@sanity/workflow-studio-plugin 0.5.0 → 0.21.0

package/dist/_chunks-cjs/workflows-tool-root.cjs

@@ -1,22 +1,6 @@
 "use strict";
 
-var jsxRuntime = require("react/jsx-runtime"), ui = require("@sanity/ui"), react = require("react"), router = require("sanity/router"), index = require("./index.cjs"), ArrowLeft = require("@sanity/icons/ArrowLeft"), workflowDiagram = require("@sanity/workflow-diagram"), workflowEngine = require("@sanity/workflow-engine"), Add = require("@sanity/icons/Add"), Search = require("@sanity/icons/Search"), Checkmark = require("@sanity/icons/Checkmark"), Close = require("@sanity/icons/Close"), Filter = require("@sanity/icons/Filter"), workflowComponents = require("@sanity/workflow-components"), endOfDay = require("date-fns/endOfDay"), reactDom = require("react-dom"), sanity = require("sanity"), Calendar = require("@sanity/icons/Calendar"), workflowStudio = require("@sanity/workflow-studio");
-
-function SpinnerSlot({busy: busy}) {
-    /* @__PURE__ */
-    return jsxRuntime.jsx(ui.Flex, {
-        align: "center",
-        flex: "none",
-        justify: "center",
-        style: {
-            width: 19,
-            height: 19
-        },
-        children: busy ? /* @__PURE__ */ jsxRuntime.jsx(ui.Spinner, {
-            muted: !0
-        }) : null
-    });
-}
+var jsxRuntime = require("react/jsx-runtime"), ui = require("@sanity/ui"), workflowReact = require("@sanity/workflow-react"), react = require("react"), router = require("sanity/router"), index = require("./index.cjs"), ArrowLeft = require("@sanity/icons/ArrowLeft"), workflowDiagram = require("@sanity/workflow-diagram"), workflowEngine = require("@sanity/workflow-engine"), Add = require("@sanity/icons/Add"), Search = require("@sanity/icons/Search"), sanity = require("sanity"), Checkmark = require("@sanity/icons/Checkmark"), Close = require("@sanity/icons/Close"), Filter = require("@sanity/icons/Filter"), workflowComponents = require("@sanity/workflow-components"), endOfDay = require("date-fns/endOfDay"), reactDom = require("react-dom"), Calendar = require("@sanity/icons/Calendar"), workflowStudio = require("@sanity/workflow-studio");
 
 function documentRefsOf(instance) {
     const seen = /* @__PURE__ */ new Map;
@@ -34,14 +18,19 @@ function InstanceTaskLists({entry: entry, onOpenActivity: onOpenActivity}) {
                 onOpenActivity: onOpenActivity
             }), 
             /* @__PURE__ */ jsxRuntime.jsx(index.TodoItemsList, {
-                entry: entry
+                entry: entry,
+                surface: "tool-instance-detail"
             }) ]
         })
     });
 }
 
 function WorkflowInstanceDetail({instanceId: instanceId, onBack: onBack}) {
-    const entry = index.useWorkflowInstanceEntry(instanceId), [graceOver, setGraceOver] = react.useState(!1);
+    const entry = index.useWorkflowInstanceEntry(instanceId);
+    index.useLogEventOnMount(index.WorkflowInstanceDetailViewed, {
+        instanceId: instanceId
+    });
+    const [graceOver, setGraceOver] = react.useState(!1);
     return react.useEffect(() => {
         const timer = setTimeout(() => setGraceOver(!0), 2500);
         return () => clearTimeout(timer);
@@ -135,7 +124,8 @@ function InstanceDetailPanel({entry: entry, onBack: onBack}) {
             breadcrumb: index.instanceBreadcrumb(instance, definition),
             definition: definition,
             entry: entry,
-            onClose: () => setOpenActivity(null)
+            onClose: () => setOpenActivity(null),
+            source: "tool-instance-detail"
         }) : null ]
     });
 }
@@ -181,7 +171,7 @@ function DetailHeader({entry: entry, definition: definition, onBack: onBack}) {
             }) : /* @__PURE__ */ jsxRuntime.jsx(index.AbortedBadge, {
                 instance: instance
             }), 
-            /* @__PURE__ */ jsxRuntime.jsx(SpinnerSlot, {
+            /* @__PURE__ */ jsxRuntime.jsx(index.SpinnerSlot, {
                 busy: !ready || index.isEvaluationStale(entry)
             }) ]
         })
@@ -276,7 +266,8 @@ function NewWorkflowButton() {
             onPick: definition => {
                 setOpen(!1), openStartDialog({
                     definition: definition.name,
-                    label: definition.title
+                    label: definition.title,
+                    source: "tool"
                 });
             }
         }) : null,
@@ -383,7 +374,8 @@ function ToolActivityDialog({target: target, onClose: onClose}) {
         definition: definition,
         document: documentRefsOf(entry.instance)[0],
         entry: entry,
-        onClose: onClose
+        onClose: onClose,
+        source: "tool-task-list"
     }) : /* @__PURE__ */ jsxRuntime.jsx(ui.Dialog, {
         header: "Loading activity…",
         id: "workflow-activity-detail",
@@ -398,13 +390,154 @@ function ToolActivityDialog({target: target, onClose: onClose}) {
     });
 }
 
+const GROUP_DEFAULT_OPEN = !0;
+
+function instanceBandDefaultOpen(segment) {
+    return segment === "for-me";
+}
+
+const UNGROUPED_BAND_KEY = "section:no-document", PAYLOAD_VERSION = 1, MAX_ENTRIES = 200;
+
+function bandStateStorageKey(scope) {
+    return `sanity.workflows.tool.bands:${scope}`;
+}
+
+function isRecord(value) {
+    return typeof value == "object" && value !== null && !Array.isArray(value);
+}
+
+function bandEntryOf(value) {
+    if (!isRecord(value)) return;
+    const {open: open, touched: touched} = value;
+    if (!(typeof open != "boolean" || typeof touched != "number") && Number.isFinite(touched)) return {
+        open: open,
+        touched: touched
+    };
+}
+
+function parsePayload(raw) {
+    try {
+        const parsed = JSON.parse(raw);
+        if (!isRecord(parsed) || parsed.version !== PAYLOAD_VERSION || !isRecord(parsed.bands)) return;
+        const entries = [];
+        for (const [key, value] of Object.entries(parsed.bands)) {
+            const entry = bandEntryOf(value);
+            if (entry === void 0) return;
+            entries.push([ key, entry ]);
+        }
+        return Object.fromEntries(entries);
+    } catch {
+        return;
+    }
+}
+
+function readStored(storage, storageKey) {
+    if (!storage) return {
+        entries: void 0,
+        corrupt: !1
+    };
+    let raw;
+    try {
+        raw = storage.getItem(storageKey);
+    } catch {
+        return {
+            entries: void 0,
+            corrupt: !1
+        };
+    }
+    if (raw === null) return {
+        entries: {},
+        corrupt: !1
+    };
+    const entries = parsePayload(raw);
+    return {
+        entries: entries,
+        corrupt: entries === void 0
+    };
+}
+
+function writeStored(args) {
+    if (!args.storage) return !1;
+    try {
+        return args.storage.setItem(args.storageKey, JSON.stringify({
+            version: PAYLOAD_VERSION,
+            bands: args.entries
+        })), !0;
+    } catch {
+        return !1;
+    }
+}
+
+function baseEntries(args) {
+    return args.stored === void 0 ? args.held : args.unpersisted ? mergeByTouched(args.stored, args.held) : args.stored;
+}
+
+function mergeByTouched(stored, held) {
+    const merged = {
+        ...stored
+    };
+    for (const [key, entry] of Object.entries(held)) {
+        const persisted = merged[key];
+        (persisted === void 0 || entry.touched >= persisted.touched) && (merged[key] = entry);
+    }
+    return merged;
+}
+
+function prune(entries) {
+    const held = Object.entries(entries);
+    return held.length <= MAX_ENTRIES ? entries : Object.fromEntries(held.sort(([, a], [, b]) => b.touched - a.touched).slice(0, MAX_ENTRIES));
+}
+
+function togglesOf(entries) {
+    return new Map(Object.entries(entries).map(([key, entry]) => [ key, entry.open ]));
+}
+
+function defaultStorage() {
+    try {
+        return globalThis.localStorage;
+    } catch {
+        return;
+    }
+}
+
+function createBandStateStore(args) {
+    const storage = args.storage ?? defaultStorage(), initial = readStored(storage, args.storageKey);
+    initial.corrupt && writeStored({
+        storage: storage,
+        storageKey: args.storageKey,
+        entries: {}
+    });
+    let held = initial.entries ?? {}, unpersisted = !1;
+    return {
+        read: () => togglesOf(held),
+        setOpen(key, open) {
+            const stored = readStored(storage, args.storageKey).entries, base = baseEntries({
+                stored: stored,
+                held: held,
+                unpersisted: unpersisted
+            });
+            return held = prune({
+                ...base,
+                [key]: {
+                    open: open,
+                    touched: Date.now()
+                }
+            }), unpersisted = !writeStored({
+                storage: storage,
+                storageKey: args.storageKey,
+                entries: held
+            }), togglesOf(held);
+        }
+    };
+}
+
 function datesOf(state) {
     return state.filter(entry => entry._type === "date" || entry._type === "datetime").map(entry => entry.value).filter(value => typeof value == "string" && value !== "");
 }
 
 function spawnOrigins(instances) {
     const origins = /* @__PURE__ */ new Map;
-    for (const parent of instances) for (const row of parent.subworkflows ?? []) origins.set(workflowEngine.extractDocumentId(row.ref.id), {
+    for (const parent of instances) for (const row of parent.subworkflows ?? []) origins.set(workflowEngine.toBareId(row.ref.id), {
         parent: parent,
         activityName: row.activity,
         cohortStage: row.cohortStage
@@ -414,7 +547,7 @@ function spawnOrigins(instances) {
 
 function rootOf(instance, byId) {
     const rootRef = instance.ancestors[0];
-    return rootRef ? byId.get(workflowEngine.extractDocumentId(rootRef.id)) ?? instance : instance;
+    return rootRef ? byId.get(workflowEngine.toBareId(rootRef.id)) ?? instance : instance;
 }
 
 function taskRowsOf(args) {
@@ -555,6 +688,223 @@ function taskRowRender(row, entry) {
     };
 }
 
+const NO_ORPHANS = {
+    groupKeys: /* @__PURE__ */ new Set,
+    workflows: []
+};
+
+function localBareIds(group, contentResource) {
+    const ids = group.documents.map(doc => index.gdrLocality(doc.id, contentResource));
+    if (!ids.some(locality => !locality.parsed || !locality.local)) return ids.flatMap(locality => locality.parsed ? [ locality.parsed.documentId ] : []);
+}
+
+function orphanProbeIds(groups, contentResource) {
+    const ids = /* @__PURE__ */ new Set;
+    for (const group of groups.withDocuments) for (const id of localBareIds(group, contentResource) ?? []) ids.add(id);
+    return [ ...ids ].sort();
+}
+
+function orphanVerdict(args) {
+    const groupKeys = /* @__PURE__ */ new Set, workflows = /* @__PURE__ */ new Map;
+    for (const group of args.groups.withDocuments) {
+        const ids = localBareIds(group, args.contentResource);
+        if (!(ids === void 0 || !ids.every(id => args.missing.has(id)))) {
+            groupKeys.add(group.key);
+            for (const band of group.instances) workflows.set(band.instanceId, {
+                instanceId: band.instanceId,
+                title: band.title,
+                documentIds: ids
+            });
+        }
+    }
+    return groupKeys.size === 0 ? NO_ORPHANS : {
+        groupKeys: groupKeys,
+        workflows: [ ...workflows.values() ]
+    };
+}
+
+function hideOrphanedGroups(groups, orphaned) {
+    return orphaned.size === 0 ? groups : cutTaskGroups(groups, {
+        keepRow: () => !0,
+        keepGroup: group => !orphaned.has(group.key)
+    });
+}
+
+const DRAFT_PREFIX = "drafts.";
+
+async function missingDocIds(client, ids) {
+    const present = await client.fetch("*[_id in $ids || _id in $drafts]._id", {
+        ids: ids,
+        drafts: ids.map(id => `${DRAFT_PREFIX}${id}`)
+    }, {
+        perspective: "raw"
+    }), found = new Set(present.map(id => id.startsWith(DRAFT_PREFIX) ? id.slice(DRAFT_PREFIX.length) : id)), candidates = ids.filter(id => !found.has(id)), versions = await Promise.all(candidates.map(id => client.fetch("*[_id in path($version)][0]._id", {
+        version: `versions.*.${id}`
+    }, {
+        perspective: "raw"
+    })));
+    return new Set(candidates.filter((_, index2) => versions[index2] === null));
+}
+
+async function settleOrphans(args) {
+    const ids = [ ...new Set(args.workflows.flatMap(workflow => workflow.documentIds)) ].sort(), missing = await args.probeMissing(ids), stillOrphaned = workflow => workflow.documentIds.every(id => missing.has(id));
+    let settled = 0;
+    const failures = [];
+    for (const workflow of args.workflows.filter(stillOrphaned)) try {
+        await args.abort({
+            instanceId: workflow.instanceId,
+            reason: "Subject document deleted"
+        }), settled += 1;
+    } catch (err) {
+        failures.push({
+            workflow: workflow,
+            message: index.describeError(err)
+        });
+    }
+    return {
+        settled: settled,
+        skipped: args.workflows.filter(workflow => !stillOrphaned(workflow)),
+        failures: failures
+    };
+}
+
+function workflowTally(workflows) {
+    const counts = /* @__PURE__ */ new Map;
+    for (const workflow of workflows) counts.set(workflow.title, (counts.get(workflow.title) ?? 0) + 1);
+    return [ ...counts ].map(([title, count]) => count === 1 ? title : `${title} ×${count}`);
+}
+
+function settleToast(outcome) {
+    const total = outcome.settled + outcome.skipped.length + outcome.failures.length;
+    if (outcome.skipped.length === 0 && outcome.failures.length === 0) return {
+        status: "success",
+        title: outcome.settled === 1 ? "Cleaned up 1 workflow" : `Cleaned up ${outcome.settled} workflows`
+    };
+    const lines = [ ...outcome.skipped.map(workflow => `${workflow.title}: its document exists again — left running`), ...outcome.failures.map(failure => `${failure.workflow.title}: ${failure.message}`) ];
+    return {
+        status: "warning",
+        title: `Cleaned up ${outcome.settled} of ${total} workflows`,
+        description: lines.join(`\n`)
+    };
+}
+
+function recheckFailedToast(err) {
+    return {
+        status: "error",
+        title: "Nothing was cleaned up — the documents could not be re-checked",
+        description: index.describeError(err)
+    };
+}
+
+function OrphanedWorkflowsNote({orphans: orphans}) {
+    const [confirming, setConfirming] = react.useState(!1), count = orphans.workflows.length;
+    if (count === 0) return null;
+    const label = count === 1 ? "1 workflow is attached to a deleted document — its tasks aren’t listed." : `${count} workflows are attached to deleted documents — their tasks aren’t listed.`;
+    /* @__PURE__ */
+    return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [ 
+        /* @__PURE__ */ jsxRuntime.jsx(index.CautionNote, {
+            action: /* @__PURE__ */ jsxRuntime.jsx(ui.Button, {
+                fontSize: 1,
+                mode: "ghost",
+                onClick: () => setConfirming(!0),
+                padding: 2,
+                text: "Clean up…"
+            }),
+            label: label
+        }), confirming ? /* @__PURE__ */ jsxRuntime.jsx(SettleOrphansDialog, {
+            onClose: () => setConfirming(!1),
+            workflows: orphans.workflows
+        }) : null ]
+    });
+}
+
+function SettleOrphansDialog({workflows: workflows, onClose: onClose}) {
+    const {engine: engine} = index.useWorkflowContext(), client = sanity.useClient({
+        apiVersion: index.WORKFLOW_API_VERSION
+    }), toast = index.useClosableToast(), [pending, setPending] = react.useState(!1), confirm = async () => {
+        setPending(!0);
+        try {
+            const outcome = await settleOrphans({
+                workflows: workflows,
+                probeMissing: ids => missingDocIds(client, ids),
+                abort: args => engine.abortInstance(args)
+            });
+            toast.push(settleToast(outcome));
+        } catch (err) {
+            toast.push(recheckFailedToast(err));
+        }
+        onClose();
+    };
+    /* @__PURE__ */
+    return jsxRuntime.jsx(ui.Dialog, {
+        footer: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+            padding: 3,
+            children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Flex, {
+                gap: 2,
+                justify: "flex-end",
+                children: [ 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Button, {
+                    disabled: pending,
+                    fontSize: 1,
+                    mode: "bleed",
+                    onClick: onClose,
+                    padding: 2,
+                    text: "Cancel"
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Button, {
+                    fontSize: 1,
+                    loading: pending,
+                    onClick: () => {
+                        confirm();
+                    },
+                    padding: 2,
+                    text: workflows.length === 1 ? "Clean up 1 workflow" : `Clean up ${workflows.length} workflows`
+                }) ]
+            })
+        }),
+        header: "Clean up workflows",
+        id: "settle-orphaned-workflows",
+        onClose: onClose,
+        width: 0,
+        children: /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
+            padding: 4,
+            children: /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
+                gap: 4,
+                children: [ 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                    muted: !0,
+                    size: 1,
+                    children: "The following workflows exist for documents which have since been deleted:"
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Stack, {
+                    as: "ul",
+                    gap: 2,
+                    style: {
+                        listStyle: "disc",
+                        margin: 0,
+                        paddingLeft: "1.25em"
+                    },
+                    children: workflowTally(workflows).map(line => /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                        as: "li",
+                        size: 1,
+                        style: {
+                            display: "list-item"
+                        },
+                        weight: "medium",
+                        children: line
+                    }, line))
+                }), 
+                /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
+                    muted: !0,
+                    size: 1,
+                    children: "Cleaning up these workflows will close them."
+                }) ]
+            })
+        })
+    });
+}
+
 function taskFilterOptions(groups) {
     const workflows = /* @__PURE__ */ new Map, documents = /* @__PURE__ */ new Map;
     for (const group of groups.withDocuments) {
@@ -571,8 +921,33 @@ function taskFilterOptions(groups) {
     };
 }
 
+function activeEntries(filters) {
+    return Object.entries(filters).filter(([, value]) => value !== void 0 && (!Array.isArray(value) || value.length > 0));
+}
+
 function hasActiveFilters(filters) {
-    return Object.values(filters).some(value => value !== void 0 && (!Array.isArray(value) || value.length > 0));
+    return activeEntries(filters).length > 0;
+}
+
+function sameFilters(a, b) {
+    return sameValueSet(a.statuses, b.statuses) && sameValueSet(a.workflows, b.workflows) && sameValueSet(a.documentIds, b.documentIds) && sameValueSet(a.assigneeIds, b.assigneeIds) && sameDate(a.date, b.date);
+}
+
+function sameValueSet(a, b) {
+    const av = a ?? [], bv = b ?? [];
+    return av.length === bv.length && av.every(value => bv.includes(value));
+}
+
+function sameDate(a, b) {
+    return typeof a == "object" && typeof b == "object" ? a.before === b.before : a === b;
+}
+
+function taskFilterTelemetry(filters) {
+    const entries = activeEntries(filters);
+    return {
+        filterKinds: entries.map(([key]) => key).sort(),
+        filterCount: entries.reduce((n, [, value]) => n + (Array.isArray(value) ? value.length : 1), 0)
+    };
 }
 
 function toggledValue(args) {
@@ -727,7 +1102,12 @@ function useDocPreviewTitles(documents) {
 const HITS_CAP = 6;
 
 function TaskFilterMenu({filters: filters, options: options, onChange: onChange}) {
-    const [open, setOpen] = react.useState(!1), active = hasActiveFilters(filters);
+    const [open, setOpen] = react.useState(!1), telemetry = workflowReact.useWorkflowTelemetry(), openSnapshot = react.useRef(void 0), openMenu = () => {
+        openSnapshot.current = filters, setOpen(!0);
+    }, close = () => {
+        setOpen(!1), openSnapshot.current !== void 0 && !sameFilters(openSnapshot.current, filters) && telemetry.log(index.WorkflowTaskFiltersApplied, taskFilterTelemetry(filters)), 
+        openSnapshot.current = void 0;
+    }, active = hasActiveFilters(filters);
     /* @__PURE__ */
     return jsxRuntime.jsx(index.DismissablePopover, {
         content: open ? /* @__PURE__ */ jsxRuntime.jsx(FilterPanel, {
@@ -735,7 +1115,7 @@ function TaskFilterMenu({filters: filters, options: options, onChange: onChange}
             onChange: onChange,
             options: options
         }) : null,
-        onDismiss: () => setOpen(!1),
+        onDismiss: close,
         open: open,
         overflow: "visible",
         children: /* @__PURE__ */ jsxRuntime.jsx(index.HoverHint, {
@@ -746,7 +1126,7 @@ function TaskFilterMenu({filters: filters, options: options, onChange: onChange}
                 fontSize: 1,
                 icon: Filter.FilterIcon,
                 mode: "bleed",
-                onClick: () => setOpen(v => !v),
+                onClick: () => open ? close() : openMenu(),
                 padding: 2,
                 selected: active || open
             })
@@ -1088,7 +1468,7 @@ function DocumentField({documents: documents, activeIds: activeIds, onToggle: on
     if (documents.length === 0) return null;
     const rows = documents.map(doc => ({
         key: doc.id,
-        text: `${titles.get(doc.id) ?? ""} ${doc.type} ${workflowEngine.extractDocumentId(doc.id)}`,
+        text: `${titles.get(doc.id) ?? ""} ${doc.type} ${workflowEngine.toBareId(doc.id)}`,
         node: /* @__PURE__ */ jsxRuntime.jsx(index.DocRefFace, {
             gdr: doc
         })
@@ -1173,7 +1553,7 @@ function useDocumentChipLabels(documentIds, documents) {
     const schema = sanity.useSchema(), activeDocs = documents.filter(doc => documentIds.includes(doc.id)), {titles: titles, resolved: resolved} = useDocPreviewTitles(activeDocs), labels = /* @__PURE__ */ new Map;
     for (const doc of activeDocs) {
         if (!resolved.has(doc.id)) continue;
-        const label = titles.get(doc.id) ?? schemaTypeTitle(schema, doc.type) ?? workflowEngine.extractDocumentId(doc.id);
+        const label = titles.get(doc.id) ?? schemaTypeTitle(schema, doc.type) ?? workflowEngine.toBareId(doc.id);
         labels.set(doc.id, label);
     }
     return labels;
@@ -1242,7 +1622,7 @@ function ActivityDateControl({instanceId: instanceId, state: state, dates: dates
     });
     const kind = index.dateControlKind(state), commit = (mode, value) => {
         state.kind === "editable" && save(() => editFieldFor(instanceId, {
-            target: index.editTargetOf(state.field),
+            target: workflowReact.editFieldTarget(state.field),
             ...mode === "set" ? {
                 mode: mode,
                 value: value
@@ -1300,6 +1680,28 @@ function ActivityDateControl({instanceId: instanceId, state: state, dates: dates
     });
 }
 
+const PREWARM_MARGIN = "600px 0px";
+
+function useNearViewport() {
+    const [element, setElement] = react.useState(null), [near, setNear] = react.useState(!1);
+    return react.useEffect(() => {
+        if (element === null) return;
+        if (typeof IntersectionObserver > "u") {
+            setNear(!0);
+            return;
+        }
+        const observer = new IntersectionObserver(entries => {
+            setNear(entries.at(-1)?.isIntersecting ?? !1);
+        }, {
+            rootMargin: PREWARM_MARGIN
+        });
+        return observer.observe(element), () => observer.disconnect();
+    }, [ element ]), {
+        ref: setElement,
+        near: near
+    };
+}
+
 function RefChips({refs: refs, max: max = 2}) {
     if (refs.length === 0) return null;
     const shown = refs.slice(0, max), overflow = refs.length - shown.length;
@@ -1321,15 +1723,17 @@ function RefChips({refs: refs, max: max = 2}) {
 
 const EMPTY_NOTE = "No tasks match — adjust the filters, or start a workflow", UNGROUPED_TITLE = "Workflows without Studio documents";
 
-function TaskGroupList({groups: groups, onOpenTask: onOpenTask, onOpenWorkflow: onOpenWorkflow, showTerminalActions: showTerminalActions}) {
+function TaskGroupList({bands: bands, groups: groups, instanceDefaultOpen: instanceDefaultOpen, onOpenTask: onOpenTask, onOpenWorkflow: onOpenWorkflow, showTerminalActions: showTerminalActions}) {
     return groups.withDocuments.length === 0 && groups.withoutDocuments.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(MutedNote, {
         text: EMPTY_NOTE
     }) : /* @__PURE__ */ jsxRuntime.jsxs(ui.Stack, {
         gap: 2,
         children: [ groups.withDocuments.map(group => /* @__PURE__ */ jsxRuntime.jsx(index.CollapsibleBand, {
             background: !0,
+            onToggle: () => bands.toggle(group.key, GROUP_DEFAULT_OPEN),
+            open: bands.isOpen(group.key, GROUP_DEFAULT_OPEN),
             sticky: !0,
-            title: workflowEngine.extractDocumentId(group.document.id),
+            title: workflowEngine.toBareId(group.document.id),
             header: /* @__PURE__ */ jsxRuntime.jsx(ui.Flex, {
                 align: "center",
                 flex: "none",
@@ -1342,6 +1746,8 @@ function TaskGroupList({groups: groups, onOpenTask: onOpenTask, onOpenWorkflow:
                 })
             }),
             children: /* @__PURE__ */ jsxRuntime.jsx(InstanceBands, {
+                bands: bands,
+                instanceDefaultOpen: instanceDefaultOpen,
                 instances: group.instances,
                 onOpenTask: onOpenTask,
                 onOpenWorkflow: onOpenWorkflow,
@@ -1349,6 +1755,8 @@ function TaskGroupList({groups: groups, onOpenTask: onOpenTask, onOpenWorkflow:
             })
         }, group.key)), groups.withoutDocuments.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(index.CollapsibleBand, {
             background: !0,
+            onToggle: () => bands.toggle(UNGROUPED_BAND_KEY, GROUP_DEFAULT_OPEN),
+            open: bands.isOpen(UNGROUPED_BAND_KEY, GROUP_DEFAULT_OPEN),
             sticky: !0,
             title: UNGROUPED_TITLE,
             header: /* @__PURE__ */ jsxRuntime.jsx(ui.Text, {
@@ -1357,6 +1765,8 @@ function TaskGroupList({groups: groups, onOpenTask: onOpenTask, onOpenWorkflow:
                 children: UNGROUPED_TITLE
             }),
             children: /* @__PURE__ */ jsxRuntime.jsx(InstanceBands, {
+                bands: bands,
+                instanceDefaultOpen: instanceDefaultOpen,
                 instances: groups.withoutDocuments,
                 onOpenTask: onOpenTask,
                 onOpenWorkflow: onOpenWorkflow,
@@ -1374,12 +1784,14 @@ function targetOf(row) {
     };
 }
 
-function InstanceBands({instances: instances, onOpenTask: onOpenTask, onOpenWorkflow: onOpenWorkflow, showTerminalActions: showTerminalActions}) {
+function InstanceBands({bands: bands, instanceDefaultOpen: instanceDefaultOpen, instances: instances, onOpenTask: onOpenTask, onOpenWorkflow: onOpenWorkflow, showTerminalActions: showTerminalActions}) {
     /* @__PURE__ */
     return jsxRuntime.jsx(ui.Stack, {
         gap: 1,
         children: instances.map(band => /* @__PURE__ */ jsxRuntime.jsx(InstanceBand, {
             band: band,
+            bands: bands,
+            instanceDefaultOpen: instanceDefaultOpen,
             onOpenTask: onOpenTask,
             onOpenWorkflow: onOpenWorkflow,
             showTerminalActions: showTerminalActions
@@ -1387,10 +1799,12 @@ function InstanceBands({instances: instances, onOpenTask: onOpenTask, onOpenWork
     });
 }
 
-function InstanceBand({band: band, onOpenTask: onOpenTask, onOpenWorkflow: onOpenWorkflow, showTerminalActions: showTerminalActions}) {
+function InstanceBand({band: band, bands: bands, instanceDefaultOpen: instanceDefaultOpen, onOpenTask: onOpenTask, onOpenWorkflow: onOpenWorkflow, showTerminalActions: showTerminalActions}) {
     const {resolvePathFromState: resolvePathFromState} = router.useRouter();
     /* @__PURE__ */
     return jsxRuntime.jsx(index.CollapsibleBand, {
+        onToggle: () => bands.toggle(band.instanceId, instanceDefaultOpen),
+        open: bands.isOpen(band.instanceId, instanceDefaultOpen),
         title: band.title,
         header: /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, {
             children: [ 
@@ -1452,26 +1866,86 @@ function TaskRows({rows: rows, onOpenTask: onOpenTask, showTerminalActions: show
 }
 
 function TaskActivityRow({row: row, onOpen: onOpen, showTerminalActions: showTerminalActions}) {
-    const entry = index.useWorkflowInstanceEntry(row.instanceId), render = taskRowRender(row, entry);
+    const {ref: ref, near: near} = useNearViewport(), entry = index.useWorkflowInstanceEntry(row.instanceId, {
+        evaluate: near
+    }), render = taskRowRender(row, entry);
     /* @__PURE__ */
-    return jsxRuntime.jsx(index.StaleLock, {
-        stale: render.stale,
-        children: /* @__PURE__ */ jsxRuntime.jsx(index.ActivityRow, {
-            assignState: render.assignState,
-            assigneeIds: render.assigneeIds,
-            dateControl: /* @__PURE__ */ jsxRuntime.jsx(ActivityDateControl, {
-                dates: render.dates,
+    return jsxRuntime.jsx(ui.Box, {
+        ref: ref,
+        children: /* @__PURE__ */ jsxRuntime.jsx(index.StaleLock, {
+            stale: render.stale,
+            children: /* @__PURE__ */ jsxRuntime.jsx(index.ActivityRow, {
+                assignState: render.assignState,
+                assigneeIds: render.assigneeIds,
+                dateControl: /* @__PURE__ */ jsxRuntime.jsx(ActivityDateControl, {
+                    dates: render.dates,
+                    instanceId: row.instanceId,
+                    state: render.dateState
+                }),
+                face: render.face,
                 instanceId: row.instanceId,
-                state: render.dateState
-            }),
-            face: render.face,
-            instanceId: row.instanceId,
-            onOpen: onOpen,
-            terminalActions: showTerminalActions ? render.terminalActions : []
+                onOpen: onOpen,
+                terminalActions: showTerminalActions ? render.terminalActions : []
+            })
         })
     });
 }
 
+function useBandOpenState(args) {
+    const {segment: segment, scope: scope} = args, store = react.useMemo(() => createBandStateStore({
+        storageKey: bandStateStorageKey(scope)
+    }), [ scope ]), [held, setHeld] = react.useState(() => ({
+        store: store,
+        toggles: store.read()
+    }));
+    held.store !== store && setHeld({
+        store: store,
+        toggles: store.read()
+    });
+    const qualify = key => `${segment}/${key}`, isOpen = (key, defaultOpen) => held.toggles.get(qualify(key)) ?? defaultOpen;
+    return {
+        isOpen: isOpen,
+        toggle: (key, defaultOpen) => {
+            setHeld({
+                store: store,
+                toggles: store.setOpen(qualify(key), !isOpen(key, defaultOpen))
+            });
+        }
+    };
+}
+
+const NO_MISSING = /* @__PURE__ */ new Set;
+
+function sameIdSet(a, b) {
+    if (a.size !== b.size) return !1;
+    for (const id of a) if (!b.has(id)) return !1;
+    return !0;
+}
+
+function useOrphanedWorkflows(groups) {
+    const {actualTypes: actualTypes, binding: binding} = index.useWorkflowContext(), contentResource = binding.contentResource, key = react.useMemo(() => orphanProbeIds(groups, contentResource), [ groups, contentResource ]).join("|"), [missing, setMissing] = react.useState(NO_MISSING);
+    return react.useEffect(() => {
+        if (key === "") {
+            setMissing(NO_MISSING);
+            return;
+        }
+        const tracked = key.split("|"), releases = tracked.map(id => actualTypes.track(id)), recompute = () => {
+            const next = new Set(tracked.filter(id => actualTypes.read(id) === null));
+            setMissing(current => sameIdSet(current, next) ? current : next);
+        };
+        recompute();
+        const unsubscribe = actualTypes.subscribe(recompute);
+        return () => {
+            unsubscribe();
+            for (const release of releases) release();
+        };
+    }, [ actualTypes, key ]), react.useMemo(() => missing.size === 0 ? NO_ORPHANS : orphanVerdict({
+        groups: groups,
+        contentResource: contentResource,
+        missing: missing
+    }), [ groups, contentResource, missing ]);
+}
+
 const INSTANCE_CAP = 200, NEWEST_INSTANCES = {
     includeCompleted: !0,
     limit: INSTANCE_CAP
@@ -1494,18 +1968,21 @@ function useToolInstances() {
     }, [ instances, loading, unreadable ]);
 }
 
-function TasksTab({filterSlot: filterSlot, instances: instances, loading: loading, identity: identity, mineOnly: mineOnly, onOpenTask: onOpenTask, onOpenWorkflow: onOpenWorkflow, truncated: truncated, unreadable: unreadable}) {
-    const [filters, setFilters] = react.useState({}), groups = react.useMemo(() => deriveTaskGroups({
+function TasksTab({filterSlot: filterSlot, instances: instances, loading: loading, identity: identity, onOpenTask: onOpenTask, onOpenWorkflow: onOpenWorkflow, segment: segment, truncated: truncated, unreadable: unreadable}) {
+    const mineOnly = segment === "for-me", {binding: binding} = index.useWorkflowContext(), bands = useBandOpenState({
+        segment: segment,
+        scope: binding.engineResource.id
+    }), [filters, setFilters] = react.useState({}), groups = react.useMemo(() => deriveTaskGroups({
         instances: instances,
         identity: identity
-    }), [ instances, identity ]), options = react.useMemo(() => taskFilterOptions(groups), [ groups ]), visible = react.useMemo(() => {
+    }), [ instances, identity ]), orphans = useOrphanedWorkflows(groups), listed = react.useMemo(() => hideOrphanedGroups(groups, orphans.groupKeys), [ groups, orphans.groupKeys ]), options = react.useMemo(() => taskFilterOptions(listed), [ listed ]), visible = react.useMemo(() => {
         const filtered = applyTaskFilters({
-            groups: groups,
+            groups: listed,
             filters: filters,
             now: /* @__PURE__ */ new Date
         });
         return mineOnly ? onlyMyTasks(filtered) : filtered;
-    }, [ groups, filters, mineOnly ]);
+    }, [ listed, filters, mineOnly ]);
     return loading ? 
     /* @__PURE__ */ jsxRuntime.jsx(ui.Box, {
         paddingLeft: 2,
@@ -1526,8 +2003,13 @@ function TasksTab({filterSlot: filterSlot, instances: instances, loading: loadin
             /* @__PURE__ */ jsxRuntime.jsx(index.UnreadableDocsNote, {
                 unreadable: unreadable
             }), 
+            /* @__PURE__ */ jsxRuntime.jsx(OrphanedWorkflowsNote, {
+                orphans: orphans
+            }), 
             /* @__PURE__ */ jsxRuntime.jsx(TaskGroupList, {
+                bands: bands,
                 groups: visible,
+                instanceDefaultOpen: instanceBandDefaultOpen(segment),
                 onOpenTask: onOpenTask,
                 onOpenWorkflow: onOpenWorkflow,
                 showTerminalActions: mineOnly
@@ -1568,7 +2050,12 @@ function carryingSearchParams(state, searchParams) {
 }
 
 function WorkflowsToolRoot() {
-    const router$1 = router.useRouter(), {seedInstance: seedInstance} = index.useWorkflowContext(), instanceId = typeof router$1.state.instanceId == "string" ? router$1.state.instanceId : void 0;
+    const router$1 = router.useRouter(), {seedInstance: seedInstance} = index.useWorkflowContext(), {tab: tab} = useToolTab();
+    index.useLogEventOnMount(index.WorkflowToolOpened, {
+        tab: tab,
+        via: "open"
+    });
+    const instanceId = typeof router$1.state.instanceId == "string" ? router$1.state.instanceId : void 0;
     return instanceId ? /* @__PURE__ */ jsxRuntime.jsx(WorkflowInstanceDetail, {
         instanceId: instanceId,
         onBack: () => router$1.navigate(carryingSearchParams({}, router$1.state._searchParams))
@@ -1582,7 +2069,7 @@ function WorkflowsToolRoot() {
 }
 
 function WorkflowsHome({onOpenInstance: onOpenInstance}) {
-    const {tab: tab, setTab: setTab} = useToolTab(), instances = useToolInstances(), identity = index.useAssignmentIdentity(), [openTask, setOpenTask] = react.useState(null), openInstance = target => {
+    const {tab: tab, setTab: setTab} = useToolTab(), telemetry = workflowReact.useWorkflowTelemetry(), instances = useToolInstances(), identity = index.useAssignmentIdentity(), [openTask, setOpenTask] = react.useState(null), openInstance = target => {
         if (typeof target != "string") return onOpenInstance(target);
         const held = [ ...instances.inFlight, ...instances.settled ].find(i => i._id === target);
         onOpenInstance(held ?? target);
@@ -1626,7 +2113,12 @@ function WorkflowsHome({onOpenInstance: onOpenInstance}) {
                         /* @__PURE__ */ jsxRuntime.jsx(index.TabSwitch, {
                             ariaControls: "workflows-tool-panel",
                             idPrefix: "workflows-tool-tab",
-                            onSelect: setTab,
+                            onSelect: next => {
+                                next !== tab && telemetry.log(index.WorkflowToolOpened, {
+                                    tab: next,
+                                    via: "tab-switch"
+                                }), setTab(next);
+                            },
                             options: TOOL_TABS,
                             selected: tab
                         }), 
@@ -1657,9 +2149,9 @@ function WorkflowsHome({onOpenInstance: onOpenInstance}) {
                                 identity: identity,
                                 instances: [ ...instances.inFlight, ...instances.settled ],
                                 loading: instances.loading,
-                                mineOnly: tab === "for-me",
                                 onOpenTask: setOpenTask,
                                 onOpenWorkflow: openInstance,
+                                segment: tab,
                                 truncated: instances.truncated,
                                 unreadable: instances.unreadable
                             })