add vision model path and server secret key settings; update server start handling

Author: l3utterfly

src/main.ts

@@ -95,13 +95,24 @@ function killProcess(child: ChildProcess): Promise<void> {
 
 ipcMain.handle(
   "server:start",
-  async (_event, serverPath: string, modelPath: string, additionalArgs: string): Promise<string> => {
+  async (_event, serverPath: string, modelPath: string, visionModelPath: string, additionalArgs: string): Promise<string> => {
     if (serverProcess) {
       return "Server is already running";
     }
 
     return new Promise((resolve, reject) => {
-      const args = ["--model", modelPath, ...additionalArgs.split(" ").filter(Boolean)];
+      if (!serverPath || !modelPath || serverPath.trim() === "" || modelPath.trim() === "") {
+        reject("Server path and model path are required");
+        return;
+      }
+
+      let args = ["--model", modelPath];
+
+      if (visionModelPath && visionModelPath.trim() !== "") {
+        args.push("--mmproj", visionModelPath);
+      }
+
+      args = args.concat(additionalArgs.split(" ").filter(Boolean));
 
       serverProcess = spawn(serverPath, args, {
         stdio: ["ignore", "pipe", "pipe"],

src/preload.ts

@@ -10,9 +10,10 @@ contextBridge.exposeInMainWorld("electronBridge", {
     startServer: (
         serverPath: string,
         modelPath: string,
+        visionModelPath: string,
         additionalArgs: string,
     ): Promise<void> => {
-        return ipcRenderer.invoke('server:start', serverPath, modelPath, additionalArgs);
+        return ipcRenderer.invoke('server:start', serverPath, modelPath, visionModelPath, additionalArgs);
     },
 
     onServerStdout: (callback: (data: string) => void) => {

src/screens/LLMServerPanel.tsx

@@ -53,6 +53,7 @@ interface ElectronBridge {
   startServer: (
     serverPath: string,
     modelPath: string,
+    visionModelPath: string,
     additionalArgs: string,
   ) => Promise<void>;
   stopServer: () => Promise<void>;
@@ -347,6 +348,7 @@ const LlmServerPanel: React.FC<{ goToSettings: () => void }> = ({
 
   // ── Settings refs ──
   const modelPathRef = useRef<string | null>(null);
+  const visionModelPathRef = useRef<string | null>(null);
   const additionalArgsRef = useRef<string | null>(null);
   const localServerPathRef = useRef<string | null>(null);
   const [serverSecret, setServerSecret] = useState("");
@@ -415,6 +417,8 @@ const LlmServerPanel: React.FC<{ goToSettings: () => void }> = ({
       dc.onopen = () => {
         addLog("RTC", `DataChannel OPEN (${dc.label})`);
         addLog("RTC", "DataChannel connected!");
+
+        setStatus("Device connected, ready to stream requests");
       };
 
       dc.onclose = () => {
@@ -727,6 +731,7 @@ const LlmServerPanel: React.FC<{ goToSettings: () => void }> = ({
     await getElectronBridge().startServer(
       localServerPathRef.current,
       modelPathRef.current,
+      visionModelPathRef.current || "",
       additionalArgsRef.current || "",
     );
 
@@ -771,16 +776,19 @@ const LlmServerPanel: React.FC<{ goToSettings: () => void }> = ({
       UserSettingKey.ADDITIONAL_SERVER_CMD_ARGS,
       UserSettingKey.LOCAL_SERVER_PATH,
       UserSettingKey.SERVER_SECRET_KEY,
+      UserSettingKey.VISION_MODEL_PATH,
     ]);
 
     const mp = settings[UserSettingKey.MODEL_PATH];
     const aa = settings[UserSettingKey.ADDITIONAL_SERVER_CMD_ARGS];
     const lsp = settings[UserSettingKey.LOCAL_SERVER_PATH];
+    const vmp = settings[UserSettingKey.VISION_MODEL_PATH];
     const ssk = settings[UserSettingKey.SERVER_SECRET_KEY];
 
     setServerSecret(ssk);
     serverSecretRef.current = ssk;
     modelPathRef.current = mp;
+    visionModelPathRef.current = vmp;
     additionalArgsRef.current = aa;
     localServerPathRef.current = lsp;
 

src/screens/SettingsPage.tsx

@@ -66,6 +66,15 @@ const SETTING_SECTIONS: {
         placeholder: "--threads 8 --ctx-size 4096",
         tag: "CLI",
       },
+      {
+        key: UserSettingKey.SERVER_SECRET_KEY,
+        label: "Server Secret Key",
+        description:
+          "Secret key used to authenticate with the server.",
+        type: "text",
+        placeholder: "Enter your server secret key",
+        tag: "SECRET",
+      },
     ],
   },
   {
@@ -79,6 +88,13 @@ const SETTING_SECTIONS: {
         type: "file",
         tag: "GGUF",
       },
+      {
+        key: UserSettingKey.VISION_MODEL_PATH,
+        label: "Vision Model File",
+        description: "Path to the vision model file on disk.",
+        type: "file",
+        tag: "GGUF",
+      },
     ],
   },
 ];

src/services/user-settings-service.ts

@@ -6,6 +6,7 @@ function generatePassword(length: number = 16): string {
 export enum UserSettingKey {
   LOCAL_SERVER_URL = 'local-server-url',
   MODEL_PATH = 'model-path',
+  VISION_MODEL_PATH = 'vision-model-path',
   LOCAL_SERVER_PATH = 'local-server-path',
   ADDITIONAL_SERVER_CMD_ARGS = 'additional-server-cmd-args',
   SERVER_SECRET_KEY = 'server-secret-key',
@@ -14,6 +15,7 @@ export enum UserSettingKey {
 type UserSettingDefaults = {
   [UserSettingKey.LOCAL_SERVER_URL]: string;
   [UserSettingKey.MODEL_PATH]: string | null;
+  [UserSettingKey.VISION_MODEL_PATH]: string | null;
   [UserSettingKey.LOCAL_SERVER_PATH]: string;
   [UserSettingKey.ADDITIONAL_SERVER_CMD_ARGS]: string | null;
   [UserSettingKey.SERVER_SECRET_KEY]: string;
@@ -24,6 +26,7 @@ export const USER_SETTING_DEFAULTS: {
 } = {
   [UserSettingKey.LOCAL_SERVER_URL]: 'http://127.0.0.1:8080/v1/chat/completions',
   [UserSettingKey.MODEL_PATH]: null,
+  [UserSettingKey.VISION_MODEL_PATH]: null,
   [UserSettingKey.LOCAL_SERVER_PATH]: './resources/server/llama-server.exe',
   [UserSettingKey.ADDITIONAL_SERVER_CMD_ARGS]: null,
   [UserSettingKey.SERVER_SECRET_KEY]: generatePassword(),