chore: Better typing for preload.ts

ui/desktop/forge.config.ts

@@ -65,7 +65,7 @@ module.exports = {
             target: 'main',
           },
           {
-            entry: 'src/preload.js',
+            entry: 'src/preload.ts',
             config: 'vite.preload.config.ts',
             target: 'preload',
           },

ui/desktop/src/ChatWindow.tsx

@@ -10,7 +10,7 @@
 import { Card } from './components/ui/card';
 import { ScrollArea, ScrollAreaHandle } from './components/ui/scroll-area';
 import UserMessage from './components/UserMessage';
 import WingToWing, { Working } from './components/WingToWing';
 import { askAi } from './utils/askAI';
 import { getStoredModel, Provider } from './utils/providerUtils';
 import { ChatLayout } from './components/chat_window/ChatLayout';
@@ -23,25 +23,6 @@
 import { getDefaultModel } from './components/settings/models/hardcoded_stuff';
 import Splash from './components/Splash';
 
-declare global {
-  interface Window {
-    electron: {
-      stopPowerSaveBlocker: () => void;
-      startPowerSaveBlocker: () => void;
-      hideWindow: () => void;
-      createChatWindow: () => void;
-      getConfig: () => { GOOSE_PROVIDER: string };
-      logInfo: (message: string) => void;
-      showNotification: (opts: { title: string; body: string }) => void;
-      getBinaryPath: (binary: string) => Promise<string>;
-      app: any;
-    };
-    appConfig: {
-      get: (key: string) => any;
-    };
-  }
-}
-
 export interface Chat {
   id: number;
   title: string;
@@ -127,7 +108,7 @@
   useEffect(() => {
     const updatedChats = chats.map((c) => (c.id === selectedChatId ? { ...c, messages } : c));
     setChats(updatedChats);
   }, [messages, selectedChatId]);
 
   const initialQueryAppended = useRef(false);
   useEffect(() => {
@@ -135,7 +116,7 @@
       append({ role: 'user', content: initialQuery });
       initialQueryAppended.current = true;
     }
   }, [initialQuery]);
 
   useEffect(() => {
     if (messages.length > 0) {
@@ -291,7 +272,7 @@
   const openNewChatWindow = () => {
     window.electron.createChatWindow();
   };
   const { switchModel, currentModel } = useModel(); // Access switchModel via useModel
   const { addRecentModel } = useRecentModels(); // Access addRecentModel from useRecentModels
 
   // Add keyboard shortcut handler
@@ -330,13 +311,13 @@
 
   const [selectedChatId, setSelectedChatId] = useState(1);
   const [mode, setMode] = useState<'expanded' | 'compact'>(initialQuery ? 'compact' : 'expanded');
   const [working, setWorking] = useState<Working>(Working.Idle);
   const [progressMessage, setProgressMessage] = useState<string>('');
   const [selectedProvider, setSelectedProvider] = useState<string | Provider | null>(null);
   const [showWelcomeModal, setShowWelcomeModal] = useState(true);
 
   // Add this useEffect to track changes and update welcome state
   const toggleMode = () => {
     const newMode = mode === 'expanded' ? 'compact' : 'expanded';
     console.log(`Toggle to ${newMode}`);
     setMode(newMode);

ui/desktop/src/LauncherWindow.tsx

@@ -1,18 +1,5 @@
 import React, { useRef, useState } from 'react';
 
-declare global {
-  interface Window {
-    electron: {
-      logInfo(msg: string): unknown;
-      on(channel: string, arg1: (event: any, message: any) => void): unknown;
-      stopPowerSaveBlocker(): unknown;
-      startPowerSaveBlocker(): unknown;
-      hideWindow: () => void;
-      createChatWindow: (query: string) => void;
-    };
-  }
-}
-
 export default function SpotlightWindow() {
   const [query, setQuery] = useState('');
   const inputRef = useRef<HTMLInputElement>(null);

ui/desktop/src/components/Input.tsx

@@ -10,14 +10,6 @@ interface InputProps {
   onStop?: () => void;
 }
 
-declare global {
-  interface Window {
-    electron: {
-      selectFileOrDirectory: () => Promise<string | null>;
-    };
-  }
-}
-
 export default function Input({
   handleSubmit,
   disabled = false,

ui/desktop/src/main.ts

@@ -98,7 +98,7 @@ const createLauncher = () => {
     frame: false,
     transparent: false,
     webPreferences: {
-      preload: path.join(__dirname, 'preload.js'),
+      preload: path.join(__dirname, 'preload.ts'),
       additionalArguments: [JSON.stringify(appConfig)],
       partition: 'persist:goose',
     },

ui/desktop/src/preload.ts

@@ -0,0 +1,77 @@
+import Electron, { contextBridge, ipcRenderer } from 'electron';
+
+const config = JSON.parse(process.argv.find((arg) => arg.startsWith('{')) || '{}');
+
+// Define the API types in a single place
+type ElectronAPI = {
+  getConfig: () => Record<string, any>;
+  hideWindow: () => void;
+  directoryChooser: (replace: string) => void;
+  createChatWindow: (query?: string, dir?: string, version?: string) => void;
+  logInfo: (txt: string) => void;
+  showNotification: (data: any) => void;
+  createWingToWingWindow: (query: string) => void;
+  openInChrome: (url: string) => void;
+  fetchMetadata: (url: string) => Promise<any>;
+  reloadApp: () => void;
+  checkForOllama: () => Promise<boolean>;
+  selectFileOrDirectory: () => Promise<string>;
+  startPowerSaveBlocker: () => Promise<number>;
+  stopPowerSaveBlocker: () => Promise<void>;
+  getBinaryPath: (binaryName: string) => Promise<string>;
+  on: (
+    channel: string,
+    callback: (event: Electron.IpcRendererEvent, ...args: any[]) => void
+  ) => void;
+  off: (
+    channel: string,
+    callback: (event: Electron.IpcRendererEvent, ...args: any[]) => void
+  ) => void;
+};
+
+type AppConfigAPI = {
+  get: (key: string) => any;
+  getAll: () => Record<string, any>;
+};
+
+const electronAPI: ElectronAPI = {
+  getConfig: () => config,
+  hideWindow: () => ipcRenderer.send('hide-window'),
+  directoryChooser: (replace: string) => ipcRenderer.send('directory-chooser', replace),
+  createChatWindow: (query?: string, dir?: string, version?: string) =>
+    ipcRenderer.send('create-chat-window', query, dir, version),
+  logInfo: (txt: string) => ipcRenderer.send('logInfo', txt),
+  showNotification: (data: any) => ipcRenderer.send('notify', data),
+  createWingToWingWindow: (query: string) => ipcRenderer.send('create-wing-to-wing-window', query),
+  openInChrome: (url: string) => ipcRenderer.send('open-in-chrome', url),
+  fetchMetadata: (url: string) => ipcRenderer.invoke('fetch-metadata', url),
+  reloadApp: () => ipcRenderer.send('reload-app'),
+  checkForOllama: () => ipcRenderer.invoke('check-ollama'),
+  selectFileOrDirectory: () => ipcRenderer.invoke('select-file-or-directory'),
+  startPowerSaveBlocker: () => ipcRenderer.invoke('start-power-save-blocker'),
+  stopPowerSaveBlocker: () => ipcRenderer.invoke('stop-power-save-blocker'),
+  getBinaryPath: (binaryName: string) => ipcRenderer.invoke('get-binary-path', binaryName),
+  on: (channel: string, callback: (event: Electron.IpcRendererEvent, ...args: any[]) => void) => {
+    ipcRenderer.on(channel, callback);
+  },
+  off: (channel: string, callback: (event: Electron.IpcRendererEvent, ...args: any[]) => void) => {
+    ipcRenderer.off(channel, callback);
+  },
+};
+
+const appConfigAPI: AppConfigAPI = {
+  get: (key: string) => config[key],
+  getAll: () => config,
+};
+
+// Expose the APIs
+contextBridge.exposeInMainWorld('electron', electronAPI);
+contextBridge.exposeInMainWorld('appConfig', appConfigAPI);
+
+// Type declaration for TypeScript
+declare global {
+  interface Window {
+    electron: ElectronAPI;
+    appConfig: AppConfigAPI;
+  }
+}