fix: disabled apikey while server running

web/containers/DropdownListSidebar/index.tsx

@@ -233,7 +233,10 @@ export default function DropdownListSidebar() {
         </SelectPortal>
       </Select>
 
-      <OpenAiKeyInput selectedModel={selectedModel} />
+      <OpenAiKeyInput
+        selectedModel={selectedModel}
+        serverEnabled={serverEnabled}
+      />
     </div>
   )
 }

web/containers/OpenAiKeyInput/index.tsx

@@ -7,9 +7,10 @@ import { useEngineSettings } from '@/hooks/useEngineSettings'
 
 type Props = {
   selectedModel?: Model
+  serverEnabled?: boolean
 }
 
-const OpenAiKeyInput: React.FC<Props> = ({ selectedModel }) => {
+const OpenAiKeyInput: React.FC<Props> = ({ selectedModel, serverEnabled }) => {
   const [openAISettings, setOpenAISettings] = useState<
     { api_key: string } | undefined
   >(undefined)
@@ -34,6 +35,7 @@ const OpenAiKeyInput: React.FC<Props> = ({ selectedModel }) => {
         API Key
       </label>
       <Input
+        disabled={serverEnabled}
         id="assistant-instructions"
         placeholder="Enter your API_KEY"
         defaultValue={openAISettings?.api_key}

web/screens/LocalServer/index.tsx

@@ -309,35 +309,33 @@ const LocalServerScreen = () => {
             : 'w-0 translate-x-full opacity-0'
         )}
       >
-        <CardSidebar title="Model" hideMoreVerticalAction>
+        <div className="px-4">
-          <div className="px-2">
+          <div className="mt-4">
-            <div className="mt-4">
+            <DropdownListSidebar />
-              <DropdownListSidebar />
-            </div>
-
-            {componentDataEngineSetting.filter(
-              (x) => x.name === 'prompt_template'
-            ).length !== 0 && (
-              <div className="mt-4">
-                <CardSidebar title="Model Parameters" asChild>
-                  <div className="px-2 py-4">
-                    {settingComponentBuilder(componentDataEngineSetting, true)}
-                  </div>
-                </CardSidebar>
-              </div>
-            )}
-
-            {componentDataEngineSetting.length !== 0 && (
-              <div className="my-4">
-                <CardSidebar title="Engine Parameters" asChild>
-                  <div className="px-2 py-4">
-                    <EngineSetting />
-                  </div>
-                </CardSidebar>
-              </div>
-            )}
           </div>
-        </CardSidebar>
+
+          {componentDataEngineSetting.filter(
+            (x) => x.name === 'prompt_template'
+          ).length !== 0 && (
+            <div className="mt-4">
+              <CardSidebar title="Model Parameters" asChild>
+                <div className="px-2 py-4">
+                  {settingComponentBuilder(componentDataEngineSetting, true)}
+                </div>
+              </CardSidebar>
+            </div>
+          )}
+
+          {componentDataEngineSetting.length !== 0 && (
+            <div className="my-4">
+              <CardSidebar title="Engine Parameters" asChild>
+                <div className="px-2 py-4">
+                  <EngineSetting />
+                </div>
+              </CardSidebar>
+            </div>
+          )}
+        </div>
       </div>
     </div>
   )