feat: add avatar for unknown model

src/renderer/src/pages/home/components/Message.tsx

@@ -10,6 +10,7 @@ import { EVENT_NAMES, EventEmitter } from '@renderer/services/event'
 import { getModelLogo } from '@renderer/services/provider'
 import Logo from '@renderer/assets/images/logo.png'
 import { SyncOutlined } from '@ant-design/icons'
+import { firstLetter } from '@renderer/utils'
 
 interface Props {
   message: Message
@@ -44,7 +45,9 @@ const MessageItem: FC<Props> = ({ message, showMenu, onDeleteMessage }) => {
     <MessageContainer key={message.id}>
       <AvatarWrapper>
         {message.role === 'assistant' ? (
-          <Avatar src={message.modelId ? getModelLogo(message.modelId) : Logo} />
+          <Avatar src={message.modelId ? getModelLogo(message.modelId) : Logo}>
+            {firstLetter(message.modelId).toUpperCase()}
+          </Avatar>
         ) : (
           <Avatar src={avatar} />
         )}

src/renderer/src/pages/settings/components/ProviderSetting.tsx

@@ -73,7 +73,9 @@ const ProviderSetting: FC<Props> = ({ provider }) => {
         <Card key={group} type="inner" title={group} style={{ marginBottom: '10px' }} size="small">
           {modelGroups[group].map((model) => (
             <ModelListItem key={model.id}>
-              <Avatar src={getModelLogo(model.id)} size={22} style={{ marginRight: '8px' }} />
+              <Avatar src={getModelLogo(model.id)} size={22} style={{ marginRight: '8px' }}>
+                {model.name[0]}
+              </Avatar>
               {model.name}
             </ModelListItem>
           ))}

src/renderer/src/services/provider.ts

@@ -31,7 +31,7 @@ export function getProviderLogo(providerId: string) {
     case 'ollama':
       return OllamaProviderLogo
     default:
-      return ''
+      return undefined
   }
 }
 
@@ -53,5 +53,5 @@ export function getModelLogo(modelId: string) {
     }
   }
 
-  return ''
+  return undefined
 }

src/renderer/src/utils/index.ts

@@ -88,3 +88,8 @@ export function droppableReorder<T>(list: T[], startIndex: number, endIndex: num
   result.splice(endIndex, 0, ...removed)
   return result
 }
+
+// firstLetter
+export const firstLetter = (str?: string) => {
+  return str ? str[0] : ''
+}