From e42cdd04cb0cf6cd0733636f903cb4b0887e158a Mon Sep 17 00:00:00 2001
From: rxliuli <rxliuli@gmail.com>
Date: Mon, 26 Aug 2024 17:22:23 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=E6=B2=A1=E6=9C=89?=
 =?UTF-8?q?=E6=AD=A3=E7=A1=AE=E5=A4=84=E7=90=86=E9=80=89=E6=8B=A9=E6=A8=A1?=
 =?UTF-8?q?=E5=9E=8B=E6=97=B6=E5=88=86=E5=89=B2=20name/provider=20?=
 =?UTF-8?q?=E7=9A=84=E9=94=99=E8=AF=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/model-config.tsx | 16 +++++++++++++---
 1 file changed, 13 insertions(+), 3 deletions(-)

diff --git a/app/components/model-config.tsx b/app/components/model-config.tsx
index 6ce25f664..0538dfe12 100644
--- a/app/components/model-config.tsx
+++ b/app/components/model-config.tsx
@@ -6,12 +6,16 @@ import { InputRange } from "./input-range";
 import { ListItem, Select } from "./ui-lib";
 import { useAllModels } from "../utils/hooks";
 
+function getModelName(model: { model: string; providerName: string }) {
+  return `${model.model}----${model.providerName}`;
+}
+
 export function ModelConfigList(props: {
   modelConfig: ModelConfig;
   updateConfig: (updater: (config: ModelConfig) => void) => void;
 }) {
   const allModels = useAllModels();
-  const value = `${props.modelConfig.model}@${props.modelConfig?.providerName}`;
+  const value = getModelName(props.modelConfig);
 
   return (
     <>
@@ -20,7 +24,7 @@ export function ModelConfigList(props: {
           aria-label={Locale.Settings.Model}
           value={value}
           onChange={(e) => {
-            const [model, providerName] = e.currentTarget.value.split("@");
+            const [model, providerName] = e.currentTarget.value.split("----");
             props.updateConfig((config) => {
               config.model = ModalConfigValidator.model(model);
               config.providerName = providerName as ServiceProvider;
@@ -30,7 +34,13 @@ export function ModelConfigList(props: {
           {allModels
             .filter((v) => v.available)
             .map((v, i) => (
-              <option value={`${v.name}@${v.provider?.providerName}`} key={i}>
+              <option
+                value={getModelName({
+                  model: v.name,
+                  providerName: v.provider?.providerName!,
+                })}
+                key={i}
+              >
                 {v.displayName}({v.provider?.providerName})
               </option>
             ))}