File size: 1,908 Bytes
f0743f4 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 | import { useMemo, useEffect } from 'react';
import { Outlet, useParams, useNavigate } from 'react-router-dom';
import { PermissionTypes, Permissions } from 'librechat-data-provider';
import FilterPrompts from '~/components/Prompts/Groups/FilterPrompts';
import DashBreadcrumb from '~/routes/Layouts/DashBreadcrumb';
import GroupSidePanel from './Groups/GroupSidePanel';
import { PromptGroupsProvider } from '~/Providers';
import { useHasAccess } from '~/hooks';
import { cn } from '~/utils';
export default function PromptsView() {
const params = useParams();
const navigate = useNavigate();
const isDetailView = useMemo(() => !!(params.promptId || params['*'] === 'new'), [params]);
const hasAccess = useHasAccess({
permissionType: PermissionTypes.PROMPTS,
permission: Permissions.USE,
});
useEffect(() => {
let timeoutId: ReturnType<typeof setTimeout>;
if (!hasAccess) {
timeoutId = setTimeout(() => {
navigate('/c/new');
}, 1000);
}
return () => {
clearTimeout(timeoutId);
};
}, [hasAccess, navigate]);
if (!hasAccess) {
return null;
}
return (
<PromptGroupsProvider>
<div className="flex h-screen w-full flex-col bg-surface-primary p-0 lg:p-2">
<DashBreadcrumb />
<div className="flex w-full flex-grow flex-row divide-x overflow-hidden dark:divide-gray-600">
<GroupSidePanel isDetailView={isDetailView}>
<div className="mt-1 flex flex-row items-center justify-between px-2 md:px-2">
<FilterPrompts />
</div>
</GroupSidePanel>
<div
className={cn(
'scrollbar-gutter-stable w-full overflow-y-auto lg:w-3/4 xl:w-3/4',
isDetailView ? 'block' : 'hidden md:block',
)}
>
<Outlet />
</div>
</div>
</div>
</PromptGroupsProvider>
);
}
|