Spaces:
Running
Running
import React from 'react'; | |
import { | |
AzureMinimalIcon, | |
OpenAIMinimalIcon, | |
ChatGPTMinimalIcon, | |
PluginMinimalIcon, | |
BingAIMinimalIcon, | |
PaLMinimalIcon, | |
AnthropicMinimalIcon, | |
} from '~/components/svg'; | |
import { cn } from '~/utils'; | |
import { IconProps } from '~/common'; | |
const MinimalIcon: React.FC<IconProps> = (props) => { | |
const { size = 30, error } = props; | |
let endpoint = 'default'; // Default value for endpoint | |
if (typeof props.endpoint === 'string') { | |
endpoint = props.endpoint; | |
} | |
const endpointIcons = { | |
azureOpenAI: { icon: <AzureMinimalIcon />, name: props.chatGptLabel || 'ChatGPT' }, | |
openAI: { icon: <OpenAIMinimalIcon />, name: props.chatGptLabel || 'ChatGPT' }, | |
gptPlugins: { icon: <PluginMinimalIcon />, name: 'Plugins' }, | |
google: { icon: <PaLMinimalIcon />, name: props.modelLabel || 'PaLM2' }, | |
anthropic: { icon: <AnthropicMinimalIcon />, name: props.modelLabel || 'Claude' }, | |
bingAI: { icon: <BingAIMinimalIcon />, name: 'BingAI' }, | |
chatGPTBrowser: { icon: <ChatGPTMinimalIcon />, name: 'ChatGPT' }, | |
default: { icon: <OpenAIMinimalIcon />, name: 'UNKNOWN' }, | |
}; | |
const { icon, name } = endpointIcons[endpoint]; | |
return ( | |
<div | |
data-testid="convo-icon" | |
title={name} | |
style={{ | |
width: size, | |
height: size, | |
}} | |
className={cn( | |
'relative flex items-center justify-center rounded-sm text-white', | |
props.className || '', | |
)} | |
> | |
{icon} | |
{error && ( | |
<span className="absolute right-0 top-[20px] -mr-2 flex h-4 w-4 items-center justify-center rounded-full border border-white bg-red-500 text-[10px] text-white"> | |
! | |
</span> | |
)} | |
</div> | |
); | |
}; | |
export default MinimalIcon; | |