@parhelia/core 0.1.11873 → 0.1.11955

package/dist/task-board/TaskBoardWorkspace.js

@@ -0,0 +1,1094 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { toast } from "sonner";
+import { Splitter } from "../editor/ui/Splitter";
+import { deleteProject, getProjects, getTasks, getDependencies, runOrchestrator, triggerPlanning, updateProject } from "./services/taskService";
+import { getActiveAgents, getAgent, } from "../editor/services/agentService";
+import { loadAiProfiles } from "../editor/services/aiService";
+import { useEditContext } from "../editor/client/editContext";
+import { KanbanView } from "./views/KanbanView";
+import { ListView } from "./views/ListView";
+import { TaskDetailPanel } from "./components/TaskDetailPanel";
+import { TaskAgentPanel } from "./components/TaskAgentPanel";
+import { ProjectDashboard } from "./components/ProjectDashboard";
+import { CreateTaskDialog } from "./components/CreateTaskDialog";
+import { AssignAgentDialog } from "./components/AssignAgentDialog";
+import { CreateProjectDialog } from "./components/CreateProjectDialog";
+import { ProjectSettingsDialog } from "./components/ProjectSettingsDialog";
+import { EditorSlotContextProvider } from "../editor/views/editorSlotContext";
+import { SingleEditView } from "../editor/views/SingleEditView";
+import { Select } from "../components/ui/select";
+import { getLinkedAgentId } from "./taskAgentLink";
+import { setTaskBoardNavState, resetTaskBoardNavState, } from "./taskBoardNavStore";
+import { flattenProjectsHierarchy } from "./utils/projectHierarchy";
+import { normalizeTaskStatus } from "./taskStatus";
+function normalizeAgentStatus(status) {
+    if (status === undefined || status === null)
+        return undefined;
+    if (typeof status === "number") {
+        return status;
+    }
+    switch (status) {
+        case "Running":
+            return "running";
+        case "WaitingForApproval":
+            return "waitingForApproval";
+        case "WaitingForInput":
+            return "waitingForInput";
+        case "CostLimitReached":
+            return "costLimitReached";
+        case "Error":
+            return "error";
+        case "Idle":
+            return "idle";
+        case "Completed":
+            return "completed";
+        case "Closed":
+            return "closed";
+        case "Cancelled":
+            return "cancelled";
+        case "New":
+            return "new";
+        default:
+            return status;
+    }
+}
+// ── component ────────────────────────────────────────────────────────
+export function TaskBoardWorkspace() {
+    const editContext = useEditContext();
+    const showEditorPanel = editContext?.showAgentsWorkspaceEditor ?? true;
+    const currentItemDescriptor = editContext?.currentItemDescriptor;
+    const [projects, setProjects] = useState([]);
+    const [selectedProjectId, setSelectedProjectId] = useState(null);
+    const [tasks, setTasks] = useState([]);
+    const [dependencies, setDependencies] = useState([]);
+    const [selectedTaskId, setSelectedTaskId] = useState(null);
+    const [activeTab, setActiveTab] = useState(0);
+    const [createDialogOpen, setCreateDialogOpen] = useState(false);
+    const [createProjectOpen, setCreateProjectOpen] = useState(false);
+    const [settingsProjectId, setSettingsProjectId] = useState(null);
+    const [savingProjectStatus, setSavingProjectStatus] = useState(false);
+    const [assignAgentDialogOpen, setAssignAgentDialogOpen] = useState(false);
+    const [runningOrchestrator, setRunningOrchestrator] = useState(false);
+    const [agentStatusesById, setAgentStatusesById] = useState({});
+    const [agentProfileTitlesById, setAgentProfileTitlesById] = useState({});
+    const [subprojectTaskCounts, setSubprojectTaskCounts] = useState({});
+    const [subprojectCountsLoading, setSubprojectCountsLoading] = useState(false);
+    const [previewItemName, setPreviewItemName] = useState("");
+    const [previewItemPath, setPreviewItemPath] = useState("");
+    const [agentContextItems, setAgentContextItems] = useState([]);
+    const [contextItemNamesByKey, setContextItemNamesByKey] = useState({});
+    const [contextItemPathsByKey, setContextItemPathsByKey] = useState({});
+    const wsRefreshTimeoutRef = useRef(null);
+    const wsSubprojectRefreshTimeoutRef = useRef(null);
+    const wsProjectRefreshTimeoutRef = useRef(null);
+    const refreshProjectsRef = useRef(null);
+    const refreshTasksRef = useRef(null);
+    const refreshDependenciesRef = useRef(null);
+    const refreshSubprojectTaskCountsRef = useRef(null);
+    const selectedProjectIdRef = useRef(null);
+    const directSubprojectIdsRef = useRef(new Set());
+    const tasksRef = useRef([]);
+    const autoSelectedProjectIdsRef = useRef(new Set());
+    useEffect(() => {
+        let cancelled = false;
+        loadAiProfiles()
+            .then((profiles) => {
+            if (cancelled)
+                return;
+            const byId = {};
+            for (const profile of profiles || []) {
+                if (!profile?.id)
+                    continue;
+                byId[profile.id.toLowerCase()] = profile.displayTitle || profile.name || profile.id;
+            }
+            setAgentProfileTitlesById(byId);
+        })
+            .catch(() => {
+            // best-effort only
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, []);
+    const tasksWithDisplayAssignees = useMemo(() => {
+        return tasks.map((task) => {
+            if (task.assigneeType !== "Agent" ||
+                !task.assigneeId ||
+                task.assigneeDisplayName) {
+                return task;
+            }
+            const profileTitle = agentProfileTitlesById[task.assigneeId.toLowerCase()];
+            if (!profileTitle)
+                return task;
+            return {
+                ...task,
+                assigneeDisplayName: profileTitle,
+            };
+        });
+    }, [tasks, agentProfileTitlesById]);
+    const selectedProject = useMemo(() => projects.find((p) => p.project.projectId === selectedProjectId) ?? null, [projects, selectedProjectId]);
+    const settingsProject = useMemo(() => projects.find((p) => p.project.projectId === settingsProjectId) ?? null, [projects, settingsProjectId]);
+    const selectedProjectTaskCounts = useMemo(() => {
+        const counts = {
+            total: tasks.length,
+            todo: 0,
+            inProgress: 0,
+            review: 0,
+            done: 0,
+        };
+        for (const task of tasks) {
+            const normalizedStatus = normalizeTaskStatus(task.status, task.executionStatus);
+            if (normalizedStatus === "Todo")
+                counts.todo += 1;
+            else if (normalizedStatus === "InProgress")
+                counts.inProgress += 1;
+            else if (normalizedStatus === "Review")
+                counts.review += 1;
+            else if (normalizedStatus === "Done")
+                counts.done += 1;
+        }
+        return counts;
+    }, [tasks]);
+    const directSubprojects = useMemo(() => selectedProjectId
+        ? projects
+            .filter((project) => project.project.parentProjectId === selectedProjectId)
+            .sort((a, b) => a.project.title.localeCompare(b.project.title))
+        : [], [projects, selectedProjectId]);
+    const selectedProjectCumulativeCostUsed = useMemo(() => {
+        if (!selectedProjectId)
+            return 0;
+        const childrenByParent = new Map();
+        for (const project of projects) {
+            const parentId = project.project.parentProjectId;
+            if (!parentId)
+                continue;
+            const children = childrenByParent.get(parentId) || [];
+            children.push(project.project.projectId);
+            childrenByParent.set(parentId, children);
+        }
+        const stack = [selectedProjectId];
+        const visited = new Set();
+        let total = 0;
+        while (stack.length > 0) {
+            const currentId = stack.pop();
+            if (!currentId || visited.has(currentId))
+                continue;
+            visited.add(currentId);
+            const currentProject = projects.find((project) => project.project.projectId === currentId);
+            const cost = currentProject?.project.costUsed;
+            if (typeof cost === "number" && Number.isFinite(cost)) {
+                total += cost;
+            }
+            const children = childrenByParent.get(currentId) || [];
+            for (const childId of children) {
+                if (!visited.has(childId))
+                    stack.push(childId);
+            }
+        }
+        return total;
+    }, [projects, selectedProjectId]);
+    const parentProject = useMemo(() => {
+        const parentId = selectedProject?.project.parentProjectId;
+        if (!parentId)
+            return null;
+        return projects.find((project) => project.project.projectId === parentId) ?? null;
+    }, [projects, selectedProject]);
+    useEffect(() => {
+        const childrenByParent = new Map();
+        for (const project of projects) {
+            const parentId = project.project.parentProjectId;
+            if (!parentId)
+                continue;
+            const children = childrenByParent.get(parentId) || [];
+            children.push(project.project.projectId);
+            childrenByParent.set(parentId, children);
+        }
+        const includedProjects = [];
+        if (selectedProjectId) {
+            const stack = [selectedProjectId];
+            const visited = new Set();
+            while (stack.length > 0) {
+                const currentId = stack.pop();
+                if (!currentId || visited.has(currentId))
+                    continue;
+                visited.add(currentId);
+                const currentProject = projects.find((project) => project.project.projectId === currentId);
+                includedProjects.push({
+                    projectId: currentId,
+                    costUsed: typeof currentProject?.project.costUsed === "number"
+                        ? currentProject.project.costUsed
+                        : null,
+                });
+                const children = childrenByParent.get(currentId) || [];
+                for (const childId of children) {
+                    if (!visited.has(childId))
+                        stack.push(childId);
+                }
+            }
+        }
+    }, [selectedProjectCumulativeCostUsed, selectedProjectId, selectedProject?.project.costUsed, projects]);
+    const canCreate = selectedProject?.permission === "Owner" || selectedProject?.permission === "Editor";
+    const canEditTasks = canCreate;
+    const viewTabIds = useMemo(() => [
+        "kanban",
+        "list",
+    ], []);
+    const isListView = viewTabIds[activeTab] === "list";
+    const isPlanning = selectedProject?.project.status === "Planning" ||
+        selectedProject?.project.status === "PlanPending";
+    const selectedTask = useMemo(() => tasksWithDisplayAssignees.find((t) => t.taskId === selectedTaskId) ?? null, [tasksWithDisplayAssignees, selectedTaskId]);
+    const planningTask = useMemo(() => tasksWithDisplayAssignees.find((t) => String(t.taskType ?? "").toLowerCase() === "plan") ??
+        tasksWithDisplayAssignees.find((t) => t.title === "Project Plan") ??
+        null, [tasksWithDisplayAssignees]);
+    const selectedTaskIsPlan = useMemo(() => {
+        const taskType = String(selectedTask?.taskType ?? "").toLowerCase();
+        return taskType === "plan" || selectedTask?.title === "Project Plan";
+    }, [selectedTask]);
+    const selectedTaskIsBlocked = useMemo(() => {
+        if (!selectedTask)
+            return false;
+        const blockerIds = dependencies
+            .filter((dependency) => dependency.taskId === selectedTask.taskId &&
+            dependency.dependencyType === "BlockedBy")
+            .map((dependency) => dependency.dependsOnTaskId);
+        if (blockerIds.length === 0)
+            return false;
+        const taskById = new Map(tasksWithDisplayAssignees.map((task) => [task.taskId, task]));
+        return blockerIds.some((blockerId) => {
+            const blockerTask = taskById.get(blockerId);
+            return !blockerTask || blockerTask.status !== "Done";
+        });
+    }, [selectedTask, dependencies, tasksWithDisplayAssignees]);
+    // ── current agent ID and panel mode for the right panel ──
+    const currentAgentId = useMemo(() => {
+        return getLinkedAgentId(selectedTask);
+    }, [selectedTask]);
+    const currentItemKey = useMemo(() => {
+        if (!currentItemDescriptor)
+            return "";
+        return `${currentItemDescriptor.id}|${currentItemDescriptor.language}|${currentItemDescriptor.version}`;
+    }, [currentItemDescriptor]);
+    const agentPanelMode = useMemo(() => {
+        if (!selectedTask)
+            return "no-task-selected";
+        if (currentAgentId)
+            return "agent";
+        return "no-agent";
+    }, [selectedTask, currentAgentId]);
+    // ── data fetching ──
+    const refreshProjects = useCallback(async () => {
+        const result = await getProjects();
+        if (result.type !== "success") {
+            toast.error(result.summary || "Failed to load projects");
+            return;
+        }
+        const data = result.data || [];
+        const selectedProject = selectedProjectIdRef.current
+            ? data.find((p) => p.project.projectId === selectedProjectIdRef.current)
+            : null;
+        setProjects(data);
+        setSelectedProjectId((prev) => {
+            if (!prev)
+                return data[0]?.project.projectId ?? null;
+            const stillExists = data.some((p) => p.project.projectId === prev);
+            return stillExists ? prev : data[0]?.project.projectId ?? null;
+        });
+    }, []);
+    const refreshTasks = useCallback(async (projectId) => {
+        const result = await getTasks(projectId);
+        if (result.type !== "success") {
+            toast.error(result.summary || "Failed to load tasks");
+            return;
+        }
+        setTasks(result.data || []);
+    }, []);
+    const refreshSubprojectTaskCounts = useCallback(async () => {
+        if (directSubprojects.length === 0) {
+            setSubprojectTaskCounts({});
+            return;
+        }
+        setSubprojectCountsLoading(true);
+        try {
+            const results = await Promise.all(directSubprojects.map(async (subproject) => {
+                const projectId = subproject.project.projectId;
+                const response = await getTasks(projectId);
+                if (response.type !== "success") {
+                    return [projectId, null];
+                }
+                const tasksForProject = response.data || [];
+                const counts = {
+                    total: tasksForProject.length,
+                    todo: 0,
+                    inProgress: 0,
+                    review: 0,
+                    done: 0,
+                };
+                for (const task of tasksForProject) {
+                    const normalizedStatus = normalizeTaskStatus(task.status, task.executionStatus);
+                    if (normalizedStatus === "Todo")
+                        counts.todo += 1;
+                    else if (normalizedStatus === "InProgress")
+                        counts.inProgress += 1;
+                    else if (normalizedStatus === "Review")
+                        counts.review += 1;
+                    else if (normalizedStatus === "Done")
+                        counts.done += 1;
+                }
+                return [projectId, counts];
+            }));
+            const nextCounts = {};
+            for (const [projectId, counts] of results) {
+                if (counts)
+                    nextCounts[projectId] = counts;
+            }
+            setSubprojectTaskCounts(nextCounts);
+        }
+        finally {
+            setSubprojectCountsLoading(false);
+        }
+    }, [directSubprojects]);
+    // If a project only has a single task, auto-select it once when loading.
+    // Do not auto-reselect after the user explicitly closes task details.
+    useEffect(() => {
+        if (!selectedProjectId)
+            return;
+        if (selectedTaskId)
+            return;
+        if (tasks.length !== 1)
+            return;
+        if (autoSelectedProjectIdsRef.current.has(selectedProjectId))
+            return;
+        const firstTask = tasks[0];
+        if (!firstTask)
+            return;
+        autoSelectedProjectIdsRef.current.add(selectedProjectId);
+        setSelectedTaskId(firstTask.taskId);
+    }, [selectedProjectId, selectedTaskId, tasks]);
+    const refreshDependencies = useCallback(async (projectId) => {
+        const result = await getDependencies(projectId);
+        if (result.type !== "success") {
+            toast.error(result.summary || "Failed to load dependencies");
+            return;
+        }
+        setDependencies(result.data || []);
+    }, []);
+    const refreshAgentStatuses = useCallback(async (taskList) => {
+        const agentIds = Array.from(new Set(taskList
+            .map((task) => getLinkedAgentId(task))
+            .filter((id) => typeof id === "string" && id.length > 0)));
+        if (agentIds.length === 0) {
+            setAgentStatusesById({});
+            return;
+        }
+        try {
+            const response = await getActiveAgents({
+                limit: 1000,
+                includeOwned: true,
+                includeShared: true,
+                excludeClosed: false,
+            });
+            const wanted = new Set(agentIds.map((id) => id.toLowerCase()));
+            const statuses = {};
+            for (const agent of response.agents || []) {
+                const normalizedAgentId = agent.id.toLowerCase();
+                if (wanted.has(normalizedAgentId)) {
+                    statuses[normalizedAgentId] = agent.status;
+                }
+            }
+            setAgentStatusesById(statuses);
+        }
+        catch {
+            // best-effort only
+        }
+    }, []);
+    // Sync refs with latest function/state values for use in WebSocket timeout callback
+    useEffect(() => {
+        refreshProjectsRef.current = refreshProjects;
+        refreshTasksRef.current = refreshTasks;
+        refreshDependenciesRef.current = refreshDependencies;
+        refreshSubprojectTaskCountsRef.current = refreshSubprojectTaskCounts;
+        selectedProjectIdRef.current = selectedProjectId;
+        directSubprojectIdsRef.current = new Set(directSubprojects.map((subproject) => subproject.project.projectId));
+        tasksRef.current = tasks;
+    }, [refreshProjects, refreshTasks, refreshDependencies, refreshSubprojectTaskCounts, selectedProjectId, directSubprojects, tasks]);
+    const handleRunOrchestrator = useCallback(async () => {
+        if (!selectedProjectId)
+            return;
+        setRunningOrchestrator(true);
+        try {
+            const result = await runOrchestrator(selectedProjectId);
+            if (result.type !== "success") {
+                toast.error(result.summary || "Failed to run orchestrator");
+                return;
+            }
+            const data = result.data;
+            if (data?.errors?.length) {
+                toast.error(data.errors.join(", "));
+            }
+            else {
+                const dispatched = data?.tasksDispatched?.length || 0;
+                const launched = data?.tasksLaunched?.length || 0;
+                if (launched > 0) {
+                    if (dispatched > 0) {
+                        toast.success(`Launched ${launched} task(s). ${dispatched} task(s) still need planner assignment.`);
+                    }
+                    else {
+                        toast.success(`Launched ${launched} task(s).`);
+                    }
+                }
+                else if (dispatched > 0) {
+                    toast.info(`${dispatched} task(s) are runnable but still need planner assignment.`);
+                }
+                else {
+                    toast.info("No queued tasks ready to launch");
+                }
+            }
+            // Refresh tasks after orchestrator runs
+            await refreshTasks(selectedProjectId);
+            await refreshDependencies(selectedProjectId);
+        }
+        finally {
+            setRunningOrchestrator(false);
+        }
+    }, [selectedProjectId, refreshTasks, refreshDependencies]);
+    const handleProjectStatusChange = useCallback(async (status) => {
+        if (!selectedProject)
+            return;
+        if (selectedProject.permission !== "Owner")
+            return;
+        if (selectedProject.project.status === status)
+            return;
+        setSavingProjectStatus(true);
+        try {
+            const result = await updateProject({
+                projectId: selectedProject.project.projectId,
+                title: selectedProject.project.title,
+                description: selectedProject.project.description ?? "",
+                costLimit: selectedProject.project.costLimit ?? null,
+                status,
+            });
+            if (result.type !== "success") {
+                toast.error(result.summary || "Failed to update project status");
+                return;
+            }
+            await refreshProjects();
+        }
+        finally {
+            setSavingProjectStatus(false);
+        }
+    }, [selectedProject, refreshProjects]);
+    useEffect(() => {
+        setTaskBoardNavState({
+            projectTitle: selectedProject?.project.title ?? "Tasks",
+            projectSubtitle: selectedProject?.project.description?.trim() ||
+                "Select a project to get started",
+            permissionLabel: selectedProject?.permission ?? "No project selected",
+            activeTab,
+            selectedProjectId,
+            projectOptions: flattenProjectsHierarchy(projects.map((project) => ({
+                projectId: project.project.projectId,
+                parentProjectId: project.project.parentProjectId ?? null,
+                title: project.project.title,
+                description: project.project.description,
+                status: project.project.status,
+                permission: project.permission,
+            }))),
+            hasSelectedProject: !!selectedProjectId,
+            canCreateTask: canCreate,
+            canRunOrchestrator: canCreate && !isPlanning,
+            runningOrchestrator,
+            canManageProject: selectedProject?.permission === "Owner",
+            onSelectProject: setSelectedProjectId,
+            onSetActiveTab: setActiveTab,
+            onCreateProject: () => setCreateProjectOpen(true),
+            onOpenProjectSettings: (projectId) => setSettingsProjectId(projectId),
+            onDeleteProject: (projectId, title) => {
+                const runDelete = async () => {
+                    const result = await deleteProject(projectId);
+                    if (result.type !== "success") {
+                        toast.error(result.summary || "Failed to delete project");
+                        return;
+                    }
+                    toast.success("Project deleted");
+                    const fallbackProjectId = projects.find((p) => p.project.projectId !== projectId)?.project.projectId ??
+                        null;
+                    await refreshProjects();
+                    if (selectedProjectId === projectId) {
+                        setSelectedProjectId(fallbackProjectId);
+                    }
+                };
+                if (editContext?.confirm) {
+                    editContext.confirm({
+                        header: "Delete project",
+                        message: `Are you sure you want to delete \"${title}\"?\n\nThis action cannot be undone.`,
+                        acceptLabel: "Delete",
+                        showCancel: true,
+                        accept: () => {
+                            void runDelete();
+                        },
+                    });
+                    return;
+                }
+                void runDelete();
+            },
+            onCreateTask: () => setCreateDialogOpen(true),
+            onRunOrchestrator: handleRunOrchestrator,
+            onRefresh: () => {
+                if (selectedProjectId) {
+                    void refreshTasks(selectedProjectId);
+                    void refreshDependencies(selectedProjectId);
+                }
+            },
+        });
+    }, [
+        selectedProject?.project.title,
+        selectedProject?.project.description,
+        selectedProject?.permission,
+        activeTab,
+        selectedProjectId,
+        projects,
+        canCreate,
+        isPlanning,
+        runningOrchestrator,
+        editContext,
+        refreshProjects,
+        handleRunOrchestrator,
+        refreshTasks,
+        refreshDependencies,
+    ]);
+    useEffect(() => {
+        return () => {
+            resetTaskBoardNavState();
+        };
+    }, []);
+    const handleStartPlanning = useCallback(async () => {
+        if (!selectedProjectId)
+            return;
+        try {
+            const result = await triggerPlanning(selectedProjectId);
+            if (result.type !== "success") {
+                toast.error(result.summary || "Failed to start planning");
+                return;
+            }
+            toast.success("Planning agent started");
+            // Open the planner terminal by selecting the Plan task.
+            // The backend links the Plan task to the planner agent (assigneeId),
+            // so we don't need any special "planner discovery" logic on the frontend.
+            await refreshTasks(selectedProjectId);
+            await refreshDependencies(selectedProjectId);
+            const plan = tasks.find((t) => String(t.taskType ?? "").toLowerCase() === "plan") ??
+                tasks.find((t) => t.title === "Project Plan") ??
+                null;
+            if (plan)
+                setSelectedTaskId(plan.taskId);
+        }
+        catch {
+            toast.error("Failed to start planning");
+        }
+    }, [selectedProjectId, refreshTasks, refreshDependencies, tasks]);
+    useEffect(() => {
+        void refreshProjects();
+    }, [refreshProjects]);
+    useEffect(() => {
+        if (!selectedProjectId)
+            return;
+        void refreshTasks(selectedProjectId);
+        void refreshDependencies(selectedProjectId);
+    }, [refreshTasks, refreshDependencies, selectedProjectId]);
+    useEffect(() => {
+        void refreshSubprojectTaskCounts();
+    }, [refreshSubprojectTaskCounts]);
+    useEffect(() => {
+        if (!selectedProjectId) {
+            setAgentStatusesById({});
+            return;
+        }
+        void refreshAgentStatuses(tasks);
+    }, [selectedProjectId, tasks, refreshAgentStatuses]);
+    // Keep task board in sync with backend task updates pushed over WebSocket.
+    // Uses refs for callbacks and selectedProjectId so the effect only depends on
+    // editContext (stable), preventing cleanup from canceling pending refresh timeouts.
+    useEffect(() => {
+        const addListener = editContext?.addSocketMessageListener;
+        if (!addListener)
+            return;
+        const unsubscribe = addListener((message) => {
+            const messageType = message?.type;
+            if (messageType !== "task:updated" && messageType !== "task:created" && messageType !== "task:deleted") {
+                return;
+            }
+            const payload = message?.payload;
+            const projectId = payload?.projectId ?? payload?.ProjectId;
+            const currentProjectId = selectedProjectIdRef.current;
+            if (!projectId || !currentProjectId)
+                return;
+            if (projectId !== currentProjectId) {
+                if (!directSubprojectIdsRef.current.has(projectId))
+                    return;
+                if (wsSubprojectRefreshTimeoutRef.current !== null) {
+                    window.clearTimeout(wsSubprojectRefreshTimeoutRef.current);
+                    wsSubprojectRefreshTimeoutRef.current = null;
+                }
+                wsSubprojectRefreshTimeoutRef.current = window.setTimeout(() => {
+                    wsSubprojectRefreshTimeoutRef.current = null;
+                    const refreshSubprojectsFn = refreshSubprojectTaskCountsRef.current;
+                    const refreshProjectsFn = refreshProjectsRef.current;
+                    if (!refreshSubprojectsFn)
+                        return;
+                    void refreshSubprojectsFn();
+                    if (refreshProjectsFn)
+                        void refreshProjectsFn();
+                }, 250);
+                return;
+            }
+            if (wsRefreshTimeoutRef.current !== null) {
+                window.clearTimeout(wsRefreshTimeoutRef.current);
+                wsRefreshTimeoutRef.current = null;
+            }
+            wsRefreshTimeoutRef.current = window.setTimeout(() => {
+                wsRefreshTimeoutRef.current = null;
+                const pid = selectedProjectIdRef.current;
+                const refreshProjectsFn = refreshProjectsRef.current;
+                const refreshTasksFn = refreshTasksRef.current;
+                const refreshDepsFn = refreshDependenciesRef.current;
+                if (!pid || !refreshTasksFn || !refreshDepsFn)
+                    return;
+                void refreshTasksFn(pid);
+                void refreshDepsFn(pid);
+                if (refreshProjectsFn)
+                    void refreshProjectsFn();
+            }, 250);
+        });
+        return () => {
+            unsubscribe();
+            // Do NOT clear wsRefreshTimeoutRef here — the ref persists across effect
+            // re-runs and the timeout callback reads the latest values via refs.
+            // Clearing it here was the bug: editContext changes caused cleanup to
+            // cancel the pending debounced refresh before it could fire.
+        };
+    }, [editContext]);
+    // Keep project dropdown in sync when projects are created elsewhere (e.g. by agents).
+    useEffect(() => {
+        const addListener = editContext?.addSocketMessageListener;
+        if (!addListener)
+            return;
+        const unsubscribe = addListener((message) => {
+            if (message?.type !== "project:created")
+                return;
+            void refreshProjects();
+        });
+        return () => unsubscribe();
+    }, [editContext, refreshProjects]);
+    useEffect(() => {
+        const addListener = editContext?.addSocketMessageListener;
+        if (!addListener)
+            return;
+        const unsubscribe = addListener((message) => {
+            const type = message?.type;
+            if (!type)
+                return;
+            const payload = message?.payload ?? {};
+            const agentId = payload?.agentId;
+            if (!agentId || typeof agentId !== "string")
+                return;
+            const trackedAgentIds = new Set(tasksRef.current
+                .map((task) => task.assignedAgentId)
+                .filter((id) => typeof id === "string" && id.length > 0)
+                .map((id) => id.toLowerCase()));
+            if (!trackedAgentIds.has(agentId.toLowerCase()))
+                return;
+            const queueProjectsRefresh = () => {
+                if (wsProjectRefreshTimeoutRef.current !== null) {
+                    window.clearTimeout(wsProjectRefreshTimeoutRef.current);
+                    wsProjectRefreshTimeoutRef.current = null;
+                }
+                wsProjectRefreshTimeoutRef.current = window.setTimeout(() => {
+                    wsProjectRefreshTimeoutRef.current = null;
+                    const refreshProjectsFn = refreshProjectsRef.current;
+                    if (!refreshProjectsFn)
+                        return;
+                    void refreshProjectsFn();
+                }, 500);
+            };
+            if (type === "agent:run:status") {
+                const status = normalizeAgentStatus(payload?.data?.state);
+                if (status === undefined)
+                    return;
+                const normalizedAgentId = agentId.toLowerCase();
+                setAgentStatusesById((prev) => ({ ...prev, [normalizedAgentId]: status }));
+                queueProjectsRefresh();
+                return;
+            }
+            if (type === "agent:run:start") {
+                const normalizedAgentId = agentId.toLowerCase();
+                setAgentStatusesById((prev) => ({ ...prev, [normalizedAgentId]: "running" }));
+                queueProjectsRefresh();
+                return;
+            }
+            if (type === "agent:run:complete") {
+                const normalizedAgentId = agentId.toLowerCase();
+                setAgentStatusesById((prev) => ({ ...prev, [normalizedAgentId]: "completed" }));
+                queueProjectsRefresh();
+                return;
+            }
+            if (type === "agent:run:error") {
+                const normalizedAgentId = agentId.toLowerCase();
+                setAgentStatusesById((prev) => ({ ...prev, [normalizedAgentId]: "error" }));
+                queueProjectsRefresh();
+                return;
+            }
+            if (type === "agent:run:closed") {
+                const normalizedAgentId = agentId.toLowerCase();
+                setAgentStatusesById((prev) => ({ ...prev, [normalizedAgentId]: "closed" }));
+                queueProjectsRefresh();
+            }
+        });
+        return () => unsubscribe();
+    }, [editContext]);
+    // Clean up pending debounced refresh on unmount only.
+    useEffect(() => {
+        return () => {
+            if (wsRefreshTimeoutRef.current !== null) {
+                window.clearTimeout(wsRefreshTimeoutRef.current);
+                wsRefreshTimeoutRef.current = null;
+            }
+            if (wsSubprojectRefreshTimeoutRef.current !== null) {
+                window.clearTimeout(wsSubprojectRefreshTimeoutRef.current);
+                wsSubprojectRefreshTimeoutRef.current = null;
+            }
+            if (wsProjectRefreshTimeoutRef.current !== null) {
+                window.clearTimeout(wsProjectRefreshTimeoutRef.current);
+                wsProjectRefreshTimeoutRef.current = null;
+            }
+        };
+    }, []);
+    // Ensure selected task still exists after reload
+    useEffect(() => {
+        if (!selectedTaskId)
+            return;
+        if (!tasks.some((t) => t.taskId === selectedTaskId))
+            setSelectedTaskId(null);
+    }, [selectedTaskId, tasks]);
+    // No special auto-selection by project status — the agent panel is driven by
+    // whichever task the user selects.
+    // The backend now creates the Plan task and triggers the planner agent
+    // during project creation (TaskService.CreateProjectAsync), so we no longer
+    // need to auto-trigger planning from the frontend.
+    const taskBoardContent = useMemo(() => {
+        if (!selectedProjectId) {
+            return (_jsx("div", { className: "text-sm text-muted-foreground p-6", children: "Select a project to view tasks." }));
+        }
+        if (isListView) {
+            return (_jsxs("div", { className: "grid gap-3", children: [_jsx(ProjectDashboard, { selectedProjectTitle: selectedProject?.project.title ?? "Current project", selectedProjectDescription: selectedProject?.project.description, selectedProjectStatus: selectedProject?.project.status, selectedProjectCostUsed: selectedProjectCumulativeCostUsed, selectedProjectCostLimit: selectedProject?.project.costLimit ?? null, canEditProjectStatus: selectedProject?.permission === "Owner", savingProjectStatus: savingProjectStatus, onStatusChange: handleProjectStatusChange, selectedProjectTaskCounts: selectedProjectTaskCounts, subprojects: directSubprojects, taskCountsByProjectId: subprojectTaskCounts, loading: subprojectCountsLoading, parentProjectId: parentProject?.project.projectId ?? null, parentProjectTitle: parentProject?.project.title ?? null, onSelectProject: setSelectedProjectId }), _jsx(ListView, { tasks: tasksWithDisplayAssignees, onSelectTask: (id) => setSelectedTaskId(id), selectedTaskId: selectedTaskId, onTasksChanged: () => {
+                            if (selectedProjectId) {
+                                void refreshTasks(selectedProjectId);
+                                void refreshDependencies(selectedProjectId);
+                                void refreshSubprojectTaskCounts();
+                            }
+                        }, projectId: selectedProjectId, permission: selectedProject?.permission, agentStatusesById: agentStatusesById, activeTab: activeTab, onSetActiveTab: setActiveTab })] }));
+        }
+        return (_jsxs("div", { className: "grid gap-3", children: [_jsx(ProjectDashboard, { selectedProjectTitle: selectedProject?.project.title ?? "Current project", selectedProjectDescription: selectedProject?.project.description, selectedProjectStatus: selectedProject?.project.status, selectedProjectCostUsed: selectedProjectCumulativeCostUsed, selectedProjectCostLimit: selectedProject?.project.costLimit ?? null, canEditProjectStatus: selectedProject?.permission === "Owner", savingProjectStatus: savingProjectStatus, onStatusChange: handleProjectStatusChange, selectedProjectTaskCounts: selectedProjectTaskCounts, subprojects: directSubprojects, taskCountsByProjectId: subprojectTaskCounts, loading: subprojectCountsLoading, parentProjectId: parentProject?.project.projectId ?? null, parentProjectTitle: parentProject?.project.title ?? null, onSelectProject: setSelectedProjectId }), _jsx(KanbanView, { tasks: tasksWithDisplayAssignees, dependencies: dependencies, onSelectTask: (id) => setSelectedTaskId(id), selectedTaskId: selectedTaskId, onTasksChanged: () => {
+                        if (selectedProjectId) {
+                            void refreshTasks(selectedProjectId);
+                            void refreshDependencies(selectedProjectId);
+                            void refreshSubprojectTaskCounts();
+                        }
+                    }, projectId: selectedProjectId, permission: selectedProject?.permission, agentStatusesById: agentStatusesById, activeTab: activeTab, onSetActiveTab: setActiveTab })] }));
+    }, [
+        selectedProjectId,
+        isListView,
+        tasksWithDisplayAssignees,
+        selectedTaskId,
+        refreshTasks,
+        refreshDependencies,
+        selectedProject?.permission,
+        selectedProject?.project.description,
+        selectedProject?.project.status,
+        selectedProject?.project.costLimit,
+        selectedProjectCumulativeCostUsed,
+        agentStatusesById,
+        dependencies,
+        directSubprojects,
+        parentProject?.project.projectId,
+        parentProject?.project.title,
+        selectedProject?.project.title,
+        selectedProjectTaskCounts,
+        subprojectTaskCounts,
+        subprojectCountsLoading,
+        refreshSubprojectTaskCounts,
+        savingProjectStatus,
+        handleProjectStatusChange,
+        activeTab,
+    ]);
+    const taskDetailPanel = useMemo(() => (_jsx(TaskDetailPanel, { project: selectedProject, task: selectedTask, allTasks: tasksWithDisplayAssignees, dependencies: dependencies, agentStatusesById: agentStatusesById, onTaskChanged: () => {
+            if (selectedProjectId) {
+                void refreshTasks(selectedProjectId);
+                void refreshDependencies(selectedProjectId);
+            }
+        }, onSelectTask: (taskId) => setSelectedTaskId(taskId), onClose: () => setSelectedTaskId(null), variant: "panel" })), [selectedProject, selectedTask, tasksWithDisplayAssignees, dependencies, agentStatusesById, selectedProjectId, refreshTasks, refreshDependencies]);
+    const agentTerminalPanel = useMemo(() => (_jsx(TaskAgentPanel, { agentId: currentAgentId, mode: agentPanelMode, label: selectedTaskIsPlan ? "Planner" : "Task Agent", onStartPlanning: selectedTaskIsPlan && isPlanning ? handleStartPlanning : undefined, canAssignAgent: !selectedTaskIsBlocked, assignAgentDisabledReason: selectedTaskIsBlocked
+            ? "This task is blocked by unfinished dependencies."
+            : undefined, onAssignAgent: !selectedTaskIsPlan && canEditTasks && agentPanelMode === "no-agent"
+            ? () => setAssignAgentDialogOpen(true)
+            : undefined })), [currentAgentId, agentPanelMode, selectedTaskIsPlan, isPlanning, handleStartPlanning, selectedTaskIsBlocked, canEditTasks]);
+    const slotContext = editContext?.getActiveSlotContext();
+    const previewItemVersion = useMemo(() => {
+        if (!currentItemDescriptor)
+            return null;
+        return currentItemDescriptor.version === 0
+            ? (editContext?.item?.version ?? null)
+            : currentItemDescriptor.version;
+    }, [currentItemDescriptor, editContext?.item?.version]);
+    const contextItemOptions = useMemo(() => {
+        return agentContextItems.map((contextItem) => {
+            const key = `${contextItem.id}|${contextItem.language}|${contextItem.version}`;
+            const name = contextItemNamesByKey[key] || contextItem.name || contextItem.id;
+            const path = contextItemPathsByKey[key] || contextItem.path || "";
+            return {
+                value: key,
+                label: name,
+                description: `${path || contextItem.id} (${contextItem.language}/v${contextItem.version})`,
+            };
+        });
+    }, [agentContextItems, contextItemNamesByKey, contextItemPathsByKey]);
+    const selectedContextItemValue = useMemo(() => {
+        if (currentItemKey)
+            return currentItemKey;
+        const first = agentContextItems[0];
+        if (!first)
+            return "";
+        return `${first.id}|${first.language}|${first.version}`;
+    }, [currentItemKey, agentContextItems]);
+    const hasMultipleContextItems = contextItemOptions.length > 1;
+    useEffect(() => {
+        if (!currentAgentId) {
+            setAgentContextItems([]);
+            return;
+        }
+        let cancelled = false;
+        getAgent(currentAgentId)
+            .then((agent) => {
+            if (cancelled)
+                return;
+            const rawContext = agent?.agentContext;
+            if (!rawContext) {
+                setAgentContextItems([]);
+                return;
+            }
+            let parsed = null;
+            try {
+                parsed = JSON.parse(rawContext);
+            }
+            catch {
+                parsed = null;
+            }
+            const items = (parsed?.items || []).filter((x) => !!x?.id && !!x?.language && typeof x?.version === "number");
+            setAgentContextItems(items);
+        })
+            .catch(() => {
+            if (cancelled)
+                return;
+            setAgentContextItems([]);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [currentAgentId]);
+    useEffect(() => {
+        if (!editContext || agentContextItems.length === 0) {
+            setContextItemNamesByKey({});
+            setContextItemPathsByKey({});
+            return;
+        }
+        let cancelled = false;
+        Promise.all(agentContextItems.map(async (contextItem) => {
+            const key = `${contextItem.id}|${contextItem.language}|${contextItem.version}`;
+            const descriptor = {
+                id: contextItem.id,
+                language: contextItem.language,
+                version: contextItem.version,
+            };
+            const item = await editContext.itemsRepository.getItem(descriptor);
+            return {
+                key,
+                name: item?.name || contextItem.name || "",
+                path: item?.path || contextItem.path || "",
+            };
+        }))
+            .then((results) => {
+            if (cancelled)
+                return;
+            const nextNames = {};
+            const nextPaths = {};
+            for (const result of results) {
+                nextNames[result.key] = result.name;
+                nextPaths[result.key] = result.path;
+            }
+            setContextItemNamesByKey(nextNames);
+            setContextItemPathsByKey(nextPaths);
+        })
+            .catch(() => {
+            if (cancelled)
+                return;
+            setContextItemNamesByKey({});
+            setContextItemPathsByKey({});
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [editContext, agentContextItems]);
+    const handleSelectContextItem = useCallback((value) => {
+        const [id, language, versionText] = value.split("|");
+        const version = Number(versionText);
+        if (!id || !language || Number.isNaN(version) || !editContext?.loadItem)
+            return;
+        void editContext.loadItem({ id, language, version });
+    }, [editContext]);
+    useEffect(() => {
+        if (!editContext || !currentItemDescriptor) {
+            setPreviewItemName("");
+            setPreviewItemPath("");
+            return;
+        }
+        const activeItem = editContext.item;
+        const itemMatchesDescriptor = activeItem?.id === currentItemDescriptor.id &&
+            activeItem?.language === currentItemDescriptor.language;
+        if (itemMatchesDescriptor) {
+            setPreviewItemName(activeItem?.name || "");
+            setPreviewItemPath(activeItem?.path || "");
+            return;
+        }
+        let cancelled = false;
+        editContext.itemsRepository
+            .getItem(currentItemDescriptor)
+            .then((item) => {
+            if (cancelled)
+                return;
+            setPreviewItemName(item?.name || "");
+            setPreviewItemPath(item?.path || "");
+        })
+            .catch(() => {
+            if (cancelled)
+                return;
+            setPreviewItemName("");
+            setPreviewItemPath("");
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [
+        editContext,
+        currentItemDescriptor,
+        currentItemDescriptor?.id,
+        currentItemDescriptor?.language,
+        currentItemDescriptor?.version,
+        editContext?.item?.id,
+        editContext?.item?.language,
+        editContext?.item?.name,
+        editContext?.item?.path,
+    ]);
+    const itemPreviewPanel = useMemo(() => {
+        const hasCurrentItem = !!currentItemDescriptor;
+        if (!slotContext) {
+            return (_jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsx("div", { className: "border-b border-gray-200 bg-white px-3 py-2", children: hasCurrentItem ? (_jsxs("div", { className: "min-w-0", children: [hasMultipleContextItems ? (_jsx(Select, { value: selectedContextItemValue, onValueChange: handleSelectContextItem, options: contextItemOptions, placeholder: "Select context item", size: "xs", searchable: true, className: "h-7 rounded-md bg-white", maxWidth: 420, "data-testid": "taskboard-context-item-selector" })) : (_jsx("div", { className: "truncate text-sm font-medium text-slate-900", children: previewItemName || "Loading item..." })), _jsxs("div", { className: "mt-0.5 flex items-center gap-2", children: [_jsx("span", { className: "truncate text-xs text-slate-500", children: previewItemPath || "Path unavailable" }), _jsx("span", { className: "shrink-0 rounded bg-slate-100 px-1.5 py-0.5 text-[10px] font-medium text-slate-600", children: currentItemDescriptor?.language }), previewItemVersion != null && (_jsxs("span", { className: "shrink-0 rounded bg-slate-100 px-1.5 py-0.5 text-[10px] font-medium text-slate-600", children: ["v", previewItemVersion] }))] })] })) : (_jsx("div", { className: "text-xs text-slate-500", children: "No item loaded" })) }), _jsxs("div", { className: "flex min-h-0 flex-1 flex-col items-center justify-center gap-3 bg-gray-50 p-6 text-center", children: [_jsx("div", { className: "text-sm font-medium text-muted-foreground", children: "Editor preview unavailable" }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Open the editor context item to preview and edit it here." })] })] }));
+        }
+        return (_jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsx("div", { className: "border-b border-gray-200 bg-white px-3 py-2", children: hasCurrentItem ? (_jsxs("div", { className: "min-w-0", children: [hasMultipleContextItems ? (_jsx(Select, { value: selectedContextItemValue, onValueChange: handleSelectContextItem, options: contextItemOptions, placeholder: "Select context item", size: "xs", searchable: true, className: "h-7 rounded-md bg-white", maxWidth: 420, "data-testid": "taskboard-context-item-selector" })) : (_jsx("div", { className: "truncate text-sm font-medium text-slate-900", children: previewItemName || "Loading item..." })), _jsxs("div", { className: "mt-0.5 flex items-center gap-2", children: [_jsx("span", { className: "truncate text-xs text-slate-500", children: previewItemPath || "Path unavailable" }), _jsx("span", { className: "shrink-0 rounded bg-slate-100 px-1.5 py-0.5 text-[10px] font-medium text-slate-600", children: currentItemDescriptor?.language }), previewItemVersion != null && (_jsxs("span", { className: "shrink-0 rounded bg-slate-100 px-1.5 py-0.5 text-[10px] font-medium text-slate-600", children: ["v", previewItemVersion] }))] })] })) : (_jsx("div", { className: "text-xs text-slate-500", children: "No item loaded" })) }), _jsx("div", { className: "min-h-0 flex-1 overflow-hidden bg-gray-50", children: _jsx(EditorSlotContextProvider, { value: slotContext, children: _jsx(SingleEditView, { compareView: false, name: "taskboard-workspace-preview", view: "primary" }) }) })] }));
+    }, [
+        slotContext,
+        currentItemDescriptor,
+        contextItemOptions,
+        hasMultipleContextItems,
+        handleSelectContextItem,
+        selectedContextItemValue,
+        previewItemName,
+        previewItemPath,
+        previewItemVersion,
+    ]);
+    useEffect(() => {
+        if (!assignAgentDialogOpen)
+            return;
+        if (!selectedTask || agentPanelMode !== "no-agent" || selectedTaskIsBlocked) {
+            setAssignAgentDialogOpen(false);
+        }
+    }, [assignAgentDialogOpen, selectedTask, agentPanelMode, selectedTaskIsBlocked]);
+    const panels = useMemo(() => {
+        if (isListView) {
+            const listPanels = [
+                {
+                    name: "task-list",
+                    defaultSize: "auto",
+                    content: (_jsx("div", { className: "h-full overflow-y-auto overflow-x-auto bg-slate-50/50 p-4 pt-3", children: taskBoardContent })),
+                },
+                {
+                    name: "task-details",
+                    defaultSize: 420,
+                    content: taskDetailPanel,
+                    hidden: !selectedTask,
+                },
+                {
+                    name: "agent-terminal",
+                    defaultSize: 560,
+                    content: agentTerminalPanel,
+                },
+            ];
+            if (showEditorPanel) {
+                listPanels.push({
+                    name: "editor-preview",
+                    defaultSize: 500,
+                    content: (_jsx("div", { className: "h-full overflow-hidden border-l border-gray-200 bg-gray-50", children: itemPreviewPanel })),
+                });
+            }
+            return listPanels;
+        }
+        const kanbanPanels = [
+            {
+                name: "work-area",
+                defaultSize: "auto",
+                content: (_jsx(Splitter, { direction: "vertical", localStorageKey: "task-board-work-area-splitter", panels: [
+                        {
+                            name: "board",
+                            defaultSize: "auto",
+                            content: (_jsx("div", { className: "h-full overflow-y-auto overflow-x-hidden bg-slate-50/50 p-4 pt-3", children: taskBoardContent })),
+                        },
+                        {
+                            name: "task-details",
+                            defaultSize: 320,
+                            content: taskDetailPanel,
+                            hidden: !selectedTask,
+                        },
+                    ] })),
+            },
+            {
+                name: "agent-terminal",
+                defaultSize: 560,
+                content: agentTerminalPanel,
+            },
+        ];
+        if (showEditorPanel) {
+            kanbanPanels.push({
+                name: "editor-preview",
+                defaultSize: 500,
+                content: (_jsx("div", { className: "h-full overflow-hidden border-l border-gray-200 bg-gray-50", children: itemPreviewPanel })),
+            });
+        }
+        return kanbanPanels;
+    }, [isListView, taskBoardContent, taskDetailPanel, agentTerminalPanel, selectedTask, showEditorPanel, itemPreviewPanel]);
+    return (_jsxs("div", { className: "flex h-full w-full flex-col bg-white text-foreground select-text", children: [_jsx("div", { className: "min-h-0 flex-1", children: _jsx(Splitter, { panels: panels, direction: "horizontal", localStorageKey: isListView ? "task-board-list-splitter" : "task-board-kanban-splitter" }) }), selectedProjectId && (_jsx(CreateTaskDialog, { open: createDialogOpen, onOpenChange: setCreateDialogOpen, projectId: selectedProjectId, onCreated: () => {
+                    void refreshTasks(selectedProjectId);
+                    void refreshDependencies(selectedProjectId);
+                } })), _jsx(CreateProjectDialog, { open: createProjectOpen, onOpenChange: setCreateProjectOpen, projects: projects, onCreated: async (newProjectId) => {
+                    await refreshProjects();
+                    if (newProjectId)
+                        setSelectedProjectId(newProjectId);
+                } }), _jsx(ProjectSettingsDialog, { open: !!settingsProjectId, onOpenChange: (open) => {
+                    if (!open)
+                        setSettingsProjectId(null);
+                }, projectId: settingsProjectId, selectedProject: settingsProject, onChanged: refreshProjects }), _jsx(AssignAgentDialog, { open: assignAgentDialogOpen, task: selectedTask, onOpenChange: setAssignAgentDialogOpen, onAssigned: async () => {
+                    if (!selectedProjectId)
+                        return;
+                    await refreshTasks(selectedProjectId);
+                    await refreshDependencies(selectedProjectId);
+                } })] }));
+}
+//# sourceMappingURL=TaskBoardWorkspace.js.map