@taskforcehq/taskforce 0.3.305 → 0.3.306

package/dist/components/task/TaskForm.js

@@ -15,7 +15,7 @@ import { IconMap, resolveColor } from "../../utils/constants";
 import { formatDate } from "../../utils/formatting";
 import { t } from "../../localization";
 import { TaskContextUpload } from "./TaskContextUpload";
-import { summarizeTaskChange, summarizeTaskEvent, } from "../../utils/taskActivity";
+import { getTaskActivityItems, getTaskEventPrimaryChangeField, summarizeTaskChange, summarizeTaskEvent, } from "../../utils/taskActivity";
 import { ensureAssigneeOptionPresent, getAssigneeKind, getAssigneeLabel, } from "../../utils/assignees";
 import { getTaskReferenceLabel } from "../../utils/taskReferences";
 import { getVisibleTaskFormTaxonomies } from "../../utils/taxonomyFormDefaults.js";
@@ -235,18 +235,7 @@ export function TaskForm(props) {
         initiative.id,
         getInitiativeReferenceLabel(initiative) || initiative.id,
     ])), [initiatives]);
-    const taskActivityItems = React.useMemo(() => {
-        if (Array.isArray(currentTask?.activity) &&
-            currentTask.activity.length > 0) {
-            return currentTask.activity;
-        }
-        return comments.map((comment) => ({
-            id: `comment:${comment.id}`,
-            type: "comment",
-            timestamp: comment.timestamp,
-            comment,
-        }));
-    }, [comments, currentTask?.activity]);
+    const taskActivityItems = React.useMemo(() => getTaskActivityItems({ activity: currentTask?.activity, comments }), [comments, currentTask?.activity]);
     const formatActivityFieldValue = (field, value) => {
         const normalizedValue = String(value || "").trim();
         if (!normalizedValue)
@@ -284,8 +273,53 @@ export function TaskForm(props) {
         formatAiAuthorLabel,
         resolvedAssigneeOptions,
     ]);
+    const resolveActivityActorPresentation = React.useCallback(({ actorId, actorType, actorProfile, fallbackKind, }) => {
+        const actorRef = String(actorId || "").trim();
+        const normalizedActor = actorRef.toLowerCase();
+        const actorFallback = actorFallbackById.get(actorRef);
+        const actorOption = actorOptionByValue.get(actorRef) ||
+            actorOptionByValue.get(normalizedActor);
+        const resolvedActor = actorProfile || actorFallback || actorOption || null;
+        const resolvedKind = actorType === "system"
+            ? "system"
+            : actorType === "ai" || resolvedActor?.kind === "ai"
+                ? "agent"
+                : actorType === "human" || resolvedActor?.kind === "human"
+                    ? "member"
+                    : actorOption?.kind === "agent"
+                        ? "agent"
+                        : actorOption?.kind === "member"
+                            ? "member"
+                            : fallbackKind ||
+                                (normalizedActor === "" ||
+                                    normalizedActor === "user" ||
+                                    normalizedActor === "human"
+                                    ? "member"
+                                    : "agent");
+        const label = resolvedKind === "system"
+            ? "System"
+            : resolveActorLabel(actorRef, resolvedKind === "agent" ? "ai" : "human", resolvedActor?.label || null);
+        const color = resolvedActor?.color;
+        const iconName = String(resolvedActor?.icon ||
+            (resolvedKind === "agent"
+                ? "Bot"
+                : resolvedKind === "member"
+                    ? "User"
+                    : "ClipboardList"));
+        const ActorIcon = IconMap[iconName] ||
+            (resolvedKind === "agent"
+                ? Bot
+                : resolvedKind === "member"
+                    ? User
+                    : ClipboardList);
+        return { kind: resolvedKind, label, color, ActorIcon };
+    }, [
+        actorFallbackById,
+        actorOptionByValue,
+        resolveActorLabel,
+    ]);
     const latestActivityActorLabel = React.useMemo(() => {
-        const latestItem = taskActivityItems[0];
+        const latestItem = taskActivityItems[taskActivityItems.length - 1];
         if (!latestItem)
             return null;
         if (latestItem.type === "comment") {
@@ -350,95 +384,56 @@ export function TaskForm(props) {
     const activitySidebar = editingTaskId ? (_jsxs("aside", { className: formStyles.activitySidebar, "aria-label": t("taskForm.commentsSectionTitle"), children: [_jsxs("div", { className: formStyles.activitySidebarHeader, children: [_jsx("h2", { className: formStyles.activitySidebarTitle, children: t("taskForm.commentsSectionTitle") }), _jsx("span", { className: formStyles.activitySidebarCount, children: activityCount })] }), _jsxs("div", { className: `${formStyles.commentPanel} ${formStyles.activitySidebarPanel}`.trim(), children: [_jsxs("div", { className: formStyles.commentThread, children: [activityCount === 0 && (_jsx("div", { className: formStyles.emptyComments, children: t("taskForm.noComments") })), taskActivityItems.map((item) => {
                                 if (item.type === "comment") {
                                     const c = item.comment;
-                                    const authorRef = String(c.author || "").trim();
-                                    const normalizedAuthor = authorRef.toLowerCase();
-                                    const actorFallback = actorFallbackById.get(authorRef);
-                                    const actorOption = actorOptionByValue.get(authorRef) ||
-                                        actorOptionByValue.get(normalizedAuthor);
-                                    const resolvedActor = c.actor || actorFallback || actorOption || null;
-                                    const commentKind = c.actor?.kind === "human"
-                                        ? "member"
-                                        : c.actor?.kind === "ai"
-                                            ? "agent"
-                                            : actorFallback?.kind === "human"
-                                                ? "member"
-                                                : actorFallback?.kind === "ai"
-                                                    ? "agent"
-                                                    : actorOption?.kind ||
-                                                        (normalizedAuthor === "" ||
-                                                            normalizedAuthor === "user" ||
-                                                            normalizedAuthor === "human"
-                                                            ? "member"
-                                                            : "agent");
-                                    const authorLabel = c.actor?.label ||
-                                        actorFallback?.label ||
-                                        actorOption?.label ||
-                                        (authorRef
-                                            ? getAssigneeLabel(authorRef, resolvedAssigneeOptions)
-                                            : "") ||
-                                        (commentKind === "agent"
-                                            ? formatAiAuthorLabel(authorRef || "ai")
-                                            : t("taskForm.you"));
-                                    const authorColor = c.actor?.color || actorFallback?.color || actorOption?.color;
-                                    const iconName = String(resolvedActor?.icon ||
-                                        (commentKind === "agent" ? "Bot" : "User"));
-                                    const CommentActorIcon = IconMap[iconName] || (commentKind === "agent" ? Bot : User);
+                                    const actorPresentation = resolveActivityActorPresentation({
+                                        actorId: c.author,
+                                        actorType: c.actor?.kind === "ai"
+                                            ? "ai"
+                                            : c.actor?.kind === "human"
+                                                ? "human"
+                                                : null,
+                                        actorProfile: c.actor,
+                                    });
+                                    const commentKind = actorPresentation.kind === "agent" ? "agent" : "member";
+                                    const { ActorIcon: CommentActorIcon } = actorPresentation;
+                                    const authorColor = actorPresentation.color;
+                                    const authorLabel = actorPresentation.label;
+                                    const commentAccentStyle = authorColor && hexToRgba(authorColor, 0.35)
+                                        ? {
+                                            background: `linear-gradient(135deg, ${hexToRgba(authorColor, 0.18)} 0%, ${hexToRgba(authorColor, 0.1)} 100%)`,
+                                            borderColor: hexToRgba(authorColor, 0.35),
+                                        }
+                                        : undefined;
                                     return (_jsxs("div", { className: `${formStyles.comment} ${commentKind === "agent" ? formStyles.commentAi : formStyles.commentUser}`, children: [_jsxs("div", { className: formStyles.commentHeader, children: [_jsx("span", { className: formStyles.commentAuthor, style: authorColor ? { color: authorColor } : undefined, children: _jsxs(_Fragment, { children: [_jsx(CommentActorIcon, { size: 12, strokeWidth: 1.5 }), " ", authorLabel] }) }), _jsx("span", { className: formStyles.commentTime, children: formatDate(c.timestamp, {
                                                             month: "short",
                                                             day: "numeric",
                                                             hour: "2-digit",
                                                             minute: "2-digit",
-                                                        }) })] }), _jsx("div", { className: formStyles.commentText, style: authorColor
-                                                    ? {
-                                                        background: `linear-gradient(135deg, ${hexToRgba(authorColor, 0.18)} 0%, ${hexToRgba(authorColor, 0.1)} 100%)`,
-                                                        borderColor: hexToRgba(authorColor, 0.35),
-                                                    }
-                                                    : undefined, children: _jsx(Markdown, { onTaskIdClick: onOpenTaskById, children: c.text }) })] }, c.id));
+                                                        }) })] }), _jsx("div", { className: formStyles.commentText, style: commentAccentStyle, children: _jsx(Markdown, { onTaskIdClick: onOpenTaskById, children: c.text }) })] }, c.id));
                                 }
                                 const event = item.event;
-                                const actorRef = String(event.actor || "").trim();
-                                const normalizedAuthor = actorRef.toLowerCase();
-                                const actorFallback = actorFallbackById.get(actorRef);
-                                const actorOption = actorOptionByValue.get(actorRef) ||
-                                    actorOptionByValue.get(normalizedAuthor);
-                                const resolvedActor = event.actorProfile || actorFallback || actorOption || null;
-                                const eventKind = event.actorType === "ai"
-                                    ? "agent"
-                                    : event.actorType === "human"
-                                        ? "member"
-                                        : "system";
-                                const authorLabel = event.actorProfile?.label ||
-                                    actorFallback?.label ||
-                                    actorOption?.label ||
-                                    (eventKind === "system"
-                                        ? "System"
-                                        : actorRef
-                                            ? getAssigneeLabel(actorRef, resolvedAssigneeOptions)
-                                            : eventKind === "agent"
-                                                ? formatAiAuthorLabel("ai")
-                                                : t("taskForm.you"));
-                                const authorColor = event.actorProfile?.color ||
-                                    actorFallback?.color ||
-                                    actorOption?.color;
-                                const iconName = String(resolvedActor?.icon ||
-                                    (eventKind === "agent"
-                                        ? "Bot"
-                                        : eventKind === "member"
-                                            ? "User"
-                                            : "ClipboardList"));
-                                const EventActorIcon = IconMap[iconName] ||
-                                    (eventKind === "agent"
-                                        ? Bot
-                                        : eventKind === "member"
-                                            ? User
-                                            : ClipboardList);
+                                const actorPresentation = resolveActivityActorPresentation({
+                                    actorId: event.actor,
+                                    actorType: event.actorType,
+                                    actorProfile: event.actorProfile,
+                                    fallbackKind: "system",
+                                });
+                                const { ActorIcon: EventActorIcon } = actorPresentation;
+                                const authorColor = actorPresentation.color;
+                                const authorLabel = actorPresentation.label;
+                                const eventKind = actorPresentation.kind;
                                 const changeEntries = Object.entries(event.details?.changes || {});
+                                const primaryChangeField = getTaskEventPrimaryChangeField(event);
+                                const displayedChangeEntries = changeEntries.length > 1 && primaryChangeField
+                                    ? changeEntries.filter(([field]) => field !== primaryChangeField)
+                                    : changeEntries.length > 1
+                                        ? changeEntries
+                                        : [];
                                 return (_jsxs("div", { className: `${formStyles.comment} ${formStyles.activityEvent} ${eventKind === "system" ? formStyles.activityEventSystem : ""}`, children: [_jsxs("div", { className: `${formStyles.commentHeader} ${formStyles.activityEventHeader}`, children: [_jsx("span", { className: formStyles.commentAuthor, style: authorColor ? { color: authorColor } : undefined, children: _jsxs(_Fragment, { children: [_jsx(EventActorIcon, { size: 12, strokeWidth: 1.5 }), " ", authorLabel] }) }), _jsx("span", { className: formStyles.commentTime, children: formatDate(event.createdAt, {
                                                         month: "short",
                                                         day: "numeric",
                                                         hour: "2-digit",
                                                         minute: "2-digit",
-                                                    }) })] }), _jsxs("div", { className: formStyles.activityEventText, children: [_jsx("div", { children: summarizeTaskEvent(event, formatActivityFieldValue) }), changeEntries.length > 1 && (_jsx("div", { className: formStyles.activityEventChanges, children: changeEntries.map(([field, change]) => (_jsx("span", { className: formStyles.activityEventChange, children: summarizeTaskChange(field, change, formatActivityFieldValue) }, field))) }))] })] }, item.id));
+                                                    }) })] }), _jsxs("div", { className: formStyles.activityEventText, children: [_jsx("div", { children: summarizeTaskEvent(event, formatActivityFieldValue) }), displayedChangeEntries.length > 0 && (_jsx("div", { className: formStyles.activityEventChanges, children: displayedChangeEntries.map(([field, change]) => (_jsx("div", { className: formStyles.activityEventChange, children: summarizeTaskChange(field, change, formatActivityFieldValue) }, field))) }))] })] }, item.id));
                             }), _jsx("div", { ref: commentsEndRef })] }), _jsxs("div", { className: formStyles.commentInputArea, children: [_jsx("textarea", { className: formStyles.commentInput, placeholder: t("taskForm.commentPlaceholder"), value: newCommentText, onChange: (e) => onNewCommentTextChange(e.target.value), onKeyDown: (e) => {
                                     if (e.key === "Enter" && !e.shiftKey) {
                                         e.preventDefault();

package/dist/components/task/TaskForm.test.js

@@ -455,7 +455,7 @@ describe("TaskForm Component", () => {
                 ],
             },
         });
-        expect(screen.getByText("ASSIGNED TO: Unassigned -> Planner Bot")).toBeInTheDocument();
+        expect(screen.getByText("Assigned to: Unassigned -> Planner Bot")).toBeInTheDocument();
         expect(screen.queryByText(/ai-profile-1/i)).not.toBeInTheDocument();
     });
     it("renders planning relationship audit activity with reference labels instead of raw ids", () => {
@@ -491,7 +491,7 @@ describe("TaskForm Component", () => {
                 ],
             },
         });
-        expect(screen.getByText("Workstream: none -> WS-12")).toBeInTheDocument();
+        expect(screen.getByText("Workstream changed: none -> WS-12")).toBeInTheDocument();
         expect(screen.queryByText(/workstream-1/i)).not.toBeInTheDocument();
     });
     it("3.13 Update title", async () => {
@@ -504,8 +504,8 @@ describe("TaskForm Component", () => {
     });
     it("keeps scheduled date editable in the task form", () => {
         renderForm({
-            editingTaskId: "parent-1",
-            currentTask: { id: "parent-1", title: "Parent Task" },
+            editingTaskId: "task-1",
+            currentTask: { id: "task-1", title: "Schedulable task" },
         });
         const scheduledLabel = screen.getByText("Scheduled:");
         const scheduledInput = scheduledLabel.nextElementSibling;
@@ -513,7 +513,6 @@ describe("TaskForm Component", () => {
         if (!scheduledInput)
             throw new Error("Scheduled date input missing");
         expect(scheduledInput.disabled).toBe(false);
-        expect(screen.queryByText("Parent tasks cannot be scheduled. Schedule leaf tasks instead.")).not.toBeInTheDocument();
     });
     it("3.14 Context Documents section renders", async () => {
         const user = userEvent.setup();
@@ -682,9 +681,112 @@ describe("TaskForm Component", () => {
                 ],
             },
         });
-        expect(screen.getByText("Status: task -> in-progress")).toBeInTheDocument();
+        expect(screen.getByText("Status changed: Task -> In Progress")).toBeInTheDocument();
         expect(screen.queryByText("System")).not.toBeInTheDocument();
     });
+    it("captures comments alongside audit events and avoids duplicate comment event rows", () => {
+        renderForm({
+            editingTaskId: "123",
+            comments: [
+                {
+                    id: "comment-activity-1",
+                    author: "user",
+                    text: "This comment should stay visible.",
+                    timestamp: "2026-03-22T10:05:00.000Z",
+                },
+            ],
+            currentTask: {
+                id: "task-activity-with-comment",
+                title: "Activity with comment",
+                status: "task",
+                createdAt: "2026-03-22T09:00:00.000Z",
+                activity: [
+                    {
+                        id: "event:status-1",
+                        type: "event",
+                        timestamp: "2026-03-22T10:00:00.000Z",
+                        event: {
+                            id: "status-1",
+                            taskId: "task-activity-with-comment",
+                            workspaceId: "default",
+                            action: "task-status-changed",
+                            actor: "user",
+                            actorType: "human",
+                            createdAt: "2026-03-22T10:00:00.000Z",
+                            details: {
+                                changes: {
+                                    status: { from: "task", to: "in-progress" },
+                                },
+                            },
+                        },
+                    },
+                    {
+                        id: "event:comment-added-1",
+                        type: "event",
+                        timestamp: "2026-03-22T10:05:00.000Z",
+                        event: {
+                            id: "comment-added-1",
+                            taskId: "task-activity-with-comment",
+                            workspaceId: "default",
+                            action: "task-comment-added",
+                            actor: "user",
+                            actorType: "human",
+                            createdAt: "2026-03-22T10:05:00.000Z",
+                        },
+                    },
+                ],
+            },
+        });
+        expect(screen.getByText("This comment should stay visible.")).toBeInTheDocument();
+        expect(screen.getByText("Status changed: Task -> In Progress")).toBeInTheDocument();
+        expect(screen.queryByText("Comment added")).not.toBeInTheDocument();
+    });
+    it("does not repeat the primary activity change in multi-change event details", () => {
+        renderForm({
+            editingTaskId: "123",
+            assigneeOptions: [
+                ...defaultProps.assigneeOptions,
+                {
+                    value: "member-2",
+                    label: "Tiffany Case",
+                    icon: "User",
+                    color: "#22c55e",
+                    kind: "member",
+                },
+            ],
+            currentTask: {
+                id: "task-multi-change",
+                title: "Multi change task",
+                status: "in-progress",
+                createdAt: "2026-03-22T09:00:00.000Z",
+                activity: [
+                    {
+                        id: "event:multi-change-1",
+                        type: "event",
+                        timestamp: "2026-03-22T10:00:00.000Z",
+                        event: {
+                            id: "multi-change-1",
+                            taskId: "task-multi-change",
+                            workspaceId: "default",
+                            action: "task-status-changed",
+                            actor: "user",
+                            actorType: "human",
+                            createdAt: "2026-03-22T10:00:00.000Z",
+                            details: {
+                                changes: {
+                                    status: { from: "task", to: "in-progress" },
+                                    assignee: { from: "unassigned", to: "member-2" },
+                                },
+                            },
+                        },
+                    },
+                ],
+            },
+        });
+        expect(screen.getByText("Status changed: Task -> In Progress")).toBeInTheDocument();
+        expect(screen.getByText("Assigned to: Unassigned -> Tiffany Case")).toBeInTheDocument();
+        expect(screen.queryByText("Status: Task -> In Progress")).not.toBeInTheDocument();
+    });
     it("summarizes description audit events without rendering the full description body", () => {
         renderForm({
             editingTaskId: "123",
@@ -720,7 +822,7 @@ describe("TaskForm Component", () => {
                 ],
             },
         });
-        expect(screen.getByText("DESCRIPTION: added")).toBeInTheDocument();
+        expect(screen.getByText("Description: added")).toBeInTheDocument();
         expect(screen.queryByText(/Line one/)).not.toBeInTheDocument();
         expect(screen.queryByText(/Line two/)).not.toBeInTheDocument();
         expect(screen.queryByText(/Line three/)).not.toBeInTheDocument();
@@ -760,7 +862,7 @@ describe("TaskForm Component", () => {
                 ],
             },
         });
-        expect(screen.getByText("TITLE: updated")).toBeInTheDocument();
+        expect(screen.getByText("Title: updated")).toBeInTheDocument();
         expect(screen.queryByText("Old title")).not.toBeInTheDocument();
         expect(screen.queryByText("New title")).not.toBeInTheDocument();
     });

package/dist/components/task/TaskKanban.d.ts

@@ -53,6 +53,7 @@ interface TaskKanbanProps {
     filterPriorities?: number[];
     filterStatus?: string[];
     filterAssignees?: TaskAssignee[];
+    filtersReady?: boolean;
     scheduleFilteredTaskIds?: string[];
     categories?: CategoryConfig[];
     compressed?: boolean;
@@ -71,5 +72,5 @@ interface TaskKanbanProps {
     workstreams?: WorkstreamItem[];
     initiatives?: InitiativeItem[];
 }
-export declare 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, filterCategories, filterTypes, filterPriorities, filterStatus, filterAssignees, scheduleFilteredTaskIds, categories, compressed, readOnlyMode, recentlyChangedTaskIds, scheduleDates, onScheduleDaySelected, persistedScrollLeft, onScrollLeftChange, sortBy, sortOrder, planningDropTargets, onAssignTaskToWorkstream, onAssignWorkstreamToInitiative, showTaskCardStatusLabel, workstreams, initiatives, }: TaskKanbanProps): import("react/jsx-runtime").JSX.Element;
+export declare 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, filterCategories, filterTypes, filterPriorities, filterStatus, filterAssignees, filtersReady, scheduleFilteredTaskIds, categories, compressed, readOnlyMode, recentlyChangedTaskIds, scheduleDates, onScheduleDaySelected, persistedScrollLeft, onScrollLeftChange, sortBy, sortOrder, planningDropTargets, onAssignTaskToWorkstream, onAssignWorkstreamToInitiative, showTaskCardStatusLabel, workstreams, initiatives, }: TaskKanbanProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/task/TaskKanban.js

@@ -11,7 +11,7 @@ import { buildScheduleDropResult, buildStatusTransitionUpdates, getGroupedTaskSt
 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, 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 = [], }) {
+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 = [], filtersReady = true, 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 [isHeaderPanning, setIsHeaderPanning] = useState(false);
     const [headerPanEnabled, setHeaderPanEnabled] = useState(false);
@@ -130,20 +130,99 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
         ]);
         return dateToColumn.get(scheduledDate) || '__offweek';
     };
+    const inferredKanbanColumns = useMemo(() => {
+        if (groupBy === 'schedule')
+            return [];
+        const existingValues = new Set(kanbanColumns.map((column) => String(column.value)));
+        const existingLabels = new Set(kanbanColumns.map((column) => column.label));
+        const inferred = [];
+        const buildColumn = (task) => {
+            const rawValue = groupBy === 'status'
+                ? getTaskStatus(task)
+                : task[groupBy];
+            const value = String(rawValue ?? '');
+            if (!value || existingValues.has(value) || existingLabels.has(value))
+                return null;
+            if (groupBy === 'category') {
+                const category = categories.find((entry) => entry.value === value || entry.label === value);
+                return {
+                    value,
+                    label: category?.label || value,
+                    icon: category?.icon || 'Folder',
+                    color: category?.color,
+                };
+            }
+            if (groupBy === 'type') {
+                const type = types?.find((entry) => entry.value === value || entry.label === value);
+                return {
+                    value,
+                    label: type?.label || value,
+                    icon: type?.icon || 'CheckSquare',
+                    color: type?.color,
+                };
+            }
+            if (groupBy === 'priority') {
+                const priority = priorities?.find((entry) => Number(entry.value) === Number(value));
+                return {
+                    value: Number.isFinite(Number(value)) ? Number(value) : value,
+                    label: priority?.label || value,
+                    icon: priority?.icon || 'Flag',
+                    color: priority?.color,
+                };
+            }
+            if (groupBy === 'complexity') {
+                return {
+                    value: Number.isFinite(Number(value)) ? Number(value) : value,
+                    label: value,
+                    icon: 'Gauge',
+                };
+            }
+            if (groupBy === 'status') {
+                return {
+                    value,
+                    label: value,
+                    icon: 'Circle',
+                };
+            }
+            if (groupBy === 'assignee') {
+                const option = assigneeOptions.find((entry) => entry.value === value);
+                return {
+                    value,
+                    label: option?.label || value,
+                    icon: option?.icon === 'HelpCircle' ? 'Circle' : option?.icon,
+                    color: option?.color,
+                };
+            }
+            return {
+                value,
+                label: value,
+            };
+        };
+        for (const task of tasks) {
+            const column = buildColumn(task);
+            if (!column)
+                continue;
+            inferred.push(column);
+            existingValues.add(String(column.value));
+            existingLabels.add(column.label);
+        }
+        return inferred;
+    }, [assigneeOptions, categories, groupBy, kanbanColumns, priorities, tasks, types]);
+    const effectiveKanbanColumns = useMemo(() => [...kanbanColumns, ...inferredKanbanColumns], [inferredKanbanColumns, kanbanColumns]);
     const columnLookup = useMemo(() => {
         const map = new Map();
-        for (const column of kanbanColumns) {
+        for (const column of effectiveKanbanColumns) {
             map.set(String(column.value), column);
             if (!map.has(column.label)) {
                 map.set(column.label, column);
             }
         }
         return map;
-    }, [kanbanColumns]);
+    }, [effectiveKanbanColumns]);
     // Totals for "X / Y" display
     const columnTotals = useMemo(() => {
         const counts = {};
-        kanbanColumns.forEach(col => { counts[String(col.value)] = 0; });
+        effectiveKanbanColumns.forEach(col => { counts[String(col.value)] = 0; });
         const totalsSource = allTasks.length > 0 ? allTasks : tasks;
         totalsSource.forEach(task => {
             let stringValue = '';
@@ -170,12 +249,12 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             }
         });
         return counts;
-    }, [allTasks, tasks, kanbanColumns, groupBy, columnLookup, todayDateOnly]);
+    }, [allTasks, tasks, effectiveKanbanColumns, groupBy, columnLookup, todayDateOnly]);
     // Group items by the groupBy field
     const groupedTasks = useMemo(() => {
         const groups = {};
         // Initialize all columns
-        kanbanColumns.forEach(col => {
+        effectiveKanbanColumns.forEach(col => {
             groups[String(col.value)] = [];
         });
         // Distribute tasks
@@ -232,7 +311,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             });
         }
         return groups;
-    }, [tasks, allTasks, kanbanColumns, groupBy, columnLookup, scheduleFilteredTaskIdSet, todayDateOnly, sortBy, sortOrder]);
+    }, [tasks, allTasks, effectiveKanbanColumns, 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
@@ -248,6 +327,8 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
     const lastReportedScrollLeftRef = useRef(-1);
     // Calculate total width for scroll syncing
     const getIsColumnHidden = (columnValue, title) => {
+        if (!filtersReady)
+            return false;
         if (groupBy === 'category')
             return !filterCategories.includes(String(columnValue));
         if (groupBy === 'type')
@@ -269,7 +350,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
         const COL_WIDTH = 320;
         const COL_COLLAPSED = 72;
         let width = 0;
-        kanbanColumns.forEach((col, index) => {
+        effectiveKanbanColumns.forEach((col, index) => {
             const items = groupedTasks[String(col.value)] || [];
             const isExplicitlyHidden = getIsColumnHidden(col.value, col.label);
             const isAutoHidden = groupBy !== 'schedule' && emptyColumnMode === 'hide' && items.length === 0;
@@ -280,7 +361,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             width += GAP;
         });
         return width;
-    }, [kanbanColumns, groupedTasks, emptyColumnMode, groupBy, filterCategories, filterTypes, filterPriorities, filterStatus]);
+    }, [effectiveKanbanColumns, groupedTasks, emptyColumnMode, groupBy, filterCategories, filterTypes, filterPriorities, filterStatus, filterAssignees, filtersReady]);
     const emitScrollLeft = useCallback((scrollLeft) => {
         if (!onScrollLeftChange)
             return;
@@ -353,7 +434,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
         return () => {
             window.removeEventListener('resize', updatePanAvailability);
         };
-    }, [totalWidth, kanbanColumns.length, groupedTasks]);
+    }, [totalWidth, effectiveKanbanColumns.length, groupedTasks]);
     useEffect(() => {
         const handlePointerMove = (event) => {
             const pan = panStateRef.current;
@@ -474,7 +555,7 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
             return;
         // Find the column definition
         const column = columnLookup.get(containerId)
-            || kanbanColumns.find(c => String(c.value) === containerId || c.label === containerId);
+            || effectiveKanbanColumns.find(c => String(c.value) === containerId || c.label === containerId);
         if (column) {
             if (groupBy === 'schedule') {
                 const targetColumn = String(column.value);
@@ -681,12 +762,12 @@ export function TaskKanban({ tasks, columns: kanbanColumns, groupBy, searchQuery
     return (_jsxs(DndContext, { sensors: sensors, collisionDetection: customCollisionDetection, onDragStart: handleDragStart, onDragOver: handleDragOver, onDragEnd: handleDragEnd, onDragCancel: (event) => {
             lastPlanningOverRef.current = null;
             setActiveId(null);
-        }, 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) => {
+        }, 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: effectiveKanbanColumns.map((column) => {
                             const columnTasks = groupedTasks[String(column.value)] || [];
                             const isExplicitlyHidden = getIsColumnHidden(column.value, column.label);
                             const isAutoHidden = groupBy !== 'schedule' && emptyColumnMode === 'hide' && columnTasks.length === 0;
                             const isScheduleMode = groupBy === 'schedule';
-                            const hasBacklogColumn = isScheduleMode && kanbanColumns.some((entry) => String(entry.value) === 'backlog');
+                            const hasBacklogColumn = isScheduleMode && effectiveKanbanColumns.some((entry) => String(entry.value) === 'backlog');
                             const isBacklog = isScheduleMode && String(column.value) === 'backlog';
                             const isExpired = isScheduleMode && String(column.value) === 'expired';
                             const backlogTasks = groupedTasks.backlog || [];

package/dist/components/task/TaskKanban.test.js

@@ -61,3 +61,39 @@ describe('TaskKanban schedule expired behavior', () => {
         expect(screen.getByText('1 / 2')).toBeInTheDocument();
     });
 });
+describe('TaskKanban filter bootstrap behavior', () => {
+    it('keeps task columns visible while filters are still initializing', () => {
+        const task = makeTask({
+            id: 'task-filter-bootstrap',
+            title: 'Filter bootstrap visible task',
+            category: 'shared'
+        });
+        render(_jsx(TaskKanban, { tasks: [task], allTasks: [task], columns: [
+                { value: 'shared', label: 'Shared', color: '#3b82f6', icon: 'Folder' }
+            ], groupBy: "category", filterCategories: [], filtersReady: false, onUpdateTask: vi.fn(), onTaskClick: vi.fn() }));
+        expect(screen.getByText('Shared')).toBeInTheDocument();
+        expect(screen.getByText('Filter bootstrap visible task')).toBeInTheDocument();
+    });
+    it('renders a discoverable task when category columns are not loaded yet', () => {
+        const task = makeTask({
+            id: 'task-missing-category-columns',
+            title: 'Visible before categories load',
+            category: 'default'
+        });
+        render(_jsx(TaskKanban, { tasks: [task], allTasks: [task], columns: [], groupBy: "category", filterCategories: [], filtersReady: false, onUpdateTask: vi.fn(), onTaskClick: vi.fn() }));
+        expect(screen.getByText('default')).toBeInTheDocument();
+        expect(screen.getByText('Visible before categories load')).toBeInTheDocument();
+    });
+    it('hides filtered-out columns after filters initialize', () => {
+        const task = makeTask({
+            id: 'task-filter-ready',
+            title: 'Filter ready hidden task',
+            category: 'shared'
+        });
+        render(_jsx(TaskKanban, { tasks: [task], allTasks: [task], columns: [
+                { value: 'shared', label: 'Shared', color: '#3b82f6', icon: 'Folder' }
+            ], groupBy: "category", filterCategories: [], filtersReady: true, onUpdateTask: vi.fn(), onTaskClick: vi.fn() }));
+        expect(screen.queryByText('Shared')).not.toBeInTheDocument();
+        expect(screen.queryByText('Filter ready hidden task')).not.toBeInTheDocument();
+    });
+});