@parhelia/core 0.3.12791 → 0.3.12806

package/dist/editor/settings/panels/ProjectTemplatesPanel.js

@@ -1,5 +1,5 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ChevronLeft, CopyPlus, CornerDownRight, GitBranch, LayoutTemplate, Link2, PanelRightOpen, Plus, RefreshCw, Settings2, Shield, Trash2, X, } from "lucide-react";
+import { ArrowDown, ArrowUp, ChevronLeft, CopyPlus, CornerDownRight, GitBranch, LayoutTemplate, ListChecks, Link2, PanelRightOpen, Plus, RefreshCw, Settings2, Shield, Trash2, X, } from "lucide-react";
 import { useCallback, useEffect, useMemo, useRef, useState, Suspense, lazy, } from "react";
 import { toast } from "sonner";
 import { Badge } from "../../../components/ui/badge";
@@ -91,7 +91,17 @@ function isProjectTemplateItemChange(changes, selectedTemplateId) {
 function cloneTemplate(template) {
     return normalizeProjectTemplate(JSON.parse(JSON.stringify(template)));
 }
-function normalizeTaskTemplate(task) {
+function normalizeTaskTemplateTodo(todo, index) {
+    return {
+        ...todo,
+        id: todo.id?.trim() || crypto.randomUUID(),
+        title: todo.title ?? "",
+        instructions: todo.instructions ?? "",
+        agentProfileId: todo.agentProfileId?.trim() || null,
+        sortOrder: Number.isFinite(todo.sortOrder) ? todo.sortOrder : index * 100,
+    };
+}
+export function normalizeTaskTemplate(task) {
     const rawAssigneeId = task.assigneeId?.trim() || null;
     const rawAgentProfileId = task.agentProfileId?.trim() || null;
     const rawParentTaskId = task.parentTaskId?.trim() || null;
@@ -108,6 +118,8 @@ function normalizeTaskTemplate(task) {
             : "MultiSelect"
         : null;
     const assigneeType = task.assigneeType ?? (rawAgentProfileId ? "Agent" : null);
+    const todos = (task.todos ?? []).map(normalizeTaskTemplateTodo);
+    const todosManaged = task.todosManaged === true && todos.length > 0;
     if (assigneeType === "Agent") {
         const canonicalAgentId = rawAgentProfileId || (isValidGuid(rawAssigneeId) ? rawAssigneeId : null);
         return {
@@ -120,6 +132,8 @@ function normalizeTaskTemplate(task) {
             agentProfileId: canonicalAgentId,
             parentTaskId: rawParentTaskId,
             dependencyIds,
+            todos,
+            todosManaged,
         };
     }
     if (assigneeType === "user" || assigneeType === "Role") {
@@ -133,6 +147,8 @@ function normalizeTaskTemplate(task) {
             agentProfileId: null,
             parentTaskId: rawParentTaskId,
             dependencyIds,
+            todos,
+            todosManaged,
         };
     }
     return {
@@ -145,6 +161,8 @@ function normalizeTaskTemplate(task) {
         agentProfileId: null,
         parentTaskId: rawParentTaskId,
         dependencyIds,
+        todos,
+        todosManaged,
     };
 }
 function normalizeGraphOrientation(orientation) {
@@ -196,6 +214,17 @@ function createEmptyTaskTemplate(taskCount, title) {
         sortOrder: taskCount * 100,
         parentTaskId: null,
         dependencyIds: [],
+        todos: [],
+        todosManaged: false,
+    };
+}
+function createEmptyTaskTemplateTodo(todoCount) {
+    return {
+        id: crypto.randomUUID(),
+        title: `Todo ${todoCount + 1}`,
+        instructions: "",
+        agentProfileId: null,
+        sortOrder: todoCount * 100,
     };
 }
 function createEmptyGoalDefinition(goalCount, title) {
@@ -212,7 +241,7 @@ function createEmptyGoalDefinition(goalCount, title) {
 function sortTemplates(templates) {
     return [...templates].sort((left, right) => left.name.localeCompare(right.name, undefined, { sensitivity: "base" }));
 }
-function buildUpsertTemplateRequest(template) {
+export function buildUpsertTemplateRequest(template) {
     return {
         projectTemplateId: template.id,
         name: template.name.trim(),
@@ -249,6 +278,15 @@ function buildUpsertTemplateRequest(template) {
                 assigneeType: normalizedTask.assigneeType || null,
                 assigneeId: normalizedTask.assigneeId || null,
                 dependencyIds: Array.from(new Set(normalizedTask.dependencyIds || [])),
+                todosManaged: normalizedTask.todosManaged === true &&
+                    (normalizedTask.todos?.length ?? 0) > 0,
+                todos: (normalizedTask.todos ?? []).map((todo, todoIndex) => ({
+                    id: todo.id,
+                    title: todo.title.trim(),
+                    instructions: todo.instructions?.trim() || null,
+                    agentProfileId: todo.agentProfileId || null,
+                    sortOrder: todoIndex * 100,
+                })),
             };
         }),
         goalTemplates: (template.goalTemplates ?? []).map((goal, index) => ({
@@ -262,7 +300,7 @@ function buildUpsertTemplateRequest(template) {
         })),
     };
 }
-function mergeTemplateResponseWithRequest(serverTemplate, request) {
+export function mergeTemplateResponseWithRequest(serverTemplate, request) {
     const requestedTaskById = new Map((request.taskTemplates ?? []).map((task) => [task.id, task]));
     const requestedGoalById = new Map((request.goalTemplates ?? []).map((goal) => [goal.id, goal]));
     // Server re-reads goals after BeginEdit/EndEdit; if a just-written goal is
@@ -310,6 +348,9 @@ function mergeTemplateResponseWithRequest(serverTemplate, request) {
                 dependencyIds: serverDeps.length === 0 && requestedDeps.length > 0
                     ? Array.from(new Set(requestedDeps))
                     : serverDeps,
+                todos: requested?.todos ?? task.todos ?? [],
+                todosManaged: (requested?.todos?.length ?? task.todos?.length ?? 0) > 0 &&
+                    (requested?.todosManaged ?? task.todosManaged) === true,
             };
         }),
     });
@@ -530,6 +571,7 @@ export function ProjectTemplatesPanel() {
     const [templates, setTemplates] = useState([]);
     const [error, setError] = useState(null);
     const [selectedTemplateId, setSelectedTemplateId] = useState(null);
+    const [persistedTemplateId, setPersistedTemplateId] = useState(null);
     const [draftTemplate, setDraftTemplate] = useState(null);
     const [selectedTaskId, setSelectedTaskId] = useState(null);
     const [saving, setSaving] = useState(false);
@@ -834,6 +876,7 @@ export function ProjectTemplatesPanel() {
         selectedTemplateIdRef.current = template?.id ?? null;
         draftTemplateRef.current = clonedTemplate;
         setSelectedTemplateId(template?.id ?? null);
+        setPersistedTemplateId(template?.id ?? null);
         setDraftTemplate(clonedTemplate);
         setEditingAgentProfile(null);
         setSelectedTaskId(getSelectedTaskIdForTemplate(clonedTemplate, preferredTaskId));
@@ -960,6 +1003,16 @@ export function ProjectTemplatesPanel() {
         }
         return byId;
     }, [aiProfiles]);
+    const taskTodoProfileOptions = useMemo(() => [
+        { value: "__task_agent__", label: "Use task agent profile" },
+        ...aiProfiles
+            .filter((profile) => !!profile.id)
+            .map((profile) => ({
+            value: profile.id,
+            label: profile.displayTitle || profile.name || profile.id,
+        }))
+            .sort((left, right) => left.label.localeCompare(right.label)),
+    ], [aiProfiles]);
     const selectedTask = useMemo(() => draftTemplate?.taskTemplates.find((task) => task.id === selectedTaskId) ??
         null, [draftTemplate, selectedTaskId]);
     const templateAgentInitialMetadata = useMemo(() => draftTemplate
@@ -1059,6 +1112,16 @@ export function ProjectTemplatesPanel() {
             setTemplateAgentError(null);
             return;
         }
+        // New and duplicated templates are shown optimistically before their first
+        // save has reached Sitecore. Resolving the assistant during that window
+        // races the upsert and produces a transient "Project template not found"
+        // response. Wait until persistTemplate confirms this ID exists remotely.
+        if (persistedTemplateId !== selectedTemplateId) {
+            setTemplateAgentId(null);
+            setTemplateAgentLoading(true);
+            setTemplateAgentError(null);
+            return;
+        }
         setTemplateAgentId(null);
         setTemplateAgentLoading(true);
         setTemplateAgentError(null);
@@ -1082,7 +1145,12 @@ export function ProjectTemplatesPanel() {
                 ? loadError.message
                 : "Failed to load project template assistant");
         });
-    }, [draftTemplate?.id, selectedTemplateId, syncProjectTemplateAgentContext]);
+    }, [
+        draftTemplate?.id,
+        persistedTemplateId,
+        selectedTemplateId,
+        syncProjectTemplateAgentContext,
+    ]);
     useEffect(() => {
         if (!templateAgentId || templateAgentLoading)
             return;
@@ -1122,6 +1190,59 @@ export function ProjectTemplatesPanel() {
             taskTemplates: currentTemplate.taskTemplates.map((task) => task.id === selectedTaskId ? updater({ ...task }) : task),
         }));
     }, [applyDraftChange, selectedTaskId]);
+    const handleAddTaskTodo = useCallback(() => {
+        updateSelectedTask((currentTask) => ({
+            ...currentTask,
+            todos: [
+                ...(currentTask.todos ?? []),
+                createEmptyTaskTemplateTodo(currentTask.todos?.length ?? 0),
+            ],
+        }));
+    }, [updateSelectedTask]);
+    const handleUpdateTaskTodo = useCallback((todoId, updater) => {
+        updateSelectedTask((currentTask) => ({
+            ...currentTask,
+            todos: (currentTask.todos ?? []).map((todo) => todo.id === todoId ? updater({ ...todo }) : todo),
+        }));
+    }, [updateSelectedTask]);
+    const handleRemoveTaskTodo = useCallback((todoId) => {
+        updateSelectedTask((currentTask) => {
+            const todos = (currentTask.todos ?? [])
+                .filter((todo) => todo.id !== todoId)
+                .map((todo, index) => ({ ...todo, sortOrder: index * 100 }));
+            return {
+                ...currentTask,
+                todos,
+                todosManaged: todos.length > 0 && currentTask.todosManaged === true,
+            };
+        });
+    }, [updateSelectedTask]);
+    const handleMoveTaskTodo = useCallback((todoId, direction) => {
+        updateSelectedTask((currentTask) => {
+            const todos = [...(currentTask.todos ?? [])];
+            const currentIndex = todos.findIndex((todo) => todo.id === todoId);
+            const targetIndex = currentIndex + direction;
+            if (currentIndex < 0 ||
+                targetIndex < 0 ||
+                targetIndex >= todos.length) {
+                return currentTask;
+            }
+            const currentTodo = todos[currentIndex];
+            const targetTodo = todos[targetIndex];
+            if (currentTodo === undefined || targetTodo === undefined) {
+                return currentTask;
+            }
+            todos[currentIndex] = targetTodo;
+            todos[targetIndex] = currentTodo;
+            return {
+                ...currentTask,
+                todos: todos.map((todo, index) => ({
+                    ...todo,
+                    sortOrder: index * 100,
+                })),
+            };
+        });
+    }, [updateSelectedTask]);
     const updateSelectedGoal = useCallback((updater) => {
         if (!selectedGoalId)
             return;
@@ -1245,6 +1366,9 @@ export function ProjectTemplatesPanel() {
             }
             const savedTemplate = mergeTemplateResponseWithRequest(result.data, request);
             lastPersistedSignatureRef.current = signature;
+            if (selectedTemplateIdRef.current === savedTemplate.id) {
+                setPersistedTemplateId(savedTemplate.id);
+            }
             setTemplates((existingTemplates) => sortTemplates([
                 ...existingTemplates.filter((template) => template.id !== savedTemplate.id),
                 savedTemplate,
@@ -1511,6 +1635,7 @@ export function ProjectTemplatesPanel() {
         latestDraftSignatureRef.current = signature;
         setTemplates((current) => sortTemplates([nextTemplate, ...current]));
         setSelectedTemplateId(nextTemplate.id);
+        setPersistedTemplateId(null);
         setDraftTemplate(cloneTemplate(nextTemplate));
         setSelectedTaskId(null);
         setSelectedGoalId(null);
@@ -1572,6 +1697,7 @@ export function ProjectTemplatesPanel() {
         latestDraftSignatureRef.current = signature;
         setTemplates((current) => sortTemplates([nextTemplate, ...current]));
         setSelectedTemplateId(nextTemplate.id);
+        setPersistedTemplateId(null);
         setDraftTemplate(cloneTemplate(nextTemplate));
         setSelectedTaskId(getSelectedTaskIdForTemplate(nextTemplate, null));
         setSelectedGoalId(null);
@@ -2257,7 +2383,23 @@ export function ProjectTemplatesPanel() {
                                                                     agentProfileId: next?.assigneeType === "Agent"
                                                                         ? next.assigneeId
                                                                         : null,
-                                                                })), placeholder: "Assign user or agent", buttonClassName: "h-8 min-h-0 w-full justify-between rounded-md bg-white text-xs", buttonTestId: "project-template-task-assignee-picker" }) }), selectedTask.assigneeType === "Agent" ? (_jsxs(Button, { type: "button", size: "sm", variant: "outline", className: "h-8 shrink-0 gap-1 px-2 text-xs", onClick: () => void handleEditAssignedAgentProfile(), disabled: !selectedAgentProfileId, "data-testid": "project-template-task-edit-agent-profile-button", children: [_jsx(Settings2, { className: "h-3.5 w-3.5", strokeWidth: 1 }), "Edit Profile"] })) : null] }), profilesError ? (_jsx("div", { className: "text-feedback-orange text-xs", children: profilesError })) : null] })] }), _jsxs("div", { className: "space-y-3", children: [_jsxs("div", { className: "border-border-default bg-neutral-grey-5 rounded-lg border p-3", "data-testid": "project-template-dependencies-section", children: [_jsxs("div", { className: "mb-2 flex items-center justify-between gap-2", children: [_jsxs("div", { className: "text-neutral-grey-100 flex items-center gap-2 text-xs font-medium", children: [_jsx(Shield, { className: "text-neutral-grey-50 h-4 w-4", strokeWidth: 1 }), "Dependencies"] }), _jsxs(Popover, { open: dependencyPickerOpen, onOpenChange: setDependencyPickerOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { type: "button", size: "sm", variant: "outline", className: "h-7 gap-1 px-2", disabled: dependencyAddCandidates.length === 0, "aria-label": "Add dependency", "data-testid": "project-template-add-dependency-button", children: _jsx(Plus, { className: "h-3.5 w-3.5", strokeWidth: 1 }) }) }), _jsxs(PopoverContent, { align: "end", className: "w-72 p-0", sideOffset: 6, "data-testid": "project-template-dependency-popover", children: [_jsx("div", { className: "border-border-default text-neutral-grey-100 border-b px-3 py-2 text-xs font-medium", children: "Depends on" }), _jsx("div", { className: "max-h-56 overflow-y-auto p-1", children: dependencyAddCandidates.length === 0 ? (_jsx("div", { className: "text-neutral-grey-50 px-2 py-3 text-center text-xs", children: "All other tasks are already linked." })) : (dependencyAddCandidates.map((task) => (_jsxs("button", { type: "button", className: "hover:bg-neutral-grey-5 flex w-full items-center gap-2 rounded-md px-2 py-2 text-left text-xs", onClick: () => handleAddDependency(task.id), "data-testid": `project-template-dependency-option-${task.id}`, children: [_jsx(Link2, { className: "text-neutral-grey-50 h-3.5 w-3.5 shrink-0", strokeWidth: 1 }), _jsx("span", { className: "text-neutral-grey-100 min-w-0 truncate font-medium", children: task.title || "Untitled Task" })] }, task.id)))) })] })] })] }), _jsx("p", { className: "text-neutral-grey-50 mb-2 text-[11px] leading-snug", children: "This task must wait for these tasks to finish first." }), dependencyTasks.length === 0 ? (_jsx("div", { className: "text-neutral-grey-50 text-xs", children: draftTemplate.taskTemplates.filter((t) => t.id !== selectedTask.id).length === 0
+                                                                })), placeholder: "Assign user or agent", buttonClassName: "h-8 min-h-0 w-full justify-between rounded-md bg-white text-xs", buttonTestId: "project-template-task-assignee-picker" }) }), selectedTask.assigneeType === "Agent" ? (_jsxs(Button, { type: "button", size: "sm", variant: "outline", className: "h-8 shrink-0 gap-1 px-2 text-xs", onClick: () => void handleEditAssignedAgentProfile(), disabled: !selectedAgentProfileId, "data-testid": "project-template-task-edit-agent-profile-button", children: [_jsx(Settings2, { className: "h-3.5 w-3.5", strokeWidth: 1 }), "Edit Profile"] })) : null] }), profilesError ? (_jsx("div", { className: "text-feedback-orange text-xs", children: profilesError })) : null] })] }), _jsxs("div", { className: "space-y-3", children: [_jsxs("div", { className: "border-border-default bg-neutral-grey-5 rounded-lg border p-3", "data-testid": "project-template-todos-section", children: [_jsxs("div", { className: "mb-2 flex items-center justify-between gap-2", children: [_jsxs("div", { className: "text-neutral-grey-100 flex items-center gap-2 text-xs font-medium", children: [_jsx(ListChecks, { className: "text-neutral-grey-50 h-4 w-4", strokeWidth: 1 }), "Todos"] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs("div", { className: "flex items-center gap-1.5", title: (selectedTask.todos?.length ?? 0) > 0
+                                                                        ? "Deliver todo items to the agent one at a time"
+                                                                        : "Add at least one todo to enable managed execution", children: [_jsx(Switch, { id: "project-template-todos-managed", checked: selectedTask.todosManaged === true, disabled: (selectedTask.todos?.length ?? 0) === 0, onCheckedChange: (checked) => updateSelectedTask((currentTask) => ({
+                                                                                ...currentTask,
+                                                                                todosManaged: checked &&
+                                                                                    (currentTask.todos?.length ?? 0) > 0,
+                                                                            })), "aria-label": "Managed todo execution", "data-testid": "project-template-todos-managed-toggle" }), _jsx(Label, { htmlFor: "project-template-todos-managed", className: "text-neutral-grey-100 text-xs", children: "Managed" })] }), _jsx(Button, { type: "button", size: "sm", variant: "outline", className: "h-7 gap-1 px-2", onClick: handleAddTaskTodo, "aria-label": "Add todo", "data-testid": "project-template-add-todo-button", children: _jsx(Plus, { className: "h-3.5 w-3.5", strokeWidth: 1 }) })] })] }), _jsx("p", { className: "text-neutral-grey-50 mb-2 text-[11px] leading-snug", children: "These task-specific todos override predefined todos from the assigned agent profile. Managed lists are delivered one item at a time after a brief orientation turn." }), (selectedTask.todos ?? []).length === 0 ? (_jsx("div", { className: "text-neutral-grey-50 text-xs", children: "No todos yet. The agent profile defaults will be used." })) : (_jsx("div", { className: "space-y-2", children: (selectedTask.todos ?? []).map((todo, todoIndex) => (_jsxs("div", { className: "border-border-default space-y-2 rounded-md border bg-white p-2", "data-testid": `project-template-todo-row-${todo.id}`, children: [_jsxs("div", { className: "flex items-center gap-1.5", children: [_jsx(Input, { className: "h-8 min-w-0 flex-1 text-xs md:text-xs", value: todo.title, onChange: (event) => handleUpdateTaskTodo(todo.id, (current) => ({
+                                                                            ...current,
+                                                                            title: event.target.value,
+                                                                        })), placeholder: "Todo title", "aria-label": `Todo ${todoIndex + 1} title`, "data-testid": "project-template-todo-title-input" }), _jsx(Button, { type: "button", size: "icon", variant: "ghost", className: "h-7 w-7 shrink-0", disabled: todoIndex === 0, onClick: () => handleMoveTaskTodo(todo.id, -1), "aria-label": `Move ${todo.title || "todo"} up`, "data-testid": "project-template-move-todo-up", children: _jsx(ArrowUp, { className: "h-3.5 w-3.5", strokeWidth: 1 }) }), _jsx(Button, { type: "button", size: "icon", variant: "ghost", className: "h-7 w-7 shrink-0", disabled: todoIndex ===
+                                                                            (selectedTask.todos?.length ?? 0) - 1, onClick: () => handleMoveTaskTodo(todo.id, 1), "aria-label": `Move ${todo.title || "todo"} down`, "data-testid": "project-template-move-todo-down", children: _jsx(ArrowDown, { className: "h-3.5 w-3.5", strokeWidth: 1 }) }), _jsx(Button, { type: "button", size: "icon", variant: "ghost", className: "text-feedback-red h-7 w-7 shrink-0", onClick: () => handleRemoveTaskTodo(todo.id), "aria-label": `Remove ${todo.title || "todo"}`, "data-testid": "project-template-remove-todo-button", children: _jsx(Trash2, { className: "h-3.5 w-3.5", strokeWidth: 1 }) })] }), _jsx(Textarea, { className: "text-xs", rows: 2, value: todo.instructions ?? "", onChange: (event) => handleUpdateTaskTodo(todo.id, (current) => ({
+                                                                    ...current,
+                                                                    instructions: event.target.value,
+                                                                })), placeholder: "Instructions for completing this todo", "aria-label": `Todo ${todoIndex + 1} instructions`, "data-testid": "project-template-todo-instructions-input" }), _jsx(Select, { value: todo.agentProfileId ?? "__task_agent__", onValueChange: (value) => handleUpdateTaskTodo(todo.id, (current) => ({
+                                                                    ...current,
+                                                                    agentProfileId: value === "__task_agent__" ? null : value,
+                                                                })), options: taskTodoProfileOptions, searchable: true, placeholder: "Use task agent profile", "data-testid": "project-template-todo-agent-profile-select" })] }, todo.id))) }))] }), _jsxs("div", { className: "border-border-default bg-neutral-grey-5 rounded-lg border p-3", "data-testid": "project-template-dependencies-section", children: [_jsxs("div", { className: "mb-2 flex items-center justify-between gap-2", children: [_jsxs("div", { className: "text-neutral-grey-100 flex items-center gap-2 text-xs font-medium", children: [_jsx(Shield, { className: "text-neutral-grey-50 h-4 w-4", strokeWidth: 1 }), "Dependencies"] }), _jsxs(Popover, { open: dependencyPickerOpen, onOpenChange: setDependencyPickerOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx(Button, { type: "button", size: "sm", variant: "outline", className: "h-7 gap-1 px-2", disabled: dependencyAddCandidates.length === 0, "aria-label": "Add dependency", "data-testid": "project-template-add-dependency-button", children: _jsx(Plus, { className: "h-3.5 w-3.5", strokeWidth: 1 }) }) }), _jsxs(PopoverContent, { align: "end", className: "w-72 p-0", sideOffset: 6, "data-testid": "project-template-dependency-popover", children: [_jsx("div", { className: "border-border-default text-neutral-grey-100 border-b px-3 py-2 text-xs font-medium", children: "Depends on" }), _jsx("div", { className: "max-h-56 overflow-y-auto p-1", children: dependencyAddCandidates.length === 0 ? (_jsx("div", { className: "text-neutral-grey-50 px-2 py-3 text-center text-xs", children: "All other tasks are already linked." })) : (dependencyAddCandidates.map((task) => (_jsxs("button", { type: "button", className: "hover:bg-neutral-grey-5 flex w-full items-center gap-2 rounded-md px-2 py-2 text-left text-xs", onClick: () => handleAddDependency(task.id), "data-testid": `project-template-dependency-option-${task.id}`, children: [_jsx(Link2, { className: "text-neutral-grey-50 h-3.5 w-3.5 shrink-0", strokeWidth: 1 }), _jsx("span", { className: "text-neutral-grey-100 min-w-0 truncate font-medium", children: task.title || "Untitled Task" })] }, task.id)))) })] })] })] }), _jsx("p", { className: "text-neutral-grey-50 mb-2 text-[11px] leading-snug", children: "This task must wait for these tasks to finish first." }), dependencyTasks.length === 0 ? (_jsx("div", { className: "text-neutral-grey-50 text-xs", children: draftTemplate.taskTemplates.filter((t) => t.id !== selectedTask.id).length === 0
                                                         ? "Add more task templates to create dependencies."
                                                         : "No dependencies yet. Use + to add one." })) : (_jsx("ul", { className: "space-y-1.5", children: dependencyTasks.map((task) => (_jsxs("li", { tabIndex: 0, className: cn("flex items-center justify-between gap-2 rounded-md border bg-white px-3 py-2 text-xs transition-colors outline-none", selectedDependencyId === task.id
                                                             ? "border-feedback-orange bg-feedback-orange-light ring-feedback-orange ring-1"