fix: model settings crash

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

@@ -25,7 +25,7 @@ const SelectModelDropdown: FC<Props & PropsWithChildren> = ({ children, model, o
       children: p.models.map((m) => ({
         key: m?.id,
         label: upperFirst(m?.name),
-        style: m?.id === model?.id ? { color: 'var(--color-primary)' } : undefined,
+        defaultSelectedKeys: [model?.id],
         icon: (
           <Avatar src={getModelLogo(m?.id || '')} size={24}>
             {first(m?.name)}
@@ -37,7 +37,7 @@ const SelectModelDropdown: FC<Props & PropsWithChildren> = ({ children, model, o
 
   return (
     <DropdownMenu
-      menu={{ items, style: { maxHeight: '80vh', overflow: 'auto' } }}
+      menu={{ items, style: { maxHeight: '80vh', overflow: 'auto' }, selectedKeys: [model?.id] }}
       trigger={['click']}
       arrow
       placement="bottom"

src/renderer/src/pages/settings/ModelSettings.tsx

@@ -3,7 +3,7 @@ import { useDefaultModel } from '@renderer/hooks/useAssistant'
 import { useProviders } from '@renderer/hooks/useProvider'
 import { Model } from '@renderer/types'
 import { Select } from 'antd'
-import { find, upperFirst } from 'lodash'
+import { find, sortBy, upperFirst } from 'lodash'
 import { FC } from 'react'
 import { useTranslation } from 'react-i18next'
 
@@ -21,12 +21,10 @@ const ModelSettings: FC = () => {
     .map((p) => ({
       label: p.isSystem ? t(`provider.${p.id}`) : p.name,
       title: p.name,
-      options: p.models
-        .sort((a, b) => a.name.localeCompare(b.name))
-        .map((m) => ({
-          label: upperFirst(m.name),
-          value: m.id
-        }))
+      options: sortBy(p.models, 'name').map((m) => ({
+        label: upperFirst(m.name),
+        value: m.id
+      }))
     }))
 
   const iconStyle = { fontSize: 16, marginRight: 8 }

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

@@ -203,14 +203,11 @@ const HelpLink = styled(Link)`
 `
 
 const RemoveIcon = styled(MinusCircleOutlined)`
+  font-size: 18px;
   margin-left: 10px;
   color: var(--color-error);
   cursor: pointer;
   transition: all 0.2s ease-in-out;
-  opacity: 0.75;
-  &:hover {
-    opacity: 1;
-  }
 `
 
 export default ProviderSetting