dont need "server only" mode, image mode launch fixes

cspell.json

@@ -106,13 +106,6 @@
     "kobold",
     "KOBOLDAI",
     "koboldcpp",
-    "sdmodel",
-    "sdt5xxl",
-    "sdclipl",
-    "sdclipg",
-    "sdphotomaker",
-    "sdvae",
-    "sdapi",
     "less",
     "letterspacing",
     "libvk",
@@ -175,9 +168,19 @@
     "rocm",
     "rocminfo",
     "rollup",
+    "safetensors",
     "sass",
     "scrollbar",
     "scss",
+    "sdapi",
+    "sdclipg",
+    "sdclipl",
+    "sdmodel",
+    "sdphotomaker",
+    "sdt5xxl",
+    "sdui",
+    "sdvae",
+    "SDXL",
     "setAttribute",
     "shouldComponentUpdate",
     "shouldn",
@@ -190,8 +193,6 @@
     "subdomain",
     "svg",
     "swiftshader",
-    "safetensors",
-    "SDXL",
     "tabler",
     "Tauri",
     "temp",

src/App.tsx

@@ -249,7 +249,12 @@ export const App = () => {
                 value={activeInterfaceTab}
                 onChange={setActiveInterfaceTab}
                 data={[
-                  { value: 'chat', label: 'KoboldAI Lite' },
+                  {
+                    value: 'chat',
+                    label: isImageGenerationMode
+                      ? 'Stable UI'
+                      : 'KoboldAI Lite',
+                  },
                   { value: 'terminal', label: 'Terminal' },
                 ]}
                 placeholder="Select view"

src/hooks/useLaunchConfig.ts

@@ -6,7 +6,6 @@ import {
 } from '@/utils/imageModelPresets';
 
 export const useLaunchConfig = () => {
-  const [serverOnly, setServerOnly] = useState<boolean>(false);
   const [gpuLayers, setGpuLayers] = useState<number>(0);
   const [autoGpuLayers, setAutoGpuLayers] = useState<boolean>(false);
   const [contextSize, setContextSize] = useState<number>(2048);
@@ -199,12 +198,8 @@ export const useLaunchConfig = () => {
   }, []);
 
   const loadSavedSettings = useCallback(async () => {
-    const [savedServerOnly, cpuCapabilities] = await Promise.all([
+    const cpuCapabilities = await window.electronAPI.kobold.detectCPU();
-      window.electronAPI.config.getServerOnly(),
-      window.electronAPI.kobold.detectCPU(),
-    ]);
 
-    setServerOnly(savedServerOnly);
     setModelPath('');
     setGpuLayers(0);
     setContextSize(2048);
@@ -259,11 +254,6 @@ export const useLaunchConfig = () => {
     [parseAndApplyConfigFile]
   );
 
-  const handleServerOnlyChange = useCallback(async (checked: boolean) => {
-    setServerOnly(checked);
-    await window.electronAPI.config.setServerOnly(checked);
-  }, []);
-
   const handleGpuLayersChange = useCallback(async (value: number) => {
     setGpuLayers(value);
   }, []);
@@ -436,7 +426,6 @@ export const useLaunchConfig = () => {
   );
 
   return {
-    serverOnly,
     gpuLayers,
     autoGpuLayers,
     contextSize,
@@ -464,7 +453,6 @@ export const useLaunchConfig = () => {
     parseAndApplyConfigFile,
     loadSavedSettings,
     loadConfigFromFile,
-    handleServerOnlyChange,
     handleGpuLayersChange,
     handleAutoGpuLayersChange,
     handleContextSizeChangeWithStep,

src/main/managers/ConfigManager.ts

@@ -6,7 +6,6 @@ interface AppConfig {
   installDir?: string;
   currentKoboldBinary?: string;
   selectedConfig?: string;
-  serverOnly?: boolean;
   [key: string]: ConfigValue;
 }
 
@@ -73,13 +72,4 @@ export class ConfigManager {
     this.config.selectedConfig = configName;
     this.saveConfig();
   }
-
-  getServerOnly(): boolean {
-    return this.config.serverOnly || false;
-  }
-
-  setServerOnly(serverOnly: boolean) {
-    this.config.serverOnly = serverOnly;
-    this.saveConfig();
-  }
 }

src/main/managers/WindowManager.ts

@@ -337,6 +337,7 @@ OS: ${osInfo}`;
 
     const response = await dialog.showMessageBox(this.mainWindow!, {
       type: 'info',
+      title: 'Friendly Kobold',
       message: 'Friendly Kobold',
       detail: aboutText,
       buttons: ['Copy', 'OK'],

src/main/utils/IPCHandlers.ts

@@ -184,7 +184,7 @@ export class IPCHandlers {
       const result = await dialog.showMessageBox(mainWindow, {
         type: 'warning',
         title: 'Confirm Eject',
-        message: 'Are you sure you want to eject KoboldCpp?',
+        message: 'Are you sure you want to eject?',
         detail:
           'This will terminate the running process and return to the launch screen.',
         buttons: ['Cancel', 'Eject'],
@@ -203,14 +203,6 @@ export class IPCHandlers {
       this.koboldManager.selectModelFile()
     );
 
-    ipcMain.handle('config:getServerOnly', () =>
-      this.configManager.getServerOnly()
-    );
-
-    ipcMain.handle('config:setServerOnly', (_event, serverOnly) =>
-      this.configManager.setServerOnly(serverOnly)
-    );
-
     ipcMain.handle('config:get', (_event, key) => this.configManager.get(key));
 
     ipcMain.handle('config:set', (_event, key, value) =>

src/preload/index.ts

@@ -124,9 +124,6 @@ const appAPI: AppAPI = {
 };
 
 const configAPI: ConfigAPI = {
-  getServerOnly: () => ipcRenderer.invoke('config:getServerOnly'),
-  setServerOnly: (serverOnly: boolean) =>
-    ipcRenderer.invoke('config:setServerOnly', serverOnly),
   get: (key: string) => ipcRenderer.invoke('config:get', key),
   set: (key: string, value: unknown) =>
     ipcRenderer.invoke('config:set', key, value),

src/screens/Interface/ImageGenerationTab.tsx

@@ -1,56 +0,0 @@
-import { useRef } from 'react';
-import { Box, Text, Stack } from '@mantine/core';
-
-interface ImageGenerationTabProps {
-  serverUrl?: string;
-  isServerReady?: boolean;
-}
-
-export const ImageGenerationTab = ({
-  serverUrl,
-  isServerReady,
-}: ImageGenerationTabProps) => {
-  const iframeRef = useRef<HTMLIFrameElement>(null);
-
-  if (!isServerReady || !serverUrl) {
-    return (
-      <Box
-        style={{
-          width: '100%',
-          height: '100%',
-          display: 'flex',
-          alignItems: 'center',
-          justifyContent: 'center',
-        }}
-      >
-        <Stack align="center" gap="md">
-          <Text c="dimmed" size="lg">
-            Waiting for KoboldCpp server to start...
-          </Text>
-          <Text c="dimmed" size="sm">
-            The image generation interface will load automatically when ready
-          </Text>
-        </Stack>
-      </Box>
-    );
-  }
-
-  const imageGenerationUrl = `${serverUrl}/sdapi/v1`;
-
-  return (
-    <Box style={{ width: '100%', height: '100%', overflow: 'hidden' }}>
-      <iframe
-        ref={iframeRef}
-        src={imageGenerationUrl}
-        title="KoboldCpp Image Generation Interface"
-        style={{
-          width: '100%',
-          height: '100%',
-          border: 'none',
-          borderRadius: 'inherit',
-        }}
-        allow="clipboard-read; clipboard-write"
-      />
-    </Box>
-  );
-};

src/screens/Interface/ServerTab.tsx

@@ -39,10 +39,10 @@ export const ServerTab = ({
   }
 
   const iframeUrl =
-    mode === 'image-generation' ? `${serverUrl}/sdapi/v1` : serverUrl;
+    mode === 'image-generation' ? `${serverUrl}/sdui` : serverUrl;
   const title =
     mode === 'image-generation'
-      ? 'KoboldCpp Image Generation Interface'
+      ? 'Stable UI Interface'
       : 'KoboldAI Lite Interface';
 
   return (

src/screens/Interface/TerminalTab.tsx

@@ -10,13 +10,9 @@ import { ChevronDown } from 'lucide-react';
 
 interface TerminalTabProps {
   onServerReady?: (serverUrl: string) => void;
-  serverOnly?: boolean;
 }
 
-export const TerminalTab = ({
+export const TerminalTab = ({ onServerReady }: TerminalTabProps) => {
-  onServerReady,
-  serverOnly,
-}: TerminalTabProps) => {
   const { colorScheme } = useMantineColorScheme();
   const [terminalContent, setTerminalContent] = useState<string>('');
   const [isUserScrolling, setIsUserScrolling] = useState<boolean>(false);
@@ -56,7 +52,6 @@ export const TerminalTab = ({
         const newData = data.toString();
 
         if (
-          !serverOnly &&
           onServerReady &&
           newData.includes('Please connect to custom endpoint at ')
         ) {
@@ -95,7 +90,7 @@ export const TerminalTab = ({
     });
 
     return cleanup;
-  }, [onServerReady, serverOnly]);
+  }, [onServerReady]);
 
   const scrollToBottom = () => {
     if (viewportRef.current) {

src/screens/Interface/index.tsx

@@ -1,4 +1,4 @@
-import { useState, useEffect, useCallback } from 'react';
+import { useState, useCallback } from 'react';
 import { Card, Container } from '@mantine/core';
 import { ServerTab } from '@/screens/Interface/ServerTab';
 import { TerminalTab } from '@/screens/Interface/TerminalTab';
@@ -14,7 +14,6 @@ export const InterfaceScreen = ({
   onTabChange,
   isImageGenerationMode = false,
 }: InterfaceScreenProps) => {
-  const [serverOnly, setServerOnly] = useState<boolean>(false);
   const [serverUrl, setServerUrl] = useState<string>('');
   const [isServerReady, setIsServerReady] = useState<boolean>(false);
 
@@ -23,30 +22,13 @@ export const InterfaceScreen = ({
       setServerUrl(url);
       setIsServerReady(true);
 
-      if (!serverOnly && onTabChange) {
+      if (onTabChange) {
         onTabChange(isImageGenerationMode ? 'image' : 'chat');
       }
     },
-    [serverOnly, onTabChange, isImageGenerationMode]
+    [onTabChange, isImageGenerationMode]
   );
 
-  useEffect(() => {
-    const loadServerOnlySetting = async () => {
-      try {
-        const serverOnlyValue = await window.electronAPI.config.getServerOnly();
-        setServerOnly(serverOnlyValue);
-
-        if (serverOnlyValue && onTabChange) {
-          onTabChange('terminal');
-        }
-      } catch (error) {
-        console.error('Failed to load server-only setting:', error);
-      }
-    };
-
-    loadServerOnlySetting();
-  }, [onTabChange]);
-
   return (
     <Container size="l" style={{ height: '85vh' }}>
       <Card
@@ -55,49 +37,39 @@ export const InterfaceScreen = ({
         p="0"
         style={{ height: 'calc(90vh - 32px)' }}
       >
-        {serverOnly ? (
+        <div style={{ height: '100%' }}>
-          <TerminalTab
+          <div
-            onServerReady={handleServerReady}
+            style={{
-            serverOnly={serverOnly}
+              height: '100%',
-          />
+              display: activeTab === 'chat' ? 'block' : 'none',
-        ) : (
+            }}
-          <div style={{ height: '100%' }}>
+          >
-            <div
+            <ServerTab
-              style={{
+              serverUrl={serverUrl}
-                height: '100%',
+              isServerReady={isServerReady}
-                display: activeTab === 'chat' ? 'block' : 'none',
+              mode={isImageGenerationMode ? 'image-generation' : 'chat'}
-              }}
+            />
-            >
-              <ServerTab
-                serverUrl={serverUrl}
-                isServerReady={isServerReady}
-                mode={isImageGenerationMode ? 'image-generation' : 'chat'}
-              />
-            </div>
-            <div
-              style={{
-                height: '100%',
-                display: activeTab === 'image' ? 'block' : 'none',
-              }}
-            >
-              <ServerTab
-                serverUrl={serverUrl}
-                isServerReady={isServerReady}
-                mode="image-generation"
-              />
-            </div>
-            <div
-              style={{
-                display: activeTab === 'terminal' ? 'block' : 'none',
-              }}
-            >
-              <TerminalTab
-                onServerReady={handleServerReady}
-                serverOnly={false}
-              />
-            </div>
           </div>
-        )}
+          <div
+            style={{
+              height: '100%',
+              display: activeTab === 'image' ? 'block' : 'none',
+            }}
+          >
+            <ServerTab
+              serverUrl={serverUrl}
+              isServerReady={isServerReady}
+              mode="image-generation"
+            />
+          </div>
+          <div
+            style={{
+              display: activeTab === 'terminal' ? 'block' : 'none',
+            }}
+          >
+            <TerminalTab onServerReady={handleServerReady} />
+          </div>
+        </div>
       </Card>
     </Container>
   );

src/screens/Launch/AdvancedTab.tsx

@@ -3,13 +3,11 @@ import { InfoTooltip } from '@/components/InfoTooltip';
 
 interface AdvancedTabProps {
   additionalArguments: string;
-  serverOnly: boolean;
   noshift: boolean;
   flashattention: boolean;
   noavx2: boolean;
   failsafe: boolean;
   onAdditionalArgumentsChange: (args: string) => void;
-  onServerOnlyChange: (serverOnly: boolean) => void;
   onNoshiftChange: (noshift: boolean) => void;
   onFlashattentionChange: (flashattention: boolean) => void;
   onNoavx2Change: (noavx2: boolean) => void;
@@ -18,13 +16,11 @@ interface AdvancedTabProps {
 
 export const AdvancedTab = ({
   additionalArguments,
-  serverOnly,
   noshift,
   flashattention,
   noavx2,
   failsafe,
   onAdditionalArgumentsChange,
-  onServerOnlyChange,
   onNoshiftChange,
   onFlashattentionChange,
   onNoavx2Change,
@@ -34,19 +30,6 @@ export const AdvancedTab = ({
     <div>
       <Stack gap="md">
         <Group gap="lg" align="flex-start" wrap="nowrap">
-          <div style={{ minWidth: '200px' }}>
-            <Group gap="xs" align="center">
-              <Checkbox
-                checked={serverOnly}
-                onChange={(event) =>
-                  onServerOnlyChange(event.currentTarget.checked)
-                }
-                label="Server-only mode"
-              />
-              <InfoTooltip label="In server-only mode, the KoboldAI Lite web UI won't be displayed. Use this if you'll be using your own frontend." />
-            </Group>
-          </div>
-
           <div style={{ minWidth: '200px' }}>
             <Group gap="xs" align="center">
               <Checkbox
@@ -59,9 +42,7 @@ export const AdvancedTab = ({
               <InfoTooltip label="Use Context Shifting to reduce reprocessing. Recommended" />
             </Group>
           </div>
-        </Group>
 
-        <Group gap="lg" align="flex-start" wrap="nowrap">
           <div style={{ minWidth: '200px' }}>
             <Group gap="xs" align="center">
               <Checkbox
@@ -74,7 +55,9 @@ export const AdvancedTab = ({
               <InfoTooltip label="Enable flash attention for GGUF models." />
             </Group>
           </div>
+        </Group>
 
+        <Group gap="lg" align="flex-start" wrap="nowrap">
           <div style={{ minWidth: '200px' }}>
             <Group gap="xs" align="center">
               <Checkbox
@@ -87,15 +70,19 @@ export const AdvancedTab = ({
               <InfoTooltip label="Do not use AVX2 instructions, a slower compatibility mode for older devices." />
             </Group>
           </div>
-        </Group>
 
-        <Group gap="xs" align="center">
+          <div style={{ minWidth: '200px' }}>
-          <Checkbox
+            <Group gap="xs" align="center">
-            checked={failsafe}
+              <Checkbox
-            onChange={(event) => onFailsafeChange(event.currentTarget.checked)}
+                checked={failsafe}
-            label="Failsafe"
+                onChange={(event) =>
-          />
+                  onFailsafeChange(event.currentTarget.checked)
-          <InfoTooltip label="Use failsafe mode, extremely slow CPU only compatibility mode that should work on all devices. Can be combined with useclblast if your device supports OpenCL." />
+                }
+                label="Failsafe"
+              />
+              <InfoTooltip label="Use failsafe mode, extremely slow CPU only compatibility mode that should work on all devices. Can be combined with useclblast if your device supports OpenCL." />
+            </Group>
+          </div>
         </Group>
       </Stack>
     </div>

src/screens/Launch/index.tsx

@@ -36,7 +36,6 @@ export const LaunchScreen = ({
   const [newConfigName, setNewConfigName] = useState('');
   const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
   const {
-    serverOnly,
     gpuLayers,
     autoGpuLayers,
     contextSize,
@@ -63,7 +62,6 @@ export const LaunchScreen = ({
     parseAndApplyConfigFile,
     loadSavedSettings,
     loadConfigFromFile,
-    handleServerOnlyChange,
     handleGpuLayersChange,
     handleAutoGpuLayersChange,
     handleContextSizeChangeWithStep,
@@ -158,11 +156,6 @@ export const LaunchScreen = ({
     setHasUnsavedChanges(true);
   };
 
-  const handleServerOnlyChangeWithTracking = (serverOnly: boolean) => {
-    handleServerOnlyChange(serverOnly);
-    setHasUnsavedChanges(true);
-  };
-
   const handlePortChangeWithTracking = (port: number) => {
     handlePortChange(port);
     setHasUnsavedChanges(true);
@@ -472,7 +465,6 @@ export const LaunchScreen = ({
               <Tabs.Panel value="advanced" pt="md">
                 <AdvancedTab
                   additionalArguments={additionalArguments}
-                  serverOnly={serverOnly}
                   noshift={noshift}
                   flashattention={flashattention}
                   noavx2={noavx2}
@@ -480,7 +472,6 @@ export const LaunchScreen = ({
                   onAdditionalArgumentsChange={
                     handleAdditionalArgumentsChangeWithTracking
                   }
-                  onServerOnlyChange={handleServerOnlyChangeWithTracking}
                   onNoshiftChange={handleNoshiftChangeWithTracking}
                   onFlashattentionChange={
                     handleFlashattentionChangeWithTracking

src/types/electron.d.ts

@@ -147,8 +147,6 @@ export interface AppAPI {
 }
 
 export interface ConfigAPI {
-  getServerOnly: () => Promise<boolean>;
-  setServerOnly: (serverOnly: boolean) => Promise<void>;
   get: (key: string) => Promise<unknown>;
   set: (key: string, value: unknown) => Promise<void>;
 }