@myrialabs/clopen 0.2.1 → 0.2.2

package/frontend/{lib/components → components}/workspace/PanelContainer.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { browser } from '$frontend/lib/app-environment';
+	import { browser } from '$frontend/app-environment';
 	import { onMount, onDestroy } from 'svelte';
 	import PanelHeader from './PanelHeader.svelte';
 	import ChatPanel from './panels/ChatPanel.svelte';
@@ -7,8 +7,8 @@
 	import FilesPanel from './panels/FilesPanel.svelte';
 	import TerminalPanel from './panels/TerminalPanel.svelte';
 	import GitPanel from './panels/GitPanel.svelte';
-	import HistoryModal from '$frontend/lib/components/history/HistoryModal.svelte';
-	import { workspaceState, type PanelId } from '$frontend/lib/stores/ui/workspace.svelte';
+	import HistoryModal from '$frontend/components/history/HistoryModal.svelte';
+	import { workspaceState, type PanelId } from '$frontend/stores/ui/workspace.svelte';
 
 	interface Props {
 		panelId: PanelId;

package/frontend/{lib/components → components}/workspace/PanelHeader.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
-	import { browser } from '$frontend/lib/app-environment';
+	import { browser } from '$frontend/app-environment';
 	import { onMount, onDestroy } from 'svelte';
-	import Icon from '$frontend/lib/components/common/Icon.svelte';
-	import AvatarBubble from '$frontend/lib/components/common/AvatarBubble.svelte';
-	import { sessionState } from '$frontend/lib/stores/core/sessions.svelte';
-	import { projectState } from '$frontend/lib/stores/core/projects.svelte';
-	import { presenceState } from '$frontend/lib/stores/core/presence.svelte';
-	import { userStore } from '$frontend/lib/stores/features/user.svelte';
+	import Icon from '$frontend/components/common/display/Icon.svelte';
+	import AvatarBubble from '$frontend/components/common/display/AvatarBubble.svelte';
+	import { sessionState } from '$frontend/stores/core/sessions.svelte';
+	import { projectState } from '$frontend/stores/core/projects.svelte';
+	import { presenceState } from '$frontend/stores/core/presence.svelte';
+	import { userStore } from '$frontend/stores/features/user.svelte';
 	import {
 		workspaceState,
 		type PanelId,
@@ -15,11 +15,11 @@
 		closePanel,
 		canClosePanel,
 		PANEL_OPTIONS
-	} from '$frontend/lib/stores/ui/workspace.svelte';
+	} from '$frontend/stores/ui/workspace.svelte';
 	import type { IconName } from '$shared/types/ui/icons';
-	import type { DeviceSize } from '$frontend/lib/constants/preview';
+	import type { DeviceSize } from '$frontend/utils/preview-constants';
 
-	import { DEVICE_VIEWPORTS } from '$frontend/lib/constants/preview';
+	import { DEVICE_VIEWPORTS } from '$frontend/utils/preview-constants';
 
 	interface Props {
 		panelId: PanelId;

package/frontend/{lib/components → components}/workspace/ViewMenu.svelte

@@ -1,15 +1,15 @@
 <script lang="ts">
 	import { scale } from 'svelte/transition';
 	import { cubicOut } from 'svelte/easing';
-	import Icon from '$frontend/lib/components/common/Icon.svelte';
-	import LayoutPreview from '$frontend/lib/components/settings/appearance/LayoutPreview.svelte';
+	import Icon from '$frontend/components/common/display/Icon.svelte';
+	import LayoutPreview from '$frontend/components/settings/appearance/LayoutPreview.svelte';
 	import {
 		workspaceState,
 		builtInPresets,
 		applyLayoutPreset,
 		type LayoutPreset
-	} from '$frontend/lib/stores/ui/workspace.svelte';
-	import { clickOutside } from '$frontend/lib/utils/click-outside';
+	} from '$frontend/stores/ui/workspace.svelte';
+	import { clickOutside } from '$frontend/utils/click-outside';
 	import type { IconName } from '$shared/types/ui/icons';
 
 	interface Props {

package/frontend/{lib/components → components}/workspace/WorkspaceLayout.svelte

@@ -1,34 +1,34 @@
 <script lang="ts">
 	import { onMount, onDestroy } from 'svelte';
 	import { fade } from 'svelte/transition';
-	import { browser } from '$frontend/lib/app-environment';
+	import { browser } from '$frontend/app-environment';
 
 	// Stores
 	import {
 		workspaceState,
 		initializeWorkspace,
-	} from '$frontend/lib/stores/ui/workspace.svelte';
-	import { appState, setAppLoading, setAppInitialized, restoreLastView, restoreUnreadSessions } from '$frontend/lib/stores/core/app.svelte';
-	import { projectState } from '$frontend/lib/stores/core/projects.svelte';
-	import { sessionState } from '$frontend/lib/stores/core/sessions.svelte';
+	} from '$frontend/stores/ui/workspace.svelte';
+	import { appState, setAppLoading, setAppInitialized, restoreLastView, restoreUnreadSessions } from '$frontend/stores/core/app.svelte';
+	import { projectState } from '$frontend/stores/core/projects.svelte';
+	import { sessionState } from '$frontend/stores/core/sessions.svelte';
 
 	// Components
 	import DesktopLayout from './layout/DesktopLayout.svelte';
 	import MobileLayout from './layout/MobileLayout.svelte';
-	import LoadingScreen from '$frontend/lib/components/common/LoadingScreen.svelte';
-	import ModalProvider from '$frontend/lib/components/common/ModalProvider.svelte';
-	import SettingsModal from '$frontend/lib/components/settings/SettingsModal.svelte';
-	import HistoryModal from '$frontend/lib/components/history/HistoryModal.svelte';
+	import LoadingScreen from '$frontend/components/common/feedback/LoadingScreen.svelte';
+	import ModalProvider from '$frontend/components/common/overlay/ModalProvider.svelte';
+	import SettingsModal from '$frontend/components/settings/SettingsModal.svelte';
+	import HistoryModal from '$frontend/components/history/HistoryModal.svelte';
 
 	// Services
-	import { initializeTheme } from '$frontend/lib/utils/theme';
-	import { initializeStore } from '$frontend/lib/stores/core/app.svelte';
-	import { initializeProjects } from '$frontend/lib/stores/core/projects.svelte';
-	import { initializeSessions } from '$frontend/lib/stores/core/sessions.svelte';
-	import { initializeNotifications } from '$frontend/lib/stores/ui/notification.svelte';
-	import { applyServerSettings, loadSystemSettings } from '$frontend/lib/stores/features/settings.svelte';
-	import { initPresence } from '$frontend/lib/stores/core/presence.svelte';
-	import ws from '$frontend/lib/utils/ws';
+	import { initializeTheme } from '$frontend/utils/theme';
+	import { initializeStore } from '$frontend/stores/core/app.svelte';
+	import { initializeProjects } from '$frontend/stores/core/projects.svelte';
+	import { initializeSessions } from '$frontend/stores/core/sessions.svelte';
+	import { initializeNotifications } from '$frontend/stores/ui/notification.svelte';
+	import { applyServerSettings, loadSystemSettings } from '$frontend/stores/features/settings.svelte';
+	import { initPresence } from '$frontend/stores/core/presence.svelte';
+	import ws from '$frontend/utils/ws';
 	import { debug } from '$shared/utils/logger';
 
 	const { children } = $props();

package/frontend/{lib/components → components}/workspace/layout/DesktopLayout.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { workspaceState } from '$frontend/lib/stores/ui/workspace.svelte';
+	import { workspaceState } from '$frontend/stores/ui/workspace.svelte';
 	import DesktopNavigator from '../DesktopNavigator.svelte';
 	import Layout from './split-pane/Layout.svelte';
 </script>

package/frontend/{lib/components → components}/workspace/layout/MobileLayout.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { workspaceState } from '$frontend/lib/stores/ui/workspace.svelte';
+	import { workspaceState } from '$frontend/stores/ui/workspace.svelte';
 	import PanelContainer from '../PanelContainer.svelte';
 	import MobileNavigator from '../MobileNavigator.svelte';
 

package/frontend/{lib/components → components}/workspace/layout/split-pane/Container.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { SplitDirection, SplitNode } from '$frontend/lib/stores/ui/workspace.svelte';
+	import type { SplitDirection, SplitNode } from '$frontend/stores/ui/workspace.svelte';
 	import Layout from './Layout.svelte';
 	import Handle from './Handle.svelte';
 

package/frontend/{lib/components → components}/workspace/layout/split-pane/Handle.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import type { SplitDirection } from '$frontend/lib/stores/ui/workspace.svelte';
-	import { setSplitRatio, workspaceState } from '$frontend/lib/stores/ui/workspace.svelte';
+	import type { SplitDirection } from '$frontend/stores/ui/workspace.svelte';
+	import { setSplitRatio, workspaceState } from '$frontend/stores/ui/workspace.svelte';
 
 	interface Props {
 		direction: SplitDirection;

package/frontend/{lib/components → components}/workspace/layout/split-pane/Layout.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import { type SplitNode, setPanelAtPath, closePanelAtPath, PANEL_OPTIONS } from '$frontend/lib/stores/ui/workspace.svelte';
-	import Icon from '$frontend/lib/components/common/Icon.svelte';
+	import { type SplitNode, setPanelAtPath, closePanelAtPath, PANEL_OPTIONS } from '$frontend/stores/ui/workspace.svelte';
+	import Icon from '$frontend/components/common/display/Icon.svelte';
 	import PanelContainer from '../../PanelContainer.svelte';
 	import Container from './Container.svelte';
 

package/frontend/{lib/components → components}/workspace/panels/ChatPanel.svelte

@@ -1,21 +1,21 @@
 <script lang="ts">
-	import { sessionState, setCurrentSession, createNewChatSession, clearMessages, loadMessagesForSession } from '$frontend/lib/stores/core/sessions.svelte';
-	import { projectState } from '$frontend/lib/stores/core/projects.svelte';
-	import { appState } from '$frontend/lib/stores/core/app.svelte';
-	import { addNotification } from '$frontend/lib/stores/ui/notification.svelte';
+	import { sessionState, setCurrentSession, createNewChatSession, clearMessages, loadMessagesForSession } from '$frontend/stores/core/sessions.svelte';
+	import { projectState } from '$frontend/stores/core/projects.svelte';
+	import { appState } from '$frontend/stores/core/app.svelte';
+	import { addNotification } from '$frontend/stores/ui/notification.svelte';
 	import { onMount } from 'svelte';
 	import { fade } from 'svelte/transition';
-	import ChatMessages from '$frontend/lib/components/chat/message/ChatMessages.svelte';
-	import ChatInput from '$frontend/lib/components/chat/input/ChatInput.svelte';
-	import FloatingTodoList from '$frontend/lib/components/chat/widgets/FloatingTodoList.svelte';
-	import TimelineModal from '$frontend/lib/components/checkpoint/TimelineModal.svelte';
-	import Icon from '$frontend/lib/components/common/Icon.svelte';
-	import Button from '$frontend/lib/components/common/Button.svelte';
+	import ChatMessages from '$frontend/components/chat/message/ChatMessages.svelte';
+	import ChatInput from '$frontend/components/chat/input/ChatInput.svelte';
+	import FloatingTodoList from '$frontend/components/chat/widgets/FloatingTodoList.svelte';
+	import TimelineModal from '$frontend/components/checkpoint/TimelineModal.svelte';
+	import Icon from '$frontend/components/common/display/Icon.svelte';
+	import Button from '$frontend/components/common/display/Button.svelte';
 	import { debug } from '$shared/utils/logger';
-	import ws from '$frontend/lib/utils/ws';
-	import { chatService } from '$frontend/lib/services/chat/chat.service';
-	import { setSkipNextRestore } from '$frontend/lib/stores/ui/chat-input.svelte';
-	import { userStore } from '$frontend/lib/stores/features/user.svelte';
+	import ws from '$frontend/utils/ws';
+	import { chatService } from '$frontend/services/chat/chat.service';
+	import { setSkipNextRestore } from '$frontend/stores/ui/chat-input.svelte';
+	import { userStore } from '$frontend/stores/features/user.svelte';
 
 	// Props
 	interface Props {

package/frontend/{lib/components → components}/workspace/panels/FilesPanel.svelte

@@ -4,19 +4,19 @@
 </script>
 
 <script lang="ts">
-	import { projectState } from '$frontend/lib/stores/core/projects.svelte';
-	import FileTree from '$frontend/lib/components/files/FileTree.svelte';
-	import FileViewer from '$frontend/lib/components/files/FileViewer.svelte';
-	import Icon from '$frontend/lib/components/common/Icon.svelte';
-	import Alert from '$frontend/lib/components/common/Alert.svelte';
-	import Dialog from '$frontend/lib/components/common/Dialog.svelte';
+	import { projectState } from '$frontend/stores/core/projects.svelte';
+	import FileTree from '$frontend/components/files/FileTree.svelte';
+	import FileViewer from '$frontend/components/files/FileViewer.svelte';
+	import Icon from '$frontend/components/common/display/Icon.svelte';
+	import Alert from '$frontend/components/common/feedback/Alert.svelte';
+	import Dialog from '$frontend/components/common/overlay/Dialog.svelte';
 	import type { FileNode } from '$shared/types/filesystem';
 	import { debug } from '$shared/utils/logger';
-	import { settings } from '$frontend/lib/stores/features/settings.svelte';
+	import { settings } from '$frontend/stores/features/settings.svelte';
 	import { onMount, onDestroy } from 'svelte';
-	import ws from '$frontend/lib/utils/ws';
-	import { showConfirm } from '$frontend/lib/stores/ui/dialog.svelte';
-	import { getFileIcon } from '$frontend/lib/utils/file-icon-mappings';
+	import ws from '$frontend/utils/ws';
+	import { showConfirm } from '$frontend/stores/ui/dialog.svelte';
+	import { getFileIcon } from '$frontend/utils/file-icon-mappings';
 	import type { IconName } from '$shared/types/ui/icons';
 
 	// Props

package/frontend/{lib/components → components}/workspace/panels/GitPanel.svelte

@@ -1,14 +1,14 @@
 <script lang="ts">
 	import { onMount, untrack } from 'svelte';
-	import Icon from '$frontend/lib/components/common/Icon.svelte';
-	import Dialog from '$frontend/lib/components/common/Dialog.svelte';
-	import { projectState } from '$frontend/lib/stores/core/projects.svelte';
-	import { showError, showInfo } from '$frontend/lib/stores/ui/notification.svelte';
+	import Icon from '$frontend/components/common/display/Icon.svelte';
+	import Dialog from '$frontend/components/common/overlay/Dialog.svelte';
+	import { projectState } from '$frontend/stores/core/projects.svelte';
+	import { showError, showInfo } from '$frontend/stores/ui/notification.svelte';
 	import { debug } from '$shared/utils/logger';
-	import { settings } from '$frontend/lib/stores/features/settings.svelte';
-	import ws from '$frontend/lib/utils/ws';
-	import { getFileIcon } from '$frontend/lib/utils/file-icon-mappings';
-	import { getGitStatusLabel, getGitStatusColor } from '$frontend/lib/utils/git-status';
+	import { settings } from '$frontend/stores/features/settings.svelte';
+	import ws from '$frontend/utils/ws';
+	import { getFileIcon } from '$frontend/utils/file-icon-mappings';
+	import { getGitStatusLabel, getGitStatusColor } from '$frontend/utils/git-status';
 	import type { IconName } from '$shared/types/ui/icons';
 	import type {
 		GitStatus,
@@ -23,12 +23,12 @@
 	} from '$shared/types/git';
 
 	// Sub-components
-	import CommitForm from '$frontend/lib/components/git/CommitForm.svelte';
-	import ChangesSection from '$frontend/lib/components/git/ChangesSection.svelte';
-	import DiffViewer from '$frontend/lib/components/git/DiffViewer.svelte';
-	import BranchManager from '$frontend/lib/components/git/BranchManager.svelte';
-	import GitLog from '$frontend/lib/components/git/GitLog.svelte';
-	import ConflictResolver from '$frontend/lib/components/git/ConflictResolver.svelte';
+	import CommitForm from '$frontend/components/git/CommitForm.svelte';
+	import ChangesSection from '$frontend/components/git/ChangesSection.svelte';
+	import DiffViewer from '$frontend/components/git/DiffViewer.svelte';
+	import BranchManager from '$frontend/components/git/BranchManager.svelte';
+	import GitLog from '$frontend/components/git/GitLog.svelte';
+	import ConflictResolver from '$frontend/components/git/ConflictResolver.svelte';
 
 	// Derived state
 	const hasActiveProject = $derived(projectState.currentProject !== null);

package/frontend/{lib/components → components}/workspace/panels/PreviewPanel.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
-	import BrowserPreview from '$frontend/lib/components/preview/browser/BrowserPreview.svelte';
-	import { mcpPreviewState, clearMCPLaunchRequest } from '$frontend/lib/services/preview';
-	import { projectState } from '$frontend/lib/stores/core/projects.svelte';
+	import BrowserPreview from '$frontend/components/preview/browser/BrowserPreview.svelte';
+	import { mcpPreviewState, clearMCPLaunchRequest } from '$frontend/services/preview';
+	import { projectState } from '$frontend/stores/core/projects.svelte';
 	import { debug } from '$shared/utils/logger';
-	import Icon from '$frontend/lib/components/common/Icon.svelte';
-	import type { DeviceSize, Rotation } from '$frontend/lib/constants/preview';
+	import Icon from '$frontend/components/common/display/Icon.svelte';
+	import type { DeviceSize, Rotation } from '$frontend/utils/preview-constants';
 
 	// Project-aware state
 	const hasActiveProject = $derived(projectState.currentProject !== null);

package/frontend/{lib/components → components}/workspace/panels/TerminalPanel.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
-	import Terminal from '$frontend/lib/components/terminal/Terminal.svelte';
-	import TerminalTabs from '$frontend/lib/components/terminal/TerminalTabs.svelte';
-	import Icon from '$frontend/lib/components/common/Icon.svelte';
-	import LoadingSpinner from '$frontend/lib/components/common/LoadingSpinner.svelte';
-	import { terminalStore } from '$frontend/lib/stores/features/terminal.svelte';
-	import { projectState } from '$frontend/lib/stores/core/projects.svelte';
+	import Terminal from '$frontend/components/terminal/Terminal.svelte';
+	import TerminalTabs from '$frontend/components/terminal/TerminalTabs.svelte';
+	import Icon from '$frontend/components/common/display/Icon.svelte';
+	import LoadingSpinner from '$frontend/components/common/feedback/LoadingSpinner.svelte';
+	import { terminalStore } from '$frontend/stores/features/terminal.svelte';
+	import { projectState } from '$frontend/stores/core/projects.svelte';
 
 	// Props
 	interface Props {

package/frontend/{lib/services → services}/chat/chat.service.ts

@@ -11,18 +11,18 @@
  * - Proper presence synchronization
  */
 
-import { appState, updateSessionProcessState } from '$frontend/lib/stores/core/app.svelte';
-import type { SessionProcessState } from '$frontend/lib/stores/core/app.svelte';
-import { chatModelState } from '$frontend/lib/stores/ui/chat-model.svelte';
-import { projectState } from '$frontend/lib/stores/core/projects.svelte';
-import { sessionState, setCurrentSession, createSession, updateSession } from '$frontend/lib/stores/core/sessions.svelte';
-import { addNotification } from '$frontend/lib/stores/ui/notification.svelte';
-import { userStore } from '$frontend/lib/stores/features/user.svelte';
+import { appState, updateSessionProcessState } from '$frontend/stores/core/app.svelte';
+import type { SessionProcessState } from '$frontend/stores/core/app.svelte';
+import { chatModelState } from '$frontend/stores/ui/chat-model.svelte';
+import { projectState } from '$frontend/stores/core/projects.svelte';
+import { sessionState, setCurrentSession, createSession, updateSession } from '$frontend/stores/core/sessions.svelte';
+import { addNotification } from '$frontend/stores/ui/notification.svelte';
+import { userStore } from '$frontend/stores/features/user.svelte';
 import { SDK_CONFIG, parseModelId } from '$shared/constants/engines';
 import type { ChatServiceOptions } from '$shared/types/messaging';
 import { buildMetadataFromTransport } from '$shared/utils/message-formatter';
 import { debug } from '$shared/utils/logger';
-import ws from '$frontend/lib/utils/ws';
+import ws from '$frontend/utils/ws';
 
 /**
  * Tools that block the SDK waiting for user interaction.

package/frontend/{lib/services → services}/notification/global-stream-monitor.ts

@@ -1,117 +1,117 @@
-/**
- * Global Stream Monitor Service
- *
- * Single source of truth for chat stream notifications (sound + push).
- *
- * Listens for backend events and triggers notifications for ALL projects —
- * both active and non-active:
- * - chat:stream-finished  → stream completed/errored/cancelled
- * - chat:waiting-input    → AskUserQuestion requires user input
- *
- * The backend uses ws.emit.projectMembers() so notifications reach users
- * even when they are on a different project or session.
- */
-
-import { soundNotification, pushNotification } from '$frontend/lib/services/notification';
-import { projectState } from '$frontend/lib/stores/core/projects.svelte';
-import { debug } from '$shared/utils/logger';
-import ws from '$frontend/lib/utils/ws';
-
-class GlobalStreamMonitor {
-  private initialized = false;
-
-  /** Track notified AskUserQuestion tool_use IDs to ensure once-only notification */
-  private notifiedToolUseIds = new Set<string>();
-
-  /**
-   * Initialize the monitor - subscribes to WS events.
-   * Safe to call multiple times (idempotent).
-   */
-  initialize(): void {
-    if (this.initialized) return;
-    this.initialized = true;
-
-    debug.log('notification', 'GlobalStreamMonitor: Initializing WS listeners');
-
-    // Stream finished — notify on completion
-    ws.on('chat:stream-finished', async (data) => {
-      const { projectId, status, chatSessionId } = data;
-
-      debug.log('notification', 'GlobalStreamMonitor: Stream finished', { projectId, status });
-
-      // Clean up notified IDs for this session (stream is done)
-      this.clearSessionNotifications(chatSessionId);
-
-      // Play sound notification
-      try {
-        await soundNotification.play();
-      } catch (error) {
-        debug.error('notification', 'Error playing sound notification:', error);
-      }
-
-      // Send push notification with project context
-      try {
-        const projectName = projectState.projects.find(p => p.id === projectId)?.name || 'Unknown';
-
-        if (status === 'completed') {
-          await pushNotification.sendChatComplete(`Chat response ready in "${projectName}"`);
-        } else if (status === 'error') {
-          await pushNotification.sendChatError(`Chat error in "${projectName}"`);
-        } else if (status === 'cancelled') {
-          await pushNotification.sendChatComplete(`Chat interrupted in "${projectName}"`);
-        }
-      } catch (error) {
-        debug.error('notification', 'Error sending push notification:', error);
-      }
-    });
-
-    // Waiting for input — notify once per AskUserQuestion
-    ws.on('chat:waiting-input', async (data) => {
-      const { projectId, chatSessionId, toolUseId } = data;
-
-      // Deduplicate: only notify once per tool_use ID
-      if (this.notifiedToolUseIds.has(toolUseId)) return;
-      this.notifiedToolUseIds.add(toolUseId);
-
-      debug.log('notification', 'GlobalStreamMonitor: Waiting for input', { projectId, chatSessionId, toolUseId });
-
-      // Play sound notification
-      try {
-        await soundNotification.play();
-      } catch (error) {
-        debug.error('notification', 'Error playing sound notification:', error);
-      }
-
-      // Send push notification
-      try {
-        const projectName = projectState.projects.find(p => p.id === projectId)?.name || 'Unknown';
-        await pushNotification.sendChatComplete(`Waiting for your input in "${projectName}"`);
-      } catch (error) {
-        debug.error('notification', 'Error sending push notification:', error);
-      }
-    });
-  }
-
-  /**
-   * Remove tracked tool_use IDs for a finished session
-   */
-  private clearSessionNotifications(chatSessionId: string): void {
-    // Tool IDs are globally unique, so a simple clear-on-stream-finish
-    // is enough — they won't collide across sessions.
-    // For long-running apps, periodically trim to avoid unbounded growth.
-    if (this.notifiedToolUseIds.size > 500) {
-      this.notifiedToolUseIds.clear();
-    }
-  }
-
-  /**
-   * Clear state (for cleanup/testing)
-   */
-  clear(): void {
-    this.notifiedToolUseIds.clear();
-    debug.log('notification', 'GlobalStreamMonitor: Clearing state');
-  }
-}
-
-// Export singleton instance
-export const globalStreamMonitor = new GlobalStreamMonitor();
+/**
+ * Global Stream Monitor Service
+ *
+ * Single source of truth for chat stream notifications (sound + push).
+ *
+ * Listens for backend events and triggers notifications for ALL projects —
+ * both active and non-active:
+ * - chat:stream-finished  → stream completed/errored/cancelled
+ * - chat:waiting-input    → AskUserQuestion requires user input
+ *
+ * The backend uses ws.emit.projectMembers() so notifications reach users
+ * even when they are on a different project or session.
+ */
+
+import { soundNotification, pushNotification } from '$frontend/services/notification';
+import { projectState } from '$frontend/stores/core/projects.svelte';
+import { debug } from '$shared/utils/logger';
+import ws from '$frontend/utils/ws';
+
+class GlobalStreamMonitor {
+  private initialized = false;
+
+  /** Track notified AskUserQuestion tool_use IDs to ensure once-only notification */
+  private notifiedToolUseIds = new Set<string>();
+
+  /**
+   * Initialize the monitor - subscribes to WS events.
+   * Safe to call multiple times (idempotent).
+   */
+  initialize(): void {
+    if (this.initialized) return;
+    this.initialized = true;
+
+    debug.log('notification', 'GlobalStreamMonitor: Initializing WS listeners');
+
+    // Stream finished — notify on completion
+    ws.on('chat:stream-finished', async (data) => {
+      const { projectId, status, chatSessionId } = data;
+
+      debug.log('notification', 'GlobalStreamMonitor: Stream finished', { projectId, status });
+
+      // Clean up notified IDs for this session (stream is done)
+      this.clearSessionNotifications(chatSessionId);
+
+      // Play sound notification
+      try {
+        await soundNotification.play();
+      } catch (error) {
+        debug.error('notification', 'Error playing sound notification:', error);
+      }
+
+      // Send push notification with project context
+      try {
+        const projectName = projectState.projects.find(p => p.id === projectId)?.name || 'Unknown';
+
+        if (status === 'completed') {
+          await pushNotification.sendChatComplete(`Chat response ready in "${projectName}"`);
+        } else if (status === 'error') {
+          await pushNotification.sendChatError(`Chat error in "${projectName}"`);
+        } else if (status === 'cancelled') {
+          await pushNotification.sendChatComplete(`Chat interrupted in "${projectName}"`);
+        }
+      } catch (error) {
+        debug.error('notification', 'Error sending push notification:', error);
+      }
+    });
+
+    // Waiting for input — notify once per AskUserQuestion
+    ws.on('chat:waiting-input', async (data) => {
+      const { projectId, chatSessionId, toolUseId } = data;
+
+      // Deduplicate: only notify once per tool_use ID
+      if (this.notifiedToolUseIds.has(toolUseId)) return;
+      this.notifiedToolUseIds.add(toolUseId);
+
+      debug.log('notification', 'GlobalStreamMonitor: Waiting for input', { projectId, chatSessionId, toolUseId });
+
+      // Play sound notification
+      try {
+        await soundNotification.play();
+      } catch (error) {
+        debug.error('notification', 'Error playing sound notification:', error);
+      }
+
+      // Send push notification
+      try {
+        const projectName = projectState.projects.find(p => p.id === projectId)?.name || 'Unknown';
+        await pushNotification.sendChatComplete(`Waiting for your input in "${projectName}"`);
+      } catch (error) {
+        debug.error('notification', 'Error sending push notification:', error);
+      }
+    });
+  }
+
+  /**
+   * Remove tracked tool_use IDs for a finished session
+   */
+  private clearSessionNotifications(chatSessionId: string): void {
+    // Tool IDs are globally unique, so a simple clear-on-stream-finish
+    // is enough — they won't collide across sessions.
+    // For long-running apps, periodically trim to avoid unbounded growth.
+    if (this.notifiedToolUseIds.size > 500) {
+      this.notifiedToolUseIds.clear();
+    }
+  }
+
+  /**
+   * Clear state (for cleanup/testing)
+   */
+  clear(): void {
+    this.notifiedToolUseIds.clear();
+    debug.log('notification', 'GlobalStreamMonitor: Clearing state');
+  }
+}
+
+// Export singleton instance
+export const globalStreamMonitor = new GlobalStreamMonitor();

package/frontend/{lib/services → services}/notification/push.service.ts

@@ -4,7 +4,7 @@
  * Handles native browser push notifications for chat responses
  */
 
-import { settings } from '$frontend/lib/stores/features/settings.svelte';
+import { settings } from '$frontend/stores/features/settings.svelte';
 
 import { debug } from '$shared/utils/logger';
 // Check if browser supports notifications

package/frontend/{lib/services → services}/notification/sound.service.ts

@@ -4,7 +4,7 @@
  * Handles single audio notification for chat responses using local notification.ogg file
  */
 
-import { settings } from '$frontend/lib/stores/features/settings.svelte';
+import { settings } from '$frontend/stores/features/settings.svelte';
 
 import { debug } from '$shared/utils/logger';
 // Cache for audio element

package/frontend/{lib/services → services}/preview/browser/browser-console.service.ts

@@ -1,5 +1,5 @@
 import { debug } from '$shared/utils/logger';
-import ws from '$frontend/lib/utils/ws';
+import ws from '$frontend/utils/ws';
 
 export interface ConsoleMessage {
 	id: string;

package/frontend/{lib/services → services}/preview/browser/browser-webcodecs.service.ts

@@ -14,7 +14,7 @@
  * 7. Render video to canvas, play audio
  */
 
-import ws from '$frontend/lib/utils/ws';
+import ws from '$frontend/utils/ws';
 import { debug } from '$shared/utils/logger';
 
 export interface BrowserWebCodecsStreamStats {