@taskforcehq/taskforce 0.3.170 → 0.3.300

package/dist/components/task/TaskKanban.js

@@ -6,27 +6,49 @@ import { CSS } from '@dnd-kit/utilities';
 import { createPortal } from 'react-dom';
 import styles from '../../Taskforce.module.css';
 import { TaskCard } from './TaskCard';
-import { isDropInCenterZone } from '../../utils/taskDragZones';
-import { shouldPromptReparent, wouldCreateParentCycle } from '../../utils/taskParenting';
-import { buildHierarchyDepthMap } from '../../utils/taskHierarchy';
-import { sortChildTasksForDisplay } from '../../utils/taskRelations';
+import { compareTasksBySortKey } from '../../utils/taxonomySorting.js';
 import * as Icons from 'lucide-react';
 import { IconMap, resolveColor } from '../../utils/constants';
 const EXPIRED_CARD_ID_PREFIX = 'expired::';
-export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery, copiedId, availableSpecialists, taxonomies, priorities, approaches, onUpdateTask, onTaskClick, onOpenTaskById, onCopyId, onToggleInProgress, onToggleReview, onToggleComplete, onToggleCancel, onArchiveTask, onUnarchive, onDelete, onUnlinkChildTask, onClearParentTask, allTasks = [], hierarchyTasks = [], onAddTaskToColumn, emptyColumnMode = 'show', filterCategories = [], filterTypes = [], filterPriorities = [], filterStatus = [], filterAssignees = ['agent', 'user', 'unassigned'], assigneeFilterEnabled = false, scheduleFilteredTaskIds, categories = [], compressed = false, recentlyChangedTaskIds = [], scheduleDates, onScheduleDaySelected, onScheduleParentDrop, hierarchyChildOrderMode = 'manual', persistedScrollLeft, onScrollLeftChange, sortBy = 'created', sortOrder = 'desc' }) {
+export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery, copiedId, taxonomies, types, priorities, approaches, assigneeOptions = [], onUpdateTask, onTaskClick, onOpenTaskById, onCopyId, onToggleInProgress, onToggleReview, onToggleComplete, onToggleCancel, onSetStatus, onArchiveTask, onUnarchive, onDelete, allTasks = [], onAddTaskToColumn, emptyColumnMode = 'show', filterCategories = [], filterTypes = [], filterPriorities = [], filterStatus = [], filterAssignees = [], scheduleFilteredTaskIds, categories = [], compressed = false, readOnlyMode = null, recentlyChangedTaskIds = [], scheduleDates, onScheduleDaySelected, persistedScrollLeft, onScrollLeftChange, sortBy = 'created', sortOrder = 'desc', planningDropTargets = null, onAssignTaskToWorkstream, onAssignWorkstreamToInitiative, showTaskCardStatusLabel = true, workstreams = [], initiatives = [], }) {
     const [activeId, setActiveId] = useState(null);
-    const [recentlyLinkedParentIds, setRecentlyLinkedParentIds] = useState([]);
-    const [currentParentDropTargetId, setCurrentParentDropTargetId] = useState(null);
     const [isHeaderPanning, setIsHeaderPanning] = useState(false);
     const [headerPanEnabled, setHeaderPanEnabled] = useState(false);
     const changedTaskIdSet = useMemo(() => new Set(recentlyChangedTaskIds), [recentlyChangedTaskIds]);
+    const workstreamById = useMemo(() => new Map(workstreams.map((workstream) => [workstream.id, workstream])), [workstreams]);
+    const initiativeById = useMemo(() => new Map(initiatives.map((initiative) => [initiative.id, initiative])), [initiatives]);
+    const resolveTaskHierarchy = useCallback((task) => {
+        const taskWorkstream = task.workstreamId ? workstreamById.get(task.workstreamId) || null : null;
+        const taskInitiative = taskWorkstream?.initiativeId ? initiativeById.get(taskWorkstream.initiativeId) || null : null;
+        return { taskWorkstream, taskInitiative };
+    }, [initiativeById, workstreamById]);
     const taskIdSet = useMemo(() => new Set(tasks.map(t => t.id)), [tasks]);
     const getTaskIdFromCardId = useCallback((cardId) => (cardId.startsWith(EXPIRED_CARD_ID_PREFIX)
         ? cardId.slice(EXPIRED_CARD_ID_PREFIX.length)
         : cardId), []);
     const isTaskCardId = useCallback((id) => taskIdSet.has(getTaskIdFromCardId(id)), [taskIdSet, getTaskIdFromCardId]);
     const scheduleFilteredTaskIdSet = useMemo(() => new Set(scheduleFilteredTaskIds || []), [scheduleFilteredTaskIds]);
-    const linkFeedbackTimersRef = useRef(new Map());
+    const lastPlanningOverRef = useRef(null);
+    const resolveActiveDragMeta = useCallback((activeLike) => {
+        const current = activeLike?.data?.current || {};
+        const activeId = String(activeLike?.id || '');
+        let taskId = String(current.taskId || '');
+        let workstreamId = String(current.workstreamId || '');
+        if (!taskId && activeId && isTaskCardId(activeId)) {
+            taskId = getTaskIdFromCardId(activeId);
+        }
+        if (!workstreamId && activeId.startsWith('planning-workstream:')) {
+            workstreamId = activeId.slice('planning-workstream:'.length);
+        }
+        let type = String(current.type || '');
+        if (!type) {
+            if (taskId)
+                type = 'task-card';
+            else if (workstreamId)
+                type = 'planning-workstream';
+        }
+        return { activeId, type, taskId, workstreamId };
+    }, [getTaskIdFromCardId, isTaskCardId]);
     // Sensors
     const sensors = useSensors(useSensor(PointerSensor, {
         activationConstraint: {
@@ -111,35 +133,6 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
         ]);
         return dateToColumn.get(scheduledDate) || '__offweek';
     };
-    const hierarchyDepthSource = hierarchyTasks.length > 0
-        ? hierarchyTasks
-        : (allTasks.length > 0 ? allTasks : tasks);
-    const hierarchyDepthMap = useMemo(() => buildHierarchyDepthMap(hierarchyDepthSource), [hierarchyDepthSource]);
-    const hierarchyParentIdSet = useMemo(() => {
-        const set = new Set();
-        for (const task of hierarchyDepthSource) {
-            if (task.parentTaskId)
-                set.add(task.parentTaskId);
-        }
-        return set;
-    }, [hierarchyDepthSource]);
-    const childrenByParentId = useMemo(() => {
-        const map = new Map();
-        for (const task of hierarchyDepthSource) {
-            if (!task.parentTaskId)
-                continue;
-            const list = map.get(task.parentTaskId) || [];
-            list.push(task);
-            map.set(task.parentTaskId, list);
-        }
-        return map;
-    }, [hierarchyDepthSource]);
-    const getHierarchyColumnValue = (task) => {
-        const isStandalone = !task.parentTaskId && !hierarchyParentIdSet.has(task.id);
-        if (isStandalone)
-            return 'standalone';
-        return String((hierarchyDepthMap.get(task.id) ?? 0) + 1);
-    };
     const columnLookup = useMemo(() => {
         const map = new Map();
         for (const column of kanbanColumns) {
@@ -154,7 +147,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
     const columnTotals = useMemo(() => {
         const counts = {};
         kanbanColumns.forEach(col => { counts[String(col.value)] = 0; });
-        const totalsSource = groupBy === 'hierarchy' ? tasks : allTasks;
+        const totalsSource = allTasks.length > 0 ? allTasks : tasks;
         totalsSource.forEach(task => {
             let stringValue = '';
             if (groupBy === 'status') {
@@ -163,9 +156,6 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             else if (groupBy === 'schedule') {
                 stringValue = getScheduleColumnValue(task);
             }
-            else if (groupBy === 'hierarchy') {
-                stringValue = getHierarchyColumnValue(task);
-            }
             else {
                 const rawValue = task[groupBy];
                 stringValue = String(rawValue ?? '');
@@ -183,7 +173,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             }
         });
         return counts;
-    }, [allTasks, tasks, kanbanColumns, groupBy, hierarchyDepthMap, columnLookup, hierarchyParentIdSet, todayDateOnly]);
+    }, [allTasks, tasks, kanbanColumns, groupBy, columnLookup, todayDateOnly]);
     // Group items by the groupBy field
     const groupedTasks = useMemo(() => {
         const groups = {};
@@ -200,9 +190,6 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             else if (groupBy === 'schedule') {
                 stringValue = getScheduleColumnValue(task);
             }
-            else if (groupBy === 'hierarchy') {
-                stringValue = getHierarchyColumnValue(task);
-            }
             else {
                 const rawValue = task[groupBy];
                 // Fix: Use ?? to allow 0 as a valid value
@@ -237,32 +224,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
                 return String(a.createdAt || '').localeCompare(String(b.createdAt || ''));
             };
             const compareByHeaderSort = (a, b) => {
-                let comparison = 0;
-                if (sortBy === 'created') {
-                    comparison = new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
-                }
-                else if (sortBy === 'updated') {
-                    const aUpdated = a.updatedAt || a.createdAt;
-                    const bUpdated = b.updatedAt || b.createdAt;
-                    comparison = new Date(bUpdated).getTime() - new Date(aUpdated).getTime();
-                }
-                else if (sortBy === 'priority') {
-                    const priorityA = typeof a.priority === 'number' ? a.priority : 2;
-                    const priorityB = typeof b.priority === 'number' ? b.priority : 2;
-                    comparison = priorityB - priorityA;
-                    if (comparison === 0) {
-                        comparison = new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
-                    }
-                }
-                else if (sortBy === 'complexity') {
-                    const complexityA = typeof a.complexity === 'number' ? a.complexity : 3;
-                    const complexityB = typeof b.complexity === 'number' ? b.complexity : 3;
-                    comparison = complexityB - complexityA;
-                    if (comparison === 0) {
-                        comparison = new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime();
-                    }
-                }
-                return sortOrder === 'desc' ? comparison : -comparison;
+                return compareTasksBySortKey(a, b, sortBy, sortOrder, taxonomies);
             };
             Object.keys(groups).forEach((key) => {
                 if (key === 'backlog' || key === 'expired') {
@@ -272,70 +234,8 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
                 groups[key].sort(sortByScheduleOrder);
             });
         }
-        else if (groupBy === 'hierarchy' && hierarchyChildOrderMode === 'manual') {
-            const depthSource = hierarchyDepthSource;
-            const sourceIndexById = new Map();
-            depthSource.forEach((task, index) => sourceIndexById.set(task.id, index));
-            const sourceTaskById = new Map();
-            depthSource.forEach((task) => sourceTaskById.set(task.id, task));
-            const sourceChildrenByParent = new Map();
-            depthSource.forEach((task) => {
-                if (!task.parentTaskId)
-                    return;
-                const siblings = sourceChildrenByParent.get(task.parentTaskId) || [];
-                siblings.push(task);
-                sourceChildrenByParent.set(task.parentTaskId, siblings);
-            });
-            sourceChildrenByParent.forEach((siblings, parentId) => {
-                sourceChildrenByParent.set(parentId, sortChildTasksForDisplay(siblings));
-            });
-            const roots = depthSource.filter((task) => !task.parentTaskId || !sourceTaskById.has(task.parentTaskId));
-            roots.sort((a, b) => {
-                const idxA = sourceIndexById.get(a.id) ?? Number.MAX_SAFE_INTEGER;
-                const idxB = sourceIndexById.get(b.id) ?? Number.MAX_SAFE_INTEGER;
-                return idxA - idxB;
-            });
-            const pathByTaskId = new Map();
-            const visited = new Set();
-            const assignPaths = (task, path) => {
-                if (visited.has(task.id))
-                    return;
-                visited.add(task.id);
-                pathByTaskId.set(task.id, path);
-                const children = sourceChildrenByParent.get(task.id) || [];
-                children.forEach((child, index) => {
-                    assignPaths(child, [...path, index]);
-                });
-            };
-            roots.forEach((root, index) => {
-                assignPaths(root, [index]);
-            });
-            depthSource.forEach((task) => {
-                if (!pathByTaskId.has(task.id)) {
-                    const fallbackIndex = sourceIndexById.get(task.id) ?? Number.MAX_SAFE_INTEGER;
-                    pathByTaskId.set(task.id, [Number.MAX_SAFE_INTEGER, fallbackIndex]);
-                }
-            });
-            const compareHierarchyPath = (a, b) => {
-                const pathA = pathByTaskId.get(a.id) || [Number.MAX_SAFE_INTEGER];
-                const pathB = pathByTaskId.get(b.id) || [Number.MAX_SAFE_INTEGER];
-                const maxLen = Math.max(pathA.length, pathB.length);
-                for (let i = 0; i < maxLen; i += 1) {
-                    const segA = pathA[i] ?? -1;
-                    const segB = pathB[i] ?? -1;
-                    if (segA !== segB)
-                        return segA - segB;
-                }
-                const idxA = sourceIndexById.get(a.id) ?? Number.MAX_SAFE_INTEGER;
-                const idxB = sourceIndexById.get(b.id) ?? Number.MAX_SAFE_INTEGER;
-                return idxA - idxB;
-            };
-            Object.keys(groups).forEach((key) => {
-                groups[key].sort(compareHierarchyPath);
-            });
-        }
         return groups;
-    }, [tasks, kanbanColumns, groupBy, hierarchyDepthMap, columnLookup, hierarchyParentIdSet, scheduleFilteredTaskIdSet, todayDateOnly, hierarchyChildOrderMode, hierarchyDepthSource, sortBy, sortOrder]);
+    }, [tasks, allTasks, kanbanColumns, groupBy, columnLookup, scheduleFilteredTaskIdSet, todayDateOnly, sortBy, sortOrder]);
     const activeTaskId = activeId ? getTaskIdFromCardId(activeId) : null;
     const activeTaskOverlay = activeTaskId ? tasks.find(t => t.id === activeTaskId) : null;
     // Scroll Syncing Refs and Logic
@@ -364,7 +264,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             return !filterStatus.includes(String(columnValue));
         }
         if (groupBy === 'assignee')
-            return assigneeFilterEnabled && !filterAssignees.includes(String(columnValue));
+            return !filterAssignees.includes(String(columnValue));
         return false;
     };
     const totalWidth = useMemo(() => {
@@ -499,12 +399,6 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             document.body.style.userSelect = '';
         };
     }, [isHeaderPanning]);
-    useEffect(() => {
-        return () => {
-            linkFeedbackTimersRef.current.forEach((timerId) => window.clearTimeout(timerId));
-            linkFeedbackTimersRef.current.clear();
-        };
-    }, []);
     const handleHeaderPointerDown = (event) => {
         if (!headerPanEnabled)
             return;
@@ -520,34 +414,50 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
     };
     const handleDragStart = (event) => {
         setActiveId(event.active.id);
-        setCurrentParentDropTargetId(null);
     };
     const handleDragOver = (event) => {
-        if (groupBy === 'schedule') {
-            setCurrentParentDropTargetId(null);
-            return;
+        const activeMeta = resolveActiveDragMeta(event.active);
+        const overType = String(event.over?.data?.current?.type || '');
+        if (activeMeta.type === 'task-card' && overType.startsWith('planning-')) {
+            lastPlanningOverRef.current = `${String(event.over?.id || '')}:${overType}`;
         }
-        const { active, over } = event;
-        if (!over) {
-            setCurrentParentDropTargetId(null);
-            return;
-        }
-        const activeId = String(active.id);
-        const overId = String(over.id);
-        const activeTaskId = getTaskIdFromCardId(activeId);
-        const overTaskId = getTaskIdFromCardId(overId);
-        const activeTask = tasks.find(t => t.id === activeTaskId);
-        const overTask = tasks.find(t => t.id === overTaskId);
-        if (!activeTask || !overTask || activeTask.id === overTask.id) {
-            setCurrentParentDropTargetId(null);
-            return;
+        else if (lastPlanningOverRef.current) {
+            lastPlanningOverRef.current = null;
         }
-        setCurrentParentDropTargetId(overTask.id);
+        return;
     };
     const handleDragEnd = (event) => {
         const { active, over } = event;
+        lastPlanningOverRef.current = null;
         setActiveId(null);
-        setCurrentParentDropTargetId(null);
+        const activeMeta = resolveActiveDragMeta(active);
+        const activeType = activeMeta.type;
+        const overType = String(over?.data?.current?.type || '');
+        const activeTaskDataId = activeMeta.taskId;
+        const activeWorkstreamDataId = activeMeta.workstreamId;
+        const overWorkstreamDataId = String(over?.data?.current?.workstreamId || '');
+        const overInitiativeDataId = String(over?.data?.current?.initiativeId || '');
+        if (activeType === 'task-card') {
+            if (overType === 'planning-workstream-target' && activeTaskDataId && overWorkstreamDataId) {
+                void onAssignTaskToWorkstream?.(activeTaskDataId, overWorkstreamDataId);
+                return;
+            }
+            if (overType === 'planning-task-unlink' && activeTaskDataId) {
+                void onAssignTaskToWorkstream?.(activeTaskDataId, null);
+                return;
+            }
+        }
+        if (activeType === 'planning-workstream') {
+            if (overType === 'planning-initiative-target' && activeWorkstreamDataId && overInitiativeDataId) {
+                void onAssignWorkstreamToInitiative?.(activeWorkstreamDataId, overInitiativeDataId);
+                return;
+            }
+            if (overType === 'planning-workstream-unlink' && activeWorkstreamDataId) {
+                void onAssignWorkstreamToInitiative?.(activeWorkstreamDataId, null);
+                return;
+            }
+            return;
+        }
         const activeId = String(active.id);
         const overId = over ? String(over.id) : null;
         const activeTaskId = getTaskIdFromCardId(activeId);
@@ -555,41 +465,6 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
         const activeTask = tasks.find(t => t.id === activeTaskId);
         if (!activeTask || !overId)
             return;
-        const overTask = overTaskId ? tasks.find(t => t.id === overTaskId) : undefined;
-        if (groupBy !== 'schedule' && overTask && overTask.id !== activeTask.id) {
-            const overRect = over?.rect;
-            const translatedActiveRect = active.rect.current.translated;
-            const initialActiveRect = active.rect.current.initial;
-            const activeRect = translatedActiveRect || initialActiveRect;
-            if (overRect && activeRect) {
-                const droppedInCenterZone = isDropInCenterZone(overRect, activeRect);
-                if (droppedInCenterZone) {
-                    if (activeTask.parentTaskId === overTask.id)
-                        return;
-                    const relationshipTasks = allTasks.length > 0 ? allTasks : tasks;
-                    if (wouldCreateParentCycle(activeTask.id, overTask.id, relationshipTasks)) {
-                        window.alert(`Cannot link child ${activeTask.id} to parent ${overTask.id}: link would create a cycle.`);
-                        return;
-                    }
-                    if (shouldPromptReparent(activeTask.parentTaskId, overTask.id)) {
-                        const confirmed = window.confirm(`Task ${activeTask.id} is already parented to ${activeTask.parentTaskId}. Re-parent it to ${overTask.id}?`);
-                        if (!confirmed)
-                            return;
-                    }
-                    onUpdateTask(activeTask.id, { parentTaskId: overTask.id });
-                    setRecentlyLinkedParentIds((prev) => Array.from(new Set([...prev, overTask.id])));
-                    const existing = linkFeedbackTimersRef.current.get(overTask.id);
-                    if (existing)
-                        window.clearTimeout(existing);
-                    const timerId = window.setTimeout(() => {
-                        linkFeedbackTimersRef.current.delete(overTask.id);
-                        setRecentlyLinkedParentIds((prev) => prev.filter((id) => id !== overTask.id));
-                    }, 1800);
-                    linkFeedbackTimersRef.current.set(overTask.id, timerId);
-                    return;
-                }
-            }
-        }
         // Find the container (column) we dropped into
         // If we dropped over a task, findContainer resolves to that task's column
         // If we dropped over a column (empty or not), it resolves to the column ID
@@ -604,18 +479,13 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
         const column = columnLookup.get(containerId)
             || kanbanColumns.find(c => String(c.value) === containerId || c.label === containerId);
         if (column) {
-            if (groupBy === 'hierarchy') {
-                // Hierarchy columns are derived from relationships, not directly writable fields.
-                // Re-parenting remains card-to-card only.
-                return;
-            }
             if (groupBy === 'schedule') {
                 const targetColumn = String(column.value);
                 const scheduleKeys = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun'];
                 const isScheduleReorderColumn = targetColumn === 'backlog' || targetColumn === 'expired' || scheduleKeys.includes(targetColumn);
                 const buildInsertIndex = (targetTasks) => {
                     let insertAt = targetTasks.length;
-                    const candidateOverTaskId = overTask?.id || (overId && isTaskCardId(overId) ? getTaskIdFromCardId(overId) : null);
+                    const candidateOverTaskId = overId && isTaskCardId(overId) ? getTaskIdFromCardId(overId) : null;
                     if (!candidateOverTaskId || !taskIdSet.has(candidateOverTaskId))
                         return insertAt;
                     const overTaskId = candidateOverTaskId;
@@ -705,32 +575,6 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
                     return;
                 }
                 const scheduledWeekKey = scheduleContext.parseToIsoWeekKey(scheduledDate);
-                if (childrenByParentId.has(activeTask.id)) {
-                    const stack = [...(childrenByParentId.get(activeTask.id) || [])];
-                    const descendants = [];
-                    while (stack.length > 0) {
-                        const next = stack.shift();
-                        descendants.push(next);
-                        const children = childrenByParentId.get(next.id) || [];
-                        if (children.length > 0)
-                            stack.push(...children);
-                    }
-                    const leafDescendants = descendants.filter((task) => !childrenByParentId.has(task.id));
-                    const activeLeafDescendants = leafDescendants.filter((task) => !task.isArchived && task.status !== 'done' && task.status !== 'cancelled');
-                    const toSchedule = activeLeafDescendants.filter((task) => !task.scheduledDate);
-                    const alreadyScheduledLeafCount = Math.max(0, activeLeafDescendants.length - toSchedule.length);
-                    onScheduleParentDrop?.({
-                        parentTaskId: activeTask.id,
-                        parentTitle: activeTask.title,
-                        targetColumn: targetColumn,
-                        targetDate: scheduledDate,
-                        toScheduleLeafTaskIds: toSchedule.map((task) => task.id),
-                        alreadyScheduledLeafCount,
-                        totalLeafDescendants: activeLeafDescendants.length
-                    });
-                    onScheduleDaySelected?.(scheduledDate);
-                    return;
-                }
                 const pendingUpdates = new Map();
                 const targetTasks = (groupedTasks[targetColumn] || []).filter(t => t.id !== activeTaskId);
                 const insertAt = buildInsertIndex(targetTasks);
@@ -838,9 +682,6 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             else if (groupBy === 'schedule') {
                 val = getScheduleColumnValue(task);
             }
-            else if (groupBy === 'hierarchy') {
-                val = getHierarchyColumnValue(task);
-            }
             else {
                 val = String(task[groupBy] ?? '');
             }
@@ -859,111 +700,116 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
         }),
     };
     const customCollisionDetection = (args) => {
-        // First, look for collisions with the pointer (mouse cursor)
-        // This is crucial for collapsed columns which are narrow
-        const pointerCollisions = pointerWithin(args);
-        // If we have pointer collisions, user is explicitly hovering over something
-        if (pointerCollisions.length > 0) {
-            const pointerCoords = args.pointerCoordinates;
-            if (!pointerCoords)
-                return [pointerCollisions[0]];
-            // Prefer task cards over columns when both collide.
-            const taskCollisions = pointerCollisions.filter((c) => {
-                const id = String(c.id);
-                return isTaskCardId(id) && id !== activeId;
-            });
-            if (taskCollisions.length === 0) {
-                // Pointer is often between cards (gap), where only column collision exists.
-                // Constrain nearest-task fallback to the column under pointer to avoid cross-column/day drift.
-                const columnCollisions = pointerCollisions.filter((c) => {
+        try {
+            // First, look for collisions with the pointer (mouse cursor)
+            // This is crucial for collapsed columns which are narrow
+            const pointerCollisions = pointerWithin(args);
+            // If we have pointer collisions, user is explicitly hovering over something
+            if (pointerCollisions.length > 0) {
+                const planningCollision = pointerCollisions.find((collision) => String(collision.id).startsWith('planning-'));
+                if (planningCollision) {
+                    return [planningCollision];
+                }
+                const pointerCoords = args.pointerCoordinates;
+                if (!pointerCoords)
+                    return [pointerCollisions[0]];
+                // Prefer task cards over columns when both collide.
+                const taskCollisions = pointerCollisions.filter((c) => {
                     const id = String(c.id);
-                    return !isTaskCardId(id);
+                    return isTaskCardId(id) && id !== activeId;
                 });
-                const hoveredColumnCollision = columnCollisions.find((collision) => {
-                    const mapped = findContainer(String(collision.id));
-                    return Boolean(mapped);
-                }) || null;
-                const hoveredColumnId = hoveredColumnCollision
-                    ? findContainer(String(hoveredColumnCollision.id))
-                    : null;
-                const taskDroppables = (args.droppableContainers || []).filter((container) => {
-                    const id = String(container.id);
-                    if (!isTaskCardId(id) || id === activeId)
-                        return false;
-                    if (!hoveredColumnId)
-                        return true;
-                    return findContainer(id) === hoveredColumnId;
-                });
-                if (taskDroppables.length > 0) {
-                    const nearestTask = closestCorners({
-                        ...args,
-                        droppableContainers: taskDroppables
+                if (taskCollisions.length === 0) {
+                    // Pointer is often between cards (gap), where only column collision exists.
+                    // Constrain nearest-task fallback to the column under pointer to avoid cross-column/day drift.
+                    const columnCollisions = pointerCollisions.filter((c) => {
+                        const id = String(c.id);
+                        return !isTaskCardId(id);
+                    });
+                    const hoveredColumnCollision = columnCollisions.find((collision) => {
+                        const mapped = findContainer(String(collision.id));
+                        return Boolean(mapped);
+                    }) || null;
+                    const hoveredColumnId = hoveredColumnCollision
+                        ? findContainer(String(hoveredColumnCollision.id))
+                        : null;
+                    const taskDroppables = (args.droppableContainers || []).filter((container) => {
+                        const id = String(container.id);
+                        if (!isTaskCardId(id) || id === activeId)
+                            return false;
+                        if (!hoveredColumnId)
+                            return true;
+                        return findContainer(id) === hoveredColumnId;
                     });
-                    if (nearestTask.length > 0) {
-                        return [nearestTask[0]];
+                    if (taskDroppables.length > 0) {
+                        const nearestTask = closestCorners({
+                            ...args,
+                            droppableContainers: taskDroppables
+                        });
+                        if (nearestTask.length > 0) {
+                            return [nearestTask[0]];
+                        }
                     }
+                    if (hoveredColumnCollision) {
+                        return [hoveredColumnCollision];
+                    }
+                    return [pointerCollisions[0]];
                 }
-                if (hoveredColumnCollision) {
-                    return [hoveredColumnCollision];
-                }
-                return [pointerCollisions[0]];
-            }
-            const candidates = taskCollisions;
-            let best = candidates[0];
-            let bestDistance = Number.POSITIVE_INFINITY;
-            for (const collision of candidates) {
-                const rect = args.droppableRects?.get(collision.id);
-                if (!rect)
-                    continue;
-                const centerX = rect.left + rect.width / 2;
-                const centerY = rect.top + rect.height / 2;
-                const dx = pointerCoords.x - centerX;
-                const dy = pointerCoords.y - centerY;
-                const distance = dx * dx + dy * dy;
-                if (distance < bestDistance) {
-                    bestDistance = distance;
-                    best = collision;
+                const candidates = taskCollisions;
+                let best = candidates[0];
+                let bestDistance = Number.POSITIVE_INFINITY;
+                for (const collision of candidates) {
+                    const rect = args.droppableRects?.get(collision.id);
+                    if (!rect)
+                        continue;
+                    const centerX = rect.left + rect.width / 2;
+                    const centerY = rect.top + rect.height / 2;
+                    const dx = pointerCoords.x - centerX;
+                    const dy = pointerCoords.y - centerY;
+                    const distance = dx * dx + dy * dy;
+                    if (distance < bestDistance) {
+                        bestDistance = distance;
+                        best = collision;
+                    }
                 }
+                return [best];
             }
-            return [best];
+            // Fallback to closestCorners for other cases (like keyboard or large overlaps)
+            return closestCorners(args);
+        }
+        catch (error) {
+            console.error('[TaskKanban] collision detection error', error);
+            return [];
         }
-        // Fallback to closestCorners for other cases (like keyboard or large overlaps)
-        return closestCorners(args);
     };
     const commonCardProps = {
         searchQuery,
         copiedId,
-        // Use a stable relationship source so parent/child UI does not disappear
-        // when list filters hide related tasks from the board.
-        allTasks: hierarchyTasks.length > 0
-            ? hierarchyTasks
-            : (allTasks.length > 0 ? allTasks : tasks),
-        availableSpecialists,
         taxonomies,
+        types,
         priorities,
         approaches,
+        assigneeOptions,
         onCopyId,
         onToggleInProgress,
         onToggleReview,
         onToggleComplete,
         onToggleCancel,
+        onSetStatus,
         onArchiveTask,
         onUnarchive,
         onDelete,
         onOpenTaskById,
-        onUnlinkChildTask,
-        onClearParentTask,
         categories,
+        readOnlyMode,
         changedTaskIdSet,
-        linkedParentIdSet: new Set(recentlyLinkedParentIds),
-        parentDropTargetId: currentParentDropTargetId,
+        resolveTaskHierarchy,
         groupBy,
-        scheduleParentIdSet: hierarchyParentIdSet
+        showStatusLabel: showTaskCardStatusLabel
     };
-    return (_jsxs(DndContext, { sensors: sensors, collisionDetection: customCollisionDetection, onDragStart: handleDragStart, onDragOver: handleDragOver, onDragEnd: handleDragEnd, onDragCancel: () => {
+    return (_jsxs(DndContext, { sensors: sensors, collisionDetection: customCollisionDetection, onDragStart: handleDragStart, onDragOver: handleDragOver, onDragEnd: handleDragEnd, onDragCancel: (event) => {
+            lastPlanningOverRef.current = null;
             setActiveId(null);
-            setCurrentParentDropTargetId(null);
-        }, children: [_jsxs("div", { className: styles.kanbanWrapper, children: [_jsx("div", { ref: topScrollRef, className: styles.kanbanTopScroll, children: _jsx("div", { className: styles.kanbanTopScrollSpacer, style: { width: `${totalWidth}px` } }) }), _jsx("div", { className: styles.kanbanContainer, ref: containerRef, children: kanbanColumns.map((column) => {
+        }, children: [planningDropTargets, _jsxs("div", { className: styles.kanbanWrapper, children: [_jsx("div", { ref: topScrollRef, className: `${styles.kanbanTopScroll} tf-scrollbar`, children: _jsx("div", { className: styles.kanbanTopScrollSpacer, style: { width: `${totalWidth}px` } }) }), _jsx("div", { className: styles.kanbanContainer, ref: containerRef, children: kanbanColumns.map((column) => {
                             const columnTasks = groupedTasks[String(column.value)] || [];
                             const isExplicitlyHidden = getIsColumnHidden(column.value, column.label);
                             const isAutoHidden = groupBy !== 'schedule' && emptyColumnMode === 'hide' && columnTasks.length === 0;
@@ -979,7 +825,10 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
                             if (isExplicitlyHidden || isAutoHidden)
                                 return null;
                             return (_jsx(KanbanColumn, { id: String(column.value), title: column.label, color: column.color, icon: column.icon, tasks: columnTasks, activeId: activeId, activeTaskId: activeTaskId, totalCount: columnTotals[String(column.value)], onAddTask: () => onAddTaskToColumn?.(groupBy, column.value), onTaskClick: onTaskClick, commonCardProps: commonCardProps, collapseEmpty: emptyColumnMode === 'collapse', compressed: compressed, onHeaderPointerDown: handleHeaderPointerDown, isHeaderPanning: isHeaderPanning, headerPanEnabled: headerPanEnabled, stickyLeft: stickyLeft, stickyZIndex: stickyZIndex, isPast: !!column.isPast, isSelected: !!column.isSelected, isWeekend: !!column.isWeekend, disableSorting: false, scheduleDate: groupBy === 'schedule' ? scheduleContext.dates[String(column.value)] : undefined, onScheduleDaySelected: onScheduleDaySelected }, String(column.value)));
-                        }) })] }), createPortal(_jsx(DragOverlay, { dropAnimation: dropAnimation, children: activeTaskOverlay ? (_jsx(TaskCard, { task: activeTaskOverlay, isOverlay: true, ...commonCardProps, isArchived: activeTaskOverlay.isArchived, categories: categories, compressed: compressed, isRecentlyChanged: changedTaskIdSet.has(activeTaskOverlay.id) })) : null }), document.body)] }));
+                        }) })] }), createPortal(_jsx(DragOverlay, { dropAnimation: dropAnimation, children: activeTaskOverlay ? ((() => {
+                    const { taskWorkstream, taskInitiative } = resolveTaskHierarchy(activeTaskOverlay);
+                    return (_jsx(TaskCard, { task: activeTaskOverlay, taskWorkstream: taskWorkstream, taskInitiative: taskInitiative, isOverlay: true, ...commonCardProps, isArchived: activeTaskOverlay.isArchived, categories: categories, compressed: compressed, isRecentlyChanged: changedTaskIdSet.has(activeTaskOverlay.id) }));
+                })()) : null }), document.body)] }));
 }
 function KanbanColumn({ id, title, color, icon, tasks, activeId = null, activeTaskId = null, totalCount, onAddTask, onTaskClick, commonCardProps, collapseEmpty, compressed, onHeaderPointerDown, isHeaderPanning = false, headerPanEnabled = false, stickyLeft, stickyZIndex, isPast = false, isSelected = false, isWeekend = false, disableSorting = false, scheduleDate, onScheduleDaySelected }) {
     const { setNodeRef } = useDroppable({
@@ -999,7 +848,7 @@ function KanbanColumn({ id, title, color, icon, tasks, activeId = null, activeTa
         const target = event.target;
         if (!target)
             return;
-        if (target.closest(`.${styles.taskItem}`) || target.closest(`.${styles.kanbanCardWrapper}`))
+        if (target.closest('[data-task-card="true"]') || target.closest(`.${styles.kanbanCardWrapper}`))
             return;
         onScheduleDaySelected(scheduleDate);
     };
@@ -1007,11 +856,21 @@ function KanbanColumn({ id, title, color, icon, tasks, activeId = null, activeTa
                                 const IconComp = icon && IconMap[icon] ? IconMap[icon] : Icons.Folder;
                                 const resolvedColor = resolveColor(color) || 'var(--color-purple)';
                                 return _jsx(IconComp, { size: 16, style: { color: resolvedColor } });
-                            })(), !isCollapsed && _jsx("span", { style: { whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }, children: title })] }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '8px', flexShrink: 0 }, children: [(!isCollapsed || totalCount > 0) && (_jsx("span", { className: styles.kanbanCount, children: isCollapsed ? totalCount : `${tasks.length} / ${totalCount}` })), _jsx("button", { className: styles.kanbanQuickAdd, onClick: (e) => { e.stopPropagation(); onAddTask(); }, title: `Add task to ${title}`, "data-no-header-pan": "true", children: _jsx(Icons.Plus, { size: 14 }) })] })] }), _jsx("div", { className: styles.kanbanDroppable, children: _jsx("div", { className: styles.kanbanDroppableScroll, ref: scrollRef, children: disableSorting ? (visibleTasks.map((task) => (_jsx("div", { className: styles.kanbanCardWrapper, children: _jsx(TaskCard, { task: task, onClick: onTaskClick, ...commonCardProps, isArchived: task.isArchived, compressed: compressed, isRecentlyChanged: false }) }, task.id)))) : (_jsx(SortableContext, { id: id, items: visibleTasks.map((t) => toSortableId(t.id)), strategy: verticalListSortingStrategy, children: visibleTasks.map((task) => (_jsx(SortableTaskCard, { sortableId: toSortableId(task.id), task: task, onClick: onTaskClick, commonCardProps: commonCardProps, compressed: compressed, isRecentlyChanged: commonCardProps.changedTaskIdSet?.has(task.id) }, toSortableId(task.id)))) })) }) })] }));
+                            })(), !isCollapsed && _jsx("span", { style: { whiteSpace: 'nowrap', overflow: 'hidden', textOverflow: 'ellipsis' }, children: title })] }), _jsxs("div", { style: { display: 'flex', alignItems: 'center', gap: '8px', flexShrink: 0 }, children: [(!isCollapsed || totalCount > 0) && (_jsx("span", { className: styles.kanbanCount, children: isCollapsed ? totalCount : `${tasks.length} / ${totalCount}` })), !commonCardProps.readOnlyMode && (_jsx("button", { className: "tf-control-icon tf-control-icon-compact", onClick: (e) => { e.stopPropagation(); onAddTask(); }, title: `Add task to ${title}`, "aria-label": `Add task to ${title}`, "data-no-header-pan": "true", children: _jsx(Icons.Plus, { size: 14 }) }))] })] }), _jsx("div", { className: styles.kanbanDroppable, children: _jsx("div", { className: `${styles.kanbanDroppableScroll} ${styles.appScrollbar} tf-scrollbar`, ref: scrollRef, children: disableSorting ? (visibleTasks.map((task) => (_jsx("div", { className: styles.kanbanCardWrapper, children: (() => {
+                            const { taskWorkstream, taskInitiative } = commonCardProps.resolveTaskHierarchy?.(task) || {};
+                            return (_jsx(TaskCard, { task: task, taskWorkstream: taskWorkstream, taskInitiative: taskInitiative, onClick: onTaskClick, ...commonCardProps, isArchived: task.isArchived, readOnlyMode: commonCardProps.readOnlyMode || null, compressed: compressed, isRecentlyChanged: false }));
+                        })() }, task.id)))) : (_jsx(SortableContext, { id: id, items: visibleTasks.map((t) => toSortableId(t.id)), strategy: verticalListSortingStrategy, children: visibleTasks.map((task) => (_jsx(SortableTaskCard, { sortableId: toSortableId(task.id), task: task, onClick: onTaskClick, commonCardProps: commonCardProps, compressed: compressed, isRecentlyChanged: commonCardProps.changedTaskIdSet?.has(task.id) }, toSortableId(task.id)))) })) }) })] }));
 }
 function SortableTaskCard({ sortableId, task, onClick, commonCardProps, compressed, isRecentlyChanged = false }) {
-    const dragDisabled = false;
-    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({ id: sortableId, disabled: dragDisabled });
+    const dragDisabled = Boolean(commonCardProps?.readOnlyMode);
+    const { attributes, listeners, setNodeRef, transform, transition, isDragging } = useSortable({
+        id: sortableId,
+        disabled: dragDisabled,
+        data: {
+            type: 'task-card',
+            taskId: task.id,
+        },
+    });
     const style = {
         transform: CSS.Transform.toString(transform),
         transition,
@@ -1019,8 +878,9 @@ function SortableTaskCard({ sortableId, task, onClick, commonCardProps, compress
         pointerEvents: isDragging ? 'none' : 'auto',
     };
     const isScheduleMode = commonCardProps?.groupBy === 'schedule';
-    const isGlowActive = !isScheduleMode && (isRecentlyChanged
-        || commonCardProps?.parentDropTargetId === task.id
-        || !!commonCardProps?.linkedParentIdSet?.has(task.id));
-    return (_jsx("div", { ref: setNodeRef, style: style, ...(dragDisabled ? {} : attributes), ...(dragDisabled ? {} : listeners), className: `${styles.kanbanCardWrapper} ${isGlowActive ? styles.kanbanCardWrapperRaised : ''}`, children: _jsx(TaskCard, { task: task, onClick: onClick, ...commonCardProps, isArchived: task.isArchived, compressed: compressed, isRecentlyChanged: isScheduleMode ? false : isRecentlyChanged }) }));
+    const isGlowActive = !isScheduleMode && isRecentlyChanged;
+    return (_jsx("div", { ref: setNodeRef, style: style, ...(dragDisabled ? {} : attributes), ...(dragDisabled ? {} : listeners), className: `${styles.kanbanCardWrapper} ${isGlowActive ? styles.kanbanCardWrapperRaised : ''}`, children: (() => {
+            const { taskWorkstream, taskInitiative } = commonCardProps.resolveTaskHierarchy?.(task) || {};
+            return (_jsx(TaskCard, { task: task, taskWorkstream: taskWorkstream, taskInitiative: taskInitiative, onClick: onClick, ...commonCardProps, isArchived: task.isArchived, readOnlyMode: commonCardProps?.readOnlyMode || null, compressed: compressed, isRecentlyChanged: isScheduleMode ? false : isRecentlyChanged }));
+        })() }));
 }