Merge remote-tracking branch 'upstream/main'

app/components/chat.tsx

@@ -442,11 +442,27 @@ export function ChatActions(props: {
 
   // switch model
   const currentModel = chatStore.currentSession().mask.modelConfig.model;
-  const models = useAllModels()
-    .filter((m) => m.available)
-    .map((m) => m.name);
+  const allModels = useAllModels();
+  const models = useMemo(
+    () => allModels.filter((m) => m.available),
+    [allModels],
+  );
   const [showModelSelector, setShowModelSelector] = useState(false);
 
+  useEffect(() => {
+    // if current model is not available
+    // switch to first available model
+    const isUnavaliableModel = !models.some((m) => m.name === currentModel);
+    if (isUnavaliableModel && models.length > 0) {
+      const nextModel = models[0].name as ModelType;
+      chatStore.updateCurrentSession(
+        (session) => (session.mask.modelConfig.model = nextModel),
+      );
+      showToast(nextModel);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [currentModel, models]);
+
   return (
     <div className={styles["chat-input-actions"]}>
       <div>
@@ -525,8 +541,8 @@ export function ChatActions(props: {
           <Selector
             defaultSelectedValue={currentModel}
             items={models.map((m) => ({
-              title: m,
-              value: m,
+              title: m.displayName,
+              value: m.name,
             }))}
             onClose={() => setShowModelSelector(false)}
             onSelection={(s) => {
@@ -534,9 +550,6 @@ export function ChatActions(props: {
               chatStore.updateCurrentSession((session) => {
                 session.mask.modelConfig.model = s[0] as ModelType;
                 session.mask.syncGlobalConfig = false;
-                session.mask.usePlugins = /^gpt(?!.*03\d{2}$).*$/.test(
-                  session.mask.modelConfig.model,
-                );
               });
               showToast(s[0]);
             }}
@@ -1028,7 +1041,9 @@ function _Chat() {
           ).then((res) => {
             if (!res) return;
             if (payload.key) {
-              accessStore.update((access) => (access.token = payload.key!));
+              accessStore.update(
+                (access) => (access.openaiApiKey = payload.key!),
+              );
             }
             if (payload.url) {
               accessStore.update((access) => (access.openaiUrl = payload.url!));
@@ -1188,7 +1203,12 @@ function _Chat() {
                           {["system"].includes(message.role) ? (
                             <Avatar avatar="2699-fe0f" />
                           ) : (
-                            <MaskAvatar mask={session.mask} />
+                            <MaskAvatar
+                              avatar={session.mask.avatar}
+                              model={
+                                message.model || session.mask.modelConfig.model
+                              }
+                            />
                           )}
                         </>
                       )}