diff --git a/client/src/components/Prompts/CreatePrompt.tsx b/client/src/components/Prompts/CreatePrompt.tsx new file mode 100644 index 0000000000..5e40c3d471 --- /dev/null +++ b/client/src/components/Prompts/CreatePrompt.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import { Plus } from 'lucide-react'; +import { useNavigate } from 'react-router-dom'; +import { PermissionTypes, Permissions } from 'librechat-data-provider'; +import { useLocalize, useHasAccess } from '~/hooks'; +import { Button } from '~/components/ui'; + +const CreatePromptButton: React.FC<{ isChatRoute: boolean }> = ({ isChatRoute }) => { + const navigate = useNavigate(); + const localize = useLocalize(); + const hasCreateAccess = useHasAccess({ + permissionType: PermissionTypes.PROMPTS, + permission: Permissions.CREATE, + }); + + return ( + <> + {hasCreateAccess && ( +
+ +
+ )} + + ); +}; + +export default CreatePromptButton; diff --git a/client/src/components/Prompts/Groups/AutoSendPrompt.tsx b/client/src/components/Prompts/Groups/AutoSendPrompt.tsx index ce4ae1e051..fe673c0d74 100644 --- a/client/src/components/Prompts/Groups/AutoSendPrompt.tsx +++ b/client/src/components/Prompts/Groups/AutoSendPrompt.tsx @@ -1,5 +1,14 @@ +import { Cog } from 'lucide-react'; import { useRecoilState } from 'recoil'; -import { Switch } from '~/components/ui'; +import { + Label, + Switch, + Button, + OGDialog, + OGDialogTrigger, + OGDialogContent, + OGDialogTitle, +} from '~/components'; import { useLocalize } from '~/hooks'; import { cn } from '~/utils'; import store from '~/store'; @@ -22,20 +31,30 @@ export default function AutoSendPrompt({ }; return ( -
-
{localize('com_nav_auto_send_prompts')}
- -
+ <> + + + + + + + {localize('com_ui_prompts_settings')} + + +
+ + +
+
+
+ ); } diff --git a/client/src/components/Prompts/Groups/FilterPrompts.tsx b/client/src/components/Prompts/Groups/FilterPrompts.tsx index 0d0ab9a2fc..3cc5e60142 100644 --- a/client/src/components/Prompts/Groups/FilterPrompts.tsx +++ b/client/src/components/Prompts/Groups/FilterPrompts.tsx @@ -44,11 +44,11 @@ export default function FilterPrompts({ const categoryOptions = categories ? [...categories] : [ - { - value: SystemCategories.NO_CATEGORY, - label: localize('com_ui_no_category'), - }, - ]; + { + value: SystemCategories.NO_CATEGORY, + label: localize('com_ui_no_category'), + }, + ]; return [...baseOptions, ...categoryOptions]; }, [categories, localize]); @@ -78,7 +78,7 @@ export default function FilterPrompts({ value={categoryFilter || SystemCategories.ALL} onChange={onSelect} options={filterOptions} - className="bg-transparent" + className="rounded-lg bg-transparent" icon={} label="Filter: " ariaLabel={localize('com_ui_filter_prompts')} diff --git a/client/src/components/Prompts/Groups/GroupSidePanel.tsx b/client/src/components/Prompts/Groups/GroupSidePanel.tsx index 5cfd77ec2a..5bb95f8962 100644 --- a/client/src/components/Prompts/Groups/GroupSidePanel.tsx +++ b/client/src/components/Prompts/Groups/GroupSidePanel.tsx @@ -1,5 +1,3 @@ -import { useMemo } from 'react'; -import { useLocation } from 'react-router-dom'; import PanelNavigation from '~/components/Prompts/Groups/PanelNavigation'; import { useMediaQuery, usePromptGroupsNav } from '~/hooks'; import List from '~/components/Prompts/Groups/List'; @@ -17,14 +15,14 @@ export default function GroupSidePanel({ groupsQuery, promptGroups, hasPreviousPage, + isChatRoute, }: { children?: React.ReactNode; isDetailView?: boolean; className?: string; + isChatRoute: boolean; } & ReturnType) { - const location = useLocation(); const isSmallerScreen = useMediaQuery('(max-width: 1024px)'); - const isChatRoute = useMemo(() => location.pathname?.startsWith('/c/'), [location.pathname]); return (
} = useGetStartupConfig(); const { instanceProjectId } = startupConfig; - const hasCreateAccess = useHasAccess({ - permissionType: PermissionTypes.PROMPTS, - permission: Permissions.CREATE, - }); const renderGroupItem = (group: TPromptGroup) => { if (isChatRoute) { @@ -39,18 +31,6 @@ export default function List({ return (
- {hasCreateAccess && ( -
- -
- )}
{isLoading && isChatRoute && ( @@ -74,7 +54,7 @@ export default function List({ {localize('com_ui_nothing_found')}
)} - {!isLoading && groups.length > 0 && enableRanking ? ( + {!isLoading && groups.length > 0 && !isChatRoute && enableRanking ? ( ) : ( !isLoading && groups.map((group) => renderGroupItem(group)) diff --git a/client/src/components/Prompts/Groups/PanelNavigation.tsx b/client/src/components/Prompts/Groups/PanelNavigation.tsx index 76395e842d..797f0221b1 100644 --- a/client/src/components/Prompts/Groups/PanelNavigation.tsx +++ b/client/src/components/Prompts/Groups/PanelNavigation.tsx @@ -1,6 +1,8 @@ import { memo } from 'react'; -import { Button, ThemeSelector } from '~/components/ui'; +import AutoSendPrompt from '~/components/Prompts/Groups/AutoSendPrompt'; +import { Button } from '~/components'; import { useLocalize } from '~/hooks'; +import { cn } from '~/utils'; function PanelNavigation({ prevPage, @@ -19,12 +21,16 @@ function PanelNavigation({ }) { const localize = useLocalize(); return ( -
+
+
- {!isChatRoute && } -
-
- diff --git a/client/src/components/Prompts/PromptsAccordion.tsx b/client/src/components/Prompts/PromptsAccordion.tsx index 444646c5ee..8cf0bb2ef6 100644 --- a/client/src/components/Prompts/PromptsAccordion.tsx +++ b/client/src/components/Prompts/PromptsAccordion.tsx @@ -1,19 +1,24 @@ +import React, { useMemo } from 'react'; +import { useLocation } from 'react-router-dom'; import PromptSidePanel from '~/components/Prompts/Groups/GroupSidePanel'; -import AutoSendPrompt from '~/components/Prompts/Groups/AutoSendPrompt'; import FilterPrompts from '~/components/Prompts/Groups/FilterPrompts'; import ManagePrompts from '~/components/Prompts/ManagePrompts'; +import CreatePrompt from '~/components/Prompts/CreatePrompt'; import { usePromptGroupsNav } from '~/hooks'; export default function PromptsAccordion() { + const location = useLocation(); const groupsNav = usePromptGroupsNav(); + const isChatRoute = useMemo(() => location.pathname?.startsWith('/c/'), [location.pathname]); + return ( -
- -
- - -
+
+ +
+ + +
); diff --git a/client/src/locales/en/translation.json b/client/src/locales/en/translation.json index bb05c6ab70..bd27dea8d2 100644 --- a/client/src/locales/en/translation.json +++ b/client/src/locales/en/translation.json @@ -822,6 +822,7 @@ "com_ui_prompts_allow_create": "Allow creating Prompts", "com_ui_prompts_allow_share_global": "Allow sharing Prompts to all users", "com_ui_prompts_allow_use": "Allow using Prompts", + "com_ui_prompts_settings": "Prompt Settings", "com_ui_provider": "Provider", "com_ui_read_aloud": "Read aloud", "com_ui_redirecting_to_provider": "Redirecting to {{0}}, please wait...", diff --git a/client/src/routes/Layouts/DashBreadcrumb.tsx b/client/src/routes/Layouts/DashBreadcrumb.tsx index 0138e63abc..4542d12cff 100644 --- a/client/src/routes/Layouts/DashBreadcrumb.tsx +++ b/client/src/routes/Layouts/DashBreadcrumb.tsx @@ -4,6 +4,7 @@ import { SystemRoles } from 'librechat-data-provider'; import { useRecoilValue, useSetRecoilState } from 'recoil'; import { ArrowLeft, MessageSquareQuote } from 'lucide-react'; import { + ThemeSelector, Breadcrumb, BreadcrumbItem, BreadcrumbLink, @@ -14,7 +15,7 @@ import { // DropdownMenuItem, // DropdownMenuContent, // DropdownMenuTrigger, -} from '~/components/ui'; +} from '~/components'; import { useLocalize, useCustomLink, useAuthContext } from '~/hooks'; import AdvancedSwitch from '~/components/Prompts/AdvancedSwitch'; // import { RightPanel } from '../../components/Prompts/RightPanel'; @@ -106,6 +107,7 @@ export default function DashBreadcrumb() {
{isPromptsPath && } + {user?.role === SystemRoles.ADMIN && }