@cerbur/clutch-dsh-worktree 0.1.0

package/lib/client/WorktreeSurface.js

@@ -0,0 +1,834 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { Button, IconArchiveOutline20, IconBranchOutline16, IconChevronDownOutline14, IconChevronRightOutline14, IconCloseOutline16, IconEditOutline16, IconEllipsisOutline16, IconFolderClose16, IconFolderOpen16, IconPlusOutline16, IconSearchOutline16, IconTrashOutline16, Input, Menu, Modal, StateDot, } from '@deepseek-ai/dsh-client-ui-primitives';
+import { openWorktreeSession } from './navigation.js';
+import { useSidebarOverlayGeometry } from './sidebar-overlay-geometry.js';
+import { effectiveViewMode, unboundSessionIds, workspaceSessionIds } from './view-mode.js';
+import { executeWorktreeAction, createDefaultWorktreeName, filterArchivedSessionIds, loadWorktreeViews, selectDefaultBaseBranch, stableWorkspaceIds, toWorktreeViewError, WorktreeSessionBindingError, } from './worktree-view.js';
+import styles from './worktree.css';
+const EMPTY_READ_STATE = { status: 'idle', views: [] };
+function useStableWorkspaceIds(workspaces) {
+    const next = workspaces.map((workspace) => workspace.workspaceId);
+    const previousRef = useRef([]);
+    const stable = stableWorkspaceIds(previousRef.current, next);
+    if (stable !== previousRef.current)
+        previousRef.current = stable;
+    return previousRef.current;
+}
+function sessionLabel(sessionId, sessions) {
+    return sessions.byId[sessionId]?.displayTitle ?? sessionId;
+}
+function rowHalf(event) {
+    const rect = event.currentTarget.getBoundingClientRect();
+    return event.clientY < rect.top + rect.height / 2 ? 'before' : 'after';
+}
+function bindingIdsFor(bindings, worktreeId) {
+    return bindings
+        .filter((binding) => binding.worktreeId === worktreeId)
+        .map((binding) => binding.sessionId);
+}
+function includesText(value, query) {
+    return value.toLocaleLowerCase().includes(query);
+}
+function workspaceMatches(workspace, view, sessions, query) {
+    if (query.length === 0)
+        return true;
+    if (includesText(workspace.title, query))
+        return true;
+    if (workspace.sessionIds.some((sessionId) => includesText(sessionLabel(sessionId, sessions), query))) {
+        return true;
+    }
+    if (view === undefined)
+        return false;
+    if (view.worktrees.some((record) => includesText(record.branch, query) || includesText(record.absolutePath, query))) {
+        return true;
+    }
+    return view.bindings.some((binding) => includesText(sessionLabel(binding.sessionId, sessions), query));
+}
+/** Workspace row using the native DSH menu, fixed action column, and drag contract. */
+function WorktreeWorkspaceRow({ workspace, expanded, actionPending, menuOpen, drag, onToggle, onCreateWorktree, onRename, onDelete, onMenuOpenChange, }) {
+    const workspaceMenuItems = [
+        {
+            id: 'rename',
+            label: 'Rename',
+            icon: _jsx(IconEditOutline16, {}),
+            disabled: actionPending,
+        },
+        {
+            id: 'delete',
+            label: 'Delete',
+            icon: _jsx(IconTrashOutline16, {}),
+            danger: true,
+            disabled: actionPending,
+        },
+    ];
+    const markerClass = drag.marker === 'before'
+        ? styles.dropBefore
+        : drag.marker === 'after'
+            ? styles.dropAfter
+            : '';
+    return (_jsxs("div", { className: `${styles.workspaceRow} ${markerClass}`, "data-workspace-drag": drag.active ? 'active' : undefined, "data-menu-open": menuOpen || undefined, draggable: true, onClick: () => {
+            onToggle();
+        }, onDragStart: (event) => {
+            event.dataTransfer.effectAllowed = 'move';
+            event.dataTransfer.setData('text/plain', workspace.workspaceId);
+            drag.start();
+        }, onDragEnd: drag.end, onDragOver: (event) => {
+            if (!drag.active)
+                return;
+            event.preventDefault();
+            event.dataTransfer.dropEffect = 'move';
+            drag.hover(rowHalf(event));
+        }, onDrop: (event) => {
+            if (!drag.active)
+                return;
+            event.preventDefault();
+            drag.drop(rowHalf(event));
+        }, children: [_jsx("button", { type: "button", className: `${styles.disclosureButton} ${styles.workspaceDisclosure}`, "aria-label": `${expanded ? 'Collapse' : 'Expand'} ${workspace.title}`, "aria-expanded": expanded, onClick: (event) => {
+                    event.stopPropagation();
+                    onToggle();
+                }, children: expanded ? (_jsx(IconChevronDownOutline14, { size: 18 })) : (_jsx(IconChevronRightOutline14, { size: 18 })) }), _jsx("span", { className: styles.workspaceIcon, "aria-hidden": "true", children: expanded ? _jsx(IconFolderOpen16, {}) : _jsx(IconFolderClose16, {}) }), _jsx("span", { className: styles.workspaceTitle, children: workspace.title }), _jsxs("span", { className: `${styles.treeActionSlot} ${styles.workspaceActions}`, children: [_jsx("span", { className: styles.menuAction, children: _jsx(Menu, { open: menuOpen, onClose: () => {
+                                onMenuOpenChange(false);
+                            }, items: workspaceMenuItems, onSelect: (id) => {
+                                onMenuOpenChange(false);
+                                if (id === 'rename')
+                                    onRename();
+                                if (id === 'delete')
+                                    onDelete();
+                            }, portal: true, closeOnPointerLeave: true, anchor: (_jsx("button", { type: "button", className: styles.iconButton, "data-workspace-menu": true, "aria-label": `Workspace options for ${workspace.title}`, onClick: (event) => {
+                                    event.stopPropagation();
+                                    onMenuOpenChange(!menuOpen);
+                                }, children: _jsx(IconEllipsisOutline16, {}) })) }) }), _jsx("button", { type: "button", className: styles.iconButton, "data-add-worktree": true, "aria-label": `Add Worktree to ${workspace.title}`, onClick: (event) => {
+                            event.stopPropagation();
+                            onCreateWorktree();
+                        }, children: _jsx(IconPlusOutline16, {}) })] })] }));
+}
+/** Shared Main/Worktree group row with parameterized icon, state, and actions. */
+function WorktreeGroupRow({ kind, label, expanded, icon, workspaceTitle, state, stateLabel, onToggle, onCreateSession, }) {
+    const main = kind === 'main';
+    return (_jsxs("div", { className: styles.worktreeRow, "data-main-group": main ? 'true' : undefined, "data-main-expanded": main ? String(expanded) : undefined, onClick: onToggle, children: [_jsx("button", { type: "button", className: `${styles.disclosureButton} ${styles.worktreeDisclosure}`, "aria-label": `${expanded ? 'Collapse' : 'Expand'} ${label}`, "aria-expanded": expanded, onClick: (event) => {
+                    event.stopPropagation();
+                    onToggle();
+                }, children: expanded ? (_jsx(IconChevronDownOutline14, { size: 18 })) : (_jsx(IconChevronRightOutline14, { size: 18 })) }), _jsx("span", { className: styles.worktreeIcon, "aria-hidden": "true", children: icon }), state !== undefined && stateLabel !== undefined && (_jsx("span", { className: styles.worktreeState, role: "img", "aria-label": stateLabel, title: stateLabel, children: _jsx(StateDot, { state: state }) })), _jsx("span", { className: styles.worktreeLabel, children: label }), _jsx("span", { className: styles.treeActionSlot, children: onCreateSession !== undefined && (_jsx("button", { type: "button", className: styles.iconButton, "data-add-main-session": main ? 'true' : undefined, "data-add-session": main ? undefined : 'true', "aria-label": `Add Session to ${workspaceTitle}`, onClick: (event) => {
+                        event.stopPropagation();
+                        onCreateSession();
+                    }, children: _jsx(IconPlusOutline16, {}) })) })] }));
+}
+/** Worktree-mode Session row with the same trailing options menu as native DSH rows. */
+function WorktreeSessionRow({ sessionId, label, drag, actionPending, onOpen, onRename, onFork, onArchive, }) {
+    const [menuOpen, setMenuOpen] = useState(false);
+    const markerClass = drag.marker === 'before'
+        ? styles.dropBefore
+        : drag.marker === 'after'
+            ? styles.dropAfter
+            : '';
+    const sessionMenuItems = [
+        {
+            id: 'rename',
+            label: 'Rename',
+            icon: _jsx(IconEditOutline16, {}),
+            disabled: onRename === undefined || actionPending,
+        },
+        {
+            id: 'fork',
+            label: 'Fork session',
+            icon: _jsx(IconBranchOutline16, {}),
+            disabled: onFork === undefined || actionPending,
+        },
+        {
+            id: 'archive',
+            label: 'Archive session',
+            icon: _jsx(IconArchiveOutline20, { size: 16 }),
+            disabled: onArchive === undefined || actionPending,
+        },
+    ];
+    return (_jsxs("div", { className: `${styles.treeSessionRow} ${markerClass}`, "data-session-id": sessionId, "data-session-drag": drag.active ? 'active' : undefined, "data-menu-open": menuOpen || undefined, role: "treeitem", draggable: true, onDragStart: (event) => {
+            event.dataTransfer.effectAllowed = 'move';
+            event.dataTransfer.setData('text/plain', sessionId);
+            drag.start();
+        }, onDragEnd: drag.end, onDragOver: (event) => {
+            if (!drag.active)
+                return;
+            event.preventDefault();
+            event.dataTransfer.dropEffect = 'move';
+            drag.hover(rowHalf(event));
+        }, onDrop: (event) => {
+            if (!drag.active)
+                return;
+            event.preventDefault();
+            drag.drop(rowHalf(event));
+        }, children: [_jsxs("button", { type: "button", className: styles.treeSessionContent, onClick: onOpen, children: [_jsx("span", { className: styles.treeGuide, "aria-hidden": "true", children: "\u2514" }), _jsx("span", { className: styles.sessionLabel, children: label })] }), _jsx("span", { className: styles.rowActions, children: _jsx(Menu, { open: menuOpen, onClose: () => {
+                        setMenuOpen(false);
+                    }, items: sessionMenuItems, onSelect: (id) => {
+                        setMenuOpen(false);
+                        if (id === 'rename')
+                            onRename?.(sessionId, label);
+                        if (id === 'fork')
+                            onFork?.(sessionId);
+                        if (id === 'archive')
+                            onArchive?.(sessionId);
+                    }, portal: true, closeOnPointerLeave: true, anchor: (_jsx("button", { type: "button", className: styles.iconButton, "data-session-menu": true, "aria-label": `Session options for ${label}`, onClick: (event) => {
+                            event.stopPropagation();
+                            setMenuOpen((current) => !current);
+                        }, children: _jsx(IconEllipsisOutline16, {}) })) }) })] }));
+}
+function WorktreeSessionGroup({ groupKey, sessionIds, workspaceId, expanded, actionPending, sessions, dragState, onToggleExpanded, onStartDrag, onHoverDrag, onClearDrag, onFinishDrag, onCommitDrag, onOpen, onRename, onFork, onArchive, }) {
+    const visibleSessionIds = expanded ? sessionIds : sessionIds.slice(0, 5);
+    const sameGroupDrag = dragState?.groupKey === groupKey;
+    return (_jsxs(_Fragment, { children: [visibleSessionIds.map((sessionId) => (_jsx(WorktreeSessionRow, { sessionId: sessionId, label: sessionLabel(sessionId, sessions), drag: {
+                    active: sameGroupDrag,
+                    marker: sameGroupDrag && dragState.over?.sessionId === sessionId
+                        ? dragState.over.half
+                        : null,
+                    start: () => {
+                        onStartDrag(groupKey, sessionId);
+                    },
+                    hover: (half) => {
+                        onHoverDrag(sessionId, half);
+                    },
+                    drop: (half) => {
+                        if (dragState === undefined)
+                            return;
+                        onCommitDrag(dragState, { sessionId, half }, sessionIds, workspaceId);
+                    },
+                    end: () => {
+                        if (dragState?.over !== null && dragState?.over !== undefined) {
+                            onCommitDrag(dragState, dragState.over, sessionIds, workspaceId);
+                        }
+                        else {
+                            onClearDrag();
+                        }
+                        onFinishDrag();
+                    },
+                }, actionPending: actionPending, onOpen: () => {
+                    onOpen(sessionId);
+                }, onRename: onRename, onFork: onFork, onArchive: onArchive }, `${groupKey}:${sessionId}`))), sessionIds.length > 5 && (_jsx("button", { type: "button", className: styles.sessionOverflowButton, "aria-expanded": expanded, onClick: onToggleExpanded, children: expanded ? 'Collapse' : `Expand ${sessionIds.length - 5} more` }))] }));
+}
+/**
+ * Peer Worktree navigation surface. It keeps the original DSH Workspace mode
+ * intact and renders a browser-local Workspace → Worktree → Session projection.
+ */
+export function WorktreeSurface({ useStore, actions, useSessions, useWorkspaces, available, manager, createWorkspace, createSessionForWorktree: createSessionCallback, createMainSession, renameWorkspace, deleteWorkspace, insertWorkspaceBefore, insertSessionBefore, renameSession, forkSession, archiveSession, ensureSessionWorkspace, syncSessionWorkspaces, openSession, }) {
+    const preferredMode = useStore((state) => state.viewMode);
+    const mode = effectiveViewMode(preferredMode, available && manager !== undefined);
+    const sessions = useSessions((state) => state);
+    const workspaces = useWorkspaces((state) => state);
+    const workspaceIds = useStableWorkspaceIds(workspaces.items);
+    const [readState, setReadState] = useState(EMPTY_READ_STATE);
+    const [searchQuery, setSearchQuery] = useState('');
+    const [expandedWorkspaces, setExpandedWorkspaces] = useState({});
+    const [expandedMains, setExpandedMains] = useState({});
+    const [expandedWorktrees, setExpandedWorktrees] = useState({});
+    const [worktreeModalWorkspaceId, setWorktreeModalWorkspaceId] = useState();
+    const [openWorkspaceMenuId, setOpenWorkspaceMenuId] = useState();
+    const [selectedBranch, setSelectedBranch] = useState('');
+    const [newBranch, setNewBranch] = useState('');
+    const [pendingSessionBinding, setPendingSessionBinding] = useState();
+    const [actionError, setActionError] = useState();
+    const [actionPending, setActionPending] = useState(false);
+    const [sessionRenameTarget, setSessionRenameTarget] = useState();
+    const [sessionRenameDraft, setSessionRenameDraft] = useState('');
+    const [sessionRenamePending, setSessionRenamePending] = useState(false);
+    const [sessionRenameError, setSessionRenameError] = useState();
+    const [workspaceDrag, setWorkspaceDrag] = useState();
+    const [workspaceRenameTarget, setWorkspaceRenameTarget] = useState();
+    const [workspaceRenameDraft, setWorkspaceRenameDraft] = useState('');
+    const [workspaceRenamePending, setWorkspaceRenamePending] = useState(false);
+    const [workspaceRenameError, setWorkspaceRenameError] = useState();
+    const [workspaceDeleteTarget, setWorkspaceDeleteTarget] = useState();
+    const [workspaceDeletePending, setWorkspaceDeletePending] = useState(false);
+    const [workspaceDeleteError, setWorkspaceDeleteError] = useState();
+    const workspaceDropCommitted = useRef(false);
+    const [sessionDrag, setSessionDrag] = useState();
+    const [expandedSessionGroups, setExpandedSessionGroups] = useState({});
+    const sessionDropCommitted = useRef(false);
+    const { ref, width, bounds } = useSidebarOverlayGeometry(mode === 'worktree');
+    const collapsed = width <= 64;
+    const query = searchQuery.trim().toLocaleLowerCase();
+    const archivedSessionIds = workspaces.archivedSessionIds ?? [];
+    const refresh = useCallback(async () => {
+        if (manager === undefined) {
+            setReadState(EMPTY_READ_STATE);
+            return;
+        }
+        setReadState({ status: 'loading', views: [] });
+        try {
+            const views = await loadWorktreeViews(manager, workspaceIds);
+            setReadState({ status: 'ready', views });
+        }
+        catch (error) {
+            setReadState({
+                status: 'error',
+                views: [],
+                error: toWorktreeViewError(error),
+            });
+        }
+    }, [manager, workspaceIds]);
+    useEffect(() => {
+        if (mode === 'worktree') {
+            void refresh();
+        }
+        else {
+            setReadState(EMPTY_READ_STATE);
+        }
+    }, [mode, refresh]);
+    useEffect(() => {
+        if (readState.status !== 'ready' || syncSessionWorkspaces === undefined)
+            return;
+        syncSessionWorkspaces(readState.views.flatMap((view) => view.bindings.map((binding) => ({
+            workspaceId: binding.workspaceId,
+            sessionId: binding.sessionId,
+        }))));
+    }, [readState.status, readState.views, syncSessionWorkspaces]);
+    const viewByWorkspace = useMemo(() => new Map(readState.views.map((view) => [view.workspaceId, view])), [readState.views]);
+    const modalWorkspace = workspaces.items.find((workspace) => workspace.workspaceId === worktreeModalWorkspaceId);
+    const modalView = worktreeModalWorkspaceId === undefined
+        ? undefined
+        : viewByWorkspace.get(worktreeModalWorkspaceId);
+    const runMutation = async (operation) => {
+        setActionPending(true);
+        setActionError(undefined);
+        try {
+            await operation();
+            await refresh();
+        }
+        catch (error) {
+            setActionError(toWorktreeViewError(error));
+        }
+        finally {
+            setActionPending(false);
+        }
+    };
+    const workspaceRenameTrimmed = workspaceRenameDraft.trim();
+    const workspaceRenameDuplicate = workspaceRenameTarget !== undefined &&
+        workspaceRenameTrimmed.length > 0 &&
+        workspaces.items.some((workspace) => workspace.workspaceId !== workspaceRenameTarget.workspaceId &&
+            workspace.title === workspaceRenameTrimmed);
+    const workspaceRenameBlocked = workspaceRenamePending ||
+        workspaceRenameTarget === undefined ||
+        workspaceRenameTrimmed.length === 0 ||
+        workspaceRenameTrimmed === workspaceRenameTarget?.currentTitle ||
+        workspaceRenameDuplicate;
+    const openWorkspaceRename = (workspace) => {
+        setWorkspaceRenameTarget({
+            workspaceId: workspace.workspaceId,
+            currentTitle: workspace.title,
+        });
+        setWorkspaceRenameDraft(workspace.title);
+        setWorkspaceRenameError(undefined);
+    };
+    const closeWorkspaceRename = () => {
+        if (workspaceRenamePending)
+            return;
+        setWorkspaceRenameTarget(undefined);
+        setWorkspaceRenameError(undefined);
+    };
+    const confirmWorkspaceRename = async () => {
+        const target = workspaceRenameTarget;
+        if (workspaceRenameBlocked || target === undefined)
+            return;
+        if (renameWorkspace === undefined) {
+            setWorkspaceRenameError('Workspace rename is unavailable; retry after reconnecting.');
+            return;
+        }
+        setWorkspaceRenamePending(true);
+        setWorkspaceRenameError(undefined);
+        try {
+            await renameWorkspace(target.workspaceId, workspaceRenameTrimmed);
+            setWorkspaceRenameTarget(undefined);
+        }
+        catch (error) {
+            setWorkspaceRenameError(error instanceof Error ? error.message : String(error));
+        }
+        finally {
+            setWorkspaceRenamePending(false);
+        }
+    };
+    const openWorkspaceDelete = (workspace) => {
+        setWorkspaceDeleteTarget({ workspaceId: workspace.workspaceId, title: workspace.title });
+        setWorkspaceDeleteError(undefined);
+    };
+    const closeWorkspaceDelete = () => {
+        if (workspaceDeletePending)
+            return;
+        setWorkspaceDeleteTarget(undefined);
+        setWorkspaceDeleteError(undefined);
+    };
+    const confirmWorkspaceDelete = async () => {
+        const target = workspaceDeleteTarget;
+        if (target === undefined || workspaceDeletePending)
+            return;
+        if (deleteWorkspace === undefined) {
+            setWorkspaceDeleteError('Workspace delete is unavailable; retry after reconnecting.');
+            return;
+        }
+        setWorkspaceDeletePending(true);
+        setWorkspaceDeleteError(undefined);
+        try {
+            await deleteWorkspace(target.workspaceId);
+            setWorkspaceDeleteTarget(undefined);
+        }
+        catch (error) {
+            setWorkspaceDeleteError(error instanceof Error ? error.message : String(error));
+        }
+        finally {
+            setWorkspaceDeletePending(false);
+        }
+    };
+    const commitWorkspaceDrag = (activeDrag, over) => {
+        if (workspaceDropCommitted.current)
+            return;
+        workspaceDropCommitted.current = true;
+        setWorkspaceDrag(undefined);
+        const rows = workspaces.items;
+        const targetIndex = rows.findIndex((workspace) => workspace.workspaceId === over.workspaceId);
+        const sourceIndex = rows.findIndex((workspace) => workspace.workspaceId === activeDrag.workspaceId);
+        if (targetIndex === -1 || sourceIndex === -1)
+            return;
+        const beforeWorkspaceId = over.half === 'before'
+            ? over.workspaceId
+            : rows[targetIndex + 1]?.workspaceId;
+        const anchorIndex = beforeWorkspaceId === undefined
+            ? rows.length
+            : rows.findIndex((workspace) => workspace.workspaceId === beforeWorkspaceId);
+        if (beforeWorkspaceId === activeDrag.workspaceId ||
+            anchorIndex === sourceIndex ||
+            anchorIndex === sourceIndex + 1) {
+            return;
+        }
+        if (insertWorkspaceBefore === undefined) {
+            setActionError({
+                code: 'WORKSPACE_ORDER_UNAVAILABLE',
+                message: 'Workspace ordering is unavailable; retry after reconnecting.',
+                retryable: true,
+            });
+            return;
+        }
+        setActionError(undefined);
+        void insertWorkspaceBefore(activeDrag.workspaceId, beforeWorkspaceId).catch((error) => {
+            setActionError(toWorktreeViewError(error));
+        });
+    };
+    const commitSessionDrag = (activeDrag, over, sessionIds, workspaceId) => {
+        if (sessionDropCommitted.current)
+            return;
+        sessionDropCommitted.current = true;
+        setSessionDrag(undefined);
+        const targetIndex = sessionIds.indexOf(over.sessionId);
+        const sourceIndex = sessionIds.indexOf(activeDrag.sessionId);
+        if (targetIndex === -1 || sourceIndex === -1)
+            return;
+        const beforeSessionId = over.half === 'before'
+            ? over.sessionId
+            : sessionIds[targetIndex + 1];
+        const anchorIndex = beforeSessionId === undefined
+            ? sessionIds.length
+            : sessionIds.indexOf(beforeSessionId);
+        if (beforeSessionId === activeDrag.sessionId ||
+            anchorIndex === sourceIndex ||
+            anchorIndex === sourceIndex + 1) {
+            return;
+        }
+        if (insertSessionBefore === undefined) {
+            setActionError({
+                code: 'SESSION_ORDER_UNAVAILABLE',
+                message: 'Session ordering is unavailable; retry after reconnecting.',
+                retryable: true,
+            });
+            return;
+        }
+        setActionError(undefined);
+        void insertSessionBefore(workspaceId, activeDrag.sessionId, beforeSessionId).catch((error) => {
+            setActionError(toWorktreeViewError(error));
+        });
+    };
+    const openSessionRename = (sessionId, currentTitle) => {
+        setSessionRenameTarget({ sessionId, currentTitle });
+        setSessionRenameDraft(currentTitle);
+        setSessionRenameError(undefined);
+    };
+    const closeSessionRename = () => {
+        if (sessionRenamePending)
+            return;
+        setSessionRenameTarget(undefined);
+        setSessionRenameError(undefined);
+    };
+    const confirmSessionRename = async () => {
+        const target = sessionRenameTarget;
+        const title = sessionRenameDraft.trim();
+        if (target === undefined || title.length === 0 || sessionRenamePending)
+            return;
+        if (renameSession === undefined) {
+            setSessionRenameError('Session rename is unavailable; retry after reconnecting.');
+            return;
+        }
+        setSessionRenamePending(true);
+        setSessionRenameError(undefined);
+        try {
+            await renameSession(target.sessionId, title);
+            setSessionRenameTarget(undefined);
+        }
+        catch (error) {
+            setSessionRenameError(error instanceof Error ? error.message : String(error));
+        }
+        finally {
+            setSessionRenamePending(false);
+        }
+    };
+    const archiveWorktreeSession = async (sessionId) => {
+        if (archiveSession === undefined)
+            return;
+        await runMutation(() => archiveSession(sessionId));
+    };
+    const toggleWorkspace = (workspaceId) => {
+        setExpandedWorkspaces((current) => ({
+            ...current,
+            [workspaceId]: current[workspaceId] === false,
+        }));
+    };
+    const toggleMain = (workspaceId) => {
+        setExpandedMains((current) => ({
+            ...current,
+            [workspaceId]: current[workspaceId] === false,
+        }));
+    };
+    const toggleWorktree = (worktreeId) => {
+        setExpandedWorktrees((current) => ({
+            ...current,
+            [worktreeId]: current[worktreeId] === false,
+        }));
+    };
+    const openWorktreeCreator = (workspace) => {
+        const view = viewByWorkspace.get(workspace.workspaceId);
+        const baseBranch = selectDefaultBaseBranch(view?.branches ?? []);
+        const existingNames = [
+            ...(view?.branches ?? []).map((branch) => branch.name),
+            ...(view?.worktrees ?? []).map((worktree) => worktree.branch),
+        ];
+        setWorktreeModalWorkspaceId(workspace.workspaceId);
+        setSelectedBranch(baseBranch);
+        setNewBranch(createDefaultWorktreeName(existingNames));
+        setActionError(undefined);
+    };
+    const submitWorktree = async () => {
+        const worktreeName = newBranch.trim();
+        if (manager === undefined ||
+            modalWorkspace === undefined ||
+            selectedBranch.length === 0 ||
+            worktreeName.length === 0) {
+            return;
+        }
+        const input = {
+            workspaceId: modalWorkspace.workspaceId,
+            branch: selectedBranch,
+            newBranch: worktreeName,
+        };
+        setActionPending(true);
+        setActionError(undefined);
+        setPendingSessionBinding(undefined);
+        try {
+            const createdWorktree = await executeWorktreeAction(manager, {
+                type: 'createWorktree',
+                input,
+            });
+            if (createdWorktree === undefined) {
+                throw new Error('Worktree creation returned no Worktree record; retry the request.');
+            }
+            setWorktreeModalWorkspaceId(undefined);
+            if (createSessionCallback === undefined) {
+                await refresh();
+                setActionError({
+                    code: 'SESSION_CREATE_UNAVAILABLE',
+                    message: 'Worktree created, but Session creation is unavailable; retry after reconnecting.',
+                    retryable: true,
+                });
+                return;
+            }
+            const sessionInput = {
+                workspaceId: createdWorktree.workspaceId,
+                worktreeId: createdWorktree.worktreeId,
+                cwd: createdWorktree.absolutePath,
+            };
+            try {
+                await createSessionCallback(sessionInput);
+            }
+            catch (error) {
+                if (error instanceof WorktreeSessionBindingError) {
+                    setPendingSessionBinding({ ...sessionInput, sessionId: error.sessionId });
+                }
+                throw error;
+            }
+            await refresh();
+        }
+        catch (error) {
+            setActionError(toWorktreeViewError(error));
+        }
+        finally {
+            setActionPending(false);
+        }
+    };
+    const createSession = async (input) => {
+        if (createSessionCallback === undefined) {
+            setActionError({
+                code: 'SESSION_CREATE_UNAVAILABLE',
+                message: 'Session creation is unavailable; retry after reconnecting.',
+                retryable: true,
+            });
+            return;
+        }
+        setActionPending(true);
+        setActionError(undefined);
+        setPendingSessionBinding(undefined);
+        try {
+            await createSessionCallback(input);
+            await refresh();
+        }
+        catch (error) {
+            if (error instanceof WorktreeSessionBindingError) {
+                setPendingSessionBinding({ ...input, sessionId: error.sessionId });
+            }
+            setActionError(toWorktreeViewError(error));
+        }
+        finally {
+            setActionPending(false);
+        }
+    };
+    const retrySessionBinding = async () => {
+        if (manager === undefined || pendingSessionBinding === undefined)
+            return;
+        setActionPending(true);
+        setActionError(undefined);
+        try {
+            await manager.bindSession({
+                workspaceId: pendingSessionBinding.workspaceId,
+                worktreeId: pendingSessionBinding.worktreeId,
+                sessionId: pendingSessionBinding.sessionId,
+            });
+            const sessionId = pendingSessionBinding.sessionId;
+            setPendingSessionBinding(undefined);
+            ensureSessionWorkspace?.(pendingSessionBinding.workspaceId, sessionId);
+            await refresh();
+            openSession(sessionId);
+        }
+        catch (error) {
+            setActionError(toWorktreeViewError(error));
+        }
+        finally {
+            setActionPending(false);
+        }
+    };
+    const openWorkspaceSession = (workspaceId, sessionId) => {
+        ensureSessionWorkspace?.(workspaceId, sessionId);
+        openWorktreeSession({ open: openSession }, sessionId);
+    };
+    if (mode !== 'worktree')
+        return null;
+    const visibleWorkspaces = workspaces.items.filter((workspace) => workspaceMatches(workspace, viewByWorkspace.get(workspace.workspaceId), sessions, query));
+    return (_jsxs("aside", { ref: ref, className: styles.surface, "data-worktree-surface": true, "data-collapsed": collapsed || undefined, "aria-label": "Worktree navigation", style: {
+            width: `${width}px`,
+            ...(bounds.ready
+                ? { top: `${bounds.top}px`, height: `${bounds.height}px` }
+                : { height: '0px', visibility: 'hidden' }),
+        }, children: [_jsxs("div", { className: styles.wideContent, children: [_jsxs("header", { className: styles.header, children: [_jsx("span", { className: styles.title, children: "Worktrees" }), _jsx("button", { type: "button", className: styles.closeButton, "aria-label": "Exit Worktree mode", onClick: () => {
+                                    actions.setViewMode('workspace-session');
+                                }, children: _jsx(IconCloseOutline16, {}) })] }), _jsxs("div", { className: styles.searchRow, children: [_jsx("span", { className: styles.searchIcon, "aria-hidden": "true", children: _jsx(IconSearchOutline16, {}) }), _jsx("input", { className: styles.searchInput, "aria-label": "Search Workspaces and Sessions", placeholder: "Search Workspaces and Sessions", value: searchQuery, onChange: (event) => {
+                                    setSearchQuery(event.currentTarget.value);
+                                } }), _jsx("button", { type: "button", className: styles.iconButton, "aria-label": "Add Workspace", onClick: () => {
+                                    if (createWorkspace !== undefined)
+                                        void runMutation(createWorkspace);
+                                }, children: _jsx(IconPlusOutline16, {}) })] }), _jsxs("div", { className: styles.content, tabIndex: 0, children: [actionError !== undefined && (_jsxs("div", { className: styles.error, role: "alert", "data-worktree-error": true, children: [_jsx("p", { className: styles.message, "data-error": "true", children: actionError.message }), pendingSessionBinding !== undefined && (_jsxs("div", { className: styles.recoveryActions, children: [_jsx("button", { type: "button", className: styles.actionButton, disabled: actionPending, onClick: () => {
+                                                    void retrySessionBinding();
+                                                }, children: "Retry Binding" }), _jsx("button", { type: "button", className: styles.actionButton, disabled: actionPending, onClick: () => {
+                                                    const sessionId = pendingSessionBinding.sessionId;
+                                                    setPendingSessionBinding(undefined);
+                                                    setActionError(undefined);
+                                                    openSession(sessionId);
+                                                }, children: "Open Created Session" })] })), actionError.retryable && (_jsx("button", { type: "button", className: styles.retryButton, onClick: () => {
+                                            setActionError(undefined);
+                                            void refresh();
+                                        }, children: "Retry" }))] })), readState.status === 'loading' && _jsx("p", { className: styles.message, children: "Loading Workspaces\u2026" }), readState.status === 'error' && readState.error !== undefined ? (_jsxs("div", { className: styles.error, role: "alert", "data-worktree-error": true, children: [_jsx("p", { className: styles.message, "data-error": "true", children: readState.error.message }), _jsx("button", { type: "button", className: styles.retryButton, onClick: () => {
+                                            void refresh();
+                                        }, children: "Retry" })] })) : readState.status === 'ready' ? (_jsx("div", { className: styles.workspaceList, children: visibleWorkspaces.length === 0 ? (_jsx("p", { className: styles.empty, children: "No matching Workspaces" })) : (visibleWorkspaces.map((workspace) => {
+                                    const view = viewByWorkspace.get(workspace.workspaceId);
+                                    const expanded = expandedWorkspaces[workspace.workspaceId] !== false;
+                                    const workspaceMatchesQuery = includesText(workspace.title, query);
+                                    const allWorkspaceSessionIds = filterArchivedSessionIds(workspaceSessionIds(workspaces, workspace.workspaceId, sessions.ids), archivedSessionIds);
+                                    const bindings = view?.bindings ?? [];
+                                    const boundSessionIds = new Set(bindings.map((binding) => binding.sessionId));
+                                    const mainSessionIds = unboundSessionIds(allWorkspaceSessionIds, [
+                                        ...boundSessionIds,
+                                    ]);
+                                    const visibleMainSessionIds = mainSessionIds.filter((sessionId) => workspaceMatchesQuery ||
+                                        includesText(sessionLabel(sessionId, sessions), query));
+                                    const mainExpanded = expandedMains[workspace.workspaceId] !== false;
+                                    const mainGroupKey = `main:${workspace.workspaceId}`;
+                                    const worktrees = view?.worktrees ?? [];
+                                    return (_jsxs("section", { className: styles.workspaceGroup, "data-workspace-id": workspace.workspaceId, children: [_jsx(WorktreeWorkspaceRow, { workspace: workspace, expanded: expanded, actionPending: actionPending, menuOpen: openWorkspaceMenuId === workspace.workspaceId, drag: {
+                                                    active: workspaceDrag !== undefined,
+                                                    marker: workspaceDrag?.over?.workspaceId === workspace.workspaceId
+                                                        ? workspaceDrag.over.half
+                                                        : null,
+                                                    start: () => {
+                                                        workspaceDropCommitted.current = false;
+                                                        setWorkspaceDrag({ workspaceId: workspace.workspaceId, over: null });
+                                                    },
+                                                    hover: (half) => {
+                                                        setWorkspaceDrag((current) => current === undefined
+                                                            ? current
+                                                            : {
+                                                                ...current,
+                                                                over: { workspaceId: workspace.workspaceId, half },
+                                                            });
+                                                    },
+                                                    drop: (half) => {
+                                                        if (workspaceDrag === undefined)
+                                                            return;
+                                                        commitWorkspaceDrag(workspaceDrag, {
+                                                            workspaceId: workspace.workspaceId,
+                                                            half,
+                                                        });
+                                                    },
+                                                    end: () => {
+                                                        if (workspaceDrag?.over !== null && workspaceDrag?.over !== undefined) {
+                                                            commitWorkspaceDrag(workspaceDrag, workspaceDrag.over);
+                                                        }
+                                                        else {
+                                                            setWorkspaceDrag(undefined);
+                                                        }
+                                                        workspaceDropCommitted.current = false;
+                                                    },
+                                                }, onToggle: () => {
+                                                    toggleWorkspace(workspace.workspaceId);
+                                                }, onCreateWorktree: () => {
+                                                    openWorktreeCreator(workspace);
+                                                }, onRename: () => {
+                                                    openWorkspaceRename(workspace);
+                                                }, onDelete: () => {
+                                                    openWorkspaceDelete(workspace);
+                                                }, onMenuOpenChange: (open) => {
+                                                    setOpenWorkspaceMenuId(open ? workspace.workspaceId : undefined);
+                                                } }), expanded && (_jsxs("div", { className: styles.treeChildren, children: [_jsx(WorktreeGroupRow, { kind: "main", label: "Main", expanded: mainExpanded, icon: _jsx(IconBranchOutline16, {}), workspaceTitle: workspace.title, onToggle: () => {
+                                                            toggleMain(workspace.workspaceId);
+                                                        }, onCreateSession: createMainSession === undefined
+                                                            ? undefined
+                                                            : () => {
+                                                                createMainSession(workspace.workspaceId);
+                                                            } }), mainExpanded && (_jsx(WorktreeSessionGroup, { groupKey: mainGroupKey, sessionIds: visibleMainSessionIds, workspaceId: workspace.workspaceId, expanded: expandedSessionGroups[mainGroupKey] === true, actionPending: actionPending, sessions: sessions, dragState: sessionDrag, onToggleExpanded: () => {
+                                                            setExpandedSessionGroups((current) => ({
+                                                                ...current,
+                                                                [mainGroupKey]: current[mainGroupKey] !== true,
+                                                            }));
+                                                        }, onStartDrag: (groupKey, sessionId) => {
+                                                            sessionDropCommitted.current = false;
+                                                            setSessionDrag({ groupKey, sessionId, over: null });
+                                                        }, onHoverDrag: (sessionId, half) => {
+                                                            setSessionDrag((current) => current === undefined
+                                                                ? current
+                                                                : { ...current, over: { sessionId, half } });
+                                                        }, onClearDrag: () => {
+                                                            setSessionDrag(undefined);
+                                                        }, onFinishDrag: () => {
+                                                            sessionDropCommitted.current = false;
+                                                        }, onCommitDrag: commitSessionDrag, onOpen: (sessionId) => {
+                                                            openWorktreeSession({ open: openSession }, sessionId);
+                                                        }, onRename: renameSession === undefined ? undefined : openSessionRename, onFork: forkSession, onArchive: archiveSession === undefined ? undefined : archiveWorktreeSession })), worktrees.length === 0 && (_jsx("p", { className: styles.emptyNested, children: "No Worktrees" })), worktrees.map((record) => {
+                                                        const worktreeSessionIds = filterArchivedSessionIds(bindingIdsFor(bindings, record.worktreeId).filter((sessionId) => sessions.ids.includes(sessionId)), archivedSessionIds);
+                                                        const worktreeMatchesQuery = workspaceMatchesQuery ||
+                                                            includesText(record.branch, query) ||
+                                                            includesText(record.absolutePath, query);
+                                                        if (query.length > 0 &&
+                                                            !worktreeMatchesQuery &&
+                                                            !worktreeSessionIds.some((sessionId) => includesText(sessionLabel(sessionId, sessions), query))) {
+                                                            return null;
+                                                        }
+                                                        const visibleWorktreeSessionIds = worktreeSessionIds.filter((sessionId) => worktreeMatchesQuery ||
+                                                            includesText(sessionLabel(sessionId, sessions), query));
+                                                        const worktreeGroupKey = `worktree:${record.worktreeId}`;
+                                                        const state = record.status === 'removed'
+                                                            ? 'warning'
+                                                            : record.health === 'repair'
+                                                                ? 'error'
+                                                                : 'done';
+                                                        const stateLabel = record.status === 'removed'
+                                                            ? 'Detached Worktree'
+                                                            : record.health === 'repair'
+                                                                ? 'Worktree needs repair'
+                                                                : 'Active Worktree ready';
+                                                        const worktreeExpanded = expandedWorktrees[record.worktreeId] !== false;
+                                                        return (_jsxs("div", { className: styles.worktreeGroup, "data-worktree-id": record.worktreeId, children: [_jsx(WorktreeGroupRow, { kind: "worktree", label: record.branch, expanded: worktreeExpanded, icon: _jsx(IconBranchOutline16, {}), workspaceTitle: workspace.title, state: state, stateLabel: stateLabel, onToggle: () => {
+                                                                        toggleWorktree(record.worktreeId);
+                                                                    }, onCreateSession: record.status === 'active'
+                                                                        ? () => {
+                                                                            void createSession({
+                                                                                workspaceId: record.workspaceId,
+                                                                                worktreeId: record.worktreeId,
+                                                                                cwd: record.absolutePath,
+                                                                            });
+                                                                        }
+                                                                        : undefined }), worktreeExpanded && (_jsx(WorktreeSessionGroup, { groupKey: worktreeGroupKey, sessionIds: visibleWorktreeSessionIds, workspaceId: workspace.workspaceId, expanded: expandedSessionGroups[worktreeGroupKey] === true, actionPending: actionPending, sessions: sessions, dragState: sessionDrag, onToggleExpanded: () => {
+                                                                        setExpandedSessionGroups((current) => ({
+                                                                            ...current,
+                                                                            [worktreeGroupKey]: current[worktreeGroupKey] !== true,
+                                                                        }));
+                                                                    }, onStartDrag: (groupKey, sessionId) => {
+                                                                        sessionDropCommitted.current = false;
+                                                                        setSessionDrag({ groupKey, sessionId, over: null });
+                                                                    }, onHoverDrag: (sessionId, half) => {
+                                                                        setSessionDrag((current) => current === undefined
+                                                                            ? current
+                                                                            : { ...current, over: { sessionId, half } });
+                                                                    }, onClearDrag: () => {
+                                                                        setSessionDrag(undefined);
+                                                                    }, onFinishDrag: () => {
+                                                                        sessionDropCommitted.current = false;
+                                                                    }, onCommitDrag: commitSessionDrag, onOpen: (sessionId) => {
+                                                                        openWorkspaceSession(workspace.workspaceId, sessionId);
+                                                                    }, onRename: renameSession === undefined ? undefined : openSessionRename, onFork: forkSession, onArchive: archiveSession === undefined
+                                                                        ? undefined
+                                                                        : archiveWorktreeSession }))] }, record.worktreeId));
+                                                    })] }))] }, workspace.workspaceId));
+                                })) })) : null] })] }), _jsx("div", { className: styles.railContent, children: _jsx("button", { type: "button", className: styles.railButton, "aria-label": "Exit Worktree mode", onClick: () => {
+                        actions.setViewMode('workspace-session');
+                    }, children: "WT" }) }), _jsxs(Modal, { open: sessionRenameTarget !== undefined, onClose: closeSessionRename, closeLabel: "Close", title: "Rename session", footer: (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: sessionRenamePending, onClick: closeSessionRename, children: "Cancel" }), _jsx(Button, { variant: "primary", disabled: sessionRenamePending || sessionRenameDraft.trim().length === 0, onClick: () => {
+                                void confirmSessionRename();
+                            }, children: "Rename" })] })), children: [_jsx(Input, { className: styles.renameInput, value: sessionRenameDraft, "aria-label": "Session name", autoFocus: true, disabled: sessionRenamePending, onFocus: (event) => {
+                            event.currentTarget.select();
+                        }, onChange: (event) => {
+                            setSessionRenameDraft(event.currentTarget.value);
+                            setSessionRenameError(undefined);
+                        }, onKeyDown: (event) => {
+                            if (event.key === 'Enter' && !event.nativeEvent.isComposing) {
+                                event.preventDefault();
+                                void confirmSessionRename();
+                            }
+                        } }), sessionRenameError !== undefined && (_jsx("p", { className: styles.renameError, role: "alert", children: sessionRenameError }))] }), workspaceRenameTarget !== undefined && (_jsxs(Modal, { open: workspaceRenameTarget !== undefined, onClose: closeWorkspaceRename, closeLabel: "Close Rename Workspace dialog", title: "Rename Workspace", footer: (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: workspaceRenamePending, onClick: closeWorkspaceRename, children: "Cancel" }), _jsx(Button, { variant: "primary", disabled: workspaceRenameBlocked, onClick: () => {
+                                void confirmWorkspaceRename();
+                            }, children: "Rename" })] })), children: [_jsx(Input, { className: styles.renameInput, value: workspaceRenameDraft, "aria-label": "Workspace name", autoFocus: true, disabled: workspaceRenamePending, onFocus: (event) => {
+                            event.currentTarget.select();
+                        }, onChange: (event) => {
+                            setWorkspaceRenameDraft(event.currentTarget.value);
+                            setWorkspaceRenameError(undefined);
+                        }, onKeyDown: (event) => {
+                            if (event.key === 'Enter' && !event.nativeEvent.isComposing) {
+                                event.preventDefault();
+                                void confirmWorkspaceRename();
+                            }
+                        } }), workspaceRenameDuplicate && (_jsx("p", { className: styles.renameError, role: "alert", children: "A Workspace with this name already exists." })), workspaceRenameError !== undefined && (_jsx("p", { className: styles.renameError, role: "alert", children: workspaceRenameError }))] })), workspaceDeleteTarget !== undefined && (_jsx(Modal, { open: workspaceDeleteTarget !== undefined, onClose: closeWorkspaceDelete, closeLabel: "Close Delete Workspace dialog", title: "Delete Workspace", description: `Delete ${workspaceDeleteTarget.title}? This removes only the DSH Workspace registration. The directory, Sessions, and Git Worktrees will be retained.`, footer: (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: workspaceDeletePending, onClick: closeWorkspaceDelete, children: "Cancel" }), _jsx(Button, { variant: "outline", disabled: workspaceDeletePending, onClick: () => {
+                                void confirmWorkspaceDelete();
+                            }, children: "Delete" })] })), children: workspaceDeleteError !== undefined && (_jsx("p", { className: styles.renameError, role: "alert", children: workspaceDeleteError })) })), worktreeModalWorkspaceId !== undefined && modalWorkspace !== undefined && (_jsxs(Modal, { open: worktreeModalWorkspaceId !== undefined, onClose: () => {
+                    if (actionPending)
+                        return;
+                    setWorktreeModalWorkspaceId(undefined);
+                }, closeLabel: "Close Create Worktree dialog", title: "New Worktree", description: `${modalWorkspace.title} · the Worktree path is managed by DSH.`, footer: (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", disabled: actionPending, onClick: () => {
+                                setWorktreeModalWorkspaceId(undefined);
+                            }, children: "Cancel" }), _jsx(Button, { variant: "primary", disabled: actionPending ||
+                                selectedBranch.length === 0 ||
+                                newBranch.trim().length === 0, onClick: () => {
+                                void submitWorktree();
+                            }, children: "Create Worktree" })] })), children: [_jsxs("label", { className: styles.modalField, children: ["Base branch", _jsxs("select", { className: styles.actionSelect, "aria-label": "Worktree base branch", value: selectedBranch, disabled: actionPending, onChange: (event) => {
+                                    setSelectedBranch(event.currentTarget.value);
+                                }, children: [_jsx("option", { value: "", children: "No local branch" }), (modalView?.branches ?? []).map((branch) => (_jsxs("option", { value: branch.name, children: [branch.name, branch.isCurrent ? ' (current)' : '', branch.checkedOut ? ' (checked out)' : ''] }, branch.name)))] })] }), _jsxs("label", { className: styles.modalField, children: ["Worktree name", _jsx(Input, { className: styles.renameInput, "aria-label": "Worktree name", value: newBranch, placeholder: "dsh/12345678", disabled: actionPending, onChange: (event) => {
+                                    setNewBranch(event.currentTarget.value);
+                                } })] }), modalView?.branches.length === 0 && (_jsx("p", { className: styles.empty, children: "No local branches found in this Workspace." }))] }))] }));
+}
+//# sourceMappingURL=WorktreeSurface.js.map