add granola sync toggle

apps/x/apps/main/src/ipc.ts

@@ -16,6 +16,8 @@ import type { FSWatcher } from 'chokidar';
 import fs from 'node:fs/promises';
 import z from 'zod';
 import { RunEvent } from 'packages/shared/dist/runs.js';
+import container from '@x/core/dist/di/container.js';
+import { IGranolaConfigRepo } from '@x/core/dist/knowledge/granola/repo.js';
 
 type InvokeChannels = ipc.InvokeChannels;
 type IPCChannels = ipc.IPCChannels;
@@ -300,5 +302,15 @@ export function setupIpcHandlers() {
     'oauth:get-connected-providers': async () => {
       return await getConnectedProviders();
     },
+    'granola:getConfig': async () => {
+      const repo = container.resolve<IGranolaConfigRepo>('granolaConfigRepo');
+      const config = await repo.getConfig();
+      return { enabled: config.enabled };
+    },
+    'granola:setConfig': async (_event, args) => {
+      const repo = container.resolve<IGranolaConfigRepo>('granolaConfigRepo');
+      await repo.setConfig({ enabled: args.enabled });
+      return { success: true };
+    },
   });
 }

apps/x/apps/renderer/src/components/connected-accounts-sidebar.tsx

@@ -1,7 +1,8 @@
 "use client"
 
 import * as React from "react"
-import { Loader2, Plug } from "lucide-react"
+import { useState, useEffect, useCallback } from "react"
+import { Loader2, Plug, Database } from "lucide-react"
 import {
   Sidebar,
   SidebarContent,
@@ -14,12 +15,59 @@ import {
 } from "@/components/ui/sidebar"
 import { Button } from "@/components/ui/button"
 import { Badge } from "@/components/ui/badge"
+import { Switch } from "@/components/ui/switch"
 import { useOAuth, useAvailableProviders } from "@/hooks/useOAuth"
+import { toast } from "@/lib/toast"
 
 type ConnectedAccountsSidebarProps = React.ComponentProps<typeof Sidebar>
 
+/**
+ * Hook for managing Granola sync config
+ */
+function useGranolaConfig() {
+  const [enabled, setEnabled] = useState<boolean>(false);
+  const [isLoading, setIsLoading] = useState<boolean>(true);
+
+  const loadConfig = useCallback(async () => {
+    try {
+      setIsLoading(true);
+      const result = await window.ipc.invoke('granola:getConfig', null);
+      setEnabled(result.enabled);
+    } catch (error) {
+      console.error('Failed to load Granola config:', error);
+      setEnabled(false);
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+
+  useEffect(() => {
+    loadConfig();
+  }, [loadConfig]);
+
+  const updateConfig = useCallback(async (newEnabled: boolean) => {
+    try {
+      setIsLoading(true);
+      await window.ipc.invoke('granola:setConfig', { enabled: newEnabled });
+      setEnabled(newEnabled);
+      toast(
+        newEnabled ? 'Granola sync enabled' : 'Granola sync disabled',
+        'success'
+      );
+    } catch (error) {
+      console.error('Failed to update Granola config:', error);
+      toast('Failed to update Granola sync settings', 'error');
+    } finally {
+      setIsLoading(false);
+    }
+  }, []);
+
+  return { enabled, isLoading, updateConfig };
+}
+
 export function ConnectedAccountsSidebar({ ...props }: ConnectedAccountsSidebarProps) {
   const { providers, isLoading: providersLoading } = useAvailableProviders()
+  const { enabled: granolaEnabled, isLoading: granolaLoading, updateConfig: updateGranolaConfig } = useGranolaConfig()
 
   return (
     <Sidebar collapsible="none" className="hidden flex-1 md:flex" {...props}>
@@ -49,6 +97,33 @@ export function ConnectedAccountsSidebar({ ...props }: ConnectedAccountsSidebarP
             </SidebarMenu>
           </SidebarGroupContent>
         </SidebarGroup>
+        <SidebarGroup>
+          <SidebarGroupLabel>Data Sources</SidebarGroupLabel>
+          <SidebarGroupContent>
+            <SidebarMenu>
+              <SidebarMenuItem>
+                <div className="flex items-center gap-2 px-2 py-1.5 w-full">
+                  <Switch
+                    checked={granolaEnabled}
+                    onCheckedChange={updateGranolaConfig}
+                    disabled={granolaLoading}
+                    className="shrink-0"
+                  />
+                  <Database className="size-4 shrink-0" />
+                  <div className="flex flex-col min-w-0 flex-1">
+                    <span className="truncate text-sm">Granola Sync</span>
+                    <span className="text-xs text-muted-foreground truncate">
+                      Sync notes from Granola
+                    </span>
+                  </div>
+                  {granolaLoading && (
+                    <Loader2 className="size-3 animate-spin shrink-0" />
+                  )}
+                </div>
+              </SidebarMenuItem>
+            </SidebarMenu>
+          </SidebarGroupContent>
+        </SidebarGroup>
       </SidebarContent>
     </Sidebar>
   )

apps/x/packages/shared/src/ipc.ts

@@ -197,6 +197,20 @@ const ipcSchemas = {
       providers: z.array(z.string()),
     }),
   },
+  'granola:getConfig': {
+    req: z.null(),
+    res: z.object({
+      enabled: z.boolean(),
+    }),
+  },
+  'granola:setConfig': {
+    req: z.object({
+      enabled: z.boolean(),
+    }),
+    res: z.object({
+      success: z.literal(true),
+    }),
+  },
 } as const;
 
 // ============================================================================