@taskforcehq/taskforce 0.3.306 → 0.3.307

package/dist/components/views/panels/PlanningDrawer.js

@@ -2,13 +2,20 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import React from 'react';
 import { useDndContext, useDraggable, useDroppable } from '@dnd-kit/core';
 import { CSS } from '@dnd-kit/utilities';
-import { ChevronLeft, ChevronRight, ChevronsDown, ChevronsRight, Filter, Plus, } from 'lucide-react';
+import { Bot, ChevronDown, ChevronLeft, ChevronRight, ClipboardList, Eye, EyeOff, Filter, Link2, Plus, Unlink, User, } from 'lucide-react';
 import styles from '../../../Taskforce.module.css';
 import panelStyles from './PlanningDrawer.module.css';
 import { ReferenceBadgeButton } from '../../ui/ReferenceBadgeButton';
-import { ContextAttachmentManager } from '../../context/ContextAttachmentManager';
+import { HierarchyActionBadge } from '../../ui/HierarchyActionBadge';
 import { IconMap, getStatusDefinition, resolveColor } from '../../../utils/constants';
 import { formatInitiativeReference, formatWorkstreamReference, } from '../../../utils/planningReferences.js';
+import { getEntityActivityItems } from '../../../utils/taskActivity';
+const DeferredEntityActivityTimeline = React.lazy(() => (import('../../activity/EntityActivityTimeline').then((module) => ({
+    default: module.EntityActivityTimeline,
+}))));
+const DeferredContextAttachmentManager = React.lazy(() => (import('../../context/ContextAttachmentManager').then((module) => ({
+    default: module.ContextAttachmentManager,
+}))));
 export const PLANNING_DRAWER_TREE_WIDTH_PX = 332;
 export const PLANNING_DRAWER_DETAIL_WIDTH_PX = 392;
 export const PLANNING_DRAWER_COLLAPSED_PANE_WIDTH_PX = 56;
@@ -17,6 +24,27 @@ export function getPlanningDrawerWidthPx(treeCollapsed, hasPrimaryPane, primaryC
         + (hasPrimaryPane ? (primaryCollapsed ? PLANNING_DRAWER_COLLAPSED_PANE_WIDTH_PX : PLANNING_DRAWER_DETAIL_WIDTH_PX) : 0)
         + (hasSecondaryPane ? (secondaryCollapsed ? PLANNING_DRAWER_COLLAPSED_PANE_WIDTH_PX : PLANNING_DRAWER_DETAIL_WIDTH_PX) : 0);
 }
+export function normalizePlanningOwnerOptions(options, selectedValue) {
+    const selected = String(selectedValue || '').trim();
+    const byIdentity = new Map();
+    for (const option of options) {
+        const value = String(option?.value || '').trim();
+        if (!value || value === 'unassigned')
+            continue;
+        if (typeof option.archivedAt === 'string' && option.archivedAt.trim().length > 0)
+            continue;
+        const label = String(option.label || value).trim() || value;
+        const kind = String(option.kind || '').trim().toLowerCase();
+        const username = String(option.username || '').trim().toLowerCase();
+        const identity = kind === 'agent'
+            ? `agent:${username || label.toLowerCase()}`
+            : `value:${value}`;
+        if (!byIdentity.has(identity) || value === selected) {
+            byIdentity.set(identity, { ...option, value, label });
+        }
+    }
+    return Array.from(byIdentity.values()).sort((left, right) => (left.label.localeCompare(right.label, undefined, { sensitivity: 'base' })));
+}
 function formatTaskStatusLabel(status) {
     if (!status)
         return 'No status';
@@ -66,42 +94,54 @@ function PlanningRow({ rowId, rowType, referenceLabel, title, meta, active, deta
         ? { transform: CSS.Translate.toString(transform) }
         : undefined;
     const showDropReady = canDropTask || canDropWorkstream;
-    return (_jsxs("div", { ref: setDropRef, style: dragStyle, className: `${panelStyles.treeRow} ${detailOpen ? panelStyles.treeRowDetailOpen : ''} ${showDropReady ? panelStyles.treeRowDropReady : ''} ${isOver ? panelStyles.treeRowDropActive : ''} ${isDragging ? panelStyles.treeRowDragging : ''} ${showDropReady ? panelStyles.treeRowDropMode : ''}`, children: [canExpand ? (_jsx("button", { type: "button", className: panelStyles.treeChevron, onClick: onToggleExpand, title: expanded ? 'Collapse workstreams' : 'Expand workstreams', children: expanded ? _jsx(ChevronsDown, { size: 15 }) : _jsx(ChevronsRight, { size: 15 }) })) : (_jsx("span", { className: panelStyles.treeChevron, "aria-hidden": "true", children: _jsx(ChevronRight, { size: 14 }) })), _jsxs("div", { className: panelStyles.rowContent, children: [_jsxs("div", { className: panelStyles.rowTopRow, children: [referenceLabel ? (_jsx(PlanningReferenceBadge, { label: referenceLabel, entityType: rowType })) : _jsx("span", { "aria-hidden": "true" }), _jsx("button", { type: "button", className: `${panelStyles.detailsButton} ${active ? panelStyles.detailsButtonActive : ''}`, onClick: onToggleScope, title: active ? 'Clear board scope' : 'Scope board to this item', children: _jsx(Filter, { size: 14 }) })] }), _jsxs("button", { type: "button", ref: draggable ? setDragRef : undefined, className: panelStyles.rowButton, onClick: onToggleDetails, ...(draggable ? attributes : {}), ...(draggable ? listeners : {}), children: [_jsx("span", { className: panelStyles.rowTitle, children: title }), _jsx("span", { className: panelStyles.rowMeta, children: meta })] })] })] }));
+    return (_jsxs("div", { ref: setDropRef, style: dragStyle, className: `${panelStyles.treeRow} ${detailOpen ? panelStyles.treeRowDetailOpen : ''} ${showDropReady ? panelStyles.treeRowDropReady : ''} ${isOver ? panelStyles.treeRowDropActive : ''} ${isDragging ? panelStyles.treeRowDragging : ''} ${showDropReady ? panelStyles.treeRowDropMode : ''}`, children: [canExpand ? (_jsx("button", { type: "button", className: panelStyles.treeChevron, onClick: onToggleExpand, title: expanded ? 'Collapse workstreams' : 'Expand workstreams', children: expanded ? _jsx(ChevronDown, { size: 15 }) : _jsx(ChevronRight, { size: 15 }) })) : (_jsx("span", { className: `${panelStyles.treeChevron} ${panelStyles.treeChevronPlaceholder}`, "aria-hidden": "true" })), _jsxs("div", { className: panelStyles.rowContent, children: [_jsxs("div", { className: panelStyles.rowTopRow, children: [referenceLabel ? (_jsx(PlanningReferenceBadge, { label: referenceLabel, entityType: rowType })) : _jsx("span", { "aria-hidden": "true" }), _jsx("button", { type: "button", className: `${panelStyles.detailsButton} ${active ? panelStyles.detailsButtonActive : ''}`, onClick: onToggleScope, title: active ? 'Clear board scope' : 'Scope board to this item', children: _jsx(Filter, { size: 14 }) })] }), _jsxs("button", { type: "button", ref: draggable ? setDragRef : undefined, className: panelStyles.rowButton, onClick: onToggleDetails, ...(draggable ? attributes : {}), ...(draggable ? listeners : {}), children: [_jsx("span", { className: panelStyles.rowTitle, children: title }), _jsx("span", { className: panelStyles.rowMeta, children: meta })] })] })] }));
 }
 function CollapsedPane({ label, onExpand, }) {
     return (_jsx("div", { className: `${panelStyles.paneShell} ${panelStyles.collapsedPaneShell}`.trim(), children: _jsxs("div", { className: panelStyles.collapsedPaneHeader, children: [_jsx("button", { type: "button", className: "tf-control-icon", onClick: onExpand, title: `Expand ${label}`, children: _jsx(ChevronRight, { size: 16 }) }), _jsx("span", { className: panelStyles.collapsedPaneLabel, children: label })] }) }));
 }
-function PlanningUnlinkZone({ targetType, label, }) {
-    const { active } = useDndContext();
-    const dragType = String(active?.data?.current?.type || '');
-    const matches = (targetType === 'task' && dragType === 'task-card')
-        || (targetType === 'workstream' && dragType === 'planning-workstream');
-    const { setNodeRef, isOver } = useDroppable({
-        id: targetType === 'task' ? 'planning-task-unlink' : 'planning-workstream-unlink',
-        data: { type: targetType === 'task' ? 'planning-task-unlink' : 'planning-workstream-unlink' },
-    });
-    if (!matches)
-        return null;
-    return (_jsx("div", { ref: setNodeRef, className: `${panelStyles.unlinkZone} ${isOver ? panelStyles.unlinkZoneActive : ''}`, children: label }));
+function DeferredPlanningPanelFallback() {
+    return (_jsxs("div", { className: panelStyles.deferredPanelFallback, "aria-hidden": "true", children: [_jsx("span", {}), _jsx("span", {}), _jsx("span", {})] }));
 }
-function PlanningDrawerList({ initiatives, standaloneWorkstreams, activeInitiativeId, activeWorkstreamId, expandedInitiativeIds, detail, secondaryPane, onCreateInitiative, onCreateWorkstream, onToggleInitiative, onSelectInitiative, onSelectWorkstream, onOpenInitiativeDetails, onOpenWorkstreamDetails, }) {
-    const { active } = useDndContext();
-    const dragType = String(active?.data?.current?.type || '');
-    const workstreamUnlinkEnabled = dragType === 'planning-workstream';
-    const { setNodeRef: setStandaloneWorkstreamsDropRef, isOver: isStandaloneWorkstreamsDropOver, } = useDroppable({
-        id: 'planning-workstream-unlink',
-        data: { type: 'planning-workstream-unlink' },
-    });
-    return (_jsxs(_Fragment, { children: [_jsx(PlanningUnlinkZone, { targetType: "task", label: "Drop here to make task standalone" }), _jsxs("div", { className: panelStyles.sectionGroup, children: [_jsxs("div", { className: panelStyles.sectionHeaderRow, children: [_jsx("div", { className: panelStyles.sectionTitle, children: "Initiatives" }), _jsx("button", { type: "button", className: "tf-control-icon", title: "Create initiative", "aria-label": "Create initiative", onClick: onCreateInitiative, children: _jsx(Plus, { size: 15 }) })] }), _jsx("div", { className: panelStyles.treeList, children: initiatives.length === 0 ? (_jsxs("div", { className: panelStyles.emptyPanel, children: [_jsx("div", { className: panelStyles.emptyPanelTitle, children: "No initiatives yet" }), _jsxs("div", { className: panelStyles.emptyPanelText, children: ["Initiatives give larger efforts a clear home without crowding the task board. Use the ", _jsx("code", { children: "+" }), " action above to create the first one."] })] })) : initiatives.map((initiative) => {
+function PlanningDrawerList({ initiatives, standaloneWorkstreams, allStandaloneWorkstreams = standaloneWorkstreams, activeInitiativeId, activeWorkstreamId, expandedInitiativeIds, detail, secondaryPane, onCreateInitiative, onCreateWorkstream, onToggleInitiative, onSelectInitiative, onSelectWorkstream, onOpenInitiativeDetails, onOpenWorkstreamDetails, }) {
+    const [showArchivedTrayWorkstreams, setShowArchivedTrayWorkstreams] = React.useState(false);
+    const getInitiativeTreeWorkstreams = React.useCallback((initiative) => {
+        if (!showArchivedTrayWorkstreams)
+            return initiative.workstreams;
+        const visibleIds = new Set(initiative.workstreams.map((workstream) => workstream.id));
+        const archivedWorkstreams = (initiative.allWorkstreams || [])
+            .filter((workstream) => Boolean(workstream.isArchived) && !visibleIds.has(workstream.id));
+        return [...initiative.workstreams, ...archivedWorkstreams];
+    }, [showArchivedTrayWorkstreams]);
+    const standaloneTreeWorkstreams = React.useMemo(() => {
+        if (!showArchivedTrayWorkstreams)
+            return standaloneWorkstreams;
+        const visibleIds = new Set(standaloneWorkstreams.map((workstream) => workstream.id));
+        const archivedWorkstreams = allStandaloneWorkstreams
+            .filter((workstream) => Boolean(workstream.isArchived) && !visibleIds.has(workstream.id));
+        return [...standaloneWorkstreams, ...archivedWorkstreams];
+    }, [allStandaloneWorkstreams, showArchivedTrayWorkstreams, standaloneWorkstreams]);
+    const archivedTrayWorkstreamCount = React.useMemo(() => {
+        const initiativeArchivedCount = initiatives.reduce((count, initiative) => (count + (initiative.allWorkstreams || []).filter((workstream) => Boolean(workstream.isArchived)).length), 0);
+        const standaloneArchivedCount = allStandaloneWorkstreams
+            .filter((workstream) => Boolean(workstream.isArchived)).length;
+        return initiativeArchivedCount + standaloneArchivedCount;
+    }, [allStandaloneWorkstreams, initiatives]);
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: panelStyles.sectionGroup, children: [_jsxs("div", { className: panelStyles.sectionHeaderRow, children: [_jsx("div", { className: panelStyles.sectionTitle, children: "Initiatives" }), _jsxs("div", { className: panelStyles.headerActionGroup, children: [archivedTrayWorkstreamCount > 0 ? (_jsx("button", { type: "button", className: `tf-control-icon ${showArchivedTrayWorkstreams ? panelStyles.toggleActive : ''}`.trim(), title: showArchivedTrayWorkstreams ? 'Hide archived workstreams in tray' : 'Show archived workstreams in tray', "aria-label": showArchivedTrayWorkstreams ? 'Hide archived workstreams in tray' : 'Show archived workstreams in tray', "aria-pressed": showArchivedTrayWorkstreams, onClick: () => setShowArchivedTrayWorkstreams((current) => !current), children: showArchivedTrayWorkstreams ? _jsx(EyeOff, { size: 15 }) : _jsx(Eye, { size: 15 }) })) : null, _jsx("button", { type: "button", className: "tf-control-icon", title: "Create initiative", "aria-label": "Create initiative", onClick: onCreateInitiative, children: _jsx(Plus, { size: 15 }) })] })] }), _jsx("div", { className: panelStyles.treeList, children: initiatives.length === 0 ? (_jsxs("div", { className: panelStyles.emptyPanel, children: [_jsx("div", { className: panelStyles.emptyPanelTitle, children: "No initiatives yet" }), _jsxs("div", { className: panelStyles.emptyPanelText, children: ["Initiatives give larger efforts a clear home without crowding the task board. Use the ", _jsx("code", { children: "+" }), " action above to create the first one."] })] })) : initiatives.map((initiative) => {
                             const expanded = expandedInitiativeIds.has(initiative.id);
-                            const meta = `${initiative.workstreamCount || 0} workstreams • ${initiative.taskCount} tasks${initiative.isArchived ? ' • archived' : ''}`;
-                            return (_jsxs("div", { children: [_jsx(PlanningRow, { rowId: initiative.id, rowType: "initiative", referenceLabel: formatInitiativeReference(initiative), title: initiative.title, meta: meta, active: activeInitiativeId === initiative.id && !activeWorkstreamId, detailOpen: detail?.type === 'initiative' && detail.item.id === initiative.id, canExpand: initiative.workstreams.length > 0, expanded: expanded, onToggleExpand: () => onToggleInitiative(initiative.id), onToggleScope: () => onSelectInitiative(initiative.id), onToggleDetails: () => {
+                            const treeWorkstreams = getInitiativeTreeWorkstreams(initiative);
+                            const activeWorkstreamCount = initiative.workstreamCount || 0;
+                            const archivedWorkstreamCount = treeWorkstreams.filter((workstream) => Boolean(workstream.isArchived)).length;
+                            const workstreamMeta = showArchivedTrayWorkstreams && archivedWorkstreamCount > 0
+                                ? `${activeWorkstreamCount} workstreams + ${archivedWorkstreamCount} archived`
+                                : `${activeWorkstreamCount} workstreams`;
+                            const meta = `${workstreamMeta} • ${initiative.taskCount} tasks${initiative.isArchived ? ' • archived' : ''}`;
+                            return (_jsxs("div", { children: [_jsx(PlanningRow, { rowId: initiative.id, rowType: "initiative", referenceLabel: formatInitiativeReference(initiative), title: initiative.title, meta: meta, active: activeInitiativeId === initiative.id && !activeWorkstreamId, detailOpen: detail?.type === 'initiative' && detail.item.id === initiative.id, canExpand: treeWorkstreams.length > 0, expanded: expanded, onToggleExpand: () => onToggleInitiative(initiative.id), onToggleScope: () => onSelectInitiative(initiative.id), onToggleDetails: () => {
                                             if (detail?.type === 'initiative' && detail.item.id === initiative.id) {
                                                 onOpenInitiativeDetails('');
                                                 return;
                                             }
                                             onOpenInitiativeDetails(initiative.id);
-                                        } }), expanded && initiative.workstreams.length > 0 && (_jsx("div", { className: panelStyles.treeChildren, children: initiative.workstreams.map((workstream) => (_jsx(PlanningRow, { rowId: workstream.id, rowType: "workstream", referenceLabel: formatWorkstreamReference(workstream), title: workstream.title, meta: `${workstream.taskCount} tasks • ${workstream.progressPercent}% complete${workstream.isArchived ? ' • archived' : ''}`, active: activeWorkstreamId === workstream.id, detailOpen: (detail?.type === 'workstream' && detail.item.id === workstream.id)
+                                        } }), expanded && treeWorkstreams.length > 0 && (_jsx("div", { className: panelStyles.treeChildren, children: treeWorkstreams.map((workstream) => (_jsx(PlanningRow, { rowId: workstream.id, rowType: "workstream", referenceLabel: formatWorkstreamReference(workstream), title: workstream.title, meta: `${workstream.taskCount} tasks • ${workstream.progressPercent}% complete${workstream.isArchived ? ' • archived' : ''}`, active: activeWorkstreamId === workstream.id, detailOpen: (detail?.type === 'workstream' && detail.item.id === workstream.id)
                                                 || (secondaryPane?.kind === 'detail' && secondaryPane.detail.item.id === workstream.id), onToggleScope: () => onSelectWorkstream(workstream.id, initiative.id), onToggleDetails: () => {
                                                 if (secondaryPane?.kind === 'detail' && secondaryPane.detail.item.id === workstream.id) {
                                                     onOpenWorkstreamDetails('');
@@ -113,7 +153,7 @@ function PlanningDrawerList({ initiatives, standaloneWorkstreams, activeInitiati
                                                 }
                                                 onOpenWorkstreamDetails(workstream.id);
                                             } }, workstream.id))) }))] }, initiative.id));
-                        }) })] }), _jsxs("div", { ref: setStandaloneWorkstreamsDropRef, className: `${panelStyles.sectionGroup} ${workstreamUnlinkEnabled ? panelStyles.sectionDropReady : ''} ${isStandaloneWorkstreamsDropOver ? panelStyles.sectionDropActive : ''}`.trim(), children: [_jsxs("div", { className: panelStyles.sectionHeaderRow, children: [_jsx("div", { className: panelStyles.sectionTitle, children: "Workstreams" }), _jsx("button", { type: "button", className: "tf-control-icon", title: "Create workstream", "aria-label": "Create workstream", onClick: onCreateWorkstream, children: _jsx(Plus, { size: 15 }) })] }), _jsx("div", { className: panelStyles.treeList, children: standaloneWorkstreams.length === 0 ? (_jsxs("div", { className: panelStyles.emptyPanel, children: [_jsx("div", { className: panelStyles.emptyPanelTitle, children: "No standalone workstreams yet" }), _jsxs("div", { className: panelStyles.emptyPanelText, children: ["Smaller projects can still use workstreams without needing initiative-level structure. Use the ", _jsx("code", { children: "+" }), " action above to add one."] })] })) : standaloneWorkstreams.map((workstream) => (_jsx(PlanningRow, { rowId: workstream.id, rowType: "workstream", referenceLabel: formatWorkstreamReference(workstream), title: workstream.title, meta: `${workstream.taskCount} tasks • ${workstream.progressPercent}% complete${workstream.isArchived ? ' • archived' : ''}`, active: activeWorkstreamId === workstream.id, detailOpen: (detail?.type === 'workstream' && detail.item.id === workstream.id)
+                        }) })] }), _jsxs("div", { className: panelStyles.sectionGroup, children: [_jsxs("div", { className: panelStyles.sectionHeaderRow, children: [_jsx("div", { className: panelStyles.sectionTitle, children: "Workstreams" }), _jsx("button", { type: "button", className: "tf-control-icon", title: "Create workstream", "aria-label": "Create workstream", onClick: onCreateWorkstream, children: _jsx(Plus, { size: 15 }) })] }), _jsx("div", { className: panelStyles.treeList, children: standaloneTreeWorkstreams.length === 0 ? (_jsxs("div", { className: panelStyles.emptyPanel, children: [_jsx("div", { className: panelStyles.emptyPanelTitle, children: "No standalone workstreams yet" }), _jsxs("div", { className: panelStyles.emptyPanelText, children: ["Smaller projects can still use workstreams without needing initiative-level structure. Use the ", _jsx("code", { children: "+" }), " action above to add one."] })] })) : standaloneTreeWorkstreams.map((workstream) => (_jsx(PlanningRow, { rowId: workstream.id, rowType: "workstream", referenceLabel: formatWorkstreamReference(workstream), title: workstream.title, meta: `${workstream.taskCount} tasks • ${workstream.progressPercent}% complete${workstream.isArchived ? ' • archived' : ''}`, active: activeWorkstreamId === workstream.id, detailOpen: (detail?.type === 'workstream' && detail.item.id === workstream.id)
                                 || (secondaryPane?.kind === 'detail' && secondaryPane.detail.item.id === workstream.id), onToggleScope: () => onSelectWorkstream(workstream.id, null), onToggleDetails: () => {
                                 if (detail?.type === 'workstream' && detail.item.id === workstream.id) {
                                     onOpenWorkstreamDetails('');
@@ -122,8 +162,10 @@ function PlanningDrawerList({ initiatives, standaloneWorkstreams, activeInitiati
                                 onOpenWorkstreamDetails(workstream.id);
                             } }, workstream.id))) })] })] }));
 }
-function PlanningDrawerDetailView({ detail, currentWorkspaceId, onOpenNestedWorkstreamDetails, onEdit, onArchive, onUnarchive, onCreateTaskInWorkstream, onCreateWorkstreamInInitiative, onOpenTaskById, onAttachTaskToWorkstreamByReference, onAttachWorkstreamToInitiativeByReference, onAddPlanningContextFile, onRemovePlanningContextFile, onUpdatePlanningContextCaption, }) {
+function PlanningDrawerDetailView({ detail, currentWorkspaceId, onOpenNestedWorkstreamDetails, onEdit, onArchive, onUnarchive, onCreateTaskInWorkstream, onCreateWorkstreamInInitiative, onOpenTaskById, onRemoveTaskFromWorkstream, onAssignInitiativeToWorkstream, onAttachTaskToWorkstreamByReference, onAttachWorkstreamToInitiativeByReference, onAddPlanningContextFile, onRemovePlanningContextFile, onUpdatePlanningContextCaption, parentInitiative = null, assigneeOptions, }) {
     const [attachReference, setAttachReference] = React.useState('');
+    const [showArchivedChildren, setShowArchivedChildren] = React.useState(false);
+    const [showRecentActivity, setShowRecentActivity] = React.useState(true);
     const { active } = useDndContext();
     const dragType = String(active?.data?.current?.type || '');
     const canDropTask = detail.type === 'workstream' && dragType === 'task-card';
@@ -136,30 +178,166 @@ function PlanningDrawerDetailView({ detail, currentWorkspaceId, onOpenNestedWork
             : { type: childDropType, workstreamId: detail.item.id },
     });
     const childLabel = detail.type === 'initiative' ? 'Workstreams' : 'Tasks';
-    const childItems = detail.type === 'initiative' ? detail.item.workstreams : [];
+    const childItems = React.useMemo(() => {
+        if (detail.type !== 'initiative')
+            return [];
+        const archivedWorkstreamIds = new Set(detail.item.workstreams.map((workstream) => workstream.id));
+        const archivedWorkstreams = (detail.item.allWorkstreams || [])
+            .filter((workstream) => Boolean(workstream.isArchived) && !archivedWorkstreamIds.has(workstream.id));
+        return [...detail.item.workstreams, ...archivedWorkstreams];
+    }, [detail.item, detail.type]);
+    const taskItems = React.useMemo(() => {
+        if (detail.type !== 'workstream')
+            return [];
+        return detail.item.tasks || [];
+    }, [detail.item, detail.type]);
+    const archivedChildCount = detail.type === 'initiative'
+        ? childItems.filter((workstream) => Boolean(workstream.isArchived)).length
+        : taskItems.filter((task) => Boolean(task.isArchived)).length;
+    const visibleChildItems = showArchivedChildren
+        ? childItems
+        : childItems.filter((workstream) => !workstream.isArchived);
+    const visibleTaskItems = showArchivedChildren
+        ? taskItems
+        : taskItems.filter((task) => !task.isArchived);
     const detailLabel = detail.type === 'initiative' ? 'Initiative' : 'Workstream';
     const detailReferenceLabel = detail.type === 'initiative'
         ? formatInitiativeReference(detail.item)
         : formatWorkstreamReference(detail.item);
     React.useEffect(() => {
         setAttachReference('');
+        setShowArchivedChildren(false);
+        setShowRecentActivity(true);
     }, [detail.item.id, detail.type]);
-    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: panelStyles.detailHero, children: [detailReferenceLabel ? (_jsx("div", { className: panelStyles.detailReferenceRow, children: _jsx(PlanningReferenceBadge, { label: detailReferenceLabel, entityType: detail.type }) })) : null, _jsx("h3", { className: panelStyles.detailTitle, children: detail.item.title }), _jsx("p", { className: panelStyles.detailDescription, children: detail.item.description?.trim() || (detail.type === 'initiative'
+    const handleAttachReference = React.useCallback(() => {
+        const value = attachReference.trim();
+        if (!value)
+            return;
+        if (detail.type === 'initiative') {
+            onAttachWorkstreamToInitiativeByReference?.(detail.item.id, value);
+        }
+        else {
+            onAttachTaskToWorkstreamByReference?.(detail.item.id, value);
+        }
+        setAttachReference('');
+    }, [
+        attachReference,
+        detail.item.id,
+        detail.type,
+        onAttachTaskToWorkstreamByReference,
+        onAttachWorkstreamToInitiativeByReference,
+    ]);
+    const attachActionLabel = detail.type === 'initiative'
+        ? 'Attach workstream to initiative'
+        : 'Attach task to workstream';
+    const archivedToggleLabel = detail.type === 'initiative' ? 'archived workstreams' : 'archived tasks';
+    const parentInitiativeReferenceLabel = detail.type === 'workstream' && parentInitiative
+        ? formatInitiativeReference(parentInitiative)
+        : '';
+    const actorOptionByValue = React.useMemo(() => {
+        const map = new Map();
+        for (const option of assigneeOptions) {
+            const value = String(option.value || '').trim();
+            if (!value)
+                continue;
+            map.set(value, option);
+            map.set(value.toLowerCase(), option);
+        }
+        return map;
+    }, [assigneeOptions]);
+    const resolveActorLabel = React.useCallback((actorId, actorType, actorLabel) => {
+        if (actorLabel && actorLabel.trim())
+            return actorLabel.trim();
+        const raw = String(actorId || '').trim();
+        if (!raw)
+            return actorType === 'ai' ? 'AI Agent' : 'You';
+        const option = actorOptionByValue.get(raw) || actorOptionByValue.get(raw.toLowerCase());
+        if (option?.label)
+            return option.label;
+        if (actorType === 'ai')
+            return raw;
+        return raw;
+    }, [actorOptionByValue]);
+    const resolveActivityActorPresentation = React.useCallback((input) => {
+        const actorRef = String(input.actorId || '').trim();
+        const option = actorOptionByValue.get(actorRef) || actorOptionByValue.get(actorRef.toLowerCase());
+        const resolvedActor = input.actorProfile || option || null;
+        const resolvedKind = input.actorType === 'system'
+            ? 'system'
+            : input.actorType === 'ai' || resolvedActor?.kind === 'ai' || option?.kind === 'agent'
+                ? 'agent'
+                : input.actorType === 'human' || resolvedActor?.kind === 'human' || option?.kind === 'member'
+                    ? 'member'
+                    : input.fallbackKind || 'member';
+        const iconName = String(resolvedActor && 'icon' in resolvedActor && resolvedActor.icon
+            ? resolvedActor.icon
+            : resolvedKind === 'agent'
+                ? 'Bot'
+                : resolvedKind === 'member'
+                    ? 'User'
+                    : 'ClipboardList');
+        const ActorIcon = IconMap[iconName]
+            || (resolvedKind === 'agent' ? Bot : resolvedKind === 'member' ? User : ClipboardList);
+        return {
+            kind: resolvedKind,
+            label: resolvedKind === 'system'
+                ? 'System'
+                : resolveActorLabel(actorRef, resolvedKind === 'agent' ? 'ai' : 'human', resolvedActor && 'label' in resolvedActor ? resolvedActor.label || null : null),
+            color: resolvedActor && 'color' in resolvedActor ? resolvedActor.color || undefined : undefined,
+            ActorIcon,
+        };
+    }, [actorOptionByValue, resolveActorLabel]);
+    const formatActivityFieldValue = React.useCallback((field, value) => {
+        const normalizedValue = String(value || '').trim();
+        if (!normalizedValue)
+            return undefined;
+        if (field === 'ownerId') {
+            return actorOptionByValue.get(normalizedValue)?.label
+                || actorOptionByValue.get(normalizedValue.toLowerCase())?.label
+                || normalizedValue;
+        }
+        if (field === 'initiativeId' && parentInitiative && normalizedValue === parentInitiative.id) {
+            return formatInitiativeReference(parentInitiative) || parentInitiative.title;
+        }
+        return undefined;
+    }, [actorOptionByValue, parentInitiative]);
+    const activityItems = React.useMemo(() => getEntityActivityItems({
+        activity: detail.item.activity,
+        comments: detail.item.comments,
+    }), [detail.item.activity, detail.item.comments]);
+    const activityCount = activityItems.length;
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: panelStyles.detailHero, children: [detailReferenceLabel ? (_jsxs("div", { className: panelStyles.detailReferenceRow, children: [detail.type === 'workstream' ? (_jsxs(_Fragment, { children: [_jsx(HierarchyActionBadge, { onClick: (event) => {
+                                            event.stopPropagation();
+                                            if (parentInitiativeReferenceLabel) {
+                                                onAssignInitiativeToWorkstream?.(detail.item.id, null);
+                                                return;
+                                            }
+                                            onEdit();
+                                        }, title: parentInitiativeReferenceLabel ? 'Remove from initiative' : 'Attach to initiative', ariaLabel: parentInitiativeReferenceLabel ? 'Remove from initiative' : 'Attach to initiative', children: parentInitiativeReferenceLabel ? _jsx(Unlink, { size: 13 }) : _jsx(Link2, { size: 13 }) }), _jsx("span", { className: styles.taskHierarchyDivider, children: "/" }), parentInitiativeReferenceLabel ? (_jsxs(_Fragment, { children: [_jsx(PlanningReferenceBadge, { label: parentInitiativeReferenceLabel, entityType: "initiative" }), _jsx("span", { className: styles.taskHierarchyDivider, children: "/" })] })) : null] })) : null, _jsx(PlanningReferenceBadge, { label: detailReferenceLabel, entityType: detail.type })] })) : null, _jsx("h3", { className: panelStyles.detailTitle, children: detail.item.title }), _jsx("p", { className: panelStyles.detailDescription, children: detail.item.description?.trim() || (detail.type === 'initiative'
                             ? 'A top-level planning container that groups related workstreams.'
-                            : 'A coordination lane that groups related tasks and keeps execution organized.') }), _jsx("div", { className: panelStyles.progressTrack, "aria-label": `${detail.item.progressPercent}% complete`, children: _jsx("div", { className: panelStyles.progressFill, style: { width: `${detail.item.progressPercent}%` } }) }), _jsxs("div", { className: panelStyles.detailActionRow, children: [_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: onEdit, children: _jsxs("span", { children: ["Edit ", detailLabel] }) }), detail.item.isArchived ? (_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: onUnarchive, children: _jsx("span", { children: "Unarchive" }) })) : (_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: onArchive, children: _jsx("span", { children: "Archive" }) }))] })] }), _jsxs("div", { className: panelStyles.metricGrid, children: [_jsxs("div", { className: panelStyles.metricCard, children: [_jsx("span", { className: panelStyles.metricValue, children: detail.item.taskCount }), _jsx("span", { className: panelStyles.metricLabel, children: "Tasks in scope" })] }), _jsxs("div", { className: panelStyles.metricCard, children: [_jsx("span", { className: panelStyles.metricValue, children: detail.item.completedTaskCount }), _jsx("span", { className: panelStyles.metricLabel, children: "Done / terminal" })] }), _jsxs("div", { className: panelStyles.metricCard, children: [_jsx("span", { className: panelStyles.metricValue, children: detail.item.ownerLabel || 'Unassigned' }), _jsx("span", { className: panelStyles.metricLabel, children: "Owner" })] }), _jsxs("div", { className: panelStyles.metricCard, children: [_jsx("span", { className: panelStyles.metricValue, children: (detail.item.commentCount || 0) + (detail.item.attachmentCount || 0) }), _jsx("span", { className: panelStyles.metricLabel, children: "Context items" })] })] }), _jsxs("div", { ref: setChildDropRef, className: `${panelStyles.listCard} ${canDropTask || canDropWorkstream ? panelStyles.sectionDropReady : ''} ${isChildDropOver ? panelStyles.sectionDropActive : ''} ${canDropTask || canDropWorkstream ? panelStyles.sectionDropMode : ''}`.trim(), children: [_jsxs("div", { className: panelStyles.sectionHeaderRow, children: [_jsx("div", { className: panelStyles.sectionTitle, children: childLabel }), detail.type === 'initiative' ? (_jsx("button", { type: "button", className: "tf-control-icon", title: "Create workstream in this initiative", "aria-label": "Create workstream in this initiative", onClick: () => onCreateWorkstreamInInitiative?.(detail.item.id), children: _jsx(Plus, { size: 15 }) })) : (_jsx("button", { type: "button", className: "tf-control-icon", title: "Create task in this workstream", "aria-label": "Create task in this workstream", onClick: () => onCreateTaskInWorkstream?.(detail.item.id), children: _jsx(Plus, { size: 15 }) }))] }), _jsxs("div", { className: panelStyles.attachReferenceRow, children: [_jsx("input", { type: "text", className: styles.input, placeholder: detail.type === 'initiative'
+                            : 'A coordination lane that groups related tasks and keeps execution organized.') }), _jsx("div", { className: panelStyles.progressTrack, "aria-label": `${detail.item.progressPercent}% complete`, children: _jsx("div", { className: panelStyles.progressFill, style: { width: `${detail.item.progressPercent}%` } }) }), _jsxs("div", { className: panelStyles.detailActionRow, children: [_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: onEdit, children: _jsxs("span", { children: ["Edit ", detailLabel] }) }), detail.item.isArchived ? (_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: onUnarchive, children: _jsx("span", { children: "Unarchive" }) })) : (_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: onArchive, children: _jsx("span", { children: "Archive" }) }))] })] }), _jsxs("div", { className: panelStyles.metricGrid, children: [_jsxs("div", { className: panelStyles.metricCard, children: [_jsx("span", { className: panelStyles.metricValue, children: detail.item.taskCount }), _jsx("span", { className: panelStyles.metricLabel, children: "Tasks in scope" })] }), _jsxs("div", { className: panelStyles.metricCard, children: [_jsx("span", { className: panelStyles.metricValue, children: detail.item.completedTaskCount }), _jsx("span", { className: panelStyles.metricLabel, children: "Done / terminal" })] }), _jsxs("div", { className: panelStyles.metricCard, children: [_jsx("span", { className: panelStyles.metricValue, children: detail.item.ownerLabel || 'Unassigned' }), _jsx("span", { className: panelStyles.metricLabel, children: "Owner" })] }), _jsxs("div", { className: panelStyles.metricCard, children: [_jsx("span", { className: panelStyles.metricValue, children: (detail.item.commentCount || 0) + (detail.item.attachmentCount || 0) }), _jsx("span", { className: panelStyles.metricLabel, children: "Context items" })] })] }), _jsxs("div", { ref: setChildDropRef, className: `${panelStyles.listCard} ${canDropTask || canDropWorkstream ? panelStyles.sectionDropReady : ''} ${isChildDropOver ? panelStyles.sectionDropActive : ''} ${canDropTask || canDropWorkstream ? panelStyles.sectionDropMode : ''}`.trim(), children: [_jsxs("div", { className: panelStyles.sectionHeaderRow, children: [_jsx("div", { className: panelStyles.sectionTitle, children: childLabel }), _jsxs("div", { className: panelStyles.headerActionGroup, children: [archivedChildCount > 0 ? (_jsx("button", { type: "button", className: `tf-control-icon ${showArchivedChildren ? panelStyles.toggleActive : ''}`.trim(), title: showArchivedChildren ? `Hide ${archivedToggleLabel}` : `Show ${archivedToggleLabel}`, "aria-label": showArchivedChildren ? `Hide ${archivedToggleLabel}` : `Show ${archivedToggleLabel}`, "aria-pressed": showArchivedChildren, onClick: () => setShowArchivedChildren((current) => !current), children: showArchivedChildren ? _jsx(EyeOff, { size: 15 }) : _jsx(Eye, { size: 15 }) })) : null, detail.type === 'initiative' ? (_jsx("button", { type: "button", className: "tf-control-icon", title: "Create workstream in this initiative", "aria-label": "Create workstream in this initiative", onClick: () => onCreateWorkstreamInInitiative?.(detail.item.id), children: _jsx(Plus, { size: 15 }) })) : (_jsx("button", { type: "button", className: "tf-control-icon", title: "Create task in this workstream", "aria-label": "Create task in this workstream", onClick: () => onCreateTaskInWorkstream?.(detail.item.id), children: _jsx(Plus, { size: 15 }) }))] })] }), _jsxs("div", { className: panelStyles.attachReferenceRow, children: [_jsx(HierarchyActionBadge, { onClick: (event) => {
+                                    event.stopPropagation();
+                                    handleAttachReference();
+                                }, disabled: !attachReference.trim(), title: attachActionLabel, ariaLabel: attachActionLabel, children: _jsx(Link2, { size: 13 }) }), _jsx("span", { className: styles.taskHierarchyDivider, children: "/" }), _jsx("input", { type: "text", className: `${styles.input} ${panelStyles.attachReferenceInput}`.trim(), placeholder: detail.type === 'initiative'
                                     ? 'Paste workstream reference (e.g. WS-123)'
-                                    : 'Paste task reference (e.g. T-123)', value: attachReference, onChange: (event) => setAttachReference(event.target.value) }), _jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: () => {
-                                    const value = attachReference.trim();
-                                    if (!value)
-                                        return;
-                                    if (detail.type === 'initiative') {
-                                        onAttachWorkstreamToInitiativeByReference?.(detail.item.id, value);
-                                    }
-                                    else {
-                                        onAttachTaskToWorkstreamByReference?.(detail.item.id, value);
+                                    : 'Paste task reference (e.g. T-123)', value: attachReference, onChange: (event) => setAttachReference(event.target.value), onKeyDown: (event) => {
+                                    if (event.key === 'Enter') {
+                                        event.preventDefault();
+                                        handleAttachReference();
                                     }
-                                    setAttachReference('');
-                                }, children: "Attach" })] }), detail.type === 'initiative' ? (childItems.length > 0 ? childItems.map((workstream) => (_jsx("button", { type: "button", className: `${panelStyles.listItemButton} ${panelStyles.detailCardButton}`.trim(), onClick: () => onOpenNestedWorkstreamDetails?.(workstream.id), children: _jsxs("div", { className: `${panelStyles.listItem} ${panelStyles.detailChildCard}`.trim(), children: [_jsx("div", { className: panelStyles.detailChildCardTopRow, children: workstream.referenceNumber ? (_jsx(PlanningReferenceBadge, { label: formatWorkstreamReference(workstream), entityType: "workstream" })) : _jsx("span", { "aria-hidden": "true" }) }), _jsxs("div", { className: panelStyles.listItemText, children: [_jsx("span", { className: panelStyles.listItemTitle, children: workstream.title }), _jsxs("span", { className: panelStyles.listItemMeta, children: [workstream.taskCount, " tasks \u2022 ", workstream.progressPercent, "% complete"] })] })] }) }, workstream.id))) : (_jsxs("div", { className: panelStyles.emptyPanel, children: [_jsx("div", { className: panelStyles.emptyPanelTitle, children: "No workstreams yet" }), _jsx("div", { className: panelStyles.emptyPanelText, children: "Add the first workstream to break the initiative into clearer lanes of execution." })] }))) : (detail.item.tasks && detail.item.tasks.length > 0 ? [...detail.item.tasks]
+                                } })] }), detail.type === 'initiative' ? (visibleChildItems.length > 0 ? visibleChildItems.map((workstream) => {
+                        const workstreamReferenceLabel = formatWorkstreamReference(workstream);
+                        const handleOpenWorkstream = () => onOpenNestedWorkstreamDetails?.(workstream.id);
+                        return (_jsx("div", { className: `${panelStyles.listItemButton} ${panelStyles.detailCardButton}`.trim(), children: _jsxs("div", { className: `${panelStyles.listItem} ${panelStyles.detailChildCard} ${workstream.isArchived ? panelStyles.detailChildCardArchived : ''}`.trim(), children: [_jsx("div", { className: panelStyles.detailChildCardTopRow, children: _jsxs("div", { className: panelStyles.detailChildReferenceRow, children: [_jsx(HierarchyActionBadge, { onClick: (event) => {
+                                                        event.stopPropagation();
+                                                        onAssignInitiativeToWorkstream?.(workstream.id, null);
+                                                    }, title: "Remove from initiative", ariaLabel: "Remove from initiative", children: _jsx(Unlink, { size: 13 }) }), _jsx("span", { className: styles.taskHierarchyDivider, children: "/" }), workstreamReferenceLabel ? (_jsx(PlanningReferenceBadge, { label: workstreamReferenceLabel, entityType: "workstream" })) : _jsx("span", { "aria-hidden": "true" })] }) }), _jsxs("div", { role: "button", tabIndex: 0, className: panelStyles.listItemText, onClick: handleOpenWorkstream, onKeyDown: (event) => {
+                                            if (event.key !== 'Enter' && event.key !== ' ')
+                                                return;
+                                            event.preventDefault();
+                                            handleOpenWorkstream();
+                                        }, children: [_jsx("span", { className: panelStyles.listItemTitle, children: workstream.title }), _jsxs("span", { className: panelStyles.listItemMeta, children: [workstream.taskCount, " tasks \u2022 ", workstream.progressPercent, "% complete", workstream.isArchived ? ' • archived' : ''] })] })] }) }, workstream.id));
+                    }) : (_jsxs("div", { className: panelStyles.emptyPanel, children: [_jsx("div", { className: panelStyles.emptyPanelTitle, children: "No workstreams yet" }), _jsx("div", { className: panelStyles.emptyPanelText, children: "Add the first workstream to break the initiative into clearer lanes of execution." })] }))) : (visibleTaskItems.length > 0 ? [...visibleTaskItems]
                         .sort((left, right) => {
                         const leftDone = getStatusDefinition(left.status).value === 'done';
                         const rightDone = getStatusDefinition(right.status).value === 'done';
@@ -172,25 +350,49 @@ function PlanningDrawerDetailView({ detail, currentWorkspaceId, onOpenNestedWork
                         const statusDefinition = getStatusDefinition(task.status);
                         const StatusIcon = IconMap[statusDefinition.icon || 'Square'];
                         const statusColor = resolveColor(statusDefinition.color) || 'var(--text-secondary)';
-                        return (_jsx("button", { type: "button", className: `${panelStyles.listItemButton} ${panelStyles.detailCardButton}`.trim(), onClick: () => onOpenTaskById?.(task.id), children: _jsxs("div", { className: `${panelStyles.listItem} ${panelStyles.detailChildCard}`.trim(), children: [_jsxs("div", { className: panelStyles.detailChildCardTopRow, children: [referenceLabel ? (_jsx(PlanningReferenceBadge, { label: referenceLabel, entityType: "task" })) : _jsx("span", { "aria-hidden": "true" }), _jsx("span", { className: panelStyles.taskStatusIcon, style: {
+                        const handleOpenTask = () => onOpenTaskById?.(task.id);
+                        const taskMeta = `${formatTaskStatusLabel(task.status)}${task.isArchived ? ' • archived' : ''}`;
+                        return (_jsx("div", { className: `${panelStyles.listItemButton} ${panelStyles.detailCardButton}`.trim(), children: _jsxs("div", { className: `${panelStyles.listItem} ${panelStyles.detailChildCard} ${task.isArchived ? panelStyles.detailChildCardArchived : ''}`.trim(), children: [_jsxs("div", { className: panelStyles.detailChildCardTopRow, children: [_jsxs("div", { className: panelStyles.detailChildReferenceRow, children: [_jsx(HierarchyActionBadge, { onClick: (event) => {
+                                                            event.stopPropagation();
+                                                            onRemoveTaskFromWorkstream?.(task.id, detail.item.id);
+                                                        }, title: "Remove from workstream", ariaLabel: "Remove from workstream", children: _jsx(Unlink, { size: 13 }) }), _jsx("span", { className: styles.taskHierarchyDivider, children: "/" }), referenceLabel ? (_jsx(PlanningReferenceBadge, { label: referenceLabel, entityType: "task" })) : _jsx("span", { "aria-hidden": "true" })] }), _jsx("span", { className: panelStyles.taskStatusIcon, style: {
                                                     color: statusColor,
-                                                }, "aria-label": statusDefinition.shortLabel || formatTaskStatusLabel(task.status), title: statusDefinition.shortLabel || formatTaskStatusLabel(task.status), children: StatusIcon ? _jsx(StatusIcon, { size: 18, strokeWidth: 2.4 }) : null })] }), _jsxs("div", { className: panelStyles.listItemText, children: [_jsx("span", { className: panelStyles.listItemTitle, children: task.title }), _jsx("span", { className: panelStyles.listItemMeta, children: formatTaskStatusLabel(task.status) })] })] }) }, task.id));
-                    }) : (_jsxs("div", { className: panelStyles.sectionNote, children: ["No tasks are linked to this workstream yet. Use the ", _jsx("code", { children: "+" }), " action above to add the first one."] })))] }), _jsx("div", { className: panelStyles.listCard, children: _jsx(ContextAttachmentManager, { ownerType: detail.type, ownerId: detail.item.id, ownerReferenceLabel: detailReferenceLabel, workspaceId: currentWorkspaceId, attachments: detail.item.attachments || [], onAddAttachment: (file) => onAddPlanningContextFile?.(detail.type, detail.item.id, file), onRemoveAttachment: (index) => onRemovePlanningContextFile?.(detail.type, detail.item.id, index), onUpdateAttachmentCaption: (index, caption) => (onUpdatePlanningContextCaption?.(detail.type, detail.item.id, index, caption)) }) })] }));
+                                                }, "aria-label": statusDefinition.shortLabel || formatTaskStatusLabel(task.status), title: statusDefinition.shortLabel || formatTaskStatusLabel(task.status), children: StatusIcon ? _jsx(StatusIcon, { size: 18, strokeWidth: 2.4 }) : null })] }), _jsxs("div", { role: "button", tabIndex: 0, className: panelStyles.listItemText, onClick: handleOpenTask, onKeyDown: (event) => {
+                                            if (event.key !== 'Enter' && event.key !== ' ')
+                                                return;
+                                            event.preventDefault();
+                                            handleOpenTask();
+                                        }, children: [_jsx("span", { className: panelStyles.listItemTitle, children: task.title }), _jsx("span", { className: panelStyles.listItemMeta, children: taskMeta })] })] }) }, task.id));
+                    }) : (_jsxs("div", { className: panelStyles.sectionNote, children: ["No tasks are linked to this workstream yet. Use the ", _jsx("code", { children: "+" }), " action above to add the first one."] })))] }), _jsx("div", { className: panelStyles.listCard, children: _jsx(React.Suspense, { fallback: _jsx(DeferredPlanningPanelFallback, {}), children: _jsx(DeferredContextAttachmentManager, { ownerType: detail.type, ownerId: detail.item.id, ownerReferenceLabel: detailReferenceLabel, workspaceId: currentWorkspaceId, attachments: detail.item.attachments || [], onAddAttachment: (file) => onAddPlanningContextFile?.(detail.type, detail.item.id, file), onRemoveAttachment: (index) => onRemovePlanningContextFile?.(detail.type, detail.item.id, index), onUpdateAttachmentCaption: (index, caption) => (onUpdatePlanningContextCaption?.(detail.type, detail.item.id, index, caption)) }) }) }), _jsxs("div", { className: panelStyles.listCard, children: [_jsxs("button", { type: "button", className: panelStyles.sectionToggleButton, onClick: () => setShowRecentActivity((current) => !current), "aria-expanded": showRecentActivity, title: showRecentActivity ? 'Hide recent activity' : 'Show recent activity', children: [_jsxs("span", { className: panelStyles.sectionTitle, children: ["Recent activity (", activityCount, ")"] }), showRecentActivity ? _jsx(ChevronDown, { size: 14 }) : _jsx(ChevronRight, { size: 14 })] }), showRecentActivity ? (_jsx(React.Suspense, { fallback: _jsx(DeferredPlanningPanelFallback, {}), children: _jsx(DeferredEntityActivityTimeline, { activity: detail.item.activity, comments: detail.item.comments, formatFieldValue: formatActivityFieldValue, resolveActorPresentation: resolveActivityActorPresentation, onOpenTaskById: onOpenTaskById, emptyMessage: `No ${detail.type} activity yet.`, listClassName: panelStyles.activityTimelineList, emptyClassName: panelStyles.activityTimelineEmpty }) })) : null] })] }));
 }
 function PlanningDrawerEditor({ editor, draftTitle, draftDescription, draftOwner, draftInitiativeId, assigneeOptions, draftInitiativeSummary, onChangeDraftTitle, onChangeDraftDescription, onChangeDraftOwner, onChangeDraftInitiativeId, onCancel, onSubmit, isSubmitting, onAssignInitiativeToWorkstream, }) {
     const entityLabel = editor.entityType === 'initiative' ? 'Initiative' : 'Workstream';
     const submitLabel = isSubmitting
         ? (editor.mode === 'create' ? `Creating ${entityLabel}...` : `Saving ${entityLabel}...`)
         : (editor.mode === 'create' ? `Create ${entityLabel}` : `Save ${entityLabel}`);
+    const ownerOptions = React.useMemo(() => normalizePlanningOwnerOptions(assigneeOptions, draftOwner), [assigneeOptions, draftOwner]);
     const handleSubmit = React.useCallback((event) => {
         event.preventDefault();
         onSubmit();
     }, [onSubmit]);
+    const handleSetInitiative = React.useCallback(() => {
+        if (editor.mode !== 'edit' || editor.entityType !== 'workstream')
+            return;
+        onAssignInitiativeToWorkstream?.(editor.targetId);
+    }, [editor, onAssignInitiativeToWorkstream]);
     return (_jsxs("form", { className: panelStyles.editorCard, onSubmit: handleSubmit, children: [_jsxs("div", { className: panelStyles.editorField, children: [_jsx("label", { className: panelStyles.editorLabel, children: "Title" }), _jsx("input", { className: styles.input, disabled: isSubmitting, value: draftTitle, onChange: (event) => onChangeDraftTitle(event.target.value), placeholder: editor.entityType === 'initiative' ? 'Q3 Product Launch' : 'Content Production' })] }), _jsxs("div", { className: panelStyles.editorField, children: [_jsx("label", { className: panelStyles.editorLabel, children: "Description" }), _jsx("textarea", { className: styles.textarea, disabled: isSubmitting, value: draftDescription, onChange: (event) => onChangeDraftDescription(event.target.value), placeholder: editor.entityType === 'initiative'
                             ? 'Describe the broader outcome this initiative is meant to achieve.'
-                            : 'Describe the lane of work this workstream will coordinate.', rows: 5 })] }), editor.entityType === 'workstream' && (_jsxs("div", { className: panelStyles.editorField, children: [_jsx("label", { className: panelStyles.editorLabel, children: "Initiative" }), draftInitiativeSummary && (_jsxs("div", { className: panelStyles.editorHint, children: ["Current: ", draftInitiativeSummary.title] })), _jsxs("div", { className: styles.pathInputGroup, children: [_jsx("input", { type: "text", className: styles.input, disabled: isSubmitting, placeholder: "Paste initiative reference (e.g. IN-123)", value: draftInitiativeId, onChange: (event) => onChangeDraftInitiativeId(event.target.value) }), editor.mode === 'edit' && (_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, disabled: isSubmitting, onClick: () => onAssignInitiativeToWorkstream?.(editor.targetId), children: "Set Initiative" }))] }), editor.mode === 'edit' && (_jsx("div", { className: panelStyles.editorSubActions, children: _jsx("button", { type: "button", className: styles.secondaryHeaderBtn, disabled: isSubmitting, onClick: () => onAssignInitiativeToWorkstream?.(editor.targetId, null), children: "Clear Initiative" }) }))] })), _jsxs("div", { className: panelStyles.editorField, children: [_jsx("label", { className: panelStyles.editorLabel, children: "Owner" }), _jsxs("select", { className: `${styles.select} ${styles.groupBySelect}`, disabled: isSubmitting, value: draftOwner, onChange: (event) => onChangeDraftOwner(event.target.value), children: [_jsx("option", { value: "", children: "Unassigned" }), assigneeOptions.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] })] }), _jsxs("div", { className: panelStyles.editorActions, children: [_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: onCancel, disabled: isSubmitting, children: "Cancel" }), _jsx("button", { type: "submit", className: styles.primaryUpdateBtn, disabled: isSubmitting, children: submitLabel })] })] }));
+                            : 'Describe the lane of work this workstream will coordinate.', rows: 5 })] }), editor.entityType === 'workstream' && (_jsxs("div", { className: panelStyles.editorField, children: [_jsx("label", { className: panelStyles.editorLabel, children: "Initiative" }), draftInitiativeSummary && (_jsxs("div", { className: panelStyles.editorHint, children: ["Current: ", draftInitiativeSummary.title] })), _jsxs("div", { className: panelStyles.attachReferenceRow, children: [editor.mode === 'edit' && (_jsxs(_Fragment, { children: [_jsx(HierarchyActionBadge, { onClick: (event) => {
+                                            event.stopPropagation();
+                                            handleSetInitiative();
+                                        }, disabled: isSubmitting || !draftInitiativeId.trim(), title: "Attach workstream to initiative", ariaLabel: "Attach workstream to initiative", children: _jsx(Link2, { size: 13 }) }), _jsx("span", { className: styles.taskHierarchyDivider, children: "/" })] })), _jsx("input", { type: "text", className: `${styles.input} ${panelStyles.attachReferenceInput}`.trim(), disabled: isSubmitting, placeholder: "Paste initiative reference (e.g. IN-123)", value: draftInitiativeId, onChange: (event) => onChangeDraftInitiativeId(event.target.value), onKeyDown: (event) => {
+                                    if (event.key !== 'Enter')
+                                        return;
+                                    event.preventDefault();
+                                    handleSetInitiative();
+                                } })] })] })), _jsxs("div", { className: panelStyles.editorField, children: [_jsx("label", { className: panelStyles.editorLabel, children: "Owner" }), _jsxs("select", { className: `${styles.select} ${styles.groupBySelect}`, disabled: isSubmitting, value: draftOwner, onChange: (event) => onChangeDraftOwner(event.target.value), children: [_jsx("option", { value: "", children: "Unassigned" }), ownerOptions.map((option) => (_jsx("option", { value: option.value, children: option.label }, option.value)))] })] }), _jsxs("div", { className: panelStyles.editorActions, children: [_jsx("button", { type: "button", className: styles.secondaryHeaderBtn, onClick: onCancel, disabled: isSubmitting, children: "Cancel" }), _jsx("button", { type: "submit", className: styles.primaryUpdateBtn, disabled: isSubmitting, children: submitLabel })] })] }));
 }
-export function PlanningDrawer({ open, leftOffset = 0, initiatives, standaloneWorkstreams, activeInitiativeId, activeWorkstreamId, expandedInitiativeIds, detail, editor, secondaryPane, currentWorkspaceId, assigneeOptions, draftInitiativeSummary, draftTitle, draftDescription, draftOwner, draftInitiativeId, onChangeDraftTitle, onChangeDraftDescription, onChangeDraftOwner, onChangeDraftInitiativeId, onCollapseTreePane, onExpandTreePane, onCollapsePrimaryPane, onExpandPrimaryPane, onCollapseSecondaryPane, onExpandSecondaryPane, onBackFromSecondary, treeCollapsed, primaryCollapsed, secondaryCollapsed, onCancelEditor, onSubmitEditor, isSubmittingEditor, onCreateInitiative, onCreateWorkstream, onToggleInitiative, onSelectInitiative, onSelectWorkstream, onOpenInitiativeDetails, onOpenWorkstreamDetails, onOpenNestedWorkstreamDetails, onEditInitiative, onEditWorkstream, onArchiveInitiative, onUnarchiveInitiative, onArchiveWorkstream, onUnarchiveWorkstream, onCreateTaskInWorkstream, onCreateWorkstreamInInitiative, onAssignInitiativeToWorkstream, onOpenTaskById, onAttachTaskToWorkstreamByReference, onAttachWorkstreamToInitiativeByReference, onAddPlanningContextFile, onRemovePlanningContextFile, onUpdatePlanningContextCaption, }) {
+export function PlanningDrawer({ open, leftOffset = 0, initiatives, standaloneWorkstreams, allStandaloneWorkstreams, activeInitiativeId, activeWorkstreamId, expandedInitiativeIds, detail, editor, secondaryPane, currentWorkspaceId, assigneeOptions, draftInitiativeSummary, draftTitle, draftDescription, draftOwner, draftInitiativeId, onChangeDraftTitle, onChangeDraftDescription, onChangeDraftOwner, onChangeDraftInitiativeId, onCollapseTreePane, onExpandTreePane, onCollapsePrimaryPane, onExpandPrimaryPane, onCollapseSecondaryPane, onExpandSecondaryPane, onBackFromSecondary, treeCollapsed, primaryCollapsed, secondaryCollapsed, onCancelEditor, onSubmitEditor, isSubmittingEditor, onCreateInitiative, onCreateWorkstream, onToggleInitiative, onSelectInitiative, onSelectWorkstream, onOpenInitiativeDetails, onOpenWorkstreamDetails, onOpenNestedWorkstreamDetails, onEditInitiative, onEditWorkstream, onArchiveInitiative, onUnarchiveInitiative, onArchiveWorkstream, onUnarchiveWorkstream, onCreateTaskInWorkstream, onCreateWorkstreamInInitiative, onAssignInitiativeToWorkstream, onOpenTaskById, onRemoveTaskFromWorkstream, onAttachTaskToWorkstreamByReference, onAttachWorkstreamToInitiativeByReference, onAddPlanningContextFile, onRemovePlanningContextFile, onUpdatePlanningContextCaption, }) {
     const hasPrimaryPane = Boolean(detail || editor);
     const hasSecondaryPane = Boolean(secondaryPane);
     const drawerWidth = getPlanningDrawerWidthPx(treeCollapsed, hasPrimaryPane, primaryCollapsed, hasSecondaryPane, secondaryCollapsed);
@@ -202,6 +404,12 @@ export function PlanningDrawer({ open, leftOffset = 0, initiatives, standaloneWo
     const secondaryPaneLabel = secondaryPane?.kind === 'editor'
         ? (secondaryPane.editor.mode === 'create' ? 'New Workstream' : 'Edit Workstream')
         : 'Workstream';
+    const resolveParentInitiative = React.useCallback((workstream) => {
+        const initiativeId = String(workstream.initiativeId || '').trim();
+        if (!initiativeId)
+            return null;
+        return initiatives.find((initiative) => initiative.id === initiativeId) || null;
+    }, [initiatives]);
     return (_jsx("aside", { style: {
             position: 'absolute',
             top: 0,
@@ -224,12 +432,12 @@ export function PlanningDrawer({ open, leftOffset = 0, initiatives, standaloneWo
                         width: `${PLANNING_DRAWER_TREE_WIDTH_PX}px`,
                         minWidth: `${PLANNING_DRAWER_TREE_WIDTH_PX}px`,
                         maxWidth: `${PLANNING_DRAWER_TREE_WIDTH_PX}px`,
-                    }, children: [_jsxs("div", { className: panelStyles.paneHeader, children: [_jsx("span", { className: panelStyles.paneHeaderLabel, children: "Planning" }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: onCollapseTreePane, children: _jsx(ChevronLeft, { size: 16 }) })] }), _jsx("div", { className: panelStyles.paneContent, children: _jsx(PlanningDrawerList, { initiatives: initiatives, standaloneWorkstreams: standaloneWorkstreams, activeInitiativeId: activeInitiativeId, activeWorkstreamId: activeWorkstreamId, expandedInitiativeIds: expandedInitiativeIds, detail: detail, secondaryPane: secondaryPane, onCreateInitiative: onCreateInitiative, onCreateWorkstream: onCreateWorkstream, onToggleInitiative: onToggleInitiative, onSelectInitiative: onSelectInitiative, onSelectWorkstream: onSelectWorkstream, onOpenInitiativeDetails: onOpenInitiativeDetails, onOpenWorkstreamDetails: onOpenWorkstreamDetails }) })] })), hasPrimaryPane && (primaryCollapsed ? (_jsx(CollapsedPane, { label: primaryPaneLabel, onExpand: onExpandPrimaryPane })) : (_jsxs("div", { className: `${panelStyles.paneShell} ${styles.appScrollbar} tf-scrollbar ${panelStyles.detailPane}`.trim(), style: {
+                    }, children: [_jsxs("div", { className: panelStyles.paneHeader, children: [_jsx("span", { className: panelStyles.paneHeaderLabel, children: "Planning" }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: onCollapseTreePane, children: _jsx(ChevronLeft, { size: 16 }) })] }), _jsx("div", { className: panelStyles.paneContent, children: _jsx(PlanningDrawerList, { initiatives: initiatives, standaloneWorkstreams: standaloneWorkstreams, allStandaloneWorkstreams: allStandaloneWorkstreams, activeInitiativeId: activeInitiativeId, activeWorkstreamId: activeWorkstreamId, expandedInitiativeIds: expandedInitiativeIds, detail: detail, secondaryPane: secondaryPane, onCreateInitiative: onCreateInitiative, onCreateWorkstream: onCreateWorkstream, onToggleInitiative: onToggleInitiative, onSelectInitiative: onSelectInitiative, onSelectWorkstream: onSelectWorkstream, onOpenInitiativeDetails: onOpenInitiativeDetails, onOpenWorkstreamDetails: onOpenWorkstreamDetails }) })] })), hasPrimaryPane && (primaryCollapsed ? (_jsx(CollapsedPane, { label: primaryPaneLabel, onExpand: onExpandPrimaryPane })) : (_jsxs("div", { className: `${panelStyles.paneShell} ${styles.appScrollbar} tf-scrollbar ${panelStyles.detailPane}`.trim(), style: {
                         flex: `0 0 ${PLANNING_DRAWER_DETAIL_WIDTH_PX}px`,
                         width: `${PLANNING_DRAWER_DETAIL_WIDTH_PX}px`,
                         minWidth: `${PLANNING_DRAWER_DETAIL_WIDTH_PX}px`,
                         maxWidth: `${PLANNING_DRAWER_DETAIL_WIDTH_PX}px`,
-                    }, children: [_jsxs("div", { className: panelStyles.paneHeader, children: [_jsx("span", { className: panelStyles.paneHeaderLabel, children: primaryPaneLabel }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: onCollapsePrimaryPane, children: _jsx(ChevronLeft, { size: 16 }) })] }), _jsx("div", { className: panelStyles.paneContent, children: editor ? (_jsx(PlanningDrawerEditor, { editor: editor, draftTitle: draftTitle, draftDescription: draftDescription, draftOwner: draftOwner, draftInitiativeId: draftInitiativeId, assigneeOptions: assigneeOptions, draftInitiativeSummary: draftInitiativeSummary, onChangeDraftTitle: onChangeDraftTitle, onChangeDraftDescription: onChangeDraftDescription, onChangeDraftOwner: onChangeDraftOwner, onChangeDraftInitiativeId: onChangeDraftInitiativeId, onCancel: onCancelEditor, onSubmit: onSubmitEditor, isSubmitting: isSubmittingEditor, onAssignInitiativeToWorkstream: onAssignInitiativeToWorkstream })) : detail ? (_jsx(PlanningDrawerDetailView, { detail: detail, currentWorkspaceId: currentWorkspaceId, onOpenNestedWorkstreamDetails: detail.type === 'initiative' ? onOpenNestedWorkstreamDetails : undefined, onCreateTaskInWorkstream: detail.type === 'workstream' ? onCreateTaskInWorkstream : undefined, onCreateWorkstreamInInitiative: detail.type === 'initiative' ? onCreateWorkstreamInInitiative : undefined, onOpenTaskById: detail.type === 'workstream' ? onOpenTaskById : undefined, onAttachTaskToWorkstreamByReference: detail.type === 'workstream' ? onAttachTaskToWorkstreamByReference : undefined, onAttachWorkstreamToInitiativeByReference: detail.type === 'initiative' ? onAttachWorkstreamToInitiativeByReference : undefined, onEdit: () => detail.type === 'initiative'
+                    }, children: [_jsxs("div", { className: panelStyles.paneHeader, children: [_jsx("span", { className: panelStyles.paneHeaderLabel, children: primaryPaneLabel }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: onCollapsePrimaryPane, children: _jsx(ChevronLeft, { size: 16 }) })] }), _jsx("div", { className: panelStyles.paneContent, children: editor ? (_jsx(PlanningDrawerEditor, { editor: editor, draftTitle: draftTitle, draftDescription: draftDescription, draftOwner: draftOwner, draftInitiativeId: draftInitiativeId, assigneeOptions: assigneeOptions, draftInitiativeSummary: draftInitiativeSummary, onChangeDraftTitle: onChangeDraftTitle, onChangeDraftDescription: onChangeDraftDescription, onChangeDraftOwner: onChangeDraftOwner, onChangeDraftInitiativeId: onChangeDraftInitiativeId, onCancel: onCancelEditor, onSubmit: onSubmitEditor, isSubmitting: isSubmittingEditor, onAssignInitiativeToWorkstream: onAssignInitiativeToWorkstream })) : detail ? (_jsx(PlanningDrawerDetailView, { detail: detail, currentWorkspaceId: currentWorkspaceId, assigneeOptions: assigneeOptions, onOpenNestedWorkstreamDetails: detail.type === 'initiative' ? onOpenNestedWorkstreamDetails : undefined, onCreateTaskInWorkstream: detail.type === 'workstream' ? onCreateTaskInWorkstream : undefined, onCreateWorkstreamInInitiative: detail.type === 'initiative' ? onCreateWorkstreamInInitiative : undefined, onOpenTaskById: detail.type === 'workstream' ? onOpenTaskById : undefined, onRemoveTaskFromWorkstream: detail.type === 'workstream' ? onRemoveTaskFromWorkstream : undefined, onAssignInitiativeToWorkstream: onAssignInitiativeToWorkstream, onAttachTaskToWorkstreamByReference: detail.type === 'workstream' ? onAttachTaskToWorkstreamByReference : undefined, onAttachWorkstreamToInitiativeByReference: detail.type === 'initiative' ? onAttachWorkstreamToInitiativeByReference : undefined, parentInitiative: detail.type === 'workstream' ? resolveParentInitiative(detail.item) : null, onEdit: () => detail.type === 'initiative'
                                     ? onEditInitiative(detail.item.id)
                                     : onEditWorkstream(detail.item.id), onArchive: () => detail.type === 'initiative'
                                     ? onArchiveInitiative(detail.item.id)
@@ -240,5 +448,5 @@ export function PlanningDrawer({ open, leftOffset = 0, initiatives, standaloneWo
                         width: `${PLANNING_DRAWER_DETAIL_WIDTH_PX}px`,
                         minWidth: `${PLANNING_DRAWER_DETAIL_WIDTH_PX}px`,
                         maxWidth: `${PLANNING_DRAWER_DETAIL_WIDTH_PX}px`,
-                    }, children: [_jsxs("div", { className: panelStyles.paneHeader, children: [_jsx("span", { className: panelStyles.paneHeaderLabel, children: secondaryPaneLabel }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: onCollapseSecondaryPane, children: _jsx(ChevronLeft, { size: 16 }) })] }), _jsx("div", { className: panelStyles.paneContent, children: secondaryPane?.kind === 'editor' ? (_jsx(PlanningDrawerEditor, { editor: secondaryPane.editor, draftTitle: draftTitle, draftDescription: draftDescription, draftOwner: draftOwner, draftInitiativeId: draftInitiativeId, assigneeOptions: assigneeOptions, draftInitiativeSummary: draftInitiativeSummary, onChangeDraftTitle: onChangeDraftTitle, onChangeDraftDescription: onChangeDraftDescription, onChangeDraftOwner: onChangeDraftOwner, onChangeDraftInitiativeId: onChangeDraftInitiativeId, onCancel: onBackFromSecondary, onSubmit: onSubmitEditor, isSubmitting: isSubmittingEditor, onAssignInitiativeToWorkstream: onAssignInitiativeToWorkstream })) : secondaryPane ? (_jsx(PlanningDrawerDetailView, { detail: secondaryPane.detail, currentWorkspaceId: currentWorkspaceId, onCreateTaskInWorkstream: onCreateTaskInWorkstream, onOpenTaskById: onOpenTaskById, onAttachTaskToWorkstreamByReference: onAttachTaskToWorkstreamByReference, onEdit: () => onEditWorkstream(secondaryPane.detail.item.id), onArchive: () => onArchiveWorkstream(secondaryPane.detail.item.id), onUnarchive: () => onUnarchiveWorkstream(secondaryPane.detail.item.id), onAddPlanningContextFile: onAddPlanningContextFile, onRemovePlanningContextFile: onRemovePlanningContextFile, onUpdatePlanningContextCaption: onUpdatePlanningContextCaption })) : null })] })))] }) }));
+                    }, children: [_jsxs("div", { className: panelStyles.paneHeader, children: [_jsx("span", { className: panelStyles.paneHeaderLabel, children: secondaryPaneLabel }), _jsx("button", { type: "button", className: "tf-control-icon", onClick: onCollapseSecondaryPane, children: _jsx(ChevronLeft, { size: 16 }) })] }), _jsx("div", { className: panelStyles.paneContent, children: secondaryPane?.kind === 'editor' ? (_jsx(PlanningDrawerEditor, { editor: secondaryPane.editor, draftTitle: draftTitle, draftDescription: draftDescription, draftOwner: draftOwner, draftInitiativeId: draftInitiativeId, assigneeOptions: assigneeOptions, draftInitiativeSummary: draftInitiativeSummary, onChangeDraftTitle: onChangeDraftTitle, onChangeDraftDescription: onChangeDraftDescription, onChangeDraftOwner: onChangeDraftOwner, onChangeDraftInitiativeId: onChangeDraftInitiativeId, onCancel: onBackFromSecondary, onSubmit: onSubmitEditor, isSubmitting: isSubmittingEditor, onAssignInitiativeToWorkstream: onAssignInitiativeToWorkstream })) : secondaryPane ? (_jsx(PlanningDrawerDetailView, { detail: secondaryPane.detail, currentWorkspaceId: currentWorkspaceId, assigneeOptions: assigneeOptions, onCreateTaskInWorkstream: onCreateTaskInWorkstream, onOpenTaskById: onOpenTaskById, onRemoveTaskFromWorkstream: onRemoveTaskFromWorkstream, onAssignInitiativeToWorkstream: onAssignInitiativeToWorkstream, onAttachTaskToWorkstreamByReference: onAttachTaskToWorkstreamByReference, parentInitiative: resolveParentInitiative(secondaryPane.detail.item), onEdit: () => onEditWorkstream(secondaryPane.detail.item.id), onArchive: () => onArchiveWorkstream(secondaryPane.detail.item.id), onUnarchive: () => onUnarchiveWorkstream(secondaryPane.detail.item.id), onAddPlanningContextFile: onAddPlanningContextFile, onRemovePlanningContextFile: onRemovePlanningContextFile, onUpdatePlanningContextCaption: onUpdatePlanningContextCaption })) : null })] })))] }) }));
 }