@sanity/workflow-studio-plugin 0.32.0 → 0.34.0

package/dist/_chunks-es/workflows-tool-root.js

@@ -8,27 +8,27 @@ import { EllipsisHorizontalIcon } from "@sanity/icons/EllipsisHorizontal";
 
 import { LaunchIcon } from "@sanity/icons/Launch";
 
-import { Box, Text, useTheme_v2, Button, Card, useElementRect, Flex, Stack, Dialog, MenuButton, Menu, MenuGroup, MenuItem, MenuDivider, TextInput, Checkbox, Popover, KBD, TabPanel } from "@sanity/ui";
+import { Box, Text, Flex, Stack, Button, useTheme_v2, Card, Dialog, TextInput, Checkbox, KBD, TabPanel } from "@sanity/ui";
+
+import { MenuButton, Menu, MenuGroup, MenuItem, MenuDivider } from "@sanity/ui/menu";
 
 import { useWorkflowTelemetry } from "@sanity/workflow-react";
 
-import { useMemo, useCallback, useState, useLayoutEffect, useEffect, useRef, memo, Fragment as Fragment$1, Activity } from "react";
+import { useState, useEffect, useMemo, useRef, useLayoutEffect, useCallback, Fragment as Fragment$1, memo, Activity } from "react";
 
 import { StateLink, useRouter } from "sanity/router";
 
-import { dueDatesOf, isDueDatePast, isOpenActivityStatus, parseStoredDateValue, findActivity, isHandsOff, assigneesOf, activityLabel, countBy, stageTitle, userIdsOf, RUN_SEARCH_PARAM, toolTabState, namesNoDeployedDefinition, mappingIssueDetail, formatTimeAgo, formatShortDateTime, useSpaceToken, useWorkflowContext, readDeployedDefinitions, describeError, useMinuteClock, NoteBanner, LoadingRow, EmptyState, AgoStamp, AlertGlyph, gdrLocality, openableSchemaType, assignmentHolding, HoverHint, isEvaluationStale, SpinnerSlot, CodeChip, useWorkflowInstanceEntry, useDefinition, deriveActivityDetail, Breadcrumb, instanceBreadcrumb, InvalidDocNotice, openActivityGone, ActivityDetailBody, MetricLockup, shortSpanOf, formatDate, dueMomentSentence, useAvatarSize, OverlineHeading, useUserDisplays, uniqueIds, disambiguatedNames, useProjectMembers, formatShortAgo, MetricPair, AlertChip, DocRefFace, RowAssignees, isLiveEntry, SectionHeading, AbortWorkflowDialog, useLogEventOnMount, WorkflowInstanceDetailViewed, instanceTitle, useContainerToken, InstanceFaultNote, InstanceSnapshotBody, ActivityLog, ActivityDetailDialog, DocPreviewLink, ForMeEmptyState, FOR_ME_SECTION_COPY, ForMeSectionHeading, useCapTrimFor, useTextIconSize, CountedLabel, useRadiusToken, WORKFLOW_API_VERSION, WorkflowTitleSeedDrifted, LogEventOnMount, WorkflowBoardWorkflowSelected, definitionFingerprint, useCurrentUserId, useReleaseTitles, identityOf, UnreadableDocsNote, DismissablePopover, MetaRow, WorkflowDefinitionDetailViewed, toolRoute, landingState, TabSwitch, tabSelectionNavigates, WorkflowToolOpened, workflowState, definitionsRouteOf, TOOL_TABS, useAssignmentIdentity } from "./index.js";
+import { userIdsOf, runRowsOf, RUN_SEARCH_PARAM, toolTabState, countBy, namesNoDeployedDefinition, mappingIssueDetail, formatTimeAgo, useSpaceToken, useWorkflowContext, readDeployedDefinitions, describeError, useMinuteClock, NoteBanner, LoadingRow, EmptyState, useTableStyles, scrollParentOf, SortHeaderButton, TableRowCard, AlertGlyph, gdrLocality, UNREADABLE_DOCUMENT, openableSchemaType, isEvaluationStale, SpinnerSlot, CodeChip, useWorkflowInstanceEntry, useDefinition, deriveActivityDetail, Breadcrumb, instanceBreadcrumb, InvalidDocNotice, openActivityGone, ActivityDetailBody, documentRefsOf, ForMeTable, ForMeEmptyState, FOR_ME_SECTION_COPY, ForMeSectionHeading, forMeSummaryOf, isLiveEntry, SectionHeading, AbortWorkflowDialog, useLogEventOnMount, WorkflowInstanceDetailViewed, instanceTitle, stageTitle, useContainerToken, InstanceFaultNote, InstanceSnapshotBody, ActivityLog, ActivityDetailDialog, DocPreviewLink, blockedRunDetail, overdueRunDetail, stageTasksOf, useAlertChipSize, AttentionMark, DocRefFace, useCapTrimFor, useTextIconSize, StageTaskGroups, CountedLabel, MetricPair, ATTENTION_FACES, overdueAttentionHint, blockedAttentionHint, useRadiusToken, WORKFLOW_API_VERSION, WorkflowTitleSeedDrifted, LogEventOnMount, WorkflowBoardWorkflowSelected, definitionFingerprint, useCurrentUserId, unassignedRunCount, noReleaseRunCount, runAttentionCounts, useReleaseTitles, runCountsByRelease, runCountsByStage, useProjectMembers, runCountsByAssignee, runCountsByRole, useUserDisplays, useAvatarSize, runsScopeOf, rowHasTaskHeldBy, forMeRowId, RunsTable, runCountsByWorkflow, forMeTaskRowsOf, forMeSectionsOf, resolveForMeAddress, identityOf, UnreadableDocsNote, DismissablePopover, MetaRow, WorkflowDefinitionDetailViewed, toolRoute, landingState, TabSwitch, tabSelectionNavigates, WorkflowToolOpened, workflowState, definitionsRouteOf, TOOL_TABS, useAssignmentIdentity } from "./index.js";
 
 import { TransferIcon } from "@sanity/icons/Transfer";
 
 import { WarningOutlineIcon } from "@sanity/icons/WarningOutline";
 
-import { useSchema, useDocumentPreviewStore, usePerspective, useClient } from "sanity";
-
-import { assignmentMatch, MemberAvatar, roleMemberCount, roleLabel, memberRoleFor, memberCountLabel, RoleAvatar, roleLabelFor, AssigneeStack } from "@sanity/workflow-components";
+import { assignmentMatch, _formatShortDateTime, AgoStamp, _HoverHint, RoleAvatar, MemberAvatar, roleLabelFor, AssigneeStack } from "@sanity/workflow-components";
 
-import { entryDocRefs, toBareId, findOpenStageEntry, findStageNode, deriveWorkflowAutonomy, deriveExecutorClassification, terminalState, openActivityAssignments, assignmentState, activeAssignmentMembers, startKindOf, isSubjectEntry, isInputSourced, latestDeployedDefinitions, isTerminalStage, isStartableDefinition } from "@sanity/workflow-engine";
+import { useSchema, useDocumentPreviewStore, usePerspective, useClient } from "sanity";
 
-import { useVirtualizer } from "@tanstack/react-virtual";
+import { activeAssignmentMembers, terminalState, startKindOf, isSubjectEntry, isInputSourced, latestDeployedDefinitions, isTerminalStage, findOpenStageEntry, isStartableDefinition } from "@sanity/workflow-engine";
 
 import { useWorkflowInstancePreviews } from "@sanity/workflow-studio";
 
@@ -42,13 +42,7 @@ import { ExpandIcon } from "@sanity/icons/Expand";
 
 import { useReducedMotion, motion, useSpring, useMotionValueEvent } from "motion/react";
 
-import { CalendarIcon } from "@sanity/icons/Calendar";
-
-import { ErrorOutlineIcon } from "@sanity/icons/ErrorOutline";
-
-import { UserIcon } from "@sanity/icons/User";
-
-import { UsersIcon } from "@sanity/icons/Users";
+import { useVirtualizer } from "@tanstack/react-virtual";
 
 import { createPortal } from "react-dom";
 
@@ -56,6 +50,10 @@ import { styled } from "styled-components";
 
 import { isReferenceSchemaType } from "@sanity/types";
 
+import { UserIcon } from "@sanity/icons/User";
+
+import { Popover } from "@sanity/ui/popover";
+
 import { AddIcon } from "@sanity/icons/Add";
 
 import { CheckmarkIcon } from "@sanity/icons/Checkmark";
@@ -76,400 +74,6 @@ function MutedNote({text: text}) {
     });
 }
 
-function documentRefsOf(instance) {
-    const seen = /* @__PURE__ */ new Map;
-    for (const ref of entryDocRefs(instance.fields)) seen.has(ref.id) || seen.set(ref.id, ref);
-    return [ ...seen.values() ];
-}
-
-function rootInstanceOf(instance, byId) {
-    const rootRef = instance.ancestors[0];
-    return rootRef ? byId.get(toBareId(rootRef.id)) ?? instance : instance;
-}
-
-function openActivitiesOf(instance) {
-    return (findOpenStageEntry(instance)?.activities ?? []).filter(activity => isOpenActivityStatus(activity.status));
-}
-
-function overdueTasks(instance, now) {
-    return openActivitiesOf(instance).filter(activity => dueDatesOf(activity.fields ?? []).some(due => isDueDatePast(due, now)));
-}
-
-function earliestDue(activity) {
-    return earliestOf(dueDatesOf(activity.fields ?? []));
-}
-
-function earliestPastDue(activity, now) {
-    return earliestPastDueAcross([ activity ], now);
-}
-
-function earliestPastDueAcross(activities, now) {
-    return earliestOf(activities.flatMap(activity => dueDatesOf(activity.fields ?? []).filter(due => isDueDatePast(due, now))));
-}
-
-function earliestOf(values) {
-    let earliest;
-    for (const value of values) {
-        const time = parseStoredDateValue(value)?.getTime();
-        time !== void 0 && (earliest === void 0 || time < earliest.time) && (earliest = {
-            time: time,
-            value: value
-        });
-    }
-    return earliest?.value;
-}
-
-const AUTONOMY_BY_DEFINITION = /* @__PURE__ */ new WeakMap;
-
-function cachedAutonomy(definition) {
-    const hit = AUTONOMY_BY_DEFINITION.get(definition);
-    if (hit !== void 0) return hit;
-    const derived = deriveWorkflowAutonomy(definition);
-    return AUTONOMY_BY_DEFINITION.set(definition, derived), derived;
-}
-
-function isAutomatedActivity(args) {
-    const stage = args.autonomy?.stages.find(entry => entry.stage === args.stageName);
-    return isHandsOff({
-        classification: deriveExecutorClassification(args.activity),
-        completesWithoutCaller: stage?.activities[args.activity.name]?.completesWithoutCaller
-    });
-}
-
-function taskOf(args) {
-    const {entry: entry, now: now, openedAt: openedAt, roleAliases: roleAliases, title: title} = args;
-    return {
-        name: entry.name,
-        title: title,
-        assignees: assigneesOf(entry.fields ?? []),
-        roleAliases: roleAliases,
-        openedAt: openedAt,
-        due: earliestDue(entry),
-        overdueSince: earliestPastDue(entry, now),
-        status: entry.status
-    };
-}
-
-function humanTask(args) {
-    const {activity: activity, autonomy: autonomy, entry: entry, now: now, openedAt: openedAt, roleAliases: roleAliases, stageName: stageName} = args;
-    return entry === void 0 ? [] : isAutomatedActivity({
-        activity: activity,
-        autonomy: autonomy,
-        stageName: stageName
-    }) ? [] : [ taskOf({
-        entry: entry,
-        now: now,
-        openedAt: openedAt,
-        roleAliases: roleAliases,
-        title: activityLabel(activity)
-    }) ];
-}
-
-function undeclaredTasks(args) {
-    const {definition: definition, now: now, open: open, openedAt: openedAt, roleAliases: roleAliases, seen: seen, stageName: stageName} = args;
-    return open.filter(entry => !seen.has(entry.name)).map(entry => taskOf({
-        entry: entry,
-        now: now,
-        openedAt: openedAt,
-        roleAliases: roleAliases,
-        title: findActivity({
-            activityName: entry.name,
-            definition: definition,
-            stageName: stageName
-        }).title
-    }));
-}
-
-function definitionForPinned(definition, pinnedVersion) {
-    if (!(definition === void 0 || definition.version !== pinnedVersion)) return definition;
-}
-
-function stageTasksOf(args) {
-    const {definition: definition, instance: instance, now: now} = args, stageEntry = findOpenStageEntry(instance);
-    if (stageEntry === void 0) return [];
-    const listed = listedStageActivities(stageEntry);
-    if (listed.length === 0) return [];
-    const openedAt = stageEntry.enteredAt, pinnedDefinition = definitionForPinned(definition, instance.pinnedVersion), autonomy = pinnedDefinition === void 0 ? void 0 : cachedAutonomy(pinnedDefinition), roleAliases = pinnedDefinition?.roleAliases, stageName = instance.currentStage, openByName = new Map(listed.map(entry => [ entry.name, entry ])), declared = findStageNode({
-        definition: definition,
-        stageName: stageName
-    })?.activities ?? [];
-    return [ ...declared.flatMap(activity => humanTask({
-        activity: activity,
-        autonomy: autonomy,
-        entry: openByName.get(activity.name),
-        now: now,
-        openedAt: openedAt,
-        roleAliases: roleAliases,
-        stageName: stageName
-    })), ...undeclaredTasks({
-        definition: definition,
-        now: now,
-        open: listed,
-        openedAt: openedAt,
-        roleAliases: roleAliases,
-        seen: new Set(declared.map(activity => activity.name)),
-        stageName: stageName
-    }) ];
-}
-
-function listedStageActivities(stage) {
-    return stage.activities.filter(entry => isOpenActivityStatus(entry.status) || entry.status === "failed");
-}
-
-function groupWidthOf(task, metrics) {
-    const mark = taskAssignmentMarkOf(task.assignees), faces = mark.kind === "held" ? mark.members.length : 1;
-    return metrics.face + (faces - 1) * (metrics.face - metrics.overlap);
-}
-
-function rowWidthOf(tasks, metrics) {
-    return tasks.reduce((total, task) => total + groupWidthOf(task, metrics), 0) + Math.max(0, tasks.length - 1) * metrics.gap;
-}
-
-function countWithin(args) {
-    const {budget: budget, metrics: metrics, tasks: tasks} = args;
-    let used = 0, count = 0;
-    for (const task of tasks) {
-        const next = used + (count === 0 ? 0 : metrics.gap) + groupWidthOf(task, metrics);
-        if (next > budget) break;
-        used = next, count += 1;
-    }
-    return Math.max(1, count);
-}
-
-function visibleStageTasks(args) {
-    const {metrics: metrics, room: room, tasks: tasks} = args;
-    if (rowWidthOf(tasks, metrics) <= room) return {
-        overflow: 0,
-        visible: tasks
-    };
-    const shown = countWithin({
-        budget: room - metrics.gap - metrics.counter,
-        metrics: metrics,
-        tasks: tasks
-    });
-    return {
-        overflow: tasks.length - shown,
-        visible: tasks.slice(0, shown)
-    };
-}
-
-function taskAssignmentMarkOf(assignees) {
-    const members = assignees.filter(assignee => assignee.type === "user");
-    if (members.length > 0) return {
-        kind: "held",
-        members: members
-    };
-    const roles = assignees.flatMap(assignee => assignee.type === "role" ? [ assignee.role ] : []);
-    return roles.length > 0 ? {
-        kind: "routed",
-        roles: roles
-    } : {
-        kind: "unassigned"
-    };
-}
-
-function runsScopeOf(row) {
-    return row.endedAt === void 0 ? "open" : "closed";
-}
-
-function rowHasTaskHeldBy(row, who) {
-    return row.tasks.some(task => assignmentMatch(task.assignees, who) !== void 0);
-}
-
-function runCountsByWorkflow(rows) {
-    return countBy(rows, row => [ row.workflowName ]);
-}
-
-function runCountsByAssignee(rows) {
-    return countBy(rows, row => new Set(userIdsOf(row.assignees)));
-}
-
-function runCountsByRole(rows) {
-    return countBy(rows, row => new Set(row.assignees.flatMap(assignee => assignee.type === "role" ? [ assignee.role ] : [])));
-}
-
-function runAttentionCounts(rows) {
-    let blocked = 0, overdue = 0;
-    for (const row of rows) row.attention === "blocked" && (blocked += 1), row.attention === "overdue" && (overdue += 1);
-    return {
-        blocked: blocked,
-        overdue: overdue
-    };
-}
-
-function unassignedRunCount(rows) {
-    return rows.filter(row => row.assignmentStateCounts.unrouted > 0).length;
-}
-
-function runCountsByStage(rows) {
-    return countBy(rows, row => [ row.stage ]);
-}
-
-function runCountsByRelease(rows) {
-    return countBy(rows, row => new Set(row.releases));
-}
-
-function noReleaseRunCount(rows) {
-    return rows.filter(row => row.releases.length === 0).length;
-}
-
-function releasesOfPerspective(perspective) {
-    return Array.isArray(perspective) ? perspective.filter(name => name !== "drafts") : [];
-}
-
-function runRowsOf(args) {
-    const byId = new Map(args.previews.map(preview => [ preview._id, preview ]));
-    return args.previews.map(preview => runRowOf({
-        byId: byId,
-        definitions: args.definitions,
-        now: args.now,
-        preview: preview
-    }));
-}
-
-function runRowOf(args) {
-    const {byId: byId, definitions: definitions, now: now, preview: preview} = args, definition = definitions.get(preview.definition), settled = terminalState(preview) !== "in-flight", held = settled ? NO_ASSIGNEES : openAssignees(preview), attentionDetail = settled ? void 0 : blockedRunDetail({
-        definition: definition,
-        preview: preview
-    }) ?? overdueRunDetail({
-        definition: definition,
-        now: now,
-        preview: preview
-    });
-    return {
-        id: preview._id,
-        document: documentRefsOf(rootInstanceOf(preview, byId))[0],
-        workflowName: preview.definition,
-        workflowTitle: definition?.title ?? preview.definition,
-        stage: preview.currentStage,
-        stageTitle: stageTitle(definition, preview.currentStage),
-        releases: releasesOfPerspective(preview.perspective),
-        startedAt: preview.startedAt,
-        endedAt: settled ? preview.completedAt ?? preview.abortedAt : void 0,
-        outcome: outcomeOf(preview, definition),
-        attention: attentionKindOf(attentionDetail),
-        attentionDetail: attentionDetail,
-        assignees: held.assignees,
-        assignments: held.assignments,
-        assignmentStateCounts: held.counts,
-        tasks: settled ? [] : stageTasksOf({
-            definition: definition,
-            instance: preview,
-            now: now
-        })
-    };
-}
-
-function attentionKindOf(detail) {
-    if (detail !== void 0) return detail.kind === "overdue" ? "overdue" : "blocked";
-}
-
-function outcomeOf(preview, definition) {
-    const state = terminalState(preview);
-    if (state !== "in-flight") return state === "aborted" ? "Aborted" : stageTitle(definition, preview.currentStage);
-}
-
-function blockedRunDetail(args) {
-    const {definition: definition, preview: preview} = args, {stage: stage, titleOf: titleOf} = activityTitleResolver(preview, definition), failed = (stage?.activities ?? []).filter(activity => activity.status === "failed");
-    if (failed.length > 1) return {
-        count: failed.length,
-        kind: "blocked-many"
-    };
-    const only = failed[0];
-    if (only !== void 0) return {
-        kind: "blocked",
-        task: titleOf(only.name)
-    };
-    const stuck = stuckEffectOf({
-        definition: definition,
-        preview: preview,
-        stage: stage
-    });
-    return stuck === void 0 ? void 0 : {
-        effect: stuck.effect.title ?? stuck.effect.name,
-        failed: stuck.failed,
-        kind: "blocked-effect"
-    };
-}
-
-function stuckEffectOf(args) {
-    const reported = failedDeclaredEffect(args);
-    if (reported !== void 0) return {
-        effect: reported,
-        failed: !0
-    };
-    const claimed = args.preview.claimedEffects[0];
-    return claimed === void 0 ? void 0 : {
-        effect: claimed,
-        failed: !1
-    };
-}
-
-function failedDeclaredEffect(args) {
-    const {definition: definition, preview: preview, stage: stage} = args;
-    if (definition === void 0 || definition.version !== preview.pinnedVersion || stage === void 0) return;
-    const stageNode = findStageNode({
-        definition: definition,
-        stageName: stage.name
-    }), unresolved = new Set(stage.activities.filter(activity => activity.status !== "done" && activity.status !== "skipped").map(activity => activity.name)), declared = new Set((stageNode?.activities ?? []).filter(activity => unresolved.has(activity.name)).flatMap(activity => (activity.actions ?? []).flatMap(action => (action.effects ?? []).map(e => e.name))));
-    return [ ...preview.failedEffects ].reverse().find(effect => declared.has(effect.name));
-}
-
-function overdueRunDetail(args) {
-    const {definition: definition, now: now, preview: preview} = args, late = overdueTasks(preview, now);
-    if (late.length === 0) return;
-    const {titleOf: titleOf} = activityTitleResolver(preview, definition), only = late.length === 1 ? late[0] : void 0;
-    return {
-        count: late.length,
-        due: earliestPastDueAcross(late, now),
-        kind: "overdue",
-        task: only === void 0 ? void 0 : titleOf(only.name)
-    };
-}
-
-function activityTitleResolver(preview, definition) {
-    const stage = findOpenStageEntry(preview);
-    return {
-        stage: stage,
-        titleOf: activityName => findActivity({
-            activityName: activityName,
-            definition: definition,
-            stageName: stage?.name ?? ""
-        }).title
-    };
-}
-
-const NO_ASSIGNEES = {
-    assignees: [],
-    assignments: [],
-    counts: {
-        unrouted: 0,
-        routed: 0,
-        held: 0
-    }
-};
-
-function openAssignees(instance) {
-    const users = /* @__PURE__ */ new Map, roles = /* @__PURE__ */ new Map, assignments = openActivityAssignments(instance), counts = {
-        unrouted: 0,
-        routed: 0,
-        held: 0
-    };
-    for (const members of assignments) counts[assignmentState(members)] += 1, recordAssignees(activeAssignmentMembers(members), {
-        users: users,
-        roles: roles
-    });
-    return {
-        assignees: [ ...users.values(), ...roles.values() ],
-        assignments: assignments,
-        counts: counts
-    };
-}
-
-function recordAssignees(assignees, maps) {
-    for (const assignee of assignees) (assignee.type === "user" ? maps.users : maps.roles).set(assignee.type === "user" ? assignee.id : assignee.role, assignee);
-}
-
 function clausePolarity(operator) {
     return operator === "isNot" || operator === "isNoneOf" ? "isNot" : "is";
 }
@@ -843,7 +447,7 @@ function deployedPhrase(definition) {
     const deployedAt = deployedAtOf(definition);
     if (deployedAt === void 0) return `v${definition.version}`;
     const ago = formatTimeAgo(deployedAt);
-    return ago === "" ? formatShortDateTime(deployedAt) : `${formatShortDateTime(deployedAt)} (${ago})`;
+    return ago === "" ? _formatShortDateTime(deployedAt) : `${_formatShortDateTime(deployedAt)} (${ago})`;
 }
 
 const INSTANCES_READ_FAILED = "Couldn’t load workflow data. Try again later.", TOOL_PANEL_PADDING = 3, TOOL_HEADING_PADDING = 2, PANEL_STEP = 3;
@@ -861,207 +465,6 @@ function TabStatusRow({children: children}) {
     });
 }
 
-function useTableStyles() {
-    const {color: color} = useTheme_v2(), headTop = useSpaceToken(3), cellX = useSpaceToken(2);
-    return useMemo(() => ({
-        cell: {
-            borderBottom: `1px solid ${color.border}`,
-            boxSizing: "border-box",
-            padding: `0 ${cellX}px`,
-            verticalAlign: "middle",
-            whiteSpace: "nowrap"
-        },
-        head: {
-            background: color.bg,
-            borderBottom: `1px solid ${color.border}`,
-            boxSizing: "border-box",
-            padding: `${headTop}px 0 6px`,
-            position: "sticky",
-            textAlign: "left",
-            top: 0,
-            zIndex: 1
-        }
-    }), [ cellX, color, headTop ]);
-}
-
-function scrollParentOf(el) {
-    for (let node = el.parentElement; node !== null; node = node.parentElement) {
-        const overflowY = getComputedStyle(node).overflowY;
-        if (overflowY === "auto" || overflowY === "scroll") return node;
-    }
-}
-
-function useRowWindow(args) {
-    const {element: element, keyAt: keyAt, rowCount: rowCount} = args, [scroller, setScroller] = useState(null);
-    useLayoutEffect(() => {
-        setScroller(element === null ? null : scrollParentOf(element) ?? null);
-    }, [ element ]);
-    const [margin, setMargin] = useState(0);
-    useLayoutEffect(() => {
-        element === null || scroller === null || setMargin(element.getBoundingClientRect().top - scroller.getBoundingClientRect().top + scroller.scrollTop);
-    }, [ element, rowCount, scroller ]);
-    const virtualizer = useVirtualizer({
-        count: rowCount,
-        estimateSize: () => 44,
-        getItemKey: keyAt,
-        getScrollElement: () => scroller,
-        overscan: 10,
-        scrollMargin: margin
-    }), items = virtualizer.getVirtualItems(), first = items[0], last = items[items.length - 1];
-    return {
-        items: items,
-        measureRow: virtualizer.measureElement,
-        padBottom: last === void 0 ? 0 : virtualizer.getTotalSize() - (last.end - margin),
-        padTop: first === void 0 ? 0 : first.start - margin
-    };
-}
-
-function SpacerRow({height: height}) {
-    return height <= 0 ? null : /* @__PURE__ */ jsx("tr", {
-        "aria-hidden": !0,
-        style: {
-            height: height
-        },
-        children: /* @__PURE__ */ jsx("td", {
-            colSpan: 99,
-            style: {
-                border: 0,
-                padding: 0
-            }
-        })
-    });
-}
-
-const TABLE_TIME_WIDTH = 112, TABLE_WORKFLOW_WIDTH = {
-    cap: 260,
-    fraction: .18
-}, TABLE_STAGE_WIDTH = {
-    cap: 260,
-    fraction: .16
-};
-
-function SortableHeaderCells({children: children, columns: columns, onSort: onSort, sort: sort, styles: styles, tableWidth: tableWidth, widthOf: widthOf}) {
-    /* @__PURE__ */
-    return jsxs(Fragment, {
-        children: [ columns.map(column => {
-            const width = widthOf(column, tableWidth);
-            /* @__PURE__ */
-            return jsx("th", {
-                style: {
-                    ...styles.head,
-                    ...width === void 0 ? {} : {
-                        width: width
-                    }
-                },
-                children: /* @__PURE__ */ jsx(SortHeaderButton, {
-                    active: sort.key === column.key,
-                    dir: sort.dir,
-                    label: column.label,
-                    onSort: () => onSort(column.key)
-                })
-            }, column.key);
-        }), children ]
-    });
-}
-
-function VirtualTable({keyAt: keyAt, renderHeader: renderHeader, renderRow: renderRow, rowCount: rowCount}) {
-    const styles = useTableStyles(), [element, setElement] = useState(null), tableWidth = useTableWidth(element), window2 = useRowWindow({
-        element: element,
-        keyAt: keyAt,
-        rowCount: rowCount
-    });
-    /* @__PURE__ */
-    return jsx("div", {
-        ref: setElement,
-        style: {
-            overflowX: "clip",
-            ...tableWidth === void 0 ? {
-                visibility: "hidden"
-            } : {}
-        },
-        children: /* @__PURE__ */ jsxs("table", {
-            style: {
-                borderCollapse: "separate",
-                borderSpacing: 0,
-                tableLayout: "fixed",
-                width: "100%"
-            },
-            children: [ 
-            /* @__PURE__ */ jsx("thead", {
-                children: /* @__PURE__ */ jsx("tr", {
-                    children: renderHeader({
-                        styles: styles,
-                        tableWidth: tableWidth
-                    })
-                })
-            }), 
-            /* @__PURE__ */ jsxs("tbody", {
-                children: [ 
-                /* @__PURE__ */ jsx(SpacerRow, {
-                    height: window2.padTop
-                }), window2.items.map(item => renderRow({
-                    index: item.index,
-                    key: item.key,
-                    measureRow: window2.measureRow,
-                    tableWidth: tableWidth
-                })), 
-                /* @__PURE__ */ jsx(SpacerRow, {
-                    height: window2.padBottom
-                }) ]
-            }) ]
-        })
-    });
-}
-
-function useTableWidth(element) {
-    const observed = useElementRect(element), [mounted, setMounted] = useState(void 0);
-    return useLayoutEffect(() => {
-        setMounted(element === null ? void 0 : element.getBoundingClientRect().width);
-    }, [ element ]), observed?.width ?? mounted;
-}
-
-function SortHeaderButton({active: active, dir: dir, label: label, onSort: onSort}) {
-    /* @__PURE__ */
-    return jsx(Button, {
-        fontSize: 1,
-        mode: "bleed",
-        onClick: onSort,
-        padding: 2,
-        text: `${label}${active ? dir === "asc" ? " ↑" : " ↓" : ""}`
-    });
-}
-
-function TableRowCard({children: children, dataIndex: dataIndex, onClick: onClick, onKeyDown: onKeyDown, rowRef: rowRef, selected: selected, selectedRef: selectedRef}) {
-    const setRow = useCallback(element => {
-        rowRef?.(element), selected === !0 && selectedRef?.(element);
-    }, [ rowRef, selected, selectedRef ]);
-    /* @__PURE__ */
-    return jsx(Card, {
-        as: "tr",
-        "data-as": "a",
-        onClick: event => {
-            event.currentTarget.focus(), onClick();
-        },
-        onKeyDown: selected === !0 ? onKeyDown : void 0,
-        style: {
-            cursor: "pointer",
-            display: "table-row"
-        },
-        ...dataIndex === void 0 ? {} : {
-            "data-index": dataIndex
-        },
-        ...rowRef === void 0 && selectedRef === void 0 ? {} : {
-            ref: setRow
-        },
-        ...selected === void 0 ? {} : {
-            "aria-selected": selected,
-            pressed: selected,
-            tabIndex: selected ? 0 : -1
-        },
-        children: children
-    });
-}
-
 const logged = /* @__PURE__ */ new WeakSet;
 
 function logReadFailure(what, error) {
@@ -1259,7 +662,7 @@ function UndeployedWorkflows({notices: notices}) {
     });
 }
 
-const COLUMNS$1 = [ {
+const COLUMNS = [ {
     key: "workflow",
     label: "Workflow"
 }, {
@@ -1299,7 +702,7 @@ function DefinitionsTable({countKnown: countKnown, now: now, onOpenWorkflow: onO
         children: [ 
         /* @__PURE__ */ jsx("thead", {
             children: /* @__PURE__ */ jsxs("tr", {
-                children: [ COLUMNS$1.map(column => /* @__PURE__ */ jsx("th", {
+                children: [ COLUMNS.map(column => /* @__PURE__ */ jsx("th", {
                     style: {
                         ...head,
                         ...column.width === void 0 ? {} : {
@@ -1357,7 +760,7 @@ function DefinitionRow({countKnown: countKnown, now: now, onOpen: onOpen, row: r
                 paddingRight: titleGap
             },
             children: /* @__PURE__ */ jsxs(Stack, {
-                space: 3,
+                gap: 3,
                 children: [ 
                 /* @__PURE__ */ jsx(Text, {
                     size: 1,
@@ -1476,7 +879,7 @@ function useDocPreviewTitles(documents) {
         }, evaluate = () => {
             for (const {doc: doc, bareId: bareId} of localDocs) {
                 const probe = actualTypes.read(bareId);
-                if (probe === null) {
+                if (probe === null || probe === UNREADABLE_DOCUMENT) {
                     dropPreview(doc.id), resolved.add(doc.id);
                     continue;
                 }
@@ -1554,86 +957,18 @@ function outsiderIds(args) {
     return [ ...new Set(candidates.filter(id => !memberIds.has(id))) ];
 }
 
-function forMeRowId(instanceId, activityName) {
-    return `${instanceId}\t${activityName}`;
+function documentTitleKey(row, titles) {
+    return row.document === void 0 ? "" : titles.get(row.document.id) ?? "";
 }
 
-function forMeTaskRowsOf(args) {
-    const {now: now, rows: rows, who: who} = args;
-    return rows.flatMap(row => row.tasks.flatMap(task => {
-        const assignment = assignmentHolding(task.assignees, who);
-        if (assignment === "other") return [];
-        const attentionDetail = taskAttentionDetail({
-            now: now,
-            row: row,
-            task: task
-        });
-        return [ {
-            id: forMeRowId(row.id, task.name),
-            instanceId: row.id,
-            activityName: task.name,
-            title: task.title,
-            document: row.document,
-            workflowTitle: row.workflowTitle,
-            releases: row.releases,
-            openedAt: task.openedAt,
-            due: task.due,
-            attention: attentionKindOf(attentionDetail),
-            attentionDetail: attentionDetail,
-            assignees: task.assignees,
-            assignment: assignment
-        } ];
-    }));
+function namedRowComparator(key, titles) {
+    return key === "document" ? (a, b) => documentTitleKey(a, titles).localeCompare(documentTitleKey(b, titles)) : (a, b) => a.workflowTitle.localeCompare(b.workflowTitle);
 }
 
-function forMeSummaryOf(rows) {
-    const documents = new Set(rows.flatMap(row => row.document === void 0 ? [] : [ row.document.id ])), releases = new Set(rows.flatMap(row => row.releases));
+function defaultForMeSort() {
     return {
-        lead: rows.length === 0 ? "No tasks" : pluralize("task", rows.length, !0),
-        subjects: `on ${pluralize("document", documents.size, !0)}, and ${pluralize("release", releases.size, !0)}`
-    };
-}
-
-function forMeSectionsOf(rows) {
-    return {
-        assignedToUser: rows.filter(row => row.assignment === "you"),
-        assignedToRoles: rows.filter(row => row.assignment === "role")
-    };
-}
-
-function resolveForMeAddress(args) {
-    const {rows: rows, run: run, task: task} = args;
-    if (run === void 0) return;
-    if (task !== void 0) return rows.some(row => row.instanceId === run && row.activityName === task) ? {
-        run: run,
-        task: task
-    } : void 0;
-    const first = rows.find(row => row.instanceId === run);
-    return first === void 0 ? void 0 : {
-        run: first.instanceId,
-        task: first.activityName
-    };
-}
-
-function taskAttentionDetail(args) {
-    const {now: now, row: row, task: task} = args;
-    if (task.status === "failed") return {
-        kind: "blocked",
-        task: task.title
-    };
-    if (row.attention === "blocked") return row.attentionDetail;
-    if (task.due !== void 0 && isDueDatePast(task.due, now)) return {
-        count: 1,
-        due: task.due,
-        kind: "overdue",
-        task: task.title
-    };
-}
-
-function defaultForMeSort() {
-    return {
-        dir: "asc",
-        key: "due"
+        dir: "asc",
+        key: "due"
     };
 }
 
@@ -1664,17 +999,11 @@ function forMeCompare(args) {
     return (a, b) => dir * named(a, b);
 }
 
-function documentTitleKey$1(row, titles) {
-    return row.document === void 0 ? "" : titles.get(row.document.id) ?? "";
-}
-
 function namedCompare(key, titles) {
     switch (key) {
       case "document":
-        return (a, b) => documentTitleKey$1(a, titles).localeCompare(documentTitleKey$1(b, titles));
-
       case "workflow":
-        return (a, b) => a.workflowTitle.localeCompare(b.workflowTitle);
+        return namedRowComparator(key, titles);
 
       default:
         return (a, b) => a.title.localeCompare(b.title);
@@ -1922,7 +1251,7 @@ function PanelResizeHandle({enabled: enabled, onClose: onClose, onCommit: onComm
                 top: 0
             }
         }), 
-        /* @__PURE__ */ jsx(HoverHint, {
+        /* @__PURE__ */ jsx(_HoverHint, {
             anchor: anchor,
             disabled: !enabled || dragging,
             open: pointed,
@@ -2432,567 +1761,96 @@ function ForMeDetailPanel({activityName: activityName, instanceId: instanceId, o
     });
 }
 
-const LATE_FACE = {
-    Icon: CalendarIcon,
-    tone: "caution"
-};
-
-function LateSpan({now: now, since: since}) {
-    /* @__PURE__ */
-    return jsx(MetricLockup, {
-        Icon: LATE_FACE.Icon,
-        tone: LATE_FACE.tone,
-        value: shortSpanOf(parseStoredDateValue(since), now)
-    });
-}
-
-function DueStamp({due: due, now: now}) {
-    /* @__PURE__ */
-    return jsx(Flex, {
-        align: "center",
-        children: /* @__PURE__ */ jsx(HoverHint, {
-            text: dueMomentSentence(due, now),
-            children: isDueDatePast(due, now) ? /* @__PURE__ */ jsx(LateSpan, {
-                now: now,
-                since: due
-            }) : 
-            /* @__PURE__ */ jsx(Text, {
-                muted: !0,
-                size: 1,
-                style: {
-                    whiteSpace: "nowrap"
-                },
-                children: formatDate(due)
-            })
-        })
-    });
-}
-
-function resolveColumnWidth(width, tableWidth) {
-    return typeof width != "object" ? width : tableWidth === void 0 ? `${width.fraction * 100}%` : Math.min(width.cap, Math.round(tableWidth * width.fraction));
-}
-
-function fillColumnWidth(args) {
-    const {columns: columns, tableWidth: tableWidth, trailingWidth: trailingWidth} = args;
-    if (tableWidth === void 0) return;
-    const fixed = columns.reduce((sum, column) => {
-        const width = resolveColumnWidth(column.width, tableWidth);
-        return typeof width == "number" ? sum + width : sum;
-    }, trailingWidth);
-    return Math.max(160, Math.floor(tableWidth - fixed));
-}
-
-const HOLDER_OVERLAP = 7, HOLDER_RING = 1.5, GROUP_GAP_TOKEN = 3;
-
-function useDisplayById(ids) {
-    const displays = useUserDisplays(uniqueIds(ids)), labels = disambiguatedNames(displays);
-    return new Map(displays.map((display, index) => [ display.id, {
-        ...display,
-        label: labels[index] ?? display.name
-    } ]));
-}
-
-function holderKey(assignee, index) {
-    return `${assignee.id}-${index}`;
-}
-
-function stageTasksFace(args) {
-    return {
-        content: /* @__PURE__ */ jsx(StageTasksCard, {
-            now: args.now,
-            tasks: args.tasks
-        }),
-        flush: !0,
-        wide: !0
-    };
-}
-
-function StageTaskGroups({now: now, room: room, tasks: tasks}) {
-    const gap = useSpaceToken(GROUP_GAP_TOKEN), face = useAvatarSize(), {overflow: overflow, visible: visible} = visibleStageTasks({
-        metrics: {
-            counter: face,
-            face: face,
-            gap: gap,
-            overlap: HOLDER_OVERLAP
-        },
-        room: room ?? face * 3 + gap * 2,
-        tasks: tasks
-    });
-    return tasks.length === 0 ? null : /* @__PURE__ */ jsx(HoverHint, {
-        ...stageTasksFace({
-            now: now,
-            tasks: tasks
-        }),
-        children: /* @__PURE__ */ jsxs(Flex, {
-            align: "center",
-            "aria-label": "Tasks",
-            style: {
-                columnGap: gap
-            },
-            children: [ visible.map(task => /* @__PURE__ */ jsx(TaskGroupFace, {
-                assignees: task.assignees
-            }, task.name)), overflow === 0 ? null : /* @__PURE__ */ jsxs(Text, {
-                muted: !0,
-                size: 1,
-                children: [ "+", overflow ]
-            }) ]
-        })
-    });
-}
-
-function TaskGroupFace({assignees: assignees}) {
-    const mark = taskAssignmentMarkOf(assignees);
-    return mark.kind === "unassigned" ? /* @__PURE__ */ jsx(PersonToken, {}) : mark.kind === "routed" ? /* @__PURE__ */ jsx(PersonToken, {
-        routed: !0
-    }) : /* @__PURE__ */ jsx(OverlappedHolders, {
-        assignees: mark.members
-    });
-}
-
-function HolderFace({assignee: assignee, displayById: displayById}) {
-    const display = displayById.get(assignee.id);
-    /* @__PURE__ */
-    return jsx(MemberAvatar, {
-        imageUrl: display?.imageUrl,
-        name: display?.name ?? assignee.id,
-        size: 0
-    });
-}
-
-function OverlappedHolders({assignees: assignees}) {
-    const {color: color} = useTheme_v2(), displayById = useDisplayById(userIdsOf(assignees)), ring = `0 0 0 ${HOLDER_RING}px ${color.bg}`;
-    /* @__PURE__ */
-    return jsx(Flex, {
-        align: "center",
-        style: {
-            flexShrink: 0,
-            isolation: "isolate"
-        },
-        children: assignees.map((assignee, index) => /* @__PURE__ */ jsx(Box, {
-            style: {
-                borderRadius: "50%",
-                boxShadow: ring,
-                flexShrink: 0,
-                marginLeft: index === 0 ? 0 : -HOLDER_OVERLAP,
-                position: "relative",
-                zIndex: index
-            },
-            children: /* @__PURE__ */ jsx(HolderFace, {
-                assignee: assignee,
-                displayById: displayById
-            })
-        }, holderKey(assignee, index)))
-    });
-}
-
-function PersonToken({routed: routed = !1}) {
-    const size = useAvatarSize(), {color: color} = useTheme_v2();
-    /* @__PURE__ */
-    return jsxs(Box, {
-        "aria-label": routed ? "Routed, no person assigned" : "Unassigned",
-        role: "img",
-        style: {
-            flexShrink: 0,
-            height: size,
-            position: "relative",
-            width: size
-        },
+function ForMeTables({loading: loading, now: now, onNavigateKey: onNavigateKey, onSelect: onSelect, onSort: onSort, selectedId: selectedId, selectedRef: selectedRef, sort: sort, sections: sections}) {
+    return loading ? /* @__PURE__ */ jsxs(Fragment, {
         children: [ 
-        /* @__PURE__ */ jsx(Flex, {
-            align: "center",
-            justify: "center",
-            style: {
-                border: `1px dashed ${color.border}`,
-                borderRadius: "50%",
-                boxSizing: "border-box",
-                height: size,
-                width: size
-            },
-            children: /* @__PURE__ */ jsx(Text, {
-                size: 0,
-                children: /* @__PURE__ */ jsx(UserIcon, {
-                    style: {
-                        color: color.input.default.enabled.placeholder
-                    }
-                })
-            })
-        }), routed ? /* @__PURE__ */ jsx(Card, {
-            radius: 1,
-            tone: "primary",
-            style: {
-                bottom: -3,
-                position: "absolute",
-                right: -3
-            },
-            children: /* @__PURE__ */ jsx(Flex, {
-                align: "center",
-                justify: "center",
-                style: {
-                    height: 13,
-                    width: 13
-                },
-                children: /* @__PURE__ */ jsx(Text, {
-                    size: 0,
-                    children: /* @__PURE__ */ jsx(UsersIcon, {})
-                })
+        /* @__PURE__ */ jsx(LoadingRow, {
+            label: "Loading…",
+            padding: 2
+        }), selectedId === void 0 ? null : /* @__PURE__ */ jsx(LoadingTablePlaceholder, {
+            children: /* @__PURE__ */ jsx(ForMeTable, {
+                now: now,
+                onNavigateKey: onNavigateKey,
+                onSelect: onSelect,
+                onSort: onSort,
+                rows: [],
+                selectedId: void 0,
+                selectedRef: selectedRef,
+                sort: sort
             })
-        }) : null ]
-    });
-}
-
-function StageTasksCard({now: now, tasks: tasks}) {
-    const displayById = useDisplayById(tasks.flatMap(task => userIdsOf(task.assignees)));
-    /* @__PURE__ */
-    return jsxs(Stack, {
-        gap: 4,
-        padding: 3,
+        }) ]
+    }) : sections.assignedToUser.length === 0 && sections.assignedToRoles.length === 0 ? /* @__PURE__ */ jsx(ForMeEmptyState, {}) : /* @__PURE__ */ jsxs(Stack, {
+        gap: 6,
         children: [ 
-        /* @__PURE__ */ jsx(OverlineHeading, {
-            children: "Tasks in this stage"
+        /* @__PURE__ */ jsx(ForMeSection, {
+            description: /* @__PURE__ */ jsx(ForMeSectionCount, {
+                rows: sections.assignedToUser
+            }),
+            now: now,
+            onNavigateKey: onNavigateKey,
+            onSelect: onSelect,
+            onSort: onSort,
+            rows: sections.assignedToUser,
+            selectedId: selectedId,
+            selectedRef: selectedRef,
+            sort: sort,
+            title: FOR_ME_SECTION_COPY.assignedTitle
         }), 
-        /* @__PURE__ */ jsx(Stack, {
-            gap: 4,
-            children: tasks.map(task => /* @__PURE__ */ jsx(TaskCardRow, {
-                displayById: displayById,
-                now: now,
-                task: task
-            }, task.name))
+        /* @__PURE__ */ jsx(ForMeSection, {
+            description: FOR_ME_SECTION_COPY.roleDescription,
+            now: now,
+            onNavigateKey: onNavigateKey,
+            onSelect: onSelect,
+            onSort: onSort,
+            rows: sections.assignedToRoles,
+            selectedId: selectedId,
+            selectedRef: selectedRef,
+            sort: sort,
+            title: FOR_ME_SECTION_COPY.roleTitle
         }) ]
     });
 }
 
-function TaskCardRow({displayById: displayById, now: now, task: task}) {
-    const mark = taskAssignmentMarkOf(task.assignees);
-    /* @__PURE__ */
-    return jsxs(Stack, {
+function ForMeSection({description: description, now: now, onNavigateKey: onNavigateKey, onSelect: onSelect, onSort: onSort, rows: rows, selectedId: selectedId, selectedRef: selectedRef, sort: sort, title: title}) {
+    return rows.length === 0 ? null : /* @__PURE__ */ jsxs(Stack, {
         gap: 3,
         children: [ 
-        /* @__PURE__ */ jsxs(Stack, {
-            gap: 2,
-            children: [ 
-            /* @__PURE__ */ jsxs(Flex, {
-                align: "center",
-                gap: 3,
-                children: [ 
-                /* @__PURE__ */ jsx(Text, {
-                    size: 1,
-                    children: task.title
-                }), task.overdueSince === void 0 ? null : /* @__PURE__ */ jsx(LateSpan, {
-                    now: now,
-                    since: task.overdueSince
-                }) ]
-            }), task.due === void 0 ? null : /* @__PURE__ */ jsx(Text, {
-                muted: !0,
-                size: 1,
-                children: dueMomentSentence(task.due, now)
-            }) ]
+        /* @__PURE__ */ jsx(ForMeSectionHeading, {
+            description: description,
+            title: title
         }), 
-        /* @__PURE__ */ jsx(AssignmentLine, {
-            displayById: displayById,
-            mark: mark,
+        /* @__PURE__ */ jsx(ForMeTable, {
             now: now,
-            openedAt: task.openedAt,
-            roleAliases: task.roleAliases
-        }) ]
-    });
-}
-
-function AssignmentLine({displayById: displayById, mark: mark, now: now, openedAt: openedAt, roleAliases: roleAliases}) {
-    return mark.kind === "unassigned" ? /* @__PURE__ */ jsxs(Flex, {
-        align: "center",
-        gap: 2,
-        children: [ 
-        /* @__PURE__ */ jsx(PersonToken, {}), 
-        /* @__PURE__ */ jsx(Text, {
-            muted: !0,
-            size: 1,
-            children: "Unassigned"
+            onNavigateKey: onNavigateKey,
+            onSelect: onSelect,
+            onSort: onSort,
+            rows: rows,
+            selectedId: selectedId,
+            selectedRef: selectedRef,
+            sort: sort
         }) ]
-    }) : mark.kind === "routed" ? /* @__PURE__ */ jsx(RoutedAssignmentLine, {
-        mark: mark,
-        now: now,
-        openedAt: openedAt,
-        roleAliases: roleAliases
-    }) : /* @__PURE__ */ jsx(Stack, {
-        gap: 2,
-        children: mark.members.map((assignee, index) => /* @__PURE__ */ jsxs(Flex, {
-            align: "center",
-            gap: 2,
-            children: [ 
-            /* @__PURE__ */ jsx(HolderFace, {
-                assignee: assignee,
-                displayById: displayById
-            }), 
-            /* @__PURE__ */ jsx(Text, {
-                size: 1,
-                children: displayById.get(assignee.id)?.label ?? assignee.id
-            }) ]
-        }, holderKey(assignee, index)))
     });
 }
 
-function RoutedAssignmentLine({mark: mark, now: now, openedAt: openedAt, roleAliases: roleAliases}) {
-    const vocabulary = useProjectMembers(), count = roleMemberCount({
-        members: vocabulary.members,
-        requiredRoles: mark.roles,
-        roleAliases: roleAliases
-    }), names = mark.roles.map(role => roleLabel(memberRoleFor(vocabulary, role)));
+function ForMeSectionCount({rows: rows}) {
+    const summary = forMeSummaryOf(rows);
     /* @__PURE__ */
     return jsxs(Flex, {
         align: "center",
-        gap: 2,
-        children: [ 
-        /* @__PURE__ */ jsx(PersonToken, {
-            routed: !0
-        }), 
-        /* @__PURE__ */ jsxs(Stack, {
-            gap: 1,
-            children: [ 
-            /* @__PURE__ */ jsx(Text, {
-                size: 1,
-                children: names.join(", ")
-            }), 
-            /* @__PURE__ */ jsxs(Text, {
-                muted: !0,
-                size: 1,
-                children: [ memberCountLabel(count), " · Open ", formatShortAgo(openedAt, now) ]
-            }) ]
-        }) ]
-    });
-}
-
-function overdueAttentionHint(documents) {
-    const task = documents === 1 ? "an overdue task" : "overdue tasks";
-    return `${pluralize("document", documents, !0)} ${documents === 1 ? "has" : "have"} ${task}`;
-}
-
-function blockedAttentionHint(documents) {
-    return `${pluralize("document", documents, !0)} ${documents === 1 ? "is" : "are"} blocked`;
-}
-
-function overdueMark(detail, now) {
-    const span = overdueSpan(detail.due, now), tasks = pluralize("task", detail.count, !0);
-    return detail.count === 1 && detail.task !== void 0 ? {
-        hint: `“${detail.task}” — ${span === void 0 ? "overdue" : `${span} overdue`}`,
-        value: span ?? tasks
-    } : {
-        hint: span === void 0 ? `${tasks} overdue` : `${tasks} overdue — the longest by ${span}`,
-        value: tasks
-    };
-}
-
-function overdueSpan(due, now) {
-    const from = parseStoredDateValue(due);
-    if (from !== void 0) return shortSpanOf(from, now);
-}
-
-function overdueMarkOpensPanel(tasks) {
-    return tasks.some(task => task.overdueSince !== void 0);
-}
-
-function blockedMarkHint(detail) {
-    return detail.kind === "blocked-many" ? `${pluralize("task", detail.count, !0)} were sent back` : detail.kind === "blocked-effect" ? `Automation “${detail.effect}” ${detail.failed ? "failed" : "didn’t finish"}` : detail.task === void 0 ? "A task was sent back" : `“${detail.task}” was sent back`;
-}
-
-const ATTENTION_FACES = {
-    blocked: {
-        Icon: ErrorOutlineIcon,
-        tone: "critical"
-    },
-    overdue: LATE_FACE
-};
-
-function AttentionMark({detail: detail, now: now, tasks: tasks}) {
-    if (detail.kind === "overdue") {
-        const {hint: hint2, value: value} = overdueMark(detail, now);
-        /* @__PURE__ */
-        return jsx(MetricPair, {
-            Icon: ATTENTION_FACES.overdue.Icon,
-            face: overdueMarkOpensPanel(tasks) ? stageTasksFace({
-                now: now,
-                tasks: tasks
-            }) : {
-                text: hint2
-            },
-            label: hint2,
-            tone: ATTENTION_FACES.overdue.tone,
-            value: value
-        });
-    }
-    const hint = blockedMarkHint(detail);
-    /* @__PURE__ */
-    return jsx(AlertChip, {
-        Icon: ATTENTION_FACES.blocked.Icon,
-        hint: hint,
-        label: hint,
-        tone: ATTENTION_FACES.blocked.tone
-    });
-}
-
-const TASK_WIDTH = {
-    cap: 280,
-    fraction: .22
-}, ATTENTION_WIDTH$1 = 48, ASSIGNEE_WIDTH = 96, COLUMNS = [ {
-    key: "document",
-    label: "Workflow subject"
-}, {
-    key: "task",
-    label: "Task",
-    width: TASK_WIDTH
-}, {
-    key: "opened",
-    label: "Opened",
-    width: TABLE_TIME_WIDTH
-}, {
-    key: "workflow",
-    label: "Workflow",
-    width: TABLE_WORKFLOW_WIDTH
-}, {
-    key: "due",
-    label: "Due",
-    width: TABLE_TIME_WIDTH
-} ];
-
-function documentWidthOf$1(tableWidth) {
-    return fillColumnWidth({
-        columns: COLUMNS,
-        tableWidth: tableWidth,
-        trailingWidth: ASSIGNEE_WIDTH + ATTENTION_WIDTH$1
-    });
-}
-
-function ForMeTable({now: now, onNavigateKey: onNavigateKey, onSelect: onSelect, onSort: onSort, rows: rows, selectedId: selectedId, selectedRef: selectedRef, sort: sort}) {
-    /* @__PURE__ */
-    return jsx(VirtualTable, {
-        renderHeader: args => /* @__PURE__ */ jsxs(SortableHeaderCells, {
-            columns: COLUMNS,
-            onSort: onSort,
-            sort: sort,
-            styles: args.styles,
-            tableWidth: args.tableWidth,
-            widthOf: (column, tableWidth) => column.key === "document" ? documentWidthOf$1(tableWidth) : resolveColumnWidth(column.width, tableWidth),
-            children: [ 
-            /* @__PURE__ */ jsx("th", {
-                style: {
-                    ...args.styles.head,
-                    width: ASSIGNEE_WIDTH
-                },
-                children: /* @__PURE__ */ jsx(Box, {
-                    padding: 2,
-                    children: /* @__PURE__ */ jsx(Text, {
-                        muted: !0,
-                        size: 1,
-                        children: "Assignee"
-                    })
-                })
-            }), 
-            /* @__PURE__ */ jsx("th", {
-                "aria-label": "Attention",
-                style: {
-                    ...args.styles.head,
-                    width: ATTENTION_WIDTH$1
-                }
-            }) ]
-        }),
-        keyAt: index => rows[index]?.id ?? String(index),
-        renderRow: ({index: index, key: key, measureRow: measureRow}) => {
-            const row = rows[index];
-            return row === void 0 ? null : /* @__PURE__ */ jsx(ForMeTableRow, {
-                dataIndex: index,
-                measureRow: measureRow,
-                now: now,
-                onNavigateKey: onNavigateKey,
-                onSelect: onSelect,
-                row: row,
-                selected: row.id === selectedId,
-                selectedRef: selectedRef
-            }, key);
-        },
-        rowCount: rows.length
-    });
-}
-
-const ForMeTableRow = memo(function({dataIndex: dataIndex, measureRow: measureRow, now: now, onNavigateKey: onNavigateKey, onSelect: onSelect, row: row, selected: selected, selectedRef: selectedRef}) {
-    const styles = useTableStyles(), documentInset = useSpaceToken(1);
-    /* @__PURE__ */
-    return jsxs(TableRowCard, {
-        dataIndex: dataIndex,
-        onClick: () => onSelect(row),
-        onKeyDown: onNavigateKey,
-        rowRef: measureRow,
-        selected: selected,
-        selectedRef: selectedRef,
+        gap: 1,
         children: [ 
-        /* @__PURE__ */ jsx("td", {
-            style: {
-                ...styles.cell,
-                paddingLeft: documentInset
-            },
-            children: row.document === void 0 ? /* @__PURE__ */ jsx(Text, {
-                muted: !0,
-                size: 1,
-                textOverflow: "ellipsis",
-                children: "No document"
-            }) : /* @__PURE__ */ jsx(DocRefFace, {
-                gdr: row.document
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(Text, {
-                size: 1,
-                textOverflow: "ellipsis",
-                children: row.title
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(AgoStamp, {
-                at: row.openedAt,
-                now: now
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(Text, {
-                muted: !0,
-                size: 1,
-                textOverflow: "ellipsis",
-                children: row.workflowTitle
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: row.due === void 0 ? null : /* @__PURE__ */ jsx(DueStamp, {
-                due: row.due,
-                now: now
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: {
-                ...styles.cell,
-                overflow: "hidden"
-            },
-            children: /* @__PURE__ */ jsx(Flex, {
-                align: "center",
-                children: /* @__PURE__ */ jsx(RowAssignees, {
-                    assignees: row.assignees
-                })
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: row.attentionDetail === void 0 || row.attentionDetail.kind === "overdue" ? null : /* @__PURE__ */ jsx(Flex, {
-                align: "center",
-                children: /* @__PURE__ */ jsx(AttentionMark, {
-                    detail: row.attentionDetail,
-                    now: now,
-                    tasks: []
-                })
-            })
+        /* @__PURE__ */ jsx(Text, {
+            size: 1,
+            weight: "semibold",
+            children: summary.lead
+        }), 
+        /* @__PURE__ */ jsx(Text, {
+            muted: !0,
+            size: 1,
+            children: summary.subjects
         }) ]
     });
-});
+}
 
 function AbortWorkflowSection({entry: entry}) {
     const [aborting, setAborting] = useState(!1);
@@ -3270,7 +2128,7 @@ function ForMeWorkArea({previews: previews, loading: loading, model: model, now:
                 loading: loading,
                 previews: previews,
                 resetKey: `${sort.dir}:${sort.key}`,
-                children: /* @__PURE__ */ jsx(ForMeBody, {
+                children: /* @__PURE__ */ jsx(ForMeTables, {
                     loading: loading,
                     now: now,
                     onNavigateKey: keyboardNavigation.onKeyDown,
@@ -3295,97 +2153,6 @@ function ForMeWorkArea({previews: previews, loading: loading, model: model, now:
     });
 }
 
-function ForMeBody({loading: loading, now: now, onNavigateKey: onNavigateKey, onSelect: onSelect, onSort: onSort, selectedId: selectedId, selectedRef: selectedRef, sort: sort, sections: sections}) {
-    return loading ? /* @__PURE__ */ jsxs(Fragment, {
-        children: [ 
-        /* @__PURE__ */ jsx(LoadingRow, {
-            label: "Loading…",
-            padding: 2
-        }), selectedId === void 0 ? null : /* @__PURE__ */ jsx(LoadingTablePlaceholder, {
-            children: /* @__PURE__ */ jsx(ForMeTable, {
-                now: now,
-                onNavigateKey: onNavigateKey,
-                onSelect: onSelect,
-                onSort: onSort,
-                rows: [],
-                selectedId: void 0,
-                selectedRef: selectedRef,
-                sort: sort
-            })
-        }) ]
-    }) : sections.assignedToUser.length === 0 && sections.assignedToRoles.length === 0 ? /* @__PURE__ */ jsx(ForMeEmptyState, {}) : /* @__PURE__ */ jsxs(Stack, {
-        gap: 6,
-        children: [ 
-        /* @__PURE__ */ jsx(ForMeSection, {
-            description: /* @__PURE__ */ jsx(ForMeSectionCount, {
-                rows: sections.assignedToUser
-            }),
-            now: now,
-            onNavigateKey: onNavigateKey,
-            onSelect: onSelect,
-            onSort: onSort,
-            rows: sections.assignedToUser,
-            selectedId: selectedId,
-            selectedRef: selectedRef,
-            sort: sort,
-            title: FOR_ME_SECTION_COPY.assignedTitle
-        }), 
-        /* @__PURE__ */ jsx(ForMeSection, {
-            description: FOR_ME_SECTION_COPY.roleDescription,
-            now: now,
-            onNavigateKey: onNavigateKey,
-            onSelect: onSelect,
-            onSort: onSort,
-            rows: sections.assignedToRoles,
-            selectedId: selectedId,
-            selectedRef: selectedRef,
-            sort: sort,
-            title: FOR_ME_SECTION_COPY.roleTitle
-        }) ]
-    });
-}
-
-function ForMeSection({description: description, now: now, onNavigateKey: onNavigateKey, onSelect: onSelect, onSort: onSort, rows: rows, selectedId: selectedId, selectedRef: selectedRef, sort: sort, title: title}) {
-    return rows.length === 0 ? null : /* @__PURE__ */ jsxs(Stack, {
-        gap: 3,
-        children: [ 
-        /* @__PURE__ */ jsx(ForMeSectionHeading, {
-            description: description,
-            title: title
-        }), 
-        /* @__PURE__ */ jsx(ForMeTable, {
-            now: now,
-            onNavigateKey: onNavigateKey,
-            onSelect: onSelect,
-            onSort: onSort,
-            rows: rows,
-            selectedId: selectedId,
-            selectedRef: selectedRef,
-            sort: sort
-        }) ]
-    });
-}
-
-function ForMeSectionCount({rows: rows}) {
-    const summary = forMeSummaryOf(rows);
-    /* @__PURE__ */
-    return jsxs(Flex, {
-        align: "center",
-        gap: 1,
-        children: [ 
-        /* @__PURE__ */ jsx(Text, {
-            size: 1,
-            weight: "semibold",
-            children: summary.lead
-        }), 
-        /* @__PURE__ */ jsx(Text, {
-            muted: !0,
-            size: 1,
-            children: summary.subjects
-        }) ]
-    });
-}
-
 function defaultRunSort(scope) {
     return scope === "closed" ? {
         key: "ended",
@@ -3411,17 +2178,11 @@ function sortRunRows(args) {
     return [ ...rows ].sort((a, b) => dir * primary(a, b) || tiebreak(a, b));
 }
 
-function documentTitleKey(row, titles) {
-    return row.document === void 0 ? "" : titles.get(row.document.id) ?? "";
-}
-
 function comparatorFor(key, titles) {
     switch (key) {
       case "document":
-        return (a, b) => documentTitleKey(a, titles).localeCompare(documentTitleKey(b, titles));
-
       case "workflow":
-        return (a, b) => a.workflowTitle.localeCompare(b.workflowTitle);
+        return namedRowComparator(key, titles);
 
       case "stage":
         return (a, b) => a.stageTitle.localeCompare(b.stageTitle);
@@ -3455,7 +2216,7 @@ function cardFacts(args) {
                 now: args.now,
                 preview: preview
             }),
-            blocked: blockedRunDetail({
+            blocked: settled ? void 0 : blockedRunDetail({
                 definition: args.definition,
                 preview: preview
             }),
@@ -3814,9 +2575,9 @@ function boardDocuments(board) {
 const CARD_RADIUS = 3;
 
 function BoardCard({card: card, wiring: wiring}) {
-    const {facts: facts, now: now, onNavigateKey: onNavigateKey, onSelect: onSelect, selectedInstanceId: selectedInstanceId, selectedRef: selectedRef} = wiring, {color: color} = useTheme_v2(), faceInset = useSpaceToken(2), selected = card.instanceId === selectedInstanceId, held = facts.get(card.instanceId);
+    const {facts: facts, now: now, onNavigateKey: onNavigateKey, onSelect: onSelect, selectedInstanceId: selectedInstanceId, selectedRef: selectedRef} = wiring, {color: color} = useTheme_v2(), faceInset = useSpaceToken(2), markClearance = useAlertChipSize() + useSpaceToken(3), selected = card.instanceId === selectedInstanceId, held = facts.get(card.instanceId), blocked = held?.blocked;
     /* @__PURE__ */
-    return jsx(Card, {
+    return jsxs(Card, {
         "aria-pressed": selected,
         as: "button",
         onClick: event => {
@@ -3830,18 +2591,32 @@ function BoardCard({card: card, wiring: wiring}) {
             border: `1px solid ${color.border}`,
             display: "flex",
             flexDirection: "column",
+            position: "relative",
             textAlign: "left",
             width: "100%"
         },
         ...selected ? {
             ref: selectedRef
         } : {},
-        children: /* @__PURE__ */ jsxs(Stack, {
+        children: [ held === void 0 || blocked === void 0 ? null : /* @__PURE__ */ jsx(Box, {
+            style: {
+                position: "absolute",
+                right: faceInset,
+                top: faceInset
+            },
+            children: /* @__PURE__ */ jsx(AttentionMark, {
+                detail: blocked,
+                now: now,
+                tasks: held.tasks
+            })
+        }), 
+        /* @__PURE__ */ jsxs(Stack, {
             gap: 2,
             children: [ 
             /* @__PURE__ */ jsx(Box, {
                 style: {
                     minWidth: 0,
+                    paddingRight: blocked === void 0 ? void 0 : markClearance,
                     ...card.face.kind === "document" ? {
                         margin: `${-faceInset}px 0 ${-faceInset}px ${-faceInset}px`
                     } : {}
@@ -3859,13 +2634,13 @@ function BoardCard({card: card, wiring: wiring}) {
                 facts: held,
                 now: now
             }) ]
-        })
+        }) ]
     });
 }
 
 function CardMetrics({facts: facts, now: now}) {
-    const markOverhang = -useCapTrimFor(useTextIconSize()), bare = facts.tasks.length === 0 && facts.overdueDetail === void 0 && facts.blocked === void 0;
-    return facts.settled || bare ? null : /* @__PURE__ */ jsx(Box, {
+    const markOverhang = -useCapTrimFor(useTextIconSize());
+    return facts.settled || facts.tasks.length === 0 && facts.overdueDetail === void 0 ? null : /* @__PURE__ */ jsx(Box, {
         padding: 1,
         children: /* @__PURE__ */ jsxs(Flex, {
             align: "center",
@@ -3874,8 +2649,7 @@ function CardMetrics({facts: facts, now: now}) {
             /* @__PURE__ */ jsx(StageTaskGroups, {
                 now: now,
                 tasks: facts.tasks
-            }), 
-            /* @__PURE__ */ jsxs(Flex, {
+            }), facts.overdueDetail === void 0 ? null : /* @__PURE__ */ jsx(Flex, {
                 align: "center",
                 flex: 1,
                 gap: 3,
@@ -3883,15 +2657,11 @@ function CardMetrics({facts: facts, now: now}) {
                 style: {
                     paddingRight: markOverhang
                 },
-                children: [ facts.overdueDetail === void 0 ? null : /* @__PURE__ */ jsx(AttentionMark, {
+                children: /* @__PURE__ */ jsx(AttentionMark, {
                     detail: facts.overdueDetail,
                     now: now,
                     tasks: facts.tasks
-                }), facts.blocked === void 0 ? null : /* @__PURE__ */ jsx(AttentionMark, {
-                    detail: facts.blocked,
-                    now: now,
-                    tasks: facts.tasks
-                }) ]
+                })
             }) ]
         })
     });
@@ -4614,7 +3384,7 @@ function Segment({active: active, joined: joined, mode: mode, onPick: onPick, op
             tone: tone
         }
     });
-    return option.tooltip === void 0 ? button : /* @__PURE__ */ jsx(HoverHint, {
+    return option.tooltip === void 0 ? button : /* @__PURE__ */ jsx(_HoverHint, {
         text: option.tooltip,
         children: button
     });
@@ -5825,272 +4595,6 @@ function walkIdOf(view) {
     if (view.run !== void 0) return view.task === void 0 ? view.run : forMeRowId(view.run, view.task);
 }
 
-const OPEN_COLUMNS = [ {
-    key: "document",
-    label: "Workflow subject"
-}, {
-    key: "workflow",
-    label: "Workflow",
-    width: TABLE_WORKFLOW_WIDTH
-}, {
-    key: "stage",
-    label: "Stage",
-    width: TABLE_STAGE_WIDTH
-}, {
-    key: "started",
-    label: "Started",
-    width: TABLE_TIME_WIDTH
-} ], CLOSED_COLUMNS = [ {
-    key: "document",
-    label: "Workflow subject"
-}, {
-    key: "workflow",
-    label: "Workflow",
-    width: TABLE_WORKFLOW_WIDTH
-}, {
-    key: "outcome",
-    label: "Outcome",
-    width: TABLE_STAGE_WIDTH
-}, {
-    key: "started",
-    label: "Started",
-    width: TABLE_TIME_WIDTH
-}, {
-    key: "ended",
-    label: "Closed",
-    width: TABLE_TIME_WIDTH
-} ], TASKS_WIDTH = 120, TASKS_WIDTH_ROOMY = 168, ROOMY_TABLE_WIDTH = 1040;
-
-function tasksWidthOf(tableWidth) {
-    return tableWidth === void 0 ? TASKS_WIDTH : tableWidth >= ROOMY_TABLE_WIDTH ? TASKS_WIDTH_ROOMY : TASKS_WIDTH;
-}
-
-function taskRoomOf(args) {
-    return tasksWidthOf(args.tableWidth) - args.inset * 2;
-}
-
-const ATTENTION_WIDTH = 96;
-
-function documentWidthOf(args) {
-    const {columns: columns, scope: scope, tableWidth: tableWidth} = args, trailing = scope === "open" ? tasksWidthOf(tableWidth) + ATTENTION_WIDTH : 0;
-    return fillColumnWidth({
-        columns: columns,
-        tableWidth: tableWidth,
-        trailingWidth: trailing
-    });
-}
-
-function RunsTable({now: now, onNavigateKey: onNavigateKey, onSelectRun: onSelectRun, onSort: onSort, rows: rows, scope: scope, scopedToWorkflow: scopedToWorkflow, selectedId: selectedId, selectedRef: selectedRef, sort: sort}) {
-    const columns = (scope === "closed" ? CLOSED_COLUMNS : OPEN_COLUMNS).filter(column => !(scopedToWorkflow && column.key === "workflow")), cellInset = useSpaceToken(2);
-    /* @__PURE__ */
-    return jsx(VirtualTable, {
-        renderHeader: args => /* @__PURE__ */ jsx(RunsHeader, {
-            columns: columns,
-            onSort: onSort,
-            scope: scope,
-            sort: sort,
-            styles: args.styles,
-            tableWidth: args.tableWidth
-        }),
-        keyAt: index => rows[index]?.id ?? String(index),
-        renderRow: ({index: index, key: key, measureRow: measureRow, tableWidth: tableWidth}) => {
-            const row = rows[index];
-            return row === void 0 ? null : /* @__PURE__ */ jsx(RunTableRow, {
-                dataIndex: index,
-                measureRow: measureRow,
-                now: now,
-                onNavigateKey: onNavigateKey,
-                onSelectRun: onSelectRun,
-                row: row,
-                scope: scope,
-                scopedToWorkflow: scopedToWorkflow,
-                selected: row.id === selectedId,
-                selectedRef: selectedRef,
-                taskRoom: taskRoomOf({
-                    inset: cellInset,
-                    tableWidth: tableWidth
-                })
-            }, key);
-        },
-        rowCount: rows.length
-    });
-}
-
-function RunsHeader({columns: columns, onSort: onSort, scope: scope, sort: sort, styles: styles, tableWidth: tableWidth}) {
-    /* @__PURE__ */
-    return jsx(SortableHeaderCells, {
-        columns: columns,
-        onSort: onSort,
-        sort: sort,
-        styles: styles,
-        tableWidth: tableWidth,
-        widthOf: (column, width) => column.key === "document" ? documentWidthOf({
-            columns: columns,
-            scope: scope,
-            tableWidth: width
-        }) : resolveColumnWidth(column.width, width),
-        children: scope === "open" ? /* @__PURE__ */ jsxs(Fragment, {
-            children: [ 
-            /* @__PURE__ */ jsx("th", {
-                style: {
-                    ...styles.head,
-                    width: tasksWidthOf(tableWidth)
-                },
-                children: /* @__PURE__ */ jsx(Box, {
-                    padding: 2,
-                    children: /* @__PURE__ */ jsx(Text, {
-                        muted: !0,
-                        size: 1,
-                        children: "Tasks"
-                    })
-                })
-            }), 
-            /* @__PURE__ */ jsx("th", {
-                "aria-label": "Attention",
-                style: {
-                    ...styles.head,
-                    width: ATTENTION_WIDTH
-                }
-            }) ]
-        }) : null
-    });
-}
-
-const RunTableRow = memo(function({dataIndex: dataIndex, measureRow: measureRow, now: now, onNavigateKey: onNavigateKey, onSelectRun: onSelectRun, row: row, scope: scope, scopedToWorkflow: scopedToWorkflow, selected: selected, selectedRef: selectedRef, taskRoom: taskRoom}) {
-    const styles = useTableStyles(), documentInset = useSpaceToken(1);
-    /* @__PURE__ */
-    return jsxs(TableRowCard, {
-        dataIndex: dataIndex,
-        onClick: () => onSelectRun(row),
-        onKeyDown: onNavigateKey,
-        rowRef: measureRow,
-        selected: selected,
-        selectedRef: selectedRef,
-        children: [ 
-        /* @__PURE__ */ jsx("td", {
-            style: {
-                ...styles.cell,
-                paddingLeft: documentInset
-            },
-            children: /* @__PURE__ */ jsx(DocumentCell, {
-                row: row
-            })
-        }), scopedToWorkflow ? null : /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(Text, {
-                muted: !0,
-                size: 1,
-                textOverflow: "ellipsis",
-                children: row.workflowTitle
-            })
-        }), scope === "closed" ? /* @__PURE__ */ jsx(ClosedCells, {
-            now: now,
-            row: row
-        }) : /* @__PURE__ */ jsx(OpenCells, {
-            now: now,
-            row: row,
-            taskRoom: taskRoom
-        }) ]
-    });
-});
-
-function DocumentCell({row: row}) {
-    return row.document === void 0 ? /* @__PURE__ */ jsx(Text, {
-        muted: !0,
-        size: 1,
-        textOverflow: "ellipsis",
-        children: "No document"
-    }) : /* @__PURE__ */ jsx(DocRefFace, {
-        gdr: row.document
-    });
-}
-
-function OpenCells({now: now, row: row, taskRoom: taskRoom}) {
-    const styles = useTableStyles();
-    /* @__PURE__ */
-    return jsxs(Fragment, {
-        children: [ 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(Text, {
-                size: 1,
-                textOverflow: "ellipsis",
-                children: row.stageTitle
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(AgoStamp, {
-                at: row.startedAt,
-                now: now
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: {
-                ...styles.cell,
-                overflow: "hidden"
-            },
-            children: /* @__PURE__ */ jsx(Flex, {
-                align: "center",
-                children: /* @__PURE__ */ jsx(StageTaskGroups, {
-                    now: now,
-                    room: taskRoom,
-                    tasks: row.tasks
-                })
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(AttentionCell, {
-                now: now,
-                row: row
-            })
-        }) ]
-    });
-}
-
-function ClosedCells({now: now, row: row}) {
-    const styles = useTableStyles();
-    /* @__PURE__ */
-    return jsxs(Fragment, {
-        children: [ 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(Text, {
-                size: 1,
-                textOverflow: "ellipsis",
-                children: row.outcome
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: /* @__PURE__ */ jsx(AgoStamp, {
-                at: row.startedAt,
-                now: now
-            })
-        }), 
-        /* @__PURE__ */ jsx("td", {
-            style: styles.cell,
-            children: row.endedAt === void 0 ? null : /* @__PURE__ */ jsx(AgoStamp, {
-                at: row.endedAt,
-                now: now
-            })
-        }) ]
-    });
-}
-
-function AttentionCell({now: now, row: row}) {
-    return row.attentionDetail === void 0 ? null : 
-    /* @__PURE__ */ jsx(Flex, {
-        align: "center",
-        children: /* @__PURE__ */ jsx(AttentionMark, {
-            detail: row.attentionDetail,
-            now: now,
-            tasks: row.tasks
-        })
-    });
-}
-
 function RunsWorkArea({boardMode: boardMode, boardState: boardState, previews: previews, loading: loading, model: model, navigatorSlot: navigatorSlot, now: now, onSort: onSort, scopedCount: scopedCount, sort: sort, sorted: sorted, view: view}) {
     const columnStyle = useWorkColumnStyle({
         boardMode: boardMode,
@@ -6305,10 +4809,9 @@ const RunsTab = memo(function({addressed: addressed, filterSlot: filterSlot, for
         scoped: scoped,
         view: view
     }), taskRows = useMemo(() => forMeIdentity === void 0 ? [] : forMeTaskRowsOf({
-        now: now,
         rows: filtered,
         who: forMeIdentity
-    }), [ filtered, forMeIdentity, now ]), shownAttention = useMemo(() => runAttentionCounts(filtered), [ filtered ]), documents = useMemo(() => filtered.flatMap(row => row.document === void 0 ? [] : [ row.document ]), [ filtered ]), titles = useDocPreviewTitles(documents), sortedTasks = useMemo(() => sortForMeRows({
+    }), [ filtered, forMeIdentity ]), shownAttention = useMemo(() => runAttentionCounts(filtered), [ filtered ]), documents = useMemo(() => filtered.flatMap(row => row.document === void 0 ? [] : [ row.document ]), [ filtered ]), titles = useDocPreviewTitles(documents), sortedTasks = useMemo(() => sortForMeRows({
         rows: taskRows,
         sort: forMeSort,
         titles: titles.titles