@shepai/cli 1.151.2 → 1.152.0-pr476.5b101f5

package/dist/src/presentation/web/components/layouts/app-shell/app-shell.js

@@ -1,38 +1,26 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useMemo, useState } from 'react';
-import { useRouter, usePathname } from 'next/navigation';
-import { Plus, FolderPlus, Github, GitBranch } from 'lucide-react';
+import { useCallback, useEffect, useState } from 'react';
+import { useRouter } from 'next/navigation';
 import { SidebarProvider, SidebarInset } from '../../ui/sidebar.js';
 import { AppSidebar } from '../../layouts/app-sidebar/index.js';
-import { FloatingActionButton, } from '../../common/floating-action-button/index.js';
 import { ReactFileManagerDialog } from '../../common/react-file-manager-dialog/index.js';
+import { GlobalChatPopup } from '../../features/chat/ChatSheet.js';
 import { pickFolder } from '../../common/add-repository-button/pick-folder.js';
 import { GitHubImportDialog } from '../../common/github-import-dialog/index.js';
 import { AgentEventsProvider } from '../../../hooks/agent-events-provider.js';
 import { DrawerCloseGuardProvider, useDrawerCloseGuard } from '../../../hooks/drawer-close-guard.js';
 import { SidebarFeaturesProvider, useSidebarFeaturesContext, } from '../../../hooks/sidebar-features-context.js';
+import { TurnStatusesProvider } from '../../../hooks/turn-statuses-provider.js';
 import { useNotifications } from '../../../hooks/use-notifications.js';
 import { useFeatureFlags } from '../../../hooks/feature-flags-context.js';
-/** Control center route prefixes where the FAB should be visible. */
-const CONTROL_CENTER_PREFIXES = ['/', '/create', '/adopt', '/feature', '/repository'];
-function isControlCenterRoute(pathname) {
-    return CONTROL_CENTER_PREFIXES.some((prefix) => pathname === prefix || (prefix !== '/' && pathname.startsWith(`${prefix}/`)));
-}
 function AppShellInner({ children, sidebarOpen }) {
     const router = useRouter();
-    const pathname = usePathname();
     const { guardedNavigate } = useDrawerCloseGuard();
     const featureFlags = useFeatureFlags();
     // Subscribe to agent lifecycle events and dispatch toast/browser notifications
     useNotifications();
-    const { features, hasRepositories } = useSidebarFeaturesContext();
-    const handleNewFeature = useCallback(() => {
-        guardedNavigate(() => router.push('/create'));
-    }, [router, guardedNavigate]);
-    const handleAdoptBranch = useCallback(() => {
-        guardedNavigate(() => router.push('/adopt'));
-    }, [router, guardedNavigate]);
+    const { features } = useSidebarFeaturesContext();
     const handleFeatureClick = useCallback((featureId) => {
         guardedNavigate(() => router.push(`/feature/${featureId}`));
     }, [router, guardedNavigate]);
@@ -61,69 +49,40 @@ function AppShellInner({ children, sidebarOpen }) {
             setAddingRepo(false);
         }
     }, [addingRepo, featureFlags.reactFileManager]);
+    // Listen for pick-folder events from the canvas toolbar
+    useEffect(() => {
+        const handler = () => {
+            void handleAddRepository();
+        };
+        window.addEventListener('shep:pick-folder', handler);
+        return () => window.removeEventListener('shep:pick-folder', handler);
+    }, [handleAddRepository]);
+    // Listen for GitHub import event from (+) FAB
+    useEffect(() => {
+        const handler = () => setGithubDialogOpen(true);
+        window.addEventListener('shep:open-github-import', handler);
+        return () => window.removeEventListener('shep:open-github-import', handler);
+    }, []);
     const handleReactPickerSelect = useCallback((path) => {
         if (path) {
             window.dispatchEvent(new CustomEvent('shep:add-repository', { detail: { path } }));
         }
         setShowReactPicker(false);
     }, []);
-    const handleImportFromGitHub = useCallback(() => {
-        setGithubDialogOpen(true);
-    }, []);
     const handleGitHubImportComplete = useCallback((repository) => {
         if (repository.path) {
             window.dispatchEvent(new CustomEvent('shep:add-repository', { detail: { path: repository.path } }));
         }
     }, []);
-    const fabActions = useMemo(() => {
-        const actions = [
-            {
-                id: 'new-feature',
-                label: 'New Feature',
-                icon: _jsx(Plus, { className: "h-4 w-4" }),
-                onClick: handleNewFeature,
-            },
-            ...(featureFlags.adoptBranch
-                ? [
-                    {
-                        id: 'adopt-branch',
-                        label: 'Adopt Branch',
-                        icon: _jsx(GitBranch, { className: "h-4 w-4" }),
-                        onClick: handleAdoptBranch,
-                    },
-                ]
-                : []),
-            {
-                id: 'add-repository',
-                label: 'Add Repository',
-                icon: _jsx(FolderPlus, { className: "h-4 w-4" }),
-                onClick: handleAddRepository,
-                loading: addingRepo,
-            },
-        ];
-        if (featureFlags.githubImport) {
-            actions.push({
-                id: 'import-github',
-                label: 'Import from GitHub',
-                icon: _jsx(Github, { className: "h-4 w-4" }),
-                onClick: handleImportFromGitHub,
-            });
-        }
-        return actions;
-    }, [
-        handleNewFeature,
-        handleAdoptBranch,
-        handleAddRepository,
-        addingRepo,
-        handleImportFromGitHub,
-        featureFlags.githubImport,
-        featureFlags.adoptBranch,
-    ]);
-    return (_jsxs(SidebarProvider, { defaultOpen: sidebarOpen ?? false, children: [_jsx(AppSidebar, { features: features, featureFlags: featureFlags, onFeatureClick: handleFeatureClick }), _jsx(SidebarInset, { children: _jsxs("div", { className: "relative h-full", children: [_jsx("main", { className: "h-full", children: children }), isControlCenterRoute(pathname) && hasRepositories ? (_jsx(FloatingActionButton, { actions: fabActions })) : null, featureFlags.githubImport ? (_jsx(GitHubImportDialog, { open: githubDialogOpen, onOpenChange: setGithubDialogOpen, onImportComplete: handleGitHubImportComplete })) : null] }) }), _jsx(ReactFileManagerDialog, { open: showReactPicker, onOpenChange: (open) => {
+    return (_jsxs(SidebarProvider, { defaultOpen: sidebarOpen ?? false, children: [_jsx(AppSidebar, { features: features, featureFlags: featureFlags, onFeatureClick: handleFeatureClick }), _jsx(SidebarInset, { children: _jsxs("div", { className: "relative h-full", children: [_jsx("main", { className: "h-full", children: children }), _jsx(GlobalChatPopup, {}), featureFlags.githubImport ? (_jsx(GitHubImportDialog, { open: githubDialogOpen, onOpenChange: setGithubDialogOpen, onImportComplete: handleGitHubImportComplete })) : null] }) }), _jsx(ReactFileManagerDialog, { open: showReactPicker, onOpenChange: (open) => {
                     if (!open)
                         setShowReactPicker(false);
                 }, onSelect: handleReactPickerSelect })] }));
 }
+/** Wraps children with TurnStatusesProvider (polls all active statuses from backend). */
+function TurnStatusesBridge({ children }) {
+    return _jsx(TurnStatusesProvider, { children: children });
+}
 export function AppShell({ children, sidebarOpen }) {
-    return (_jsx(AgentEventsProvider, { children: _jsx(DrawerCloseGuardProvider, { children: _jsx(SidebarFeaturesProvider, { children: _jsx(AppShellInner, { sidebarOpen: sidebarOpen, children: children }) }) }) }));
+    return (_jsx(AgentEventsProvider, { children: _jsx(DrawerCloseGuardProvider, { children: _jsx(SidebarFeaturesProvider, { children: _jsx(TurnStatusesBridge, { children: _jsx(AppShellInner, { sidebarOpen: sidebarOpen, children: children }) }) }) }) }));
 }

package/dist/src/presentation/web/components/providers/query-provider.d.ts

@@ -0,0 +1,4 @@
+export declare function QueryProvider({ children }: {
+    children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=query-provider.d.ts.map

package/dist/src/presentation/web/components/providers/query-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"query-provider.d.ts","sourceRoot":"","sources":["../../../../../../src/presentation/web/components/providers/query-provider.tsx"],"names":[],"mappings":"AAKA,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,2CAexE"}

package/dist/src/presentation/web/components/providers/query-provider.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { useState } from 'react';
+export function QueryProvider({ children }) {
+    // eslint-disable-next-line react/hook-use-state -- intentionally omitting setter; stable instance
+    const [queryClient] = useState(() => new QueryClient({
+        defaultOptions: {
+            queries: {
+                staleTime: 1000,
+                refetchOnWindowFocus: false,
+            },
+        },
+    }));
+    return _jsx(QueryClientProvider, { client: queryClient, children: children });
+}

package/dist/src/presentation/web/hooks/turn-statuses-provider.d.ts

@@ -0,0 +1,15 @@
+import { type ReactNode } from 'react';
+import { type TurnStatus } from './use-turn-statuses.js';
+/**
+ * Polls ALL active turn statuses in a single API call (no IDs needed).
+ * Children use `useTurnStatus(scopeId)` to read individual statuses.
+ */
+export declare function TurnStatusesProvider({ children }: {
+    children: ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/**
+ * Get the turn status for a specific scope ID.
+ * Must be used within a TurnStatusesProvider.
+ */
+export declare function useTurnStatus(scopeId: string): TurnStatus;
+//# sourceMappingURL=turn-statuses-provider.d.ts.map

package/dist/src/presentation/web/hooks/turn-statuses-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"turn-statuses-provider.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/turn-statuses-provider.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAsC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAC3E,OAAO,EAAsB,KAAK,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAW1E;;;GAGG;AACH,wBAAgB,oBAAoB,CAAC,EAAE,QAAQ,EAAE,EAAE;IAAE,QAAQ,EAAE,SAAS,CAAA;CAAE,2CAWzE;AAED;;;GAGG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,MAAM,GAAG,UAAU,CAGzD"}

package/dist/src/presentation/web/hooks/turn-statuses-provider.js

@@ -0,0 +1,26 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useMemo } from 'react';
+import { useAllTurnStatuses } from './use-turn-statuses.js';
+const TurnStatusesContext = createContext({
+    getStatus: () => 'idle',
+});
+/**
+ * Polls ALL active turn statuses in a single API call (no IDs needed).
+ * Children use `useTurnStatus(scopeId)` to read individual statuses.
+ */
+export function TurnStatusesProvider({ children }) {
+    const statuses = useAllTurnStatuses();
+    const value = useMemo(() => ({
+        getStatus: (scopeId) => statuses[scopeId] ?? 'idle',
+    }), [statuses]);
+    return _jsx(TurnStatusesContext.Provider, { value: value, children: children });
+}
+/**
+ * Get the turn status for a specific scope ID.
+ * Must be used within a TurnStatusesProvider.
+ */
+export function useTurnStatus(scopeId) {
+    const ctx = useContext(TurnStatusesContext);
+    return ctx.getStatus(scopeId);
+}

package/dist/src/presentation/web/hooks/use-attachments.d.ts

@@ -0,0 +1,26 @@
+export interface FormAttachment {
+    id: string;
+    name: string;
+    size: number;
+    mimeType: string;
+    path: string;
+    loading?: boolean;
+    notes?: string;
+}
+export declare function useAttachments(): {
+    attachments: FormAttachment[];
+    completedAttachments: FormAttachment[];
+    uploadError: string | null;
+    isDragOver: boolean;
+    handleFiles: (fileList: File[]) => Promise<void>;
+    handleDragEnter: (e: React.DragEvent) => void;
+    handleDragLeave: (e: React.DragEvent) => void;
+    handleDragOver: (e: React.DragEvent) => void;
+    handleDrop: (e: React.DragEvent) => void;
+    handlePaste: (e: React.ClipboardEvent) => void;
+    addAttachment: (file: Omit<FormAttachment, "loading">) => void;
+    removeAttachment: (id: string) => void;
+    updateNotes: (id: string, notes: string) => void;
+    clearAttachments: () => void;
+};
+//# sourceMappingURL=use-attachments.d.ts.map

package/dist/src/presentation/web/hooks/use-attachments.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-attachments.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/use-attachments.ts"],"names":[],"mappings":"AA4FA,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,wBAAgB,cAAc;;;;;4BAOqB,IAAI,EAAE;yBA8Df,KAAK,CAAC,SAAS;yBAOf,KAAK,CAAC,SAAS;wBAOhB,KAAK,CAAC,SAAS;oBAMhD,KAAK,CAAC,SAAS;qBAYf,KAAK,CAAC,cAAc;0BA0Be,IAAI,CAAC,cAAc,EAAE,SAAS,CAAC;2BAR9B,MAAM;sBAIX,MAAM,SAAS,MAAM;;EAmC3D"}

package/dist/src/presentation/web/hooks/use-attachments.js

@@ -0,0 +1,227 @@
+'use client';
+import { useState, useCallback, useRef } from 'react';
+const MAX_FILE_SIZE = 10 * 1024 * 1024; // 10 MB
+/** Minimal set of known-safe extensions (same as feature-create-drawer). */
+const ALLOWED_EXTENSIONS = new Set([
+    'txt',
+    'md',
+    'csv',
+    'json',
+    'yaml',
+    'yml',
+    'xml',
+    'html',
+    'css',
+    'js',
+    'ts',
+    'jsx',
+    'tsx',
+    'py',
+    'rb',
+    'go',
+    'rs',
+    'java',
+    'kt',
+    'c',
+    'cpp',
+    'h',
+    'hpp',
+    'cs',
+    'swift',
+    'sh',
+    'bash',
+    'zsh',
+    'fish',
+    'ps1',
+    'bat',
+    'cmd',
+    'sql',
+    'graphql',
+    'proto',
+    'toml',
+    'ini',
+    'cfg',
+    'conf',
+    'env',
+    'dockerfile',
+    'makefile',
+    'cmake',
+    'gradle',
+    'sbt',
+    'lock',
+    'sum',
+    'mod',
+    'png',
+    'jpg',
+    'jpeg',
+    'gif',
+    'svg',
+    'webp',
+    'bmp',
+    'ico',
+    'avif',
+    'pdf',
+    'doc',
+    'docx',
+    'xls',
+    'xlsx',
+    'ppt',
+    'pptx',
+    'odt',
+    'ods',
+    'odp',
+    'zip',
+    'tar',
+    'gz',
+    'bz2',
+    'xz',
+    '7z',
+    'rar',
+    'log',
+    'diff',
+    'patch',
+]);
+function getExtension(filename) {
+    const idx = filename.lastIndexOf('.');
+    return idx > 0 ? filename.slice(idx + 1).toLowerCase() : null;
+}
+export function useAttachments() {
+    const [attachments, setAttachments] = useState([]);
+    const [uploadError, setUploadError] = useState(null);
+    const [isDragOver, setIsDragOver] = useState(false);
+    const dragCounterRef = useRef(0);
+    const sessionIdRef = useRef(crypto.randomUUID());
+    const handleFiles = useCallback(async (fileList) => {
+        setUploadError(null);
+        for (const file of fileList) {
+            if (file.size > MAX_FILE_SIZE) {
+                setUploadError(`"${file.name}" exceeds 10 MB limit`);
+                return;
+            }
+            const ext = getExtension(file.name);
+            if (ext && !ALLOWED_EXTENSIONS.has(ext)) {
+                setUploadError(`File type "${ext}" is not allowed`);
+                return;
+            }
+        }
+        for (const file of fileList) {
+            const tempId = crypto.randomUUID();
+            setAttachments((prev) => [
+                ...prev,
+                {
+                    id: tempId,
+                    name: file.name,
+                    size: file.size,
+                    mimeType: file.type || 'application/octet-stream',
+                    path: '',
+                    loading: true,
+                },
+            ]);
+            try {
+                const formData = new FormData();
+                formData.append('file', file);
+                formData.append('sessionId', sessionIdRef.current);
+                const res = await fetch('/api/attachments/upload', {
+                    method: 'POST',
+                    body: formData,
+                });
+                if (!res.ok) {
+                    const body = await res.json().catch(() => ({ error: 'Upload failed' }));
+                    setAttachments((prev) => prev.filter((a) => a.id !== tempId));
+                    setUploadError(body.error ?? 'Upload failed');
+                    return;
+                }
+                const uploaded = await res.json();
+                setAttachments((prev) => {
+                    const isDupe = prev.some((a) => a.id !== tempId && a.path === uploaded.path);
+                    if (isDupe)
+                        return prev.filter((a) => a.id !== tempId);
+                    return prev.map((a) => a.id === tempId ? { ...uploaded, id: tempId, loading: false } : a);
+                });
+            }
+            catch {
+                setAttachments((prev) => prev.filter((a) => a.id !== tempId));
+                setUploadError('Upload failed');
+            }
+        }
+    }, []);
+    const handleDragEnter = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        dragCounterRef.current += 1;
+        if (dragCounterRef.current === 1)
+            setIsDragOver(true);
+    }, []);
+    const handleDragLeave = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        dragCounterRef.current -= 1;
+        if (dragCounterRef.current === 0)
+            setIsDragOver(false);
+    }, []);
+    const handleDragOver = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+    }, []);
+    const handleDrop = useCallback((e) => {
+        e.preventDefault();
+        e.stopPropagation();
+        dragCounterRef.current = 0;
+        setIsDragOver(false);
+        const files = Array.from(e.dataTransfer.files);
+        if (files.length > 0)
+            void handleFiles(files);
+    }, [handleFiles]);
+    const handlePaste = useCallback((e) => {
+        const items = e.clipboardData?.items;
+        if (!items)
+            return;
+        const files = [];
+        for (const item of Array.from(items)) {
+            if (item.kind === 'file') {
+                const file = item.getAsFile();
+                if (file)
+                    files.push(file);
+            }
+        }
+        if (files.length > 0) {
+            e.preventDefault();
+            void handleFiles(files);
+        }
+    }, [handleFiles]);
+    const removeAttachment = useCallback((id) => {
+        setAttachments((prev) => prev.filter((a) => a.id !== id));
+    }, []);
+    const updateNotes = useCallback((id, notes) => {
+        setAttachments((prev) => prev.map((a) => (a.id === id ? { ...a, notes } : a)));
+    }, []);
+    const addAttachment = useCallback((file) => {
+        setAttachments((prev) => {
+            const isDupe = prev.some((a) => a.path === file.path);
+            if (isDupe)
+                return prev;
+            return [...prev, { ...file, loading: false }];
+        });
+    }, []);
+    const clearAttachments = useCallback(() => {
+        setAttachments([]);
+        setUploadError(null);
+    }, []);
+    const completedAttachments = attachments.filter((a) => !a.loading);
+    return {
+        attachments,
+        completedAttachments,
+        uploadError,
+        isDragOver,
+        handleFiles,
+        handleDragEnter,
+        handleDragLeave,
+        handleDragOver,
+        handleDrop,
+        handlePaste,
+        addAttachment,
+        removeAttachment,
+        updateNotes,
+        clearAttachments,
+    };
+}

package/dist/src/presentation/web/hooks/use-turn-statuses.d.ts

@@ -0,0 +1,12 @@
+export type TurnStatus = 'idle' | 'processing' | 'unread';
+/**
+ * Polls ALL active turn statuses from the backend.
+ * No IDs needed — the backend returns every non-idle session status.
+ * Returns a map of scopeId → TurnStatus.
+ */
+export declare function useAllTurnStatuses(): Record<string, TurnStatus>;
+/**
+ * Marks a feature's chat as read (clears 'unread' → 'idle').
+ */
+export declare function markChatRead(featureId: string): Promise<void>;
+//# sourceMappingURL=use-turn-statuses.d.ts.map

package/dist/src/presentation/web/hooks/use-turn-statuses.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-turn-statuses.d.ts","sourceRoot":"","sources":["../../../../../src/presentation/web/hooks/use-turn-statuses.ts"],"names":[],"mappings":"AAIA,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,YAAY,GAAG,QAAQ,CAAC;AAE1D;;;;GAIG;AACH,wBAAgB,kBAAkB,IAAI,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAY/D;AAED;;GAEG;AACH,wBAAsB,YAAY,CAAC,SAAS,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAEnE"}

package/dist/src/presentation/web/hooks/use-turn-statuses.js

@@ -0,0 +1,26 @@
+'use client';
+import { useQuery } from '@tanstack/react-query';
+/**
+ * Polls ALL active turn statuses from the backend.
+ * No IDs needed — the backend returns every non-idle session status.
+ * Returns a map of scopeId → TurnStatus.
+ */
+export function useAllTurnStatuses() {
+    const { data } = useQuery({
+        queryKey: ['turn-statuses'],
+        queryFn: async () => {
+            const res = await fetch('/api/interactive/chat/turn-statuses');
+            if (!res.ok)
+                return {};
+            return res.json();
+        },
+        refetchInterval: 5_000,
+    });
+    return data ?? {};
+}
+/**
+ * Marks a feature's chat as read (clears 'unread' → 'idle').
+ */
+export async function markChatRead(featureId) {
+    await fetch(`/api/interactive/chat/${featureId}/mark-read`, { method: 'POST' });
+}