feat: massive chat reliability + UX pass (web/desktop/mobile/vscode) (#593)

## Added Features
- Add VS Code save-as-image flow for assistant messages via webview bridge + native save dialog.
- Add hourly desktop update checks after startup.
- Add new tool output display mode: `Changes` (auto-expand edit/write/patch only; keep activity expanded; mode guidance text).
- Add GitHub PR attachment flow in chat input with PR picker + attached PR chip/details.
- Add mobile overlay presentation for GitHub Issue and PR pickers (shared with desktop picker content).

## Fixes
- Save-gate project icon updates until explicit Save; allow icon removal with same save-gated behavior.
- Restore clickable chat action buttons in sticky header mode (desktop + Firefox hit-target issue).
- Clamp sticky user messages to bounded chat height and allow internal scrolling.
- Prevent drawer context crash during iPad/tablet orientation switching.
- Improve text-selection action menu placement on narrow screens.
- Move assistant message time into clock tooltip; keep duration display clean.
- Hide `Link GitHub Issue` row in VS Code chat input area (GitHub flow is not yet ready there).
- Remove laggy close animation in text-selection popover; keep open motion/positioning behavior.
- Fetch branches when picker opens and cache empty; show loading state instead of false “No branches found”.
- Fix share-image export metadata rendering (theme background resolution, timestamp rendering, footer alignment).
- Scope MCP services status/toggles to active directory to avoid cross-project leakage.
- Improve long user-message clamp behavior (40% cap variant, hidden scrollbar, scroll shadows, expansion detection).
- Fix desktop `Check for Updates` menu handler; prevent duplicate checks; show clear success/error toasts.
- Stabilize long user-message scrolling behavior (follow-up hardening).
- Avoid premature web update failure on slower servers.
- Restore user message image previews + fullscreen gallery navigation payload.
- Repair desktop chat drag-and-drop image attachments when native drop coords are missing.
- Move GitHub issue linking entry into Add attachment menu.
- Align header context usage percentage visuals with context panel.
- Align `@` file search with active project in all runtimes.
- Route `@` file discovery through OpenCode SDK `find.files`; remove legacy `/api/fs/search` reliance.
- Make chat `@` mention behavior consistent with files-style behavior.
- Keep status-row todos in stable order after status changes; add compact status icons; replace noisy priority labels.

## Refactors / UX Consistency
- Simplify chat attachment model and remove project file picker path.
- Keep composer focused on `@` mention file flow.
- Use direct `Attach files` action in VS Code instead of attachment dropdown path.
- Unify issue/PR picker behavior between desktop and mobile overlays.

packages/ui/src/hooks/useChatSearchDirectory.ts

@@ -0,0 +1,42 @@
+import { useDirectoryStore } from '@/stores/useDirectoryStore';
+import { useProjectsStore } from '@/stores/useProjectsStore';
+import { useSessionStore } from '@/stores/useSessionStore';
+import type { Session } from '@opencode-ai/sdk/v2';
+
+export const useChatSearchDirectory = (): string | undefined => {
+  const currentSessionId = useSessionStore((state) => state.currentSessionId);
+  const sessions = useSessionStore((state) => state.sessions);
+  const worktreeMap = useSessionStore((state) => state.worktreeMetadata);
+  const newSessionDraft = useSessionStore((state) => state.newSessionDraft);
+
+  const activeProjectId = useProjectsStore((state) => state.activeProjectId);
+  const projects = useProjectsStore((state) => state.projects);
+
+  const fallbackDirectory = useDirectoryStore((state) => state.currentDirectory);
+
+  if (currentSessionId) {
+    const worktreeMetadata = worktreeMap.get(currentSessionId);
+    if (worktreeMetadata?.path) {
+      return worktreeMetadata.path;
+    }
+
+    type SessionWithDirectory = Session & { directory?: string };
+    const currentSession = sessions.find((session) => session.id === currentSessionId) as SessionWithDirectory | undefined;
+    if (currentSession?.directory) {
+      return currentSession.directory;
+    }
+  }
+
+  if (newSessionDraft?.open && newSessionDraft.directoryOverride) {
+    return newSessionDraft.directoryOverride;
+  }
+
+  if (activeProjectId) {
+    const activeProject = projects.find((project) => project.id === activeProjectId);
+    if (activeProject?.path) {
+      return activeProject.path;
+    }
+  }
+
+  return fallbackDirectory ?? undefined;
+};

packages/ui/src/hooks/useDrawerSwipe.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { animate } from 'motion/react';
-import { useDrawer } from '@/contexts/DrawerContext';
+import { useOptionalDrawer } from '@/contexts/DrawerContext';
 
 type DrawerSwipeOptions = {
   edgeSide?: 'left' | 'right';
@@ -11,7 +11,7 @@ type DrawerSwipeOptions = {
 };
 
 export function useDrawerSwipe(options: DrawerSwipeOptions = {}) {
-  const drawer = useDrawer();
+  const drawer = useOptionalDrawer();
   const {
     edgeSide,
     strictHorizontalIntent = false,
@@ -25,13 +25,15 @@ export function useDrawerSwipe(options: DrawerSwipeOptions = {}) {
   const isDraggingDrawerRef = React.useRef<'left' | 'right' | null>(null);
 
   const handleTouchStart = React.useCallback((e: React.TouchEvent) => {
+    if (!drawer) return;
     touchStartXRef.current = e.touches[0].clientX;
     touchStartYRef.current = e.touches[0].clientY;
     isHorizontalSwipeRef.current = null;
     isDraggingDrawerRef.current = null;
-  }, []);
+  }, [drawer]);
 
   const handleTouchMove = React.useCallback((e: React.TouchEvent) => {
+    if (!drawer) return;
     const currentX = e.touches[0].clientX;
     const currentY = e.touches[0].clientY;
     const deltaX = currentX - touchStartXRef.current;
@@ -106,6 +108,7 @@ export function useDrawerSwipe(options: DrawerSwipeOptions = {}) {
   }, [activationDistance, drawer, edgeSide, horizontalIntentRatio, onlyWhenClosed, strictHorizontalIntent]);
 
   const handleTouchEnd = React.useCallback((e: React.TouchEvent) => {
+    if (!drawer) return;
     if (isHorizontalSwipeRef.current !== true) return;
 
     const endX = e.changedTouches[0].clientX;

packages/ui/src/hooks/useMenuActions.ts

@@ -3,6 +3,7 @@ import { toast } from '@/components/ui';
 import { useSessionStore } from '@/stores/useSessionStore';
 import { useUIStore } from '@/stores/useUIStore';
 import { useProjectsStore } from '@/stores/useProjectsStore';
+import { useUpdateStore } from '@/stores/useUpdateStore';
 import { useThemeSystem } from '@/contexts/useThemeSystem';
 import { sessionEvents } from '@/lib/sessionEvents';
 import { isTauriShell } from '@/lib/desktop';
@@ -58,8 +59,35 @@ export const useMenuActions = (
     setAboutDialogOpen,
   } = useUIStore();
   const { addProject } = useProjectsStore();
+  const checkForUpdates = useUpdateStore((state) => state.checkForUpdates);
   const { requestAccess, startAccessing } = useFileSystemAccess();
   const { setThemeMode } = useThemeSystem();
+  const checkUpdatesInFlightRef = React.useRef(false);
+
+  const handleCheckForUpdates = React.useCallback(() => {
+    if (checkUpdatesInFlightRef.current) {
+      return;
+    }
+    checkUpdatesInFlightRef.current = true;
+
+    void checkForUpdates()
+      .then(() => {
+        const { available, error } = useUpdateStore.getState();
+        if (error) {
+          toast.error('Failed to check for updates', {
+            description: error,
+          });
+          return;
+        }
+
+        if (!available) {
+          toast.success('You are on the latest version');
+        }
+      })
+      .finally(() => {
+        checkUpdatesInFlightRef.current = false;
+      });
+  }, [checkForUpdates]);
 
   const handleChangeWorkspace = React.useCallback(() => {
     if (isTauriShell()) {
@@ -216,9 +244,17 @@ export const useMenuActions = (
       handleAction(action);
     };
 
+    const handleCheckForUpdatesEvent = () => {
+      handleCheckForUpdates();
+    };
+
     window.addEventListener(MENU_ACTION_EVENT, handleMenuAction);
-    return () => window.removeEventListener(MENU_ACTION_EVENT, handleMenuAction);
-  }, [handleAction]);
+    window.addEventListener(CHECK_FOR_UPDATES_EVENT, handleCheckForUpdatesEvent);
+    return () => {
+      window.removeEventListener(MENU_ACTION_EVENT, handleMenuAction);
+      window.removeEventListener(CHECK_FOR_UPDATES_EVENT, handleCheckForUpdatesEvent);
+    };
+  }, [handleAction, handleCheckForUpdates]);
 
   React.useEffect(() => {
     if (typeof window === 'undefined') return;