Refactor agent service

Author: charlesvien

apps/array/src/main/services/ui/schemas.ts

@@ -1,3 +1,5 @@
+import { z } from "zod";
+
 // UI events emitted from main to renderer
 export const UIServiceEvent = {
   OpenSettings: "open-settings",
@@ -12,3 +14,6 @@ export interface UIServiceEvents {
   [UIServiceEvent.ResetLayout]: undefined;
   [UIServiceEvent.ClearStorage]: undefined;
 }
+
+// No input needed for subscriptions - they're global events
+export const uiEventSubscriptionInput = z.object({}).optional();

apps/array/src/main/services/ui/service.ts

@@ -8,18 +8,30 @@ import { UIServiceEvent, type UIServiceEvents } from "./schemas.js";
  */
 @injectable()
 export class UIService extends TypedEventEmitter<UIServiceEvents> {
+  /**
+   * Emit an event to open the settings panel
+   */
   openSettings(): void {
     this.emit(UIServiceEvent.OpenSettings, undefined);
   }
 
+  /**
+   * Emit an event to create a new task
+   */
   newTask(): void {
     this.emit(UIServiceEvent.NewTask, undefined);
   }
 
+  /**
+   * Emit an event to reset the layout
+   */
   resetLayout(): void {
     this.emit(UIServiceEvent.ResetLayout, undefined);
   }
 
+  /**
+   * Emit an event to clear storage
+   */
   clearStorage(): void {
     this.emit(UIServiceEvent.ClearStorage, undefined);
   }

apps/array/src/renderer/components/MainLayout.tsx

@@ -12,6 +12,7 @@ import { Box, Flex } from "@radix-ui/themes";
 import { useNavigationStore } from "@stores/navigationStore";
 import { useCallback, useState } from "react";
 import { Toaster } from "sonner";
+import { trpcReact } from "@/renderer/trpc";
 import { useTaskDeepLink } from "../hooks/useTaskDeepLink";
 import { GlobalEventHandlers } from "./GlobalEventHandlers";
 
@@ -27,6 +28,58 @@ export function MainLayout() {
     setCommandMenuOpen((prev) => !prev);
   }, []);
 
+  useHotkeys("mod+k", () => setCommandMenuOpen((prev) => !prev), {
+    enabled: !commandMenuOpen,
+  });
+  useHotkeys("mod+t", () => setCommandMenuOpen((prev) => !prev), {
+    enabled: !commandMenuOpen,
+  });
+  useHotkeys("mod+p", () => setCommandMenuOpen((prev) => !prev), {
+    enabled: !commandMenuOpen,
+  });
+  useHotkeys("mod+n", () => handleFocusTaskMode());
+  useHotkeys("mod+,", () => handleOpenSettings());
+  useHotkeys("mod+[", () => goBack());
+  useHotkeys("mod+]", () => goForward());
+  useHotkeys("mod+b", () => toggleLeftSidebar());
+  useHotkeys("mod+shift+b", () => toggleRightSidebar());
+
+  // Subscribe to UI events from main process via tRPC
+  trpcReact.ui.onOpenSettings.useSubscription(undefined, {
+    onData: () => handleOpenSettings(),
+  });
+
+  trpcReact.ui.onNewTask.useSubscription(undefined, {
+    onData: () => handleFocusTaskMode(),
+  });
+
+  trpcReact.ui.onResetLayout.useSubscription(undefined, {
+    onData: () => handleResetLayout(),
+  });
+
+  trpcReact.ui.onClearStorage.useSubscription(undefined, {
+    onData: () => handleClearStorage(),
+  });
+
+  useEffect(() => {
+    const handleMouseButton = (event: MouseEvent) => {
+      if (event.button === 3) {
+        // Button 3 = back
+        event.preventDefault();
+        goBack();
+      } else if (event.button === 4) {
+        // Button 4 = forward
+        event.preventDefault();
+        goForward();
+      }
+    };
+
+    window.addEventListener("mouseup", handleMouseButton);
+    return () => {
+      window.removeEventListener("mouseup", handleMouseButton);
+    };
+  }, [goBack, goForward]);
+
   return (
     <Flex direction="column" height="100vh">
       <HeaderRow />