File size: 2,092 Bytes
aa2e6af | 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 | import React from 'react';
import type { TPreset } from 'librechat-data-provider';
import type { IconMapProps } from '~/common';
import { icons } from '~/components/Chat/Menus/Endpoints/Icons';
interface ConvoIconURLProps {
preset: TPreset | null;
endpointIconURL?: string;
assistantName?: string;
context?: 'landing' | 'menu-item' | 'nav' | 'message';
assistantAvatar?: string;
}
const classMap = {
'menu-item': 'relative flex h-full items-center justify-center overflow-hidden rounded-full',
message: 'icon-md',
default: 'icon-xl relative flex h-full overflow-hidden rounded-full',
};
const styleMap = {
'menu-item': { width: '20px', height: '20px' },
default: { width: '100%', height: '100%' },
};
const styleImageMap = {
default: { width: '100%', height: '100%' },
};
const ConvoIconURL: React.FC<ConvoIconURLProps> = ({
preset,
endpointIconURL,
assistantAvatar,
assistantName,
context,
}) => {
const { iconURL = '' } = preset ?? {};
let Icon: (
props: IconMapProps & {
context?: string;
iconURL?: string;
},
) => React.JSX.Element;
const isURL = iconURL && (iconURL.includes('http') || iconURL.startsWith('/images/'));
if (!isURL) {
Icon = icons[iconURL] ?? icons.unknown;
} else {
Icon = () => (
<div
className={classMap[context ?? 'default'] ?? classMap.default}
style={styleMap[context ?? 'default'] ?? styleMap.default}
>
<img
src={iconURL}
alt={preset?.chatGptLabel ?? preset?.modelLabel ?? ''}
style={styleImageMap[context ?? 'default'] ?? styleImageMap.default}
className="object-cover"
/>
</div>
);
return <Icon />;
}
return (
<div className="shadow-stroke relative flex h-full items-center justify-center rounded-full bg-white text-black">
<Icon
size={41}
context={context}
className="h-2/3 w-2/3"
iconURL={endpointIconURL}
assistantName={assistantName}
avatar={assistantAvatar}
/>
</div>
);
};
export default ConvoIconURL;
|