File size: 2,536 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 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 | import React, { useMemo } from 'react';
import { getEndpointField } from 'librechat-data-provider';
import type * as t from 'librechat-data-provider';
import { getIconKey, getEntity, getIconEndpoint } from '~/utils';
import ConvoIconURL from '~/components/Endpoints/ConvoIconURL';
import { icons } from '~/hooks/Endpoint/Icons';
export default function ConvoIcon({
conversation,
endpointsConfig,
assistantMap,
agentsMap,
className = '',
containerClassName = '',
context,
size,
}: {
conversation: t.TConversation | t.TPreset | null;
endpointsConfig: t.TEndpointsConfig;
assistantMap: t.TAssistantsMap | undefined;
agentsMap: t.TAgentsMap | undefined;
containerClassName?: string;
context?: 'message' | 'nav' | 'landing' | 'menu-item';
className?: string;
size?: number;
}) {
const iconURL = conversation?.iconURL ?? '';
let endpoint = conversation?.endpoint;
endpoint = getIconEndpoint({ endpointsConfig, iconURL, endpoint });
const { entity, isAgent } = useMemo(
() =>
getEntity({
endpoint,
agentsMap,
assistantMap,
agent_id: conversation?.agent_id,
assistant_id: conversation?.assistant_id,
}),
[endpoint, conversation?.agent_id, conversation?.assistant_id, agentsMap, assistantMap],
);
const name = entity?.name ?? '';
const avatar = isAgent
? (entity as t.Agent | undefined)?.avatar?.filepath
: ((entity as t.Assistant | undefined)?.metadata?.avatar as string);
const endpointIconURL = getEndpointField(endpointsConfig, endpoint, 'iconURL');
const iconKey = getIconKey({ endpoint, endpointsConfig, endpointIconURL });
const Icon = icons[iconKey] ?? null;
return (
<>
{iconURL && iconURL.includes('http') ? (
<ConvoIconURL
iconURL={iconURL}
modelLabel={conversation?.chatGptLabel ?? conversation?.modelLabel ?? ''}
endpointIconURL={endpointIconURL}
assistantAvatar={avatar}
assistantName={name}
agentAvatar={avatar}
agentName={name}
context={context}
/>
) : (
<div className={containerClassName}>
{endpoint && Icon != null && (
<Icon
size={size}
context={context}
endpoint={endpoint}
className={className}
iconURL={endpointIconURL}
assistantName={name}
agentName={name}
avatar={avatar}
/>
)}
</div>
)}
</>
);
}
|