diff --git a/client/src/common/types.ts b/client/src/common/types.ts index f952cd2832..292d4a7304 100644 --- a/client/src/common/types.ts +++ b/client/src/common/types.ts @@ -91,7 +91,14 @@ export type IconMapProps = { size?: number; }; -export type AgentIconMapProps = IconMapProps & { agentName: string }; +export type IconComponent = React.ComponentType; +export type AgentIconComponent = React.ComponentType; +export type IconComponentTypes = IconComponent | AgentIconComponent; +export type IconsRecord = { + [key in t.EModelEndpoint | 'unknown' | string]: IconComponentTypes | null | undefined; +}; + +export type AgentIconMapProps = IconMapProps & { agentName?: string }; export type NavLink = { title: string; diff --git a/client/src/components/Chat/Menus/Endpoints/Icons.tsx b/client/src/components/Chat/Menus/Endpoints/Icons.tsx index a8910625f6..3fbae8e010 100644 --- a/client/src/components/Chat/Menus/Endpoints/Icons.tsx +++ b/client/src/components/Chat/Menus/Endpoints/Icons.tsx @@ -1,5 +1,5 @@ import { EModelEndpoint } from 'librechat-data-provider'; -import type { IconMapProps, AgentIconMapProps } from '~/common'; +import type { IconMapProps, AgentIconMapProps, IconsRecord } from '~/common'; import { Feather } from 'lucide-react'; import { MinimalPlugin, @@ -42,7 +42,7 @@ const AssistantAvatar = ({ }; const AgentAvatar = ({ className = '', avatar = '', agentName, size }: AgentIconMapProps) => { - if (agentName && avatar) { + if (agentName != null && agentName && avatar) { return ( { return ; }; -export const icons = { +export const icons: IconsRecord = { [EModelEndpoint.azureOpenAI]: AzureMinimalIcon, [EModelEndpoint.openAI]: GPTIcon, [EModelEndpoint.gptPlugins]: MinimalPlugin, diff --git a/client/src/components/Chat/Menus/Presets/PresetItems.tsx b/client/src/components/Chat/Menus/Presets/PresetItems.tsx index 90021188c8..d5df89a062 100644 --- a/client/src/components/Chat/Menus/Presets/PresetItems.tsx +++ b/client/src/components/Chat/Menus/Presets/PresetItems.tsx @@ -16,7 +16,7 @@ import { cn } from '~/utils'; import store from '~/store'; const PresetItems: FC<{ - presets: TPreset[]; + presets?: Array; onSetDefaultPreset: (preset: TPreset, remove?: boolean) => void; onSelectPreset: (preset: TPreset) => void; onChangePreset: (preset: TPreset) => void; @@ -110,11 +110,17 @@ const PresetItems: FC<{ )} - presetId).join('.')}> + preset?.presetId) + .filter((p) => p) + .join('.')} + > {presets && presets.length > 0 && presets.map((preset, i) => { - if (!preset || !preset.presetId) { + const presetId = preset?.presetId ?? ''; + if (!preset || !presetId) { return null; } @@ -122,22 +128,23 @@ const PresetItems: FC<{ const Icon = icons[iconKey]; return ( - -
- + +
+ onSelectPreset(preset)} icon={ - Icon && - Icon({ - context: 'menu-item', - iconURL: getEndpointField(endpointsConfig, preset.endpoint, 'iconURL'), - className: 'icon-md mr-1 dark:text-white', - endpoint: preset.endpoint, - }) + Icon != null && ( + + ) } selected={false} data-testid={`preset-item-${preset}`} @@ -146,17 +153,17 @@ const PresetItems: FC<{