@stigmer/react 3.5.3 → 3.7.0

package/schedule/ScheduleDetailView.js

@@ -0,0 +1,648 @@
+"use client";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { cn } from "@stigmer/theme";
+import { create } from "@bufbuild/protobuf";
+import { timestampDate } from "@bufbuild/protobuf/wkt";
+import { ApiResourceKind } from "@stigmer/protos/ai/stigmer/commons/apiresource/apiresourcekind/api_resource_kind_pb";
+import { ApiResourceVisibility } from "@stigmer/protos/ai/stigmer/commons/apiresource/enum_pb";
+import { ApiResourceReferenceSchema } from "@stigmer/protos/ai/stigmer/commons/apiresource/io_pb";
+import { formatRelativeTime } from "../activity/format-relative-time.js";
+import { ErrorMessage } from "../error/ErrorMessage.js";
+import { InlineEditTextarea } from "../inline-edit/InlineEditTextarea.js";
+import { EditResourceYamlDialog } from "../manifest/EditResourceYamlDialog.js";
+import { ConfirmDialog } from "../resource-detail/ConfirmDialog.js";
+import { ResourceDetailShell } from "../resource-detail/ResourceDetailShell.js";
+import { Section } from "../resource-detail/Section.js";
+import { useConfirmAction } from "../resource-detail/useConfirmAction.js";
+import { useCopyResource } from "../resource-detail/useCopyResource.js";
+import { useDeleteResource } from "../resource-detail/useDeleteResource.js";
+import { useDetailTabs } from "../resource-detail/useDetailTabs.js";
+import { useExportResource } from "../library/useExportResource.js";
+import { ScheduleRunOutcome } from "@stigmer/protos/ai/stigmer/agentic/schedule/v1/io_pb";
+import { RunConfigSchema, } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/invocation_pb";
+import { Harness } from "@stigmer/protos/ai/stigmer/agentic/session/v1/enum_pb";
+import { ServiceTier } from "@stigmer/protos/ai/stigmer/agentic/agentexecution/v1/enum_pb";
+import { cadenceToCron, cronToCadence, describeCadence, validateCron, } from "./cadence.js";
+import { CadenceField } from "./CadenceField.js";
+import { EnvironmentPicker } from "../environment/EnvironmentPicker.js";
+import { ModelSelector } from "../models/ModelSelector.js";
+import { HARNESS_META, fromProtoHarness, toProtoHarness, } from "../models/harness.js";
+import { fromProtoServiceTier, toProtoServiceTier, } from "../models/service-tier.js";
+import { deriveScheduleState, formatNextFire } from "./scheduleState.js";
+import { ScheduleRunsCompactList, ScheduleRunsTable, } from "./ScheduleRunsTable.js";
+import { TimeZoneField, browserTimeZone } from "./TimeZoneField.js";
+import { useSchedule } from "./useSchedule.js";
+import { useScheduleRuns } from "./useScheduleRuns.js";
+import { useResumeSchedule } from "./useResumeSchedule.js";
+import { useSetScheduleEnabled } from "./useSetScheduleEnabled.js";
+import { useTriggerSchedule } from "./useTriggerSchedule.js";
+import { useUpdateScheduleSpec } from "./useUpdateScheduleSpec.js";
+const OVERVIEW_TAB_ID = "overview";
+const RUNS_TAB_ID = "runs";
+// The Overview strip shows the newest handful of fires; the Runs tab
+// owns the full paginated history.
+const RECENT_RUNS_OPTIONS = { pageSize: 5 };
+/** invocation.proto pins AgentInvocation.message to 8192 characters. */
+const MESSAGE_MAX_LEN = 8192;
+/**
+ * Self-contained detail view for a Schedule (stigmer/stigmer#352),
+ * split into an Overview tab (definition + status + recent runs) and a
+ * Runs tab (the full paginated fire ledger).
+ *
+ * The view's one non-negotiable is rendering the two stop-levers
+ * distinctly, each with its inline remedy:
+ *
+ * - **Disabled** (owner's `spec.enabled` switch) — banner with an
+ *   Enable action (a lossless full-proto re-apply).
+ * - **Paused** (platform's failure-streak latch,
+ *   `status.paused_reason`) — banner showing the reason with a Resume
+ *   action (the one path that clears the pause).
+ *
+ * Trigger ("Run now") starts a real, billable execution and is gated
+ * behind a confirmation; it is disabled while the schedule cannot fire
+ * (the banner names the remedy). With `editable`, the mutable spec
+ * fields edit inline; Edit YAML, Export, and Delete round out the
+ * action set.
+ *
+ * Handles loading, error, and not-found states automatically.
+ * Zero Console dependencies — safe for platform builder embedding.
+ * All visual properties flow through `--stgm-*` design tokens.
+ */
+export function ScheduleDetailView({ org, slug, onNavigateToAgent, onNavigateToExecution, onDeleted, onResourceLoad, editable = false, additionalTabs, activeTab, onTabChange, defaultTab, now, className, }) {
+    const { schedule, isLoading, error, refetch } = useSchedule(org, slug);
+    // The recent-runs fetch stays mounted regardless of the active tab:
+    // it feeds the Runs tab badge (total count), the Overview strip, and
+    // post-trigger freshness. The Runs tab's full table owns its own
+    // paginated fetch inside ScheduleRunsTable.
+    const { runs: recentRuns, totalCount: totalRunCount, isLoading: recentRunsLoading, refetch: refetchRecentRuns, } = useScheduleRuns(schedule?.metadata?.id ?? null, RECENT_RUNS_OPTIONS);
+    const { resumeSchedule, isResuming } = useResumeSchedule();
+    const { triggerSchedule, isTriggering } = useTriggerSchedule();
+    const { setEnabled, isPending: isToggling } = useSetScheduleEnabled();
+    const { updateSpec, isUpdating } = useUpdateScheduleSpec();
+    const { deleteResource, isDeleting } = useDeleteResource("schedule", schedule?.metadata?.id ?? null, schedule?.metadata?.name);
+    const { confirmState, confirm, handleConfirm, handleCancel } = useConfirmAction();
+    const { copyId, copyQualifiedSlug } = useCopyResource();
+    const [editOpen, setEditOpen] = useState(false);
+    // Remount key for the Runs tab's table: a manual trigger bumps it so
+    // the table refetches and returns to page 1, where the new fire
+    // appears (the key-remount reset idiom, DD-014).
+    const [runsVersion, setRunsVersion] = useState(0);
+    // Last failed inline save, attributed to the field that was edited so
+    // only that editor shows the message. The backend's message is the
+    // UX (DD-006) — e.g. the cron validator's copy surfaces verbatim.
+    const [saveError, setSaveError] = useState(null);
+    const saveSpecField = useCallback(async (field, mutate) => {
+        if (!schedule)
+            return false;
+        setSaveError(null);
+        try {
+            await updateSpec(schedule, mutate);
+            refetch();
+            return true;
+        }
+        catch (err) {
+            setSaveError({
+                field,
+                message: err instanceof Error ? err.message : String(err),
+            });
+            return false;
+        }
+    }, [schedule, updateSpec, refetch]);
+    const builtInTabs = useMemo(() => [
+        { id: OVERVIEW_TAB_ID, label: "Overview" },
+        {
+            id: RUNS_TAB_ID,
+            label: "Runs",
+            ...(totalRunCount > 0 ? { badge: totalRunCount } : {}),
+        },
+    ], [totalRunCount]);
+    const { effectiveTabs, effectiveActiveTab, effectiveOnTabChange, activeAdditionalTab, } = useDetailTabs({
+        builtInTabs,
+        additionalTabs,
+        activeTab,
+        onTabChange,
+        defaultTab,
+    });
+    const { copyYaml, downloadYaml } = useExportResource({
+        kind: "Schedule",
+        resource: schedule,
+    });
+    useEffect(() => {
+        if (schedule)
+            onResourceLoad?.(schedule);
+    }, [schedule, onResourceLoad]);
+    if (isLoading)
+        return _jsx(LoadingSkeleton, { className: className });
+    if (error)
+        return _jsx(ErrorMessage, { error: error, retry: refetch, className: className });
+    if (!schedule)
+        return _jsx(NotFoundState, { className: className });
+    const meta = schedule.metadata;
+    const spec = schedule.spec;
+    const status = schedule.status;
+    const specAudit = status?.audit?.specAudit;
+    const stateInfo = deriveScheduleState(spec, status);
+    const renderNow = now ?? new Date();
+    const scheduleId = meta?.id ?? "";
+    const scheduleOrg = meta?.org || org;
+    const target = spec?.target?.case === "agent" ? spec.target.value : undefined;
+    const handleResume = async () => {
+        await resumeSchedule(scheduleId);
+        refetch();
+    };
+    const handleToggleEnabled = async () => {
+        await setEnabled(schedule, !spec?.enabled);
+        refetch();
+    };
+    // One fire: trigger, refresh the schedule and its run history, and — on
+    // a started run — hand the execution to the host so it can navigate
+    // straight to it (the whole point of the synchronous trigger, DD-017
+    // D-6). A refused run resolves too; its reason is toasted by the hook
+    // and lands in the run history below.
+    const fireNow = async () => {
+        const result = await triggerSchedule(scheduleId);
+        refetch();
+        refetchRecentRuns();
+        setRunsVersion((v) => v + 1);
+        if (result.outcome === ScheduleRunOutcome.STARTED &&
+            result.executionId &&
+            onNavigateToExecution) {
+            onNavigateToExecution(result.executionId);
+        }
+    };
+    const handleTrigger = async () => {
+        const confirmed = await confirm({
+            title: "Run this schedule now?",
+            description: "This starts a real agent execution immediately, outside the cron " +
+                "cadence. The run is recorded in this schedule's run history.",
+            confirmLabel: "Start run",
+            variant: "default",
+        });
+        if (!confirmed)
+            return;
+        await fireNow();
+    };
+    // A disabled schedule refuses to fire at the server — ScheduleBlueprintAccess
+    // requires spec.enabled at the create gate AND the mid-run read (DD-017
+    // D-5), so a disabled run would die mid-execution after billing. The
+    // staged-disabled test flow the creation form promises is therefore
+    // "enable, then fire", and this makes it one click.
+    const handleEnableAndRun = async () => {
+        const confirmed = await confirm({
+            title: "Enable and run this schedule now?",
+            description: "This schedule is staged disabled. Enabling it lets it fire on its " +
+                "cron cadence going forward, and starts one real run immediately so " +
+                "you can see the result. You can disable it again afterwards.",
+            confirmLabel: "Enable & run",
+            variant: "default",
+        });
+        if (!confirmed)
+            return;
+        await setEnabled(schedule, true);
+        await fireNow();
+    };
+    const handleDelete = async () => {
+        const confirmed = await confirm({
+            title: "Delete this schedule?",
+            description: `"${meta?.name ?? slug}" will stop firing and be permanently ` +
+                "removed. Past executions are not affected. This cannot be undone.",
+            confirmLabel: "Delete",
+            variant: "destructive",
+        });
+        if (!confirmed)
+            return;
+        await deleteResource();
+        onDeleted?.();
+    };
+    // Disabled → "Enable & run now" (the one-click staged-test flow);
+    // active and paused → "Run now" (a paused schedule's owner needs a
+    // test fire to verify a fix before resuming — DD-017 D-5).
+    const primaryAction = stateInfo.state === "disabled"
+        ? {
+            id: "enable-and-run",
+            label: "Enable & run now",
+            onAction: () => void handleEnableAndRun(),
+            disabled: isTriggering || isToggling,
+        }
+        : {
+            id: "trigger",
+            label: "Run now",
+            onAction: () => void handleTrigger(),
+            disabled: isTriggering,
+        };
+    const actions = [
+        ...(stateInfo.isPaused
+            ? [
+                {
+                    id: "resume",
+                    label: "Resume schedule",
+                    onAction: () => void handleResume(),
+                    disabled: isResuming,
+                    group: "state",
+                },
+            ]
+            : []),
+        {
+            id: "toggle-enabled",
+            label: spec?.enabled ? "Disable schedule" : "Enable schedule",
+            onAction: () => void handleToggleEnabled(),
+            disabled: isToggling,
+            group: "state",
+        },
+        {
+            id: "copy-id",
+            label: "Copy ID",
+            onAction: () => void copyId(scheduleId),
+            group: "clipboard",
+        },
+        {
+            id: "copy-slug",
+            label: "Copy slug",
+            onAction: () => void copyQualifiedSlug(org, slug),
+            group: "clipboard",
+        },
+        {
+            id: "edit-yaml",
+            label: "Edit YAML",
+            onAction: () => setEditOpen(true),
+            group: "edit",
+        },
+        {
+            id: "copy-yaml",
+            label: "Copy YAML",
+            onAction: () => void copyYaml(),
+            group: "export",
+        },
+        {
+            id: "download-yaml",
+            label: "Download YAML",
+            onAction: downloadYaml,
+            group: "export",
+        },
+        {
+            id: "delete",
+            label: "Delete",
+            variant: "destructive",
+            onAction: () => void handleDelete(),
+            disabled: isDeleting,
+            group: "danger",
+        },
+    ];
+    const headerMeta = {
+        name: meta?.name || meta?.slug || "Untitled",
+        id: scheduleId,
+        org: meta?.org,
+        slug: meta?.slug,
+        icon: _jsx(ScheduleIcon, { className: "size-6 text-muted-foreground" }),
+        createdAt: specAudit?.createdAt ? timestampDate(specAudit.createdAt) : null,
+        updatedAt: specAudit?.updatedAt ? timestampDate(specAudit.updatedAt) : null,
+        status: stateInfo.phase,
+        statusLabel: stateInfo.label,
+    };
+    const headerBanner = stateInfo.state === "disabled" ? (_jsxs(StateBanner, { title: "Schedule is disabled", onAction: () => void handleToggleEnabled(), actionLabel: "Enable schedule", actionBusy: isToggling, children: ["This schedule is staged disabled (", _jsx("code", { className: "font-mono", children: "spec.enabled" }), " is off) \u2014 it will not fire on its cron cadence. Use", " ", _jsx("span", { className: "font-medium text-foreground", children: "Enable & run now" }), " ", "to enable it and start one test run, or Enable it here to hand it to the cadence.", stateInfo.isPaused && (_jsxs(_Fragment, { children: [" ", "It is also paused by the platform (", status?.pausedReason, "); after enabling, use Resume to clear the pause."] }))] })) : stateInfo.state === "paused" ? (_jsxs(StateBanner, { title: "Paused by the platform", onAction: () => void handleResume(), actionLabel: "Resume schedule", actionBusy: isResuming, children: [status?.pausedReason, " \u2014 resuming clears the pause and the failure streak. Re-applying the manifest does not."] })) : undefined;
+    const overviewContent = (_jsxs("div", { className: "flex flex-col gap-6", children: [_jsx(Section, { title: "Definition", children: _jsxs("dl", { className: "divide-y divide-border", children: [_jsx(DetailRow, { label: "Cadence", children: editable ? (_jsx(CadenceInlineEditor, { cron: spec?.cron ?? "", timeZone: spec?.timeZone ?? "", onSave: (cron, timeZone) => saveSpecField("cadence", (s) => {
+                                    s.cron = cron;
+                                    s.timeZone = timeZone;
+                                }), isSaving: isUpdating, error: saveError?.field === "cadence" ? saveError.message : undefined })) : (_jsx(CadenceSummary, { cron: spec?.cron ?? "", timeZone: spec?.timeZone ?? "" })) }), _jsx(DetailRow, { label: "Target agent", children: target?.agentRef ? (_jsx(ReferenceLink, { label: `${target.agentRef.org}/${target.agentRef.slug}`, onNavigate: onNavigateToAgent
+                                    ? () => onNavigateToAgent(target.agentRef.org, target.agentRef.slug)
+                                    : undefined })) : (_jsx("span", { className: "text-sm text-muted-foreground", children: "\u2014" })) }), _jsx(DetailRow, { label: "Message", children: editable && target ? (_jsx(InlineEditTextarea, { value: target.message ?? "", placeholder: "The instruction the agent receives on every fire \u2014 write it for a run with no human present.", onSave: (v) => saveSpecField("message", (s) => {
+                                    if (s.target.case === "agent") {
+                                        s.target.value.message = v.trim();
+                                    }
+                                }), isSaving: isUpdating, error: saveError?.field === "message" ? saveError.message : undefined, validate: validateMessage })) : (_jsx("p", { className: "whitespace-pre-wrap break-words text-sm text-foreground", children: target?.message || "—" })) }), _jsx(DetailRow, { label: "Environments", children: editable && target ? (_jsx(EnvironmentsInlineEditor, { org: scheduleOrg, refs: target.environmentRefs ?? [], onSave: (refs) => saveSpecField("environments", (s) => {
+                                    if (s.target.case === "agent") {
+                                        s.target.value.environmentRefs = refs.map((r) => create(ApiResourceReferenceSchema, {
+                                            org: r.org,
+                                            slug: r.slug,
+                                            kind: ApiResourceKind.environment,
+                                        }));
+                                    }
+                                }), isSaving: isUpdating, error: saveError?.field === "environments"
+                                    ? saveError.message
+                                    : undefined })) : (_jsx(EnvironmentRefList, { refs: target?.environmentRefs ?? [] })) }), _jsx(DetailRow, { label: "Workspace", children: _jsx(WorkspaceSummary, { entries: target?.workspaceEntries ?? [] }) }), _jsx(DetailRow, { label: "Engine & model", children: editable && target ? (_jsx(EngineModelInlineEditor, { invocation: target, onSave: (harness, modelName, serviceTier) => saveSpecField("engine-model", (s) => {
+                                    if (s.target.case === "agent") {
+                                        applyEngineModel(s.target.value, harness, modelName, serviceTier);
+                                    }
+                                }), isSaving: isUpdating, error: saveError?.field === "engine-model"
+                                    ? saveError.message
+                                    : undefined })) : (_jsx(EngineModelSummary, { invocation: target })) }), _jsx(DetailRow, { label: "Budget per run", children: editable && target ? (_jsx(BudgetInlineEditor, { config: target.runConfig, onSave: (maxCostUsd) => saveSpecField("budget", (s) => {
+                                    if (s.target.case === "agent") {
+                                        applyBudget(s.target.value, maxCostUsd);
+                                    }
+                                }), isSaving: isUpdating, error: saveError?.field === "budget" ? saveError.message : undefined })) : (_jsx(BudgetSummary, { config: target?.runConfig })) })] }) }), _jsx(Section, { title: "Status", children: _jsxs("dl", { className: "divide-y divide-border", children: [_jsx(DetailRow, { label: "Next fire", children: _jsx("span", { className: "text-sm text-foreground", children: stateInfo.state === "active" && status?.nextFireAt
+                                    ? formatNextFire(timestampDate(status.nextFireAt), renderNow)
+                                    : "—" }) }), _jsx(DetailRow, { label: "Last fired", children: _jsx("span", { className: "text-sm text-foreground", children: status?.lastFireAt
+                                    ? formatRelativeTime(timestampDate(status.lastFireAt), renderNow)
+                                    : "Never" }) }), _jsx(DetailRow, { label: "Last execution", children: status?.lastExecutionId ? (_jsx(ReferenceLink, { label: status.lastExecutionId, mono: true, onNavigate: onNavigateToExecution
+                                    ? () => onNavigateToExecution(status.lastExecutionId)
+                                    : undefined })) : (_jsx("span", { className: "text-sm text-muted-foreground", children: "\u2014" })) }), _jsx(DetailRow, { label: "Failure streak", children: _jsx(FailureStreak, { count: status?.consecutiveFailures ?? 0 }) })] }) }), _jsx(Section, { title: "Recent runs", headerActions: totalRunCount > recentRuns.length ? (_jsxs("button", { type: "button", onClick: () => effectiveOnTabChange(RUNS_TAB_ID), className: cn("text-xs font-medium text-primary underline-offset-2 hover:underline", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm"), children: ["View all ", totalRunCount, " runs"] })) : undefined, children: _jsx(ScheduleRunsCompactList, { runs: recentRuns, isLoading: recentRunsLoading, now: renderNow, onNavigateToExecution: onNavigateToExecution }) })] }));
+    let tabContent;
+    if (activeAdditionalTab) {
+        tabContent = activeAdditionalTab.content;
+    }
+    else if (effectiveActiveTab === RUNS_TAB_ID) {
+        tabContent = (_jsx(ScheduleRunsTable, { scheduleId: scheduleId, now: now, onNavigateToExecution: onNavigateToExecution }, runsVersion));
+    }
+    else {
+        tabContent = overviewContent;
+    }
+    return (_jsxs(_Fragment, { children: [_jsx(ResourceDetailShell, { header: headerMeta, headerBanner: headerBanner, primaryAction: primaryAction, actions: actions, tabs: effectiveTabs, activeTab: effectiveTabs ? effectiveActiveTab : undefined, onTabChange: effectiveTabs ? effectiveOnTabChange : undefined, tabsAriaLabel: "Schedule detail sections", className: className, children: tabContent }), _jsx(ConfirmDialog, { state: confirmState, onConfirm: handleConfirm, onCancel: handleCancel }), editOpen && (_jsx(EditResourceYamlDialog, { open: editOpen, onOpenChange: setEditOpen, resource: schedule, onApplied: () => refetch() }))] }));
+}
+// ---------------------------------------------------------------------------
+// State banner — one lever, one remedy, inline
+// ---------------------------------------------------------------------------
+function StateBanner({ title, children, actionLabel, onAction, actionBusy, }) {
+    return (_jsxs("div", { role: "status", className: "flex items-start gap-2.5 rounded-lg border border-warning/30 bg-warning/5 px-4 py-3", children: [_jsx(WarningIcon, { className: "mt-0.5 size-4 shrink-0 text-warning" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "text-sm font-medium text-foreground", children: title }), _jsx("p", { className: "mt-0.5 text-xs text-muted-foreground", children: children })] }), _jsx("button", { type: "button", onClick: onAction, disabled: actionBusy, className: cn("shrink-0 rounded-md border border-input bg-background px-3 py-1.5 text-xs font-medium text-foreground", "hover:bg-accent hover:text-accent-foreground", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", "disabled:pointer-events-none disabled:opacity-50"), children: actionLabel })] }));
+}
+// ---------------------------------------------------------------------------
+// Cadence summary — plain English first, raw cron as the precise record
+// ---------------------------------------------------------------------------
+/**
+ * Render a schedule's cadence for reading: the plain-English sentence
+ * first ("Every day at 09:00 (Asia/Kolkata)"), the raw cron beneath it
+ * in muted mono as the precise record.
+ *
+ * `cronToCadence` RECOGNIZES rather than parses (the platform owns no
+ * cron parser in either edition — see cadence.ts): expressions outside
+ * the builder's shapes come back as `custom`, for which the raw cron IS
+ * the primary display, with the time zone alongside so nothing the
+ * spec stores is hidden.
+ */
+function CadenceSummary({ cron, timeZone, }) {
+    if (!cron)
+        return _jsx("span", { className: "text-sm text-muted-foreground", children: "\u2014" });
+    const preset = cronToCadence(cron);
+    if (preset.kind === "custom") {
+        return (_jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("code", { className: "font-mono text-sm text-foreground", children: cron }), timeZone && (_jsx("span", { className: "text-xs text-muted-foreground", children: timeZone }))] }));
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx("span", { className: "text-sm text-foreground", children: describeCadence(preset, timeZone || undefined) }), _jsx("code", { className: "font-mono text-xs text-muted-foreground", children: cron })] }));
+}
+// ---------------------------------------------------------------------------
+// Inline editors — per-field click-to-edit over the lossless write path
+// ---------------------------------------------------------------------------
+//
+// Each editor follows the InlineEdit* family's contract: read mode is a
+// click target with a hover pencil; edit mode holds a local draft with
+// explicit Save/Cancel; a failed save keeps the editor open with the
+// server's message rendered verbatim beneath it (DD-006). The editors
+// stay in this file (the AgentDetailView single-organism precedent) and
+// reuse the creation form's field components — CadenceField,
+// TimeZoneField, EnvironmentPicker — so creating and editing a schedule
+// are the same experience.
+/** Cadence + time zone edit in one panel — they form one sentence. */
+function CadenceInlineEditor({ cron, timeZone, onSave, isSaving, error, }) {
+    const [isEditing, setIsEditing] = useState(false);
+    const [draftCadence, setDraftCadence] = useState(() => cronToCadence(cron));
+    const [draftZone, setDraftZone] = useState(timeZone);
+    const startEdit = () => {
+        // cronToCadence round-trips the stored cron into the preset picker;
+        // unrecognized shapes land on the Custom escape hatch with the raw
+        // string intact.
+        setDraftCadence(cronToCadence(cron));
+        setDraftZone(timeZone || browserTimeZone());
+        setIsEditing(true);
+    };
+    if (!isEditing) {
+        return (_jsx(InlineReadButton, { onEdit: startEdit, ariaLabel: "Edit cadence", children: _jsx(CadenceSummary, { cron: cron, timeZone: timeZone }) }));
+    }
+    const draftCron = cadenceToCron(draftCadence).trim();
+    const canSave = draftCron !== "" && validateCron(draftCron) === null;
+    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(CadenceField, { value: draftCadence, onChange: setDraftCadence, timeZone: draftZone, disabled: isSaving }), _jsxs("div", { className: "space-y-1", children: [_jsx("span", { className: editorLabelClasses, children: "Time zone" }), _jsx(TimeZoneField, { value: draftZone, onChange: setDraftZone, disabled: isSaving })] }), _jsx(InlineEditActions, { onCancel: () => setIsEditing(false), onSave: async () => {
+                    const ok = await onSave(draftCron, draftZone);
+                    if (ok)
+                        setIsEditing(false);
+                }, isSaving: isSaving, canSave: canSave, error: error })] }));
+}
+/** Environment bindings edit — org-shared credentials only (DD-017 D-2). */
+function EnvironmentsInlineEditor({ org, refs, onSave, isSaving, error, }) {
+    const [isEditing, setIsEditing] = useState(false);
+    const [draft, setDraft] = useState([]);
+    const startEdit = () => {
+        setDraft(refs.map((r) => ({ org: r.org, slug: r.slug })));
+        setIsEditing(true);
+    };
+    if (!isEditing) {
+        return (_jsx(InlineReadButton, { onEdit: startEdit, ariaLabel: "Edit environments", children: _jsx(EnvironmentRefList, { refs: refs }) }));
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx(EnvironmentPicker, { org: org, value: draft, onChange: setDraft, disabled: isSaving, 
+                // Only org-shared environments resolve for a schedule fire (the
+                // same credential surface a channel binding uses), so offering
+                // anything else could only produce refused runs.
+                filterEnvironment: isOrgSharedEnvironment }), _jsx("p", { className: "text-[0.65rem] text-muted-foreground", children: "Bind org-shared credentials so the agent\u2019s tools work on an unattended fire. Without this, an agent whose tools need credentials will be refused every run." }), _jsx(InlineEditActions, { onCancel: () => setIsEditing(false), onSave: async () => {
+                    const ok = await onSave(draft);
+                    if (ok)
+                        setIsEditing(false);
+                }, isSaving: isSaving, canSave: true, error: error })] }));
+}
+function isOrgSharedEnvironment(env) {
+    return env.metadata?.visibility === ApiResourceVisibility.visibility_org;
+}
+/**
+ * Engine & model edit — the composer's own picker, with the creation
+ * form's atomic semantics (DD-018 D-5): picking a model pins BOTH the
+ * harness and the model (the registry scopes models per harness);
+ * clearing the model unpins both, and the platform defaults apply.
+ */
+function EngineModelInlineEditor({ invocation, onSave, isSaving, error, }) {
+    const [isEditing, setIsEditing] = useState(false);
+    const [modelName, setModelName] = useState("");
+    const [harness, setHarness] = useState("cursor");
+    const [serviceTier, setServiceTier] = useState("standard");
+    const startEdit = () => {
+        setModelName(invocation.runConfig?.modelName ?? "");
+        setHarness(invocation.harness !== Harness.UNSPECIFIED
+            ? fromProtoHarness(invocation.harness)
+            : "cursor");
+        setServiceTier(fromProtoServiceTier(invocation.runConfig?.serviceTier) ?? "standard");
+        setIsEditing(true);
+    };
+    if (!isEditing) {
+        return (_jsx(InlineReadButton, { onEdit: startEdit, ariaLabel: "Edit engine and model", children: _jsx(EngineModelSummary, { invocation: invocation }) }));
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(ModelSelector, { value: modelName, onValueChange: setModelName, initialHarness: harness, onHarnessChange: setHarness, serviceTier: serviceTier, onServiceTierChange: setServiceTier, placeholderLabel: "Platform default", disabled: isSaving }), modelName !== "" && (_jsx("button", { type: "button", onClick: () => {
+                            setModelName("");
+                            setServiceTier("standard");
+                        }, disabled: isSaving, className: "rounded-md px-2 py-1 text-[0.65rem] text-muted-foreground hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50", children: "Reset to platform default" }))] }), _jsx("p", { className: "text-[0.65rem] text-muted-foreground", children: "Runs use the platform\u2019s default engine and model unless you pick one here. Picking a model pins the engine it belongs to." }), _jsx(InlineEditActions, { onCancel: () => setIsEditing(false), onSave: async () => {
+                    const ok = await onSave(modelName !== "" ? toProtoHarness(harness) : Harness.UNSPECIFIED, modelName, serviceTier);
+                    if (ok)
+                        setIsEditing(false);
+                }, isSaving: isSaving, canSave: true, error: error })] }));
+}
+/** Budget edit — blank inherits the platform default (DD-018 D-2). */
+function BudgetInlineEditor({ config, onSave, isSaving, error, }) {
+    const [isEditing, setIsEditing] = useState(false);
+    const [budgetUsd, setBudgetUsd] = useState("");
+    const startEdit = () => {
+        setBudgetUsd(config && config.maxCostUsd > 0 ? String(config.maxCostUsd) : "");
+        setIsEditing(true);
+    };
+    if (!isEditing) {
+        return (_jsx(InlineReadButton, { onEdit: startEdit, ariaLabel: "Edit budget", children: _jsx(BudgetSummary, { config: config }) }));
+    }
+    const cost = Number.parseFloat(budgetUsd);
+    const parsedBudget = Number.isFinite(cost) && cost > 0 ? cost : undefined;
+    return (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("input", { type: "number", min: "0", step: "any", "aria-label": "Budget per run (USD)", value: budgetUsd, onChange: (e) => setBudgetUsd(e.target.value), placeholder: "platform default", disabled: isSaving, className: cn(editorInputClasses, "sm:max-w-48") }), _jsx("p", { className: "text-[0.65rem] text-muted-foreground", children: "Each run stops when it reaches this spend. You can lower the platform\u2019s per-run cap, never raise it past the platform\u2019s ceiling. Blank inherits the platform default." }), _jsx(InlineEditActions, { onCancel: () => setIsEditing(false), onSave: async () => {
+                    const ok = await onSave(parsedBudget);
+                    if (ok)
+                        setIsEditing(false);
+                }, isSaving: isSaving, canSave: true, error: error })] }));
+}
+/**
+ * Write the engine+model choice onto the invocation, preserving the
+ * run-config fields the editor does not own (budget; the API-only tool
+ * rounds), and dropping an all-empty run_config — the proto's "empty =
+ * inherit" contract (DD-017 D-3 as carried into DD-018 D-2).
+ */
+function applyEngineModel(invocation, harness, modelName, serviceTier) {
+    invocation.harness = harness;
+    invocation.runConfig = normalizeRunConfig(modelName, invocation.runConfig?.maxCostUsd ?? 0, invocation.runConfig?.maxToolRounds ?? 0, 
+    // The tier rides the model choice: no model, no tier (#357).
+    modelName.trim() !== "" ? serviceTier : "standard");
+}
+/** Budget twin of {@link applyEngineModel} — writes only the cost cap. */
+function applyBudget(invocation, maxCostUsd) {
+    invocation.runConfig = normalizeRunConfig(invocation.runConfig?.modelName ?? "", maxCostUsd ?? 0, invocation.runConfig?.maxToolRounds ?? 0, fromProtoServiceTier(invocation.runConfig?.serviceTier) ?? "standard");
+}
+function normalizeRunConfig(modelName, maxCostUsd, maxToolRounds, serviceTier) {
+    const fields = {};
+    if (modelName.trim() !== "")
+        fields.modelName = modelName.trim();
+    if (maxCostUsd > 0)
+        fields.maxCostUsd = maxCostUsd;
+    if (maxToolRounds > 0)
+        fields.maxToolRounds = maxToolRounds;
+    // Only an active fast choice is carried — an untouched toggle stays
+    // absent, preserving the unspecified-vs-explicit ledger distinction (#357).
+    if (serviceTier === "fast")
+        fields.serviceTier = toProtoServiceTier(serviceTier);
+    return Object.keys(fields).length > 0
+        ? create(RunConfigSchema, fields)
+        : undefined;
+}
+/** Mirrors the server's constraint so the editor rejects bad input instantly. */
+function validateMessage(value) {
+    if (!value.trim()) {
+        return "Message is required — the agent receives it on every fire.";
+    }
+    if (value.length > MESSAGE_MAX_LEN) {
+        return `Message must be at most ${MESSAGE_MAX_LEN} characters.`;
+    }
+    return null;
+}
+// ---------------------------------------------------------------------------
+// Inline-edit chrome shared by the bespoke editors above
+// ---------------------------------------------------------------------------
+const editorLabelClasses = "block text-xs font-medium text-foreground";
+const editorInputClasses = cn("w-full rounded-md border border-input bg-background px-2.5 py-1.5 text-xs text-foreground", "placeholder:text-muted-foreground", "focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring", "disabled:pointer-events-none disabled:opacity-50");
+/** Read-mode click target with the family's hover pencil. */
+function InlineReadButton({ onEdit, ariaLabel, children, }) {
+    return (_jsx("div", { className: "group/inline-edit", children: _jsx("button", { type: "button", onClick: onEdit, "aria-label": ariaLabel, className: cn("-mx-2 w-full rounded-md px-2 py-1.5 text-left transition-colors", "hover:bg-accent-hover cursor-pointer", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring"), children: _jsxs("div", { className: "flex items-start justify-between gap-2", children: [_jsx("div", { className: "min-w-0 flex-1", children: children }), _jsx(PencilIcon, { className: "mt-0.5 size-3 shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover/inline-edit:opacity-100" })] }) }) }));
+}
+/** Save/Cancel footer with the field-attributed error line. */
+function InlineEditActions({ onCancel, onSave, isSaving, canSave, error, }) {
+    return (_jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsxs("div", { className: "flex items-center justify-end gap-1.5", children: [_jsx("button", { type: "button", onClick: onCancel, disabled: isSaving, className: cn("rounded-md px-2.5 py-1 text-xs font-medium", "border border-border bg-background text-foreground hover:bg-accent hover:text-accent-foreground", "disabled:opacity-50", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"), children: "Cancel" }), _jsxs("button", { type: "button", onClick: onSave, disabled: !canSave || isSaving, className: cn("inline-flex items-center gap-1 rounded-md px-2.5 py-1 text-xs font-medium", "bg-primary text-primary-foreground hover:bg-primary-hover", "disabled:pointer-events-none disabled:opacity-50", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"), children: [isSaving && _jsx(SpinnerIcon, {}), "Save"] })] }), error && (_jsx("p", { className: "text-xs text-destructive", role: "alert", children: error }))] }));
+}
+// ---------------------------------------------------------------------------
+// Detail rows and references
+// ---------------------------------------------------------------------------
+function DetailRow({ label, children, }) {
+    return (_jsxs("div", { className: "flex items-start gap-4 px-4 py-2.5", children: [_jsx("dt", { className: "w-40 shrink-0 pt-0.5 text-xs font-medium text-muted-foreground", children: label }), _jsx("dd", { className: "min-w-0 flex-1", children: children })] }));
+}
+/** The bound environment references, or the em-dash when there are none. */
+function EnvironmentRefList({ refs, }) {
+    if (refs.length === 0) {
+        return _jsx("span", { className: "text-sm text-muted-foreground", children: "\u2014" });
+    }
+    return (_jsx("ul", { className: "flex flex-col gap-0.5", children: refs.map((ref, i) => (_jsx("li", { className: "font-mono text-xs text-foreground", children: ref.org ? `${ref.org}/${ref.slug}` : ref.slug }, `${ref.org}/${ref.slug}-${i}`))) }));
+}
+// ---------------------------------------------------------------------------
+// Failure streak — status.consecutive_failures, explained
+// ---------------------------------------------------------------------------
+/**
+ * The platform's failure streak: how many SCHEDULED runs in a row ended
+ * badly. The server increments it per failed cron fire, resets it on a
+ * successful run (or Resume), and auto-pauses the schedule when the
+ * streak crosses its threshold. Manual "Run now" fires never count.
+ *
+ * The threshold itself is server configuration not exposed through the
+ * API, so the copy stays qualitative — a hardcoded "of 5" here could
+ * silently drift from what the platform actually enforces.
+ */
+function FailureStreak({ count }) {
+    if (count === 0) {
+        return _jsx("span", { className: "text-sm text-foreground", children: "0" });
+    }
+    return (_jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsxs("span", { className: "text-sm font-medium text-warning", children: [count, " consecutive failed ", count === 1 ? "run" : "runs"] }), _jsx("p", { className: "text-xs text-muted-foreground", children: "Failed scheduled runs raise this streak; too many in a row and the platform pauses the schedule automatically. One successful run resets it to 0. Manual runs never count." })] }));
+}
+// ---------------------------------------------------------------------------
+// The invocation's run shape — engine+model, budget, workspace summaries
+// ---------------------------------------------------------------------------
+/** "Cursor · composer-2.5", either half falling back to the platform default. */
+function EngineModelSummary({ invocation, }) {
+    const harness = invocation?.harness ?? Harness.UNSPECIFIED;
+    const modelName = invocation?.runConfig?.modelName ?? "";
+    if (harness === Harness.UNSPECIFIED && modelName === "") {
+        return (_jsx("span", { className: "text-sm text-muted-foreground", children: "Platform default" }));
+    }
+    const parts = [];
+    if (harness !== Harness.UNSPECIFIED) {
+        parts.push(HARNESS_META[fromProtoHarness(harness)].label);
+    }
+    parts.push(modelName !== "" ? modelName : "platform-default model");
+    if (invocation?.runConfig?.serviceTier === ServiceTier.FAST) {
+        parts.push("Fast tier");
+    }
+    return _jsx("span", { className: "text-sm text-foreground", children: parts.join(" · ") });
+}
+/** The per-run cost cap, plus the API-only tool-round bound when set. */
+function BudgetSummary({ config, }) {
+    const maxCostUsd = config?.maxCostUsd ?? 0;
+    const maxToolRounds = config?.maxToolRounds ?? 0;
+    return (_jsxs("div", { className: "flex flex-col gap-0.5", children: [maxCostUsd > 0 ? (_jsxs("span", { className: "text-sm text-foreground", children: ["\u2264 $", maxCostUsd.toFixed(2), " per run"] })) : (_jsx("span", { className: "text-sm text-muted-foreground", children: "Platform default" })), maxToolRounds > 0 && (_jsxs("span", { className: "text-xs text-muted-foreground", children: ["\u2264 ", maxToolRounds, " tool rounds"] }))] }));
+}
+/** The git workspace each fire clones, or the em-dash when none. */
+function WorkspaceSummary({ entries, }) {
+    if (entries.length === 0) {
+        return _jsx("span", { className: "text-sm text-muted-foreground", children: "\u2014" });
+    }
+    return (_jsx("ul", { className: "flex flex-col gap-0.5", children: entries.map((entry, i) => {
+            const git = entry.source?.source?.case === "gitRepo"
+                ? entry.source.source.value
+                : undefined;
+            return (_jsxs("li", { className: "text-xs text-foreground", children: [_jsx("span", { className: "font-medium", children: entry.name }), git?.url && (_jsxs("span", { className: "ml-1.5 font-mono text-muted-foreground", children: [git.url, git.branch ? `@${git.branch}` : ""] }))] }, `${entry.name}-${i}`));
+        }) }));
+}
+function ReferenceLink({ label, onNavigate, mono, }) {
+    const textClass = cn("text-sm", mono && "font-mono text-xs");
+    if (!onNavigate) {
+        return _jsx("span", { className: cn(textClass, "text-foreground"), children: label });
+    }
+    return (_jsx("button", { type: "button", onClick: onNavigate, className: cn(textClass, "text-primary underline-offset-2 hover:underline", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm"), children: label }));
+}
+// ---------------------------------------------------------------------------
+// Non-happy states
+// ---------------------------------------------------------------------------
+function LoadingSkeleton({ className }) {
+    return (_jsxs("div", { className: cn("flex flex-col gap-6", className), "aria-busy": "true", "aria-label": "Loading schedule details", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsx("div", { className: "mt-1 size-6 shrink-0 animate-pulse rounded bg-muted" }), _jsxs("div", { className: "flex-1 space-y-2", children: [_jsx("div", { className: "h-5 w-48 animate-pulse rounded bg-muted" }), _jsx("div", { className: "h-3 w-64 animate-pulse rounded bg-muted" })] })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: "h-3 w-28 animate-pulse rounded bg-muted" }), _jsx("div", { className: "animate-pulse rounded-lg border border-border bg-muted-faint", style: { height: "160px" } })] }), _jsxs("div", { className: "space-y-2", children: [_jsx("div", { className: "h-3 w-20 animate-pulse rounded bg-muted" }), _jsx("div", { className: "animate-pulse rounded-lg border border-border bg-muted-faint", style: { height: "160px" } })] })] }));
+}
+function NotFoundState({ className }) {
+    return (_jsxs("div", { role: "status", className: cn("flex flex-col items-center gap-2 py-12 text-center", className), children: [_jsx(ScheduleIcon, { className: "size-10 text-muted-foreground-faint" }), _jsx("p", { className: "text-sm font-medium text-muted-foreground", children: "Schedule not found" }), _jsx("p", { className: "text-xs text-muted-foreground-subtle", children: "This schedule doesn't exist or you don't have access to it." })] }));
+}
+// ---------------------------------------------------------------------------
+// Icons (inline SVG — no icon-library dependency)
+// ---------------------------------------------------------------------------
+/** Clock-with-arrow icon shared by the schedule views. */
+export function ScheduleIcon({ className }) {
+    return (_jsxs("svg", { className: className, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("path", { d: "M21 12a9 9 0 1 1-2.64-6.36" }), _jsx("path", { d: "M21 3v5h-5" }), _jsx("path", { d: "M12 7v5l3 3" })] }));
+}
+function WarningIcon({ className }) {
+    return (_jsxs("svg", { className: className, viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [_jsx("path", { d: "M8 1.5 15 14H1L8 1.5Z" }), _jsx("path", { d: "M8 6v4" }), _jsx("path", { d: "M8 12.2v.05" })] }));
+}
+function PencilIcon({ className }) {
+    return (_jsx("svg", { className: className, viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: _jsx("path", { d: "M11.5 1.5a2.121 2.121 0 0 1 3 3L5 14l-4 1 1-4Z" }) }));
+}
+function SpinnerIcon() {
+    return (_jsx("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", className: "animate-spin", "aria-hidden": "true", children: _jsx("path", { d: "M8 2a6 6 0 1 0 6 6" }) }));
+}
+//# sourceMappingURL=ScheduleDetailView.js.map