@within-7/minto 0.4.0 → 0.4.2

package/dist/components/ModelSelector/ModelSelector.js

@@ -1,11 +1,12 @@
-import React, { useState, useEffect } from "react";
+import React, { useState, useEffect, useRef } from "react";
 import { Text, useInput } from "ink";
 import { getModelManager } from "../../utils/model.js";
 import { useExitOnCtrlCD } from "../../hooks/useExitOnCtrlCD.js";
 import {
   getGlobalConfig,
   setAllPointersToModel,
-  setModelPointer
+  setModelPointer,
+  resolveApiKey
 } from "../../utils/config.js";
 import models, { providers } from "../../constants/models.js";
 import OpenAI from "openai";
@@ -43,9 +44,17 @@ function ModelSelector({
   const isEditMode = !!editingModel;
   const [screenStack, setScreenStack] = useState([isEditMode ? "testAndSave" : "provider"]);
   const currentScreen = screenStack[screenStack.length - 1];
+  const currentScreenRef = useRef(currentScreen);
+  currentScreenRef.current = currentScreen;
+  const pendingTimerRef = useRef(null);
   const navigateTo = (screen) => {
     setScreenStack((prev) => [...prev, screen]);
   };
+  const navigateToIfStillOn = (expectedScreen, targetScreen) => {
+    if (currentScreenRef.current === expectedScreen) {
+      navigateTo(targetScreen);
+    }
+  };
   const goBack = () => {
     if (screenStack.length > 1) {
       setScreenStack((prev) => prev.slice(0, -1));
@@ -84,6 +93,15 @@ function ModelSelector({
   const [modelSearchCursorOffset, setModelSearchCursorOffset] = useState(0);
   const [cursorOffset, setCursorOffset] = useState(0);
   const [apiKeyEdited, setApiKeyEdited] = useState(isEditMode);
+  const [originalEncryptedRef, setOriginalEncryptedRef] = useState(editingModel?.apiKey?.startsWith("encrypted:") ? editingModel.apiKey : null);
+  const [apiKeyUserModified, setApiKeyUserModified] = useState(false);
+  useEffect(() => {
+    if (editingModel?.apiKey?.startsWith("encrypted:")) {
+      resolveApiKey(editingModel).then((resolved) => {
+        if (resolved) setApiKey(resolved);
+      });
+    }
+  }, []);
   const [fetchRetryCount, setFetchRetryCount] = useState(0);
   const [isRetrying, setIsRetrying] = useState(false);
   const [isTestingConnection, setIsTestingConnection] = useState(false);
@@ -98,7 +116,9 @@ function ModelSelector({
     "http://localhost:11434/v1"
   );
   const [ollamaBaseUrlCursorOffset, setOllamaBaseUrlCursorOffset] = useState(0);
-  const [customBaseUrl, setCustomBaseUrl] = useState("");
+  const [customBaseUrl, setCustomBaseUrl] = useState(
+    editingModel?.provider === "custom-openai" ? editingModel?.baseURL ?? "" : ""
+  );
   const [customBaseUrlCursorOffset, setCustomBaseUrlCursorOffset] = useState(0);
   const [providerBaseUrl, setProviderBaseUrl] = useState(
     editingModel?.baseURL ?? ""
@@ -742,7 +762,7 @@ function ModelSelector({
       );
       setAvailableModels(enrichedModels);
       if (enrichedModels.length > 0) {
-        navigateTo("model");
+        navigateToIfStillOn("baseUrl", "model");
       } else {
         setModelLoadError("No models found in your Ollama installation");
       }
@@ -803,9 +823,10 @@ function ModelSelector({
 
 \u26A1 Automatically switching to manual model configuration...`
       );
-      setTimeout(() => {
+      pendingTimerRef.current = setTimeout(() => {
+        pendingTimerRef.current = null;
         setModelLoadError(null);
-        navigateTo("modelInput");
+        navigateToIfStillOn("apiKey", "modelInput");
       }, 2e3);
     } else {
       setModelLoadError(
@@ -815,65 +836,66 @@ function ModelSelector({
     return [];
   }
   async function fetchModels() {
+    const originScreen = currentScreenRef.current;
     setIsLoadingModels(true);
     setModelLoadError(null);
     try {
       if (selectedProvider === "anthropic") {
         const anthropicModels = await fetchAnthropicCompatibleProviderModels();
         setAvailableModels(anthropicModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return anthropicModels;
       }
       if (selectedProvider === "custom-openai") {
         const customModels = await fetchCustomOpenAIModels();
         setAvailableModels(customModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return customModels;
       }
       if (selectedProvider === "gemini") {
         const geminiModels = await fetchGeminiModels();
         setAvailableModels(geminiModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return geminiModels;
       }
       if (selectedProvider === "kimi") {
         const kimiModels = await fetchKimiModels();
         setAvailableModels(kimiModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return kimiModels;
       }
       if (selectedProvider === "deepseek") {
         const deepseekModels = await fetchDeepSeekModels();
         setAvailableModels(deepseekModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return deepseekModels;
       }
       if (selectedProvider === "siliconflow") {
         const siliconflowModels = await fetchSiliconFlowModels();
         setAvailableModels(siliconflowModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return siliconflowModels;
       }
       if (selectedProvider === "qwen") {
         const qwenModels = await fetchQwenModels();
         setAvailableModels(qwenModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return qwenModels;
       }
       if (selectedProvider === "glm") {
         const glmModels = await fetchGLMModels();
         setAvailableModels(glmModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return glmModels;
       }
       if (selectedProvider === "baidu-qianfan") {
         const baiduModels = await fetchBaiduQianfanModels();
         setAvailableModels(baiduModels);
-        navigateTo("model");
+        navigateToIfStillOn(originScreen, "model");
         return baiduModels;
       }
       if (selectedProvider === "azure") {
-        navigateTo("modelInput");
+        navigateToIfStillOn(originScreen, "modelInput");
         return [];
       }
       let baseURL = providerBaseUrl || providers[selectedProvider]?.baseURL;
@@ -903,7 +925,7 @@ function ModelSelector({
         });
       }
       setAvailableModels(fetchedModels);
-      navigateTo("model");
+      navigateToIfStillOn(originScreen, "model");
       return fetchedModels;
     } catch (error) {
       throw error;
@@ -1409,9 +1431,10 @@ function ModelSelector({
     if (isEditMode && editingModel) {
       try {
         const modelManager = getModelManager();
+        const saveApiKey = !apiKeyUserModified && originalEncryptedRef ? originalEncryptedRef : apiKey || editingModel.apiKey;
         modelManager.updateModel(editingModel.modelName, {
           baseURL: providerBaseUrl || editingModel.baseURL,
-          apiKey: apiKey || editingModel.apiKey,
+          apiKey: saveApiKey,
           maxTokens: parseInt(maxTokens) || editingModel.maxTokens,
           contextLength: contextLength || editingModel.contextLength,
           reasoningEffort
@@ -1438,7 +1461,11 @@ function ModelSelector({
     onDone();
   }
   const handleBack = () => {
-    if (currentScreen === "provider") {
+    if (pendingTimerRef.current) {
+      clearTimeout(pendingTimerRef.current);
+      pendingTimerRef.current = null;
+    }
+    if (screenStack.length <= 1) {
       if (onCancel) {
         onCancel();
       } else {
@@ -1464,6 +1491,7 @@ function ModelSelector({
   }
   function handleApiKeyChange(value) {
     setApiKeyEdited(true);
+    setApiKeyUserModified(true);
     setApiKey(value);
   }
   function handleModelSearchChange(value) {
@@ -1516,6 +1544,14 @@ function ModelSelector({
       return;
     }
   });
+  useEffect(() => {
+    if (currentScreen !== "modelParams") return;
+    const formFields = getFormFieldsForModelParams();
+    const currentField = formFields[activeFieldIndex];
+    if (!currentField || currentField.name === "submit") {
+      handleModelParamsSubmit();
+    }
+  }, [currentScreen, activeFieldIndex]);
   function getFormFieldsForModelParams() {
     return [
       {
@@ -1654,7 +1690,6 @@ function ModelSelector({
         }
       );
     }
-    handleModelParamsSubmit();
     return null;
   }
   if (currentScreen === "resourceName") {