@elizaos/ui 2.0.0-alpha.43 → 2.0.0-alpha.430

package/packages/app-core/src/components/pages/AutomationsView.js

@@ -0,0 +1,2528 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+/**
+ * AutomationsView — list/detail UI for tasks and n8n workflows.
+ */
+import { Button, Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, FieldLabel, Input, PageLayout, PagePanel, SidebarCollapsedActionButton, SidebarContent, SidebarPanel, SidebarScrollRegion, StatusBadge, StatusDot, Textarea, } from "@elizaos/ui";
+import { ArrowRight, Calendar, CheckCircle2, ChevronDown, ChevronRight, Circle, Clock3, Copy, Edit as EditIcon, FileText, GitBranch, Grid3x3, LayoutDashboard, Mail, Pause, Play, Plus, RefreshCw, Rss, Settings, Share2, Signal, SquareTerminal, Trash2, Workflow, Zap, } from "lucide-react";
+import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState, } from "react";
+import { client } from "../../api";
+import { isMissingCredentialsResponse, } from "../../api/client";
+import { useWorkflowGenerationState } from "../../hooks/useWorkflowGenerationState";
+import { useApp } from "../../state";
+import { confirmDesktopAction } from "../../utils";
+import { formatDateTime, formatDurationMs } from "../../utils/format";
+// Direct sub-path import: `widgets/index.ts` re-exports `WidgetHost` while
+// also pulling other widgets/* modules that depend back through the barrel.
+// Going through the index from here drags Rollup into a chunk-level cycle
+// (warning: "reexported through module ... while both modules are
+// dependencies of each other"); the direct import skips it.
+import { WidgetHost } from "../../widgets/WidgetHost";
+import { AppPageSidebar } from "../shared/AppPageSidebar";
+import { AppWorkspaceChrome, useAppWorkspaceChatChrome, } from "../workspace/AppWorkspaceChrome";
+import { buildAutomationDraftConversationMetadata, buildAutomationResponseRoutingMetadata, buildCoordinatorConversationMetadata, buildCoordinatorTriggerConversationMetadata, buildWorkflowConversationMetadata, buildWorkflowDraftConversationMetadata, getAutomationBridgeConversationId, resolveAutomationConversation, } from "./automation-conversations";
+import { HeartbeatForm } from "./HeartbeatForm";
+import { buildCreateRequest, buildUpdateRequest, emptyForm, formFromTrigger, humanizeEventKind, loadUserTemplates, localizedExecutionStatus, railMonogram, saveUserTemplates, scheduleLabel, toneForLastStatus, validateForm, } from "./heartbeat-utils";
+import { PageScopedChatPane } from "./PageScopedChatPane";
+import { WorkflowGraphViewer } from "./WorkflowGraphViewer";
+import { VISUALIZE_WORKFLOW_EVENT, } from "./workflow-graph-events";
+const WORKFLOW_DRAFT_TITLE = "New Workflow Draft";
+const WORKFLOW_SYSTEM_ADDENDUM = "You are in a workflow-specific automation room. Focus only on this " +
+    "workflow. Use the linked terminal conversation only when it directly " +
+    "informs the workflow. Request keys and connector setup when needed, and " +
+    "prefer owner-scoped LifeOps integrations for personal services.";
+const AUTOMATION_DRAFT_SYSTEM_ADDENDUM = "You are in an automation-creation room. The user wants to create one " +
+    "automation. Decide whether it should be a task or a workflow and call " +
+    "the matching action exactly once:\n" +
+    '- Task: a simple prompt that runs on a schedule or from an event, for example "every morning summarize my inbox" or "when I get a GitHub notification, make a todo". Use CREATE_TRIGGER_TASK with a clear displayName, instructions, and any needed schedule.\n' +
+    '- Workflow: a multi-step n8n pipeline with deterministic steps and integrations, for example "when a Slack message matches X, post to Discord and log it". Create an n8n workflow via the n8n actions.\n' +
+    "Ask one short clarifying question only if the shape is genuinely " +
+    "ambiguous; otherwise create immediately. After creation, briefly " +
+    "confirm what you made and how it starts.";
+const NODE_CLASS_ORDER = [
+    "agent",
+    "action",
+    "context",
+    "integration",
+    "trigger",
+    "flow-control",
+];
+const PAGE_CHAT_PREFILL_EVENT = "milady:chat:prefill";
+const DESCRIBE_WORKFLOW_PROMPT = "Describe your workflow";
+const DESCRIBE_AUTOMATION_PROMPT = "What should happen?";
+const WORKFLOW_PROMPT_PLACEHOLDER = "Describe the trigger and steps, e.g. when a GitHub issue opens, summarize it and post to Discord";
+const AUTOMATION_PROMPT_PLACEHOLDER = "e.g. Every morning summarize my inbox, or when a GitHub issue opens, triage it";
+const AUTOMATIONS_OVERVIEW_VISIBILITY_EVENT = "milady:automations:overview-visibility";
+function createWorkflowDraftId() {
+    return globalThis.crypto.randomUUID();
+}
+function prefillPageChat(text, options) {
+    if (typeof window === "undefined")
+        return;
+    window.dispatchEvent(new CustomEvent(PAGE_CHAT_PREFILL_EVENT, {
+        detail: {
+            text,
+            select: options?.select ?? true,
+        },
+    }));
+}
+/**
+ * Display name for an n8n credential type. Backend emits raw credential type
+ * IDs (e.g. `slackApi`, `gmailOAuth2`); the missing-credentials banner shows
+ * users a friendly service name. Falls back to the raw type if unmapped.
+ */
+const CRED_TYPE_LABELS = {
+    gmailOAuth2: "Gmail",
+    gmailOAuth2Api: "Gmail",
+    slackApi: "Slack",
+    slackOAuth2Api: "Slack",
+    discordApi: "Discord",
+    discordBotApi: "Discord",
+    discordWebhookApi: "Discord",
+    telegramApi: "Telegram",
+};
+function prettyCredName(credType) {
+    return CRED_TYPE_LABELS[credType] ?? credType;
+}
+function buildWorkflowCopyRequest(workflow, name) {
+    return {
+        name,
+        nodes: workflow.nodes?.map((node) => ({
+            name: node.name,
+            type: node.type,
+            typeVersion: node.typeVersion ?? 1,
+            position: node.position ?? [0, 0],
+            parameters: node.parameters ?? {},
+            ...(node.notes ? { notes: node.notes } : {}),
+            ...(node.notesInFlow !== undefined
+                ? { notesInFlow: node.notesInFlow }
+                : {}),
+        })) ?? [],
+        connections: workflow.connections ?? {},
+        settings: {},
+    };
+}
+function inferAutomationPromptKind(prompt) {
+    const normalized = prompt.toLowerCase();
+    const looksScheduledTask = /\b(every|daily|hourly|weekly|monthly|weekday|morning|evening|at \d{1,2})\b/.test(normalized);
+    const looksWorkflow = /\b(when|if|after|then|workflow|pipeline|webhook|event|triage|route|label|enrich|crm)\b/.test(normalized) ||
+        (normalized.includes(" and ") &&
+            /\b(send|post|create|update|reply|notify|summarize)\b/.test(normalized));
+    if (looksScheduledTask && !normalized.includes("when "))
+        return "task";
+    return looksWorkflow ? "workflow" : "task";
+}
+function titleFromAutomationPrompt(prompt) {
+    const cleaned = prompt
+        .replace(/[^\p{L}\p{N}\s-]/gu, " ")
+        .replace(/\s+/g, " ")
+        .trim();
+    if (!cleaned)
+        return "New task";
+    const title = cleaned.split(" ").slice(0, 7).join(" ");
+    return title.charAt(0).toUpperCase() + title.slice(1);
+}
+// Reads `#automations.trigger=<id>` from the URL hash. The LifeOps chat-sidebar
+// Automations widget writes this when a row is clicked, so /automations can
+// focus the matching trigger card on navigation. Duplicated here (instead of
+// cross-importing from @elizaos/app-lifeops) to keep the package dep graph
+// one-way (app-lifeops → app-core).
+const AUTOMATIONS_TRIGGER_HASH_KEY = "automations.trigger";
+function readAutomationsTriggerFromHash() {
+    if (typeof window === "undefined")
+        return null;
+    const raw = window.location.hash.startsWith("#")
+        ? window.location.hash.slice(1)
+        : window.location.hash;
+    if (!raw)
+        return null;
+    for (const chunk of raw.split("&")) {
+        if (!chunk)
+            continue;
+        const eq = chunk.indexOf("=");
+        if (eq < 0)
+            continue;
+        try {
+            const key = decodeURIComponent(chunk.slice(0, eq));
+            if (key !== AUTOMATIONS_TRIGGER_HASH_KEY)
+                continue;
+            const value = decodeURIComponent(chunk.slice(eq + 1));
+            return value || null;
+        }
+        catch {
+            // Skip malformed encodings.
+        }
+    }
+    return null;
+}
+function getNavigationPathFromWindow() {
+    if (typeof window === "undefined")
+        return "/";
+    return window.location.protocol === "file:"
+        ? window.location.hash.replace(/^#/, "") || "/"
+        : window.location.pathname || "/";
+}
+function normalizeAutomationPath(pathname) {
+    if (!pathname)
+        return "/";
+    const normalized = pathname.startsWith("/") ? pathname : `/${pathname}`;
+    return normalized.length > 1 ? normalized.replace(/\/+$/, "") : normalized;
+}
+function getAutomationSubpageFromPath(pathname) {
+    const normalized = normalizeAutomationPath(pathname);
+    if (normalized === "/node-catalog" ||
+        normalized === "/automations/node-catalog") {
+        return "node-catalog";
+    }
+    return "list";
+}
+function getPathForAutomationSubpage(subpage) {
+    return subpage === "node-catalog"
+        ? "/automations/node-catalog"
+        : "/automations";
+}
+function syncAutomationSubpagePath(subpage, mode = "push") {
+    if (typeof window === "undefined")
+        return;
+    const nextPath = getPathForAutomationSubpage(subpage);
+    const currentPath = normalizeAutomationPath(getNavigationPathFromWindow());
+    if (currentPath === nextPath)
+        return;
+    if (window.location.protocol === "file:") {
+        window.location.hash = nextPath;
+        return;
+    }
+    window.history[mode === "replace" ? "replaceState" : "pushState"](null, "", nextPath);
+}
+function getSelectionKind(item) {
+    if (!item)
+        return null;
+    if (item.type === "n8n_workflow")
+        return "workflow";
+    if (item.task)
+        return "task";
+    if (item.trigger)
+        return "trigger";
+    return null;
+}
+function getAutomationDisplayTitle(item) {
+    return item.isDraft ? "Draft" : item.title;
+}
+function getOverviewDisplayTitle(item) {
+    if (!item.isDraft) {
+        return getAutomationDisplayTitle(item);
+    }
+    if (item.type === "automation_draft") {
+        return "Draft automation";
+    }
+    return `Draft ${getAutomationGroupLabel(item).toLowerCase()}`;
+}
+function getAutomationGroupLabel(item) {
+    if (item.type === "n8n_workflow") {
+        return "Workflow";
+    }
+    if (item.system) {
+        return "Agent owned";
+    }
+    return "Task";
+}
+function collectScheduledAutomationEntries(items) {
+    return items.flatMap((item) => item.schedules.map((schedule) => ({
+        item,
+        schedule,
+        key: `${item.id}:${schedule.id}`,
+    })));
+}
+function isTimeBasedTrigger(trigger) {
+    return trigger.triggerType !== "event";
+}
+function formatScheduleCount(count) {
+    return count === 1 ? "1 schedule" : `${count} schedules`;
+}
+function getAutomationBridgeIdForItem(item, activeConversationId, conversations) {
+    return (item?.room?.terminalBridgeConversationId ??
+        item?.room?.sourceConversationId ??
+        getAutomationBridgeConversationId(activeConversationId, conversations));
+}
+function getWorkflowNodeCount(item) {
+    return item.workflow?.nodeCount ?? item.workflow?.nodes?.length ?? 0;
+}
+function getAutomationUpdatedAtMs(item) {
+    if (!item.updatedAt) {
+        return 0;
+    }
+    const ts = Date.parse(item.updatedAt);
+    return Number.isFinite(ts) ? ts : 0;
+}
+function sortAutomationsByUpdatedAtDesc(items) {
+    return [...items].sort((left, right) => getAutomationUpdatedAtMs(right) - getAutomationUpdatedAtMs(left));
+}
+function getAutomationIndicatorTone(item) {
+    if (item.type === "n8n_workflow") {
+        return item.enabled ? "accent" : undefined;
+    }
+    if (item.task) {
+        return item.task.isCompleted ? undefined : "accent";
+    }
+    if (item.trigger) {
+        return item.trigger.enabled ? "accent" : undefined;
+    }
+    return undefined;
+}
+function getAutomationStatusTone(item) {
+    if (item.isDraft)
+        return "warning";
+    if (item.type === "n8n_workflow") {
+        return item.enabled ? "success" : "muted";
+    }
+    if (item.trigger) {
+        const lastTone = toneForLastStatus(item.trigger.lastStatus);
+        if (lastTone === "danger")
+            return "danger";
+        return item.trigger.enabled ? "success" : "muted";
+    }
+    if (item.task) {
+        return item.task.isCompleted ? "muted" : "success";
+    }
+    return "muted";
+}
+function getTriggerWakeModeLabel(trigger) {
+    return trigger.wakeMode === "inject_now"
+        ? "Interrupt and run now"
+        : "Queue for next cycle";
+}
+function getTriggerStartModeLabel(trigger) {
+    if (trigger.triggerType === "once")
+        return "One time";
+    if (trigger.triggerType === "cron")
+        return "Cron schedule";
+    if (trigger.triggerType === "event")
+        return "Event";
+    return "Repeating";
+}
+function buildTriggerSchedulePrompt(trigger) {
+    if (trigger.triggerType === "interval") {
+        return `Schedule: interval every ${trigger.intervalMs ?? 0}ms.`;
+    }
+    if (trigger.triggerType === "once") {
+        return `Schedule: run once at ${trigger.scheduledAtIso ?? "an unspecified time"}.`;
+    }
+    if (trigger.triggerType === "cron") {
+        return `Schedule: cron ${trigger.cronExpression ?? ""}.`;
+    }
+    if (trigger.triggerType === "event") {
+        return `Event: ${trigger.eventKind ?? "event"}.`;
+    }
+    return `Schedule type: ${trigger.triggerType}.`;
+}
+function buildWorkflowCompilationPrompt(item) {
+    const lines = [
+        "Compile this coordinator automation into an n8n workflow.",
+        `Automation title: ${item.title}`,
+        `Description: ${item.description || "No additional description provided."}`,
+        "Keep the workflow in this dedicated automation room.",
+        "Use runtime actions and providers as workflow nodes when they fit the job.",
+        "Use owner-scoped LifeOps nodes for Gmail, Calendar, Signal, Telegram, Discord, and GitHub when they are set up. If not, request the required setup or keys.",
+    ];
+    if (item.task) {
+        lines.push(`Task description: ${item.task.description || "No task description."}`);
+    }
+    if (item.trigger) {
+        lines.push(`Coordinator instructions: ${item.trigger.instructions}`);
+        lines.push(buildTriggerSchedulePrompt(item.trigger));
+    }
+    if (item.schedules.length > 0) {
+        lines.push("Existing schedules:");
+        for (const schedule of item.schedules) {
+            lines.push(`- ${buildTriggerSchedulePrompt(schedule)}`);
+        }
+    }
+    lines.push("Ask follow-up questions only when workflow intent is genuinely ambiguous.");
+    return lines.join("\n");
+}
+function getNodeClassLabel(className) {
+    switch (className) {
+        case "agent":
+            return "Agent";
+        case "action":
+            return "Actions";
+        case "context":
+            return "Context";
+        case "integration":
+            return "Integrations";
+        case "trigger":
+            return "Triggers";
+        case "flow-control":
+            return "Flow Control";
+        default:
+            return className;
+    }
+}
+function getNodeIcon(node) {
+    if (node.source === "lifeops_event") {
+        return _jsx(Zap, { className: "h-3.5 w-3.5" });
+    }
+    if (node.source === "lifeops") {
+        if (node.id === "lifeops:gmail")
+            return _jsx(Mail, { className: "h-3.5 w-3.5" });
+        if (node.id === "lifeops:signal")
+            return _jsx(Signal, { className: "h-3.5 w-3.5" });
+        if (node.id === "lifeops:github") {
+            return _jsx(GitBranch, { className: "h-3.5 w-3.5" });
+        }
+    }
+    if (node.class === "agent") {
+        return _jsx(SquareTerminal, { className: "h-3.5 w-3.5" });
+    }
+    if (node.class === "integration") {
+        return _jsx(Workflow, { className: "h-3.5 w-3.5" });
+    }
+    if (node.class === "context") {
+        return _jsx(Settings, { className: "h-3.5 w-3.5" });
+    }
+    if (node.class === "trigger") {
+        return _jsx(Clock3, { className: "h-3.5 w-3.5" });
+    }
+    return _jsx(Zap, { className: "h-3.5 w-3.5" });
+}
+function useAutomationsViewController() {
+    const { triggers = [], triggersLoaded = false, triggersLoading = false, triggersSaving = false, triggerRunsById = {}, triggerError = null, loadTriggers = async () => { }, createTrigger = async () => null, updateTrigger = async () => null, deleteTrigger = async () => true, runTriggerNow = async () => true, loadTriggerRuns = async () => { }, loadTriggerHealth = async () => { }, ensureTriggersLoaded = async () => {
+        await loadTriggers(triggersLoaded ? { silent: true } : undefined);
+    }, t, uiLanguage, } = useApp();
+    const [taskError, setTaskError] = useState(null);
+    const [taskSaving, setTaskSaving] = useState(false);
+    const [form, setForm] = useState(emptyForm);
+    const [editingId, setEditingId] = useState(null);
+    const [selectedItemId, setSelectedItemId] = useState(null);
+    const [selectedItemKind, setSelectedItemKind] = useState(null);
+    const [formError, setFormError] = useState(null);
+    const [editorOpen, setEditorOpen] = useState(false);
+    const [editorMode, setEditorMode] = useState("trigger");
+    const [userTemplates, setUserTemplates] = useState(loadUserTemplates);
+    const [templateNotice, setTemplateNotice] = useState(null);
+    const [taskFormName, setTaskFormName] = useState("");
+    const [taskFormDescription, setTaskFormDescription] = useState("");
+    const [editingTaskId, setEditingTaskId] = useState(null);
+    const [filter, setFilter] = useState("all");
+    const [automationItems, setAutomationItems] = useState([]);
+    const [automationNodes, setAutomationNodes] = useState([]);
+    const [automationsLoading, setAutomationsLoading] = useState(false);
+    const [automationsLoaded, setAutomationsLoaded] = useState(false);
+    const [automationsError, setAutomationsError] = useState(null);
+    const [n8nStatus, setN8nStatus] = useState(null);
+    const [workflowFetchError, setWorkflowFetchError] = useState(null);
+    const didBootstrapDataRef = useRef(false);
+    const lastSelectedIdRef = useRef(null);
+    const refreshAutomations = useCallback(async () => {
+        setAutomationsLoading(true);
+        try {
+            const [automationData, nodeCatalog] = await Promise.all([
+                client.listAutomations(),
+                client.getAutomationNodeCatalog(),
+            ]);
+            setAutomationItems(automationData.automations ?? []);
+            setAutomationNodes(nodeCatalog.nodes ?? []);
+            setN8nStatus(automationData.n8nStatus ?? null);
+            setWorkflowFetchError(automationData.workflowFetchError ?? null);
+            setAutomationsError(null);
+            return automationData;
+        }
+        catch (error) {
+            setAutomationsError(error instanceof Error
+                ? error.message
+                : t("automations.loadFailed", {
+                    defaultValue: "Failed to load automations.",
+                }));
+            return null;
+        }
+        finally {
+            setAutomationsLoaded(true);
+            setAutomationsLoading(false);
+        }
+    }, [t]);
+    const createWorkbenchTask = useCallback(async (data) => {
+        setTaskSaving(true);
+        try {
+            const res = await client.createWorkbenchTask(data);
+            setTaskError(null);
+            await refreshAutomations();
+            return res.task;
+        }
+        catch (error) {
+            setTaskError(error instanceof Error
+                ? error.message
+                : t("automations.taskCreateFailed", {
+                    defaultValue: "Failed to create task.",
+                }));
+            return null;
+        }
+        finally {
+            setTaskSaving(false);
+        }
+    }, [refreshAutomations, t]);
+    const updateWorkbenchTask = useCallback(async (id, data) => {
+        setTaskSaving(true);
+        try {
+            const res = await client.updateWorkbenchTask(id, data);
+            setTaskError(null);
+            await refreshAutomations();
+            return res.task;
+        }
+        catch (error) {
+            setTaskError(error instanceof Error
+                ? error.message
+                : t("automations.taskUpdateFailed", {
+                    defaultValue: "Failed to update task.",
+                }));
+            return null;
+        }
+        finally {
+            setTaskSaving(false);
+        }
+    }, [refreshAutomations, t]);
+    const deleteWorkbenchTask = useCallback(async (id) => {
+        setTaskSaving(true);
+        try {
+            await client.deleteWorkbenchTask(id);
+            setTaskError(null);
+            await refreshAutomations();
+            return true;
+        }
+        catch (error) {
+            setTaskError(error instanceof Error
+                ? error.message
+                : t("automations.taskDeleteFailed", {
+                    defaultValue: "Failed to delete task.",
+                }));
+            return false;
+        }
+        finally {
+            setTaskSaving(false);
+        }
+    }, [refreshAutomations, t]);
+    const saveFormAsTemplate = useCallback(() => {
+        const name = form.displayName.trim();
+        if (!name)
+            return;
+        const template = {
+            id: `user_${Date.now()}_${Math.random().toString(36).slice(2, 6)}`,
+            name,
+            instructions: form.instructions.trim(),
+            interval: form.durationValue || "1",
+            unit: form.durationUnit,
+        };
+        setUserTemplates((previous) => {
+            const next = [...previous, template];
+            saveUserTemplates(next);
+            return next;
+        });
+    }, [form]);
+    const deleteUserTemplate = useCallback((id) => {
+        setUserTemplates((previous) => {
+            const next = previous.filter((template) => template.id !== id);
+            saveUserTemplates(next);
+            return next;
+        });
+    }, []);
+    useEffect(() => {
+        if (didBootstrapDataRef.current)
+            return;
+        didBootstrapDataRef.current = true;
+        void loadTriggerHealth();
+        void ensureTriggersLoaded();
+        void refreshAutomations();
+    }, [ensureTriggersLoaded, loadTriggerHealth, refreshAutomations]);
+    useEffect(() => {
+        const handler = (event) => {
+            const detail = event
+                .detail;
+            if (detail?.filter) {
+                setFilter(detail.filter);
+            }
+        };
+        window.addEventListener("milady:automations:setFilter", handler);
+        return () => window.removeEventListener("milady:automations:setFilter", handler);
+    }, []);
+    const allItems = automationItems;
+    const filteredItems = useMemo(() => {
+        switch (filter) {
+            case "coordinator":
+                return allItems.filter((item) => item.type === "coordinator_text");
+            case "workflows":
+                return allItems.filter((item) => item.type === "n8n_workflow");
+            case "scheduled":
+                return allItems.filter((item) => item.schedules.length > 0);
+            default:
+                return allItems;
+        }
+    }, [allItems, filter]);
+    useEffect(() => {
+        if (!selectedItemId)
+            return;
+        // Exempt in-flight workflow drafts — they're not in allItems until
+        // generateWorkflowFromPrompt finishes and refreshAutomations
+        // surfaces the real workflow. Without this exemption the draft
+        // selection gets cleared mid-generation, the auto-select effect
+        // below picks lastSelectedIdRef (typically a task like Heartbeat),
+        // and the user lands somewhere unexpected — defeating the
+        // WorkflowGenerationProgress UI we just added on the draft pane.
+        if (selectedItemId.startsWith("workflow-draft:"))
+            return;
+        if (!allItems.some((item) => item.id === selectedItemId)) {
+            setSelectedItemId(null);
+            setSelectedItemKind(null);
+        }
+    }, [allItems, selectedItemId]);
+    useEffect(() => {
+        if (selectedItemId) {
+            lastSelectedIdRef.current = selectedItemId;
+        }
+    }, [selectedItemId]);
+    useEffect(() => {
+        if (editorOpen ||
+            editingId ||
+            editingTaskId ||
+            selectedItemId ||
+            allItems.length === 0) {
+            return;
+        }
+        const preferred = lastSelectedIdRef.current;
+        if (!preferred)
+            return;
+        const item = allItems.find((candidate) => candidate.id === preferred);
+        if (!item)
+            return;
+        setSelectedItemId(preferred);
+        setSelectedItemKind(getSelectionKind(item));
+    }, [allItems, editingId, editingTaskId, editorOpen, selectedItemId]);
+    useEffect(() => {
+        if (!editorOpen)
+            return undefined;
+        const onKeyDown = (event) => {
+            if (event.key === "Escape") {
+                setEditorOpen(false);
+                setEditingId(null);
+                setEditingTaskId(null);
+                setForm(emptyForm);
+                setFormError(null);
+                setTaskFormName("");
+                setTaskFormDescription("");
+            }
+        };
+        window.addEventListener("keydown", onKeyDown);
+        return () => window.removeEventListener("keydown", onKeyDown);
+    }, [editorOpen]);
+    // When the LifeOps chat-sidebar Automations widget row is clicked, it
+    // writes `#automations.trigger=<id>` and `setTab("automations")`s over.
+    // Read the hash on mount and on any hashchange to focus that trigger.
+    useEffect(() => {
+        function applyHash() {
+            const hashTriggerId = readAutomationsTriggerFromHash();
+            if (!hashTriggerId)
+                return;
+            const nextId = `trigger:${hashTriggerId}`;
+            setSelectedItemId((prev) => (prev === nextId ? prev : nextId));
+            setSelectedItemKind("trigger");
+        }
+        applyHash();
+        window.addEventListener("hashchange", applyHash);
+        return () => window.removeEventListener("hashchange", applyHash);
+    }, []);
+    const resetEditor = () => {
+        setForm(emptyForm);
+        setEditingId(null);
+        setEditingTaskId(null);
+        setFormError(null);
+        setTaskFormName("");
+        setTaskFormDescription("");
+    };
+    const closeEditor = () => {
+        setEditorOpen(false);
+        resetEditor();
+    };
+    const openCreateTrigger = () => {
+        resetEditor();
+        setEditorMode("trigger");
+        setEditorOpen(true);
+    };
+    const openCreateTask = () => {
+        openCreateTrigger();
+    };
+    const openEditTrigger = (trigger) => {
+        setEditingId(trigger.id);
+        setForm(formFromTrigger(trigger));
+        setFormError(null);
+        setSelectedItemId(`trigger:${trigger.id}`);
+        setSelectedItemKind("trigger");
+        setEditorMode("trigger");
+        setEditorOpen(true);
+    };
+    const openEditTask = (task) => {
+        setEditingTaskId(task.id);
+        setTaskFormName(task.name);
+        setTaskFormDescription(task.description);
+        setSelectedItemId(`task:${task.id}`);
+        setSelectedItemKind("task");
+        setEditorMode("task");
+        setEditorOpen(true);
+    };
+    const setField = (key, value) => setForm((previous) => ({ ...previous, [key]: value }));
+    const onSubmitTrigger = async () => {
+        const error = validateForm(form, t);
+        if (error) {
+            setFormError(error);
+            return;
+        }
+        setFormError(null);
+        if (editingId) {
+            const updated = await updateTrigger(editingId, buildUpdateRequest(form));
+            if (updated) {
+                if (updated.kind === "workflow" && updated.workflowId) {
+                    setSelectedItemId(`workflow:${updated.workflowId}`);
+                    setSelectedItemKind("workflow");
+                }
+                else {
+                    setSelectedItemId(`trigger:${updated.id}`);
+                    setSelectedItemKind("trigger");
+                }
+                await refreshAutomations();
+                closeEditor();
+            }
+            return;
+        }
+        const created = await createTrigger(buildCreateRequest(form));
+        if (created) {
+            if (created.kind === "workflow" && created.workflowId) {
+                setSelectedItemId(`workflow:${created.workflowId}`);
+                setSelectedItemKind("workflow");
+            }
+            else {
+                setSelectedItemId(`trigger:${created.id}`);
+                setSelectedItemKind("trigger");
+            }
+            void loadTriggerRuns(created.id);
+            await refreshAutomations();
+            closeEditor();
+        }
+    };
+    const onSubmitTask = async () => {
+        const name = taskFormName.trim();
+        if (!name) {
+            setFormError(t("automations.nameRequired", {
+                defaultValue: "Name is required.",
+            }));
+            return;
+        }
+        setFormError(null);
+        if (editingTaskId) {
+            const updated = await updateWorkbenchTask(editingTaskId, {
+                name,
+                description: taskFormDescription.trim(),
+            });
+            if (updated) {
+                setSelectedItemId(`task:${updated.id}`);
+                setSelectedItemKind("task");
+                closeEditor();
+            }
+            return;
+        }
+        const created = await createWorkbenchTask({
+            name,
+            description: taskFormDescription.trim(),
+        });
+        if (created) {
+            setSelectedItemId(`task:${created.id}`);
+            setSelectedItemKind("task");
+            closeEditor();
+        }
+    };
+    const onDeleteTrigger = async () => {
+        if (!editingId)
+            return;
+        const confirmed = await confirmDesktopAction({
+            title: t("heartbeatsview.deleteTitle"),
+            message: t("heartbeatsview.deleteMessage", { name: form.displayName }),
+            confirmLabel: t("common.delete"),
+            cancelLabel: t("common.cancel"),
+            type: "warning",
+        });
+        if (!confirmed)
+            return;
+        const deleted = await deleteTrigger(editingId);
+        if (!deleted)
+            return;
+        if (selectedItemId === `trigger:${editingId}`) {
+            setSelectedItemId(null);
+            setSelectedItemKind(null);
+        }
+        await refreshAutomations();
+        closeEditor();
+    };
+    const onDeleteTask = async (taskId) => {
+        const confirmed = await confirmDesktopAction({
+            title: t("automations.taskDeleteTitle", {
+                defaultValue: "Delete task",
+            }),
+            message: t("automations.taskDeleteMessage", {
+                defaultValue: "Are you sure you want to delete this task?",
+            }),
+            confirmLabel: t("common.delete"),
+            cancelLabel: t("common.cancel"),
+            type: "warning",
+        });
+        if (!confirmed)
+            return;
+        const deleted = await deleteWorkbenchTask(taskId);
+        if (!deleted)
+            return;
+        if (selectedItemId === `task:${taskId}`) {
+            setSelectedItemId(null);
+            setSelectedItemKind(null);
+        }
+        if (editingTaskId === taskId) {
+            closeEditor();
+        }
+    };
+    const onRunSelectedTrigger = async (triggerId) => {
+        setSelectedItemId(`trigger:${triggerId}`);
+        setSelectedItemKind("trigger");
+        await runTriggerNow(triggerId);
+        await loadTriggerRuns(triggerId);
+        await refreshAutomations();
+    };
+    const onToggleTriggerEnabled = async (triggerId, currentlyEnabled) => {
+        const updated = await updateTrigger(triggerId, {
+            enabled: !currentlyEnabled,
+        });
+        if (updated && editingId === updated.id) {
+            setForm(formFromTrigger(updated));
+        }
+        await refreshAutomations();
+    };
+    const onToggleTaskCompleted = async (taskId, currentlyCompleted) => {
+        await updateWorkbenchTask(taskId, {
+            isCompleted: !currentlyCompleted,
+        });
+    };
+    const resolvedSelectedItem = useMemo(() => {
+        if (editorOpen || editingId || editingTaskId)
+            return null;
+        if (selectedItemId) {
+            const found = allItems.find((item) => item.id === selectedItemId);
+            if (found)
+                return found;
+            // In-flight workflow draft (createWorkflowDraft set selectedItemId
+            // BEFORE refreshAutomations surfaced the real workflow). Synthesize
+            // a minimal draft item so AutomationDraftPane renders with the
+            // WorkflowGenerationProgress card during the LLM call.
+            //
+            // The `room` field is left null here. `activeWorkflowConversation`
+            // — the live conversation tied to this draft — lives in
+            // AutomationsLayout (a different scope from this controller hook),
+            // so we cannot read it from here without a larger refactor.
+            // Instead, handleDeleteDraft reads activeWorkflowConversation
+            // directly and falls back to it when item.room is missing on a
+            // synthesized draft (see the handler below).
+            if (selectedItemId.startsWith("workflow-draft:")) {
+                const draftId = selectedItemId.slice("workflow-draft:".length);
+                const synthesized = {
+                    id: selectedItemId,
+                    type: "automation_draft",
+                    source: "workflow_draft",
+                    title: "New workflow",
+                    description: "",
+                    status: "draft",
+                    enabled: false,
+                    system: false,
+                    isDraft: true,
+                    hasBackingWorkflow: false,
+                    updatedAt: null,
+                    draftId,
+                    schedules: [],
+                    room: null,
+                };
+                return synthesized;
+            }
+            return null;
+        }
+        return allItems[0] ?? null;
+    }, [allItems, editingId, editingTaskId, editorOpen, selectedItemId]);
+    const modalTitle = editorMode === "trigger"
+        ? form.kind === "workflow"
+            ? editingId
+                ? `Edit ${form.displayName.trim() || "schedule"}`
+                : "New schedule"
+            : editingId
+                ? t("heartbeatsview.editTitle", {
+                    name: form.displayName.trim() ||
+                        t("automations.taskLabel", {
+                            defaultValue: "Task",
+                        }),
+                    defaultValue: "Edit {{name}}",
+                })
+                : t("automations.newTask", {
+                    defaultValue: "New task",
+                })
+        : editingTaskId
+            ? t("automations.editTask", {
+                defaultValue: "Edit task",
+            })
+            : t("automations.newTextTask", {
+                defaultValue: "New text task",
+            });
+    const editorEnabled = editingId != null
+        ? (triggers.find((trigger) => trigger.id === editingId)?.enabled ??
+            form.enabled)
+        : form.enabled;
+    const hasItems = allItems.length > 0;
+    const isLoading = triggersLoading || automationsLoading;
+    const combinedError = automationsError || triggerError || taskError;
+    const showFirstRunEmptyState = !isLoading && !combinedError && !hasItems;
+    const showDetailPane = Boolean(editorOpen || editingId || editingTaskId || resolvedSelectedItem);
+    return {
+        filter,
+        setFilter,
+        allItems,
+        filteredItems,
+        selectedItemId,
+        selectedItemKind,
+        setSelectedItemId,
+        setSelectedItemKind,
+        resolvedSelectedItem,
+        form,
+        setForm,
+        setField,
+        editingId,
+        setEditingId,
+        editorOpen,
+        setEditorOpen,
+        editorMode,
+        setEditorMode,
+        formError,
+        setFormError,
+        editorEnabled,
+        modalTitle,
+        templateNotice,
+        setTemplateNotice,
+        userTemplates,
+        taskFormName,
+        setTaskFormName,
+        taskFormDescription,
+        setTaskFormDescription,
+        editingTaskId,
+        setEditingTaskId,
+        taskSaving,
+        closeEditor,
+        openCreateTrigger,
+        openCreateTask,
+        openEditTrigger,
+        openEditTask,
+        onSubmitTrigger,
+        onSubmitTask,
+        onDeleteTrigger,
+        onDeleteTask,
+        onRunSelectedTrigger,
+        onToggleTriggerEnabled,
+        onToggleTaskCompleted,
+        saveFormAsTemplate,
+        deleteUserTemplate,
+        loadTriggerRuns,
+        refreshAutomations,
+        automationNodes,
+        automationsLoading,
+        automationsLoaded,
+        automationsError,
+        n8nStatus,
+        workflowFetchError,
+        triggers,
+        triggerRunsById,
+        triggersSaving,
+        triggersLoading,
+        triggerError,
+        taskError,
+        hasItems,
+        isLoading,
+        combinedError,
+        showFirstRunEmptyState,
+        showDetailPane,
+        t,
+        uiLanguage,
+    };
+}
+const AutomationsViewContext = createContext(null);
+function useAutomationsViewContext() {
+    const context = useContext(AutomationsViewContext);
+    if (!context) {
+        throw new Error("Automations view context is unavailable.");
+    }
+    return context;
+}
+function AutomationCollapsibleSection({ sectionKey, label, icon, count, collapsed, onToggleCollapsed, onAdd, addLabel, emptyLabel, children, }) {
+    const Chevron = collapsed ? ChevronRight : ChevronDown;
+    return (_jsxs("section", { "data-testid": `automation-section-${sectionKey}`, className: "group/section space-y-0", children: [_jsxs("div", { className: "flex items-center gap-1", children: [_jsxs("button", { type: "button", onClick: () => onToggleCollapsed(sectionKey), "aria-expanded": !collapsed, className: "inline-flex min-w-0 flex-1 items-center gap-1.5 rounded-[var(--radius-sm)] bg-transparent px-1.5 py-1 text-left text-2xs font-semibold uppercase tracking-[0.16em] text-muted transition-colors hover:text-txt", children: [_jsx("span", { className: "inline-flex shrink-0 items-center justify-center text-muted", children: icon }), _jsx("span", { className: "truncate", children: label }), _jsx(Chevron, { "aria-hidden": true, className: "ml-auto h-3 w-3 shrink-0 text-muted" })] }), onAdd ? (_jsx("button", { type: "button", onClick: onAdd, "aria-label": addLabel ?? "Add", title: addLabel, className: "inline-flex h-5 w-5 shrink-0 items-center justify-center rounded-[var(--radius-sm)] bg-transparent text-muted transition-colors hover:text-txt", children: _jsx(Plus, { className: "h-3.5 w-3.5", "aria-hidden": true }) })) : null] }), collapsed ? null : count === 0 ? (_jsx("div", { className: "py-1 pl-8 pr-1 text-2xs text-muted/70", children: emptyLabel })) : (_jsx("div", { className: "space-y-0 pl-3 pr-0.5", children: children }))] }));
+}
+function getWorkflowTemplates(t) {
+    return [
+        {
+            id: "daily-email-digest",
+            icon: Mail,
+            title: t("automations.templates.emailDigest.title", {
+                defaultValue: "Daily Email Digest",
+            }),
+            description: t("automations.templates.emailDigest.desc", {
+                defaultValue: "Summarize your inbox each morning and post to Slack.",
+            }),
+            seedPrompt: t("automations.templates.emailDigest.prompt", {
+                defaultValue: "Every weekday at 9am, read my Gmail inbox from the last 24 hours, summarize the important messages, and post the summary to my #daily channel in Slack.",
+            }),
+        },
+        {
+            id: "slack-discord-bridge",
+            icon: Share2,
+            title: "Slack \u2194 Discord Bridge",
+            description: "Cross-post messages between Slack and Discord channels.",
+            seedPrompt: "Whenever a message is posted in the #announcements channel in Slack, forward it to the #general channel in Discord.",
+        },
+        {
+            id: "rss-to-summary",
+            icon: Rss,
+            title: "RSS to Summary",
+            description: "Poll an RSS feed and summarize new articles via email.",
+            seedPrompt: "Check my RSS feed https://example.com/feed.xml every hour. For each new article, generate a 3-sentence summary and email it to me.",
+        },
+        {
+            id: "calendar-to-slack",
+            icon: Calendar,
+            title: "Calendar to Slack",
+            description: "Post your day's agenda to Slack each morning.",
+            seedPrompt: "Every weekday at 8am, read today's events from my Google Calendar and post a formatted agenda to my #daily-standup channel in Slack.",
+        },
+        {
+            id: "github-issue-triage",
+            icon: GitBranch,
+            title: "GitHub Issue Triage",
+            description: "Auto-classify and label new GitHub issues.",
+            seedPrompt: "When a new issue is opened on my GitHub repo, classify it (bug/feature/question/docs), add the matching label, and post a welcoming comment.",
+        },
+        {
+            id: "email-to-notion",
+            icon: FileText,
+            title: "Email \u2192 Notion",
+            description: "Turn tagged emails into Notion pages.",
+            seedPrompt: "When I receive a Gmail message labeled 'Task', extract the key details and create a new page in my Notion 'Inbox' database with the subject as the title and body as content.",
+        },
+    ];
+}
+function WorkflowTemplatesModal({ open, onOpenChange, onSelectTemplate, onSelectCustom, }) {
+    const { t } = useAutomationsViewContext();
+    const templates = getWorkflowTemplates(t);
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "w-[min(calc(100vw-1.5rem),56rem)] max-w-none", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: t("automations.templatesModalTitle", {
+                                defaultValue: "Start with a template",
+                            }) }), _jsx(DialogDescription, { children: t("automations.templatesModalSubtitle", {
+                                defaultValue: "Pick a workflow to customize, or start blank.",
+                            }) })] }), _jsxs("div", { className: "grid gap-3 sm:grid-cols-2 overflow-y-auto max-h-[min(32rem,calc(100dvh-12rem))] pr-1", children: [templates.map((template) => {
+                            const Icon = template.icon;
+                            return (_jsxs("div", { className: "flex flex-col gap-3 rounded-xl border border-border/40 bg-bg/30 p-4 hover:border-accent/30 hover:bg-accent/5 transition-colors", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsx("div", { className: "mt-0.5 rounded-lg bg-accent/10 p-2 text-accent shrink-0", children: _jsx(Icon, { className: "h-4 w-4" }) }), _jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [_jsx("div", { className: "text-sm font-semibold text-txt", children: template.title }), _jsx("p", { className: "text-sm text-muted leading-snug", children: template.description })] })] }), _jsx(Button, { variant: "outline", size: "sm", className: "self-end h-7 px-3 text-xs", onClick: () => onSelectTemplate(template.seedPrompt), children: t("automations.templateUseButton", {
+                                            defaultValue: "Use template",
+                                        }) })] }, template.id));
+                        }), _jsxs("div", { className: "flex flex-col gap-3 rounded-xl border border-dashed border-border/40 bg-transparent p-4 hover:border-accent/30 hover:bg-accent/5 transition-colors", children: [_jsxs("div", { className: "flex items-start gap-3", children: [_jsx("div", { className: "mt-0.5 rounded-lg bg-muted/10 p-2 text-muted shrink-0", children: _jsx(Plus, { className: "h-4 w-4" }) }), _jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [_jsx("div", { className: "text-sm font-semibold text-txt", children: t("automations.templateCustom.title", {
+                                                        defaultValue: "Custom",
+                                                    }) }), _jsx("p", { className: "text-sm text-muted leading-snug", children: t("automations.templateCustom.desc", {
+                                                        defaultValue: "Describe your own workflow in chat.",
+                                                    }) })] })] }), _jsx(Button, { variant: "outline", size: "sm", className: "self-end h-7 px-3 text-xs", onClick: onSelectCustom, children: t("automations.templateUseButton", {
+                                        defaultValue: "Use template",
+                                    }) })] })] })] }) }));
+}
+function CreateAutomationDialog({ open, onOpenChange, onCreateTask, onCreateWorkflow, onDescribeAutomation, }) {
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "w-[min(calc(100vw-1.5rem),34rem)] max-w-none", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Create automation" }) }), _jsx(AutomationCommandBar, { autoFocus: true, onSubmit: async (prompt) => {
+                        await onDescribeAutomation(prompt);
+                        onOpenChange(false);
+                    } }), _jsxs("div", { className: "grid gap-3 sm:grid-cols-2", children: [_jsx("button", { type: "button", onClick: onCreateTask, className: "rounded-xl border border-border/30 bg-bg/30 p-4 text-left transition-colors hover:border-accent/40 hover:bg-accent/5", children: _jsx("div", { className: "text-sm font-semibold text-txt", children: "Task" }) }), _jsx("button", { type: "button", onClick: onCreateWorkflow, className: "rounded-xl border border-border/30 bg-bg/30 p-4 text-left transition-colors hover:border-accent/40 hover:bg-accent/5", children: _jsx("div", { className: "text-sm font-semibold text-txt", children: "Workflow" }) })] })] }) }));
+}
+// ---------------------------------------------------------------------------
+// Zero-state onboarding CTA (Item 9)
+// ---------------------------------------------------------------------------
+function AutomationsZeroState({ onBrowseTemplates, onNewTrigger, onNewTask, }) {
+    const { t } = useAutomationsViewContext();
+    return (_jsx("div", { className: "flex min-h-0 flex-1 items-center justify-center px-8 py-12", children: _jsxs(PagePanel, { variant: "padded", className: "w-full max-w-lg text-center space-y-5", children: [_jsx("div", { className: "flex justify-center", children: _jsx("div", { className: "rounded-2xl bg-accent/10 p-4 text-accent", children: _jsx(Zap, { className: "h-8 w-8" }) }) }), _jsxs("div", { className: "space-y-2", children: [_jsx("h3", { className: "text-xl font-semibold text-txt", children: t("automations.zeroState.title", {
+                                defaultValue: "What would you like your agent to do?",
+                            }) }), _jsx("p", { className: "text-sm text-muted leading-relaxed", children: t("automations.zeroState.subtitle", {
+                                defaultValue: "I can build workflows for you, run prompts on a schedule, or keep a checklist of tasks.",
+                            }) })] }), _jsxs("div", { className: "flex flex-wrap justify-center gap-2 pt-1", children: [_jsx(Button, { variant: "default", size: "sm", className: "h-8 gap-1.5 px-4 text-sm", onClick: onBrowseTemplates, children: t("automations.zeroState.browseTemplates", {
+                                defaultValue: "Browse templates \u2192",
+                            }) }), _jsxs(Button, { variant: "outline", size: "sm", className: "h-8 gap-1.5 px-3 text-sm", onClick: onNewTrigger, children: [_jsx(Clock3, { className: "h-3.5 w-3.5" }), t("automations.newTriggerButton", {
+                                    defaultValue: "+ New trigger",
+                                })] }), _jsxs(Button, { variant: "outline", size: "sm", className: "h-8 gap-1.5 px-3 text-sm", onClick: onNewTask, children: [_jsx(SquareTerminal, { className: "h-3.5 w-3.5" }), t("automations.newTaskButton", { defaultValue: "+ New task" })] })] })] }) }));
+}
+function TaskForm() {
+    const { taskFormName, setTaskFormName, taskFormDescription, setTaskFormDescription, editingTaskId, formError, taskSaving, onSubmitTask, onDeleteTask, closeEditor, modalTitle, t, } = useAutomationsViewContext();
+    return (_jsxs(PagePanel, { variant: "padded", className: "space-y-5", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h3", { className: "text-lg font-semibold text-txt", children: modalTitle }), _jsx(Button, { variant: "ghost", size: "sm", onClick: closeEditor, children: t("common.cancel") })] }), formError && (_jsx("div", { className: "rounded-lg border border-danger/20 bg-danger/10 p-3 text-sm text-danger", children: formError })), _jsxs("div", { className: "space-y-3", children: [_jsxs("div", { children: [_jsx(FieldLabel, { children: "Task name" }), _jsx(Input, { value: taskFormName, onChange: (event) => setTaskFormName(event.target.value), placeholder: "Task name...", autoFocus: true })] }), _jsxs("div", { children: [_jsx(FieldLabel, { children: "Prompt" }), _jsx(Textarea, { value: taskFormDescription, onChange: (event) => setTaskFormDescription(event.target.value), placeholder: "What should this task do?", rows: 4 })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Button, { variant: "default", size: "sm", disabled: taskSaving || !taskFormName.trim(), onClick: () => void onSubmitTask(), children: editingTaskId
+                            ? t("automations.saveTask", {
+                                defaultValue: "Save task",
+                            })
+                            : t("automations.createTask", {
+                                defaultValue: "Create task",
+                            }) }), editingTaskId && (_jsx(Button, { variant: "outline", size: "sm", className: "border-danger/30 text-danger hover:bg-danger/10", onClick: () => void onDeleteTask(editingTaskId), children: t("common.delete") }))] })] }));
+}
+function WorkflowRuntimeNotice({ status, workflowFetchError, busy, onRefresh, onStartLocal, }) {
+    // Auto-start kicks the local sidecar at runtime boot. While it is
+    // starting (or briefly stopped before the first tick), suppress the
+    // alarm UI — the fetch error is expected and resolves itself.
+    const isAutoStarting = status?.mode === "local" &&
+        (status.status === "starting" || status.status === "stopped");
+    if (!status && !workflowFetchError) {
+        return null;
+    }
+    if (status?.mode === "disabled") {
+        return (_jsxs("div", { className: "mb-2 flex items-center justify-between gap-3 rounded-[var(--radius-sm)] border border-border/25 bg-bg/30 px-3 py-1.5 text-xs-tight", children: [_jsx("span", { className: "text-muted", children: "Workflow deploy requires n8n. Text tasks still work without it." }), status.platform !== "mobile" && (_jsx("button", { type: "button", disabled: busy, onClick: onStartLocal, className: "text-2xs font-semibold uppercase tracking-[0.12em] text-accent hover:text-accent/80 disabled:opacity-50", children: "Enable" }))] }));
+    }
+    if (isAutoStarting) {
+        return (_jsxs("div", { className: "mb-2 flex items-center gap-2 px-3 py-1 text-2xs text-muted/70", children: [_jsx("span", { className: "inline-block h-1.5 w-1.5 animate-pulse rounded-full bg-warning" }), _jsx("span", { children: "Starting local n8n\u2026" })] }));
+    }
+    if (workflowFetchError) {
+        return (_jsxs("div", { className: "mb-2 flex items-center justify-between gap-3 rounded-[var(--radius-sm)] border border-danger/25 bg-danger/5 px-3 py-1.5 text-xs-tight", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("span", { className: "inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-danger" }), _jsx("span", { className: "truncate text-danger/90", children: workflowFetchError })] }), _jsxs("div", { className: "flex items-center gap-3", children: [status?.mode === "local" && status.status !== "ready" && (_jsx("button", { type: "button", disabled: busy, onClick: onStartLocal, className: "text-2xs font-semibold uppercase tracking-[0.12em] text-danger hover:text-danger/80 disabled:opacity-50", children: "Restart" })), _jsx("button", { type: "button", disabled: busy, onClick: onRefresh, className: "text-2xs font-semibold uppercase tracking-[0.12em] text-muted hover:text-txt disabled:opacity-50", children: "Refresh" })] })] }));
+    }
+    if (status?.mode === "local" && status.status === "error") {
+        return (_jsxs("div", { className: "mb-2 flex items-center justify-between gap-3 rounded-[var(--radius-sm)] border border-danger/25 bg-danger/5 px-3 py-1.5 text-xs-tight", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("span", { className: "inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-danger" }), _jsx("span", { className: "text-danger/90", children: "Local n8n failed to start." })] }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("button", { type: "button", disabled: busy, onClick: onStartLocal, className: "text-2xs font-semibold uppercase tracking-[0.12em] text-danger hover:text-danger/80 disabled:opacity-50", children: "Retry" }), _jsx("button", { type: "button", disabled: busy, onClick: onRefresh, className: "text-2xs font-semibold uppercase tracking-[0.12em] text-muted hover:text-txt disabled:opacity-50", children: "Refresh" })] })] }));
+    }
+    if (status?.mode === "cloud" && status.cloudHealth === "degraded") {
+        return (_jsxs("div", { className: "mb-2 flex items-center justify-between gap-3 rounded-[var(--radius-sm)] border border-warning/25 bg-warning/5 px-3 py-1.5 text-xs-tight", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("span", { className: "inline-block h-1.5 w-1.5 shrink-0 rounded-full bg-warning" }), _jsx("span", { className: "text-warning", children: "Eliza Cloud workflow gateway is degraded." })] }), _jsx("button", { type: "button", disabled: busy, onClick: onRefresh, className: "text-2xs font-semibold uppercase tracking-[0.12em] text-muted hover:text-txt disabled:opacity-50", children: "Refresh" })] }));
+    }
+    return null;
+}
+function AutomationNodePalette({ nodes, title, }) {
+    const groupedNodes = useMemo(() => NODE_CLASS_ORDER.map((className) => ({
+        className,
+        nodes: nodes.filter((node) => node.class === className),
+    })).filter((group) => group.nodes.length > 0), [nodes]);
+    const enabledCount = nodes.filter((n) => n.availability === "enabled").length;
+    const disabledCount = nodes.filter((n) => n.availability === "disabled").length;
+    return (_jsxs("section", { className: "rounded-[var(--radius-sm)] border border-border/25 bg-bg/20", children: [_jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-border/20 px-3 py-1.5", children: [_jsxs("div", { className: "flex items-center gap-2 text-2xs font-semibold uppercase tracking-[0.14em] text-muted", children: [_jsx("span", { children: title }), _jsx("span", { className: "text-muted/50", children: nodes.length })] }), _jsxs("div", { className: "flex items-center gap-1.5 text-[10px] tabular-nums", children: [_jsx("span", { className: "text-ok", children: enabledCount }), _jsx("span", { className: "text-muted/40", children: "\u00B7" }), _jsx("span", { className: "text-warning", children: disabledCount })] })] }), _jsx("div", { className: "space-y-2 px-2 py-2", children: groupedNodes.map((group) => (_jsxs("div", { children: [_jsx("div", { className: "px-1 pb-1 text-[10px] font-semibold uppercase tracking-[0.12em] text-muted/60", children: getNodeClassLabel(group.className) }), _jsx("div", { className: "grid gap-1 sm:grid-cols-2 xl:grid-cols-3", children: group.nodes.map((node) => (_jsxs("div", { title: node.disabledReason || node.description || node.label, className: `flex items-center gap-2 rounded-[var(--radius-sm)] border px-2 py-1 text-xs-tight ${node.availability === "enabled"
+                                    ? "border-border/20 bg-bg/30"
+                                    : "border-warning/20 bg-warning/5"}`, children: [_jsx("span", { className: node.availability === "enabled"
+                                            ? "text-accent/80"
+                                            : "text-warning", children: getNodeIcon(node) }), _jsx("span", { className: "truncate text-txt", children: node.label }), node.ownerScoped && (_jsx("span", { className: "ml-auto text-[9px] uppercase tracking-wider text-muted/60", children: "owner" }))] }, node.id))) })] }, group.className))) })] }));
+}
+function AutomationNodeCatalogPane({ nodes, }) {
+    return _jsx(AutomationNodePalette, { nodes: nodes, title: "Nodes" });
+}
+function TaskAutomationDetailPane({ automation, onPromoteToWorkflow, }) {
+    const { openEditTask, onDeleteTask, onToggleTaskCompleted, setEditorOpen, setEditorMode, setTaskFormDescription, setTaskFormName, setEditingTaskId, setSelectedItemId, setSelectedItemKind, t, uiLanguage, } = useAutomationsViewContext();
+    const task = automation.task;
+    if (!task) {
+        return null;
+    }
+    const statusLabel = automation.system
+        ? "System"
+        : task.isCompleted
+            ? "Completed"
+            : "Open";
+    const statusTone = automation.system ? "muted" : task.isCompleted ? "muted" : "success";
+    const nextScheduledRun = automation.schedules
+        .filter(isTimeBasedTrigger)
+        .map((schedule) => schedule.nextRunAtMs ?? 0)
+        .filter((value) => value > 0)
+        .sort((left, right) => left - right)[0];
+    const taskTypeLabel = automation.system ? "Agent owned" : "Task";
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx(DetailHeader, { icon: automation.system ? (_jsx(Settings, { className: "h-3.5 w-3.5", "aria-hidden": true })) : (_jsx(FileText, { className: "h-3.5 w-3.5", "aria-hidden": true })), title: getAutomationDisplayTitle(automation), description: automation.description ||
+                    (automation.system ? "Internal manual task." : "Simple text task."), status: _jsx(DetailStatusIndicator, { label: statusLabel, tone: statusTone, dotOnly: !automation.system && !task.isCompleted }), actions: !automation.system ? (_jsxs(_Fragment, { children: [_jsx(IconAction, { label: task.isCompleted ? "Reopen" : "Complete", onClick: () => void onToggleTaskCompleted(task.id, task.isCompleted), icon: task.isCompleted ? (_jsx(Circle, { className: "h-3.5 w-3.5" })) : (_jsx(CheckCircle2, { className: "h-3.5 w-3.5" })), tone: task.isCompleted ? "ok" : undefined }), _jsx(IconAction, { label: "Duplicate", onClick: () => {
+                                setTaskFormName(`${task.name} copy`);
+                                setTaskFormDescription(task.description);
+                                setEditingTaskId(null);
+                                setEditorMode("task");
+                                setSelectedItemId(null);
+                                setSelectedItemKind(null);
+                                setEditorOpen(true);
+                            }, icon: _jsx(Copy, { className: "h-3.5 w-3.5" }) }), _jsx(IconAction, { label: "Compile to Workflow", onClick: () => void onPromoteToWorkflow(automation), icon: _jsx(GitBranch, { className: "h-3.5 w-3.5" }) }), _jsx(IconAction, { label: t("common.edit"), onClick: () => openEditTask(task), icon: _jsx(EditIcon, { className: "h-3.5 w-3.5" }) }), _jsx(IconAction, { label: t("common.delete"), onClick: () => void onDeleteTask(task.id), icon: _jsx(Trash2, { className: "h-3.5 w-3.5" }), tone: "danger" })] })) : null }), _jsxs("div", { className: "grid gap-2 sm:grid-cols-2 xl:grid-cols-4", children: [_jsx(OverviewMetricCard, { label: "Task type", value: taskTypeLabel, detail: automation.schedules.length > 0
+                            ? formatScheduleCount(automation.schedules.length)
+                            : "Run it manually" }), _jsx(OverviewMetricCard, { label: "Status", value: statusLabel, detail: task.isCompleted ? "Already completed" : "Still open", tone: task.isCompleted ? "default" : "ok" }), _jsx(OverviewMetricCard, { label: "Starts", value: nextScheduledRun
+                            ? formatRelativeFuture(nextScheduledRun, t)
+                            : "Manual", detail: nextScheduledRun
+                            ? formatDateTime(nextScheduledRun, {
+                                fallback: "—",
+                                locale: uiLanguage,
+                            })
+                            : "Run it yourself or attach a schedule", tone: nextScheduledRun ? "ok" : "default" }), _jsx(OverviewMetricCard, { label: "Updated", value: formatRelativePast(automation.updatedAt, t), detail: formatDateTime(automation.updatedAt, { fallback: "—" }) })] }), _jsxs("div", { className: "grid gap-4 xl:grid-cols-[minmax(0,1.12fr)_minmax(320px,0.88fr)]", children: [_jsxs("div", { className: "space-y-4", children: [_jsx(DetailSection, { title: "Prompt", children: _jsx("div", { className: "min-h-[10rem] px-4 py-4 text-sm leading-relaxed text-muted/85 whitespace-pre-wrap", children: task.description || "Describe what this task should do." }) }), _jsx(DetailSection, { title: automation.schedules.length > 0 ? "Starts when" : "How it starts", children: automation.schedules.length > 0 ? (_jsx("div", { className: "divide-y divide-border/20", children: automation.schedules.map((schedule) => (_jsx(OverviewListItem, { title: schedule.displayName, meta: scheduleLabel(schedule, t, uiLanguage), detail: formatDateTime(schedule.nextRunAtMs ?? null, {
+                                            fallback: "No next run queued",
+                                            locale: uiLanguage,
+                                        }), trailing: schedule.enabled ? "Live" : "Paused", tone: schedule.enabled ? "success" : "muted" }, schedule.id))) })) : (_jsx("div", { className: "px-4 py-4 text-xs-tight text-muted/70", children: "This task is manual right now. Add a schedule if you want it to start on its own." })) })] }), _jsx("div", { className: "space-y-4", children: _jsx(DetailSection, { title: "Details", children: _jsx(DetailFactList, { items: [
+                                    {
+                                        label: "State",
+                                        value: task.isCompleted ? "Completed" : "Open",
+                                    },
+                                    {
+                                        label: "Source",
+                                        value: automation.system
+                                            ? "Internal checklist item"
+                                            : "Simple prompt task",
+                                    },
+                                    {
+                                        label: "Next run",
+                                        value: nextScheduledRun
+                                            ? formatDateTime(nextScheduledRun, {
+                                                fallback: "—",
+                                                locale: uiLanguage,
+                                            })
+                                            : "Manual",
+                                    },
+                                    {
+                                        label: "Tags",
+                                        value: task.tags.length > 0 ? (_jsx("div", { className: "flex flex-wrap justify-end gap-1", children: task.tags.map((tag) => (_jsx("span", { className: "rounded bg-bg/50 px-1.5 py-0.5 text-[10px] text-muted", children: tag }, tag))) })) : ("None"),
+                                    },
+                                ] }) }) })] })] }));
+}
+const AUTOMATION_DRAFT_EXAMPLES = [
+    {
+        icon: Mail,
+        kind: "task",
+        label: "Daily inbox digest",
+        blurb: "A simple recurring prompt that keeps your morning brief tight.",
+        prompt: "Every weekday at 9am, summarize my Gmail inbox from the last 24 hours and post the summary to my #daily channel in Slack.",
+    },
+    {
+        icon: Clock3,
+        kind: "task",
+        label: "Hourly health check",
+        blurb: "A lightweight prompt that watches for anything stuck or failing.",
+        prompt: "Every hour, review recent activity, check that nothing is stuck or errored, and notify me if anything needs attention.",
+    },
+    {
+        icon: GitBranch,
+        kind: "workflow",
+        label: "GitHub issue triage",
+        blurb: "An event-driven pipeline that labels, routes, and replies.",
+        prompt: "When a new issue is opened on my GitHub repo, classify it (bug / feature / question / docs), add the matching label, and post a welcoming comment.",
+    },
+    {
+        icon: Share2,
+        kind: "workflow",
+        label: "Lead handoff",
+        blurb: "A cross-app flow that enriches, routes, and notifies.",
+        prompt: "When a new website lead arrives, enrich it, create the contact in my CRM, and post a summary to Slack for the team.",
+    },
+];
+function OverviewIdeaGrid({ ideas, onSelect, }) {
+    return (_jsx("div", { className: "grid gap-1.5", children: ideas.map((idea) => {
+            const Icon = idea.icon;
+            return (_jsxs("button", { type: "button", onClick: () => onSelect(idea), className: "group flex items-start gap-2 rounded-[var(--radius-sm)] border border-border/25 bg-bg/30 px-3 py-2 text-left transition-colors hover:border-accent/40 hover:bg-accent/5", children: [_jsx(Icon, { className: "mt-0.5 h-3.5 w-3.5 shrink-0 text-accent/80", "aria-hidden": true }), _jsxs("div", { className: "min-w-0 flex-1 space-y-0.5", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("div", { className: "truncate text-xs-tight font-semibold text-txt", children: idea.label }), _jsx("span", { className: "rounded bg-bg/50 px-1.5 py-0.5 text-[10px] uppercase tracking-[0.12em] text-muted/70", children: idea.kind })] }), _jsx("div", { className: "text-[11px] leading-snug text-muted/70", children: idea.blurb })] })] }, idea.label));
+        }) }));
+}
+function AutomationCommandBar({ onSubmit, autoFocus = false, }) {
+    const [prompt, setPrompt] = useState("");
+    const [submitting, setSubmitting] = useState(false);
+    const submit = useCallback(async () => {
+        const trimmed = prompt.trim();
+        if (!trimmed || submitting)
+            return;
+        setSubmitting(true);
+        try {
+            await onSubmit(trimmed);
+            setPrompt("");
+        }
+        finally {
+            setSubmitting(false);
+        }
+    }, [onSubmit, prompt, submitting]);
+    return (_jsx("div", { className: "rounded-2xl border border-border/30 bg-bg/55 p-1.5 shadow-sm", children: _jsxs("div", { className: "flex flex-col gap-2 sm:flex-row sm:items-center", children: [_jsx(Input, { value: prompt, onChange: (event) => setPrompt(event.target.value), onKeyDown: (event) => {
+                        if (event.key === "Enter" && !event.shiftKey) {
+                            event.preventDefault();
+                            void submit();
+                        }
+                    }, placeholder: AUTOMATION_PROMPT_PLACEHOLDER, "aria-label": DESCRIBE_AUTOMATION_PROMPT, className: "min-h-11 flex-1 border-0 bg-transparent px-4 text-sm shadow-none focus-visible:ring-0", autoFocus: autoFocus }), _jsx(Button, { variant: "default", size: "sm", className: "h-10 shrink-0 rounded-xl px-4 text-sm", disabled: submitting || prompt.trim().length === 0, onClick: () => void submit(), children: submitting ? "Creating..." : "Create" })] }) }));
+}
+function AutomationStatusStrip({ entries, }) {
+    return (_jsx("div", { className: "flex flex-wrap gap-2", children: entries.map((entry) => (_jsxs("div", { className: "inline-flex items-center gap-2 rounded-full border border-border/25 bg-bg/40 px-2.5 py-1 text-xs", children: [_jsx(StatusDot, { tone: entry.tone }), _jsx("span", { className: "font-medium text-txt", children: entry.label }), _jsx("span", { className: "tabular-nums text-muted", children: entry.value })] }, entry.label))) }));
+}
+function formatRelativeFuture(targetMs, t) {
+    const delta = targetMs - Date.now();
+    if (delta <= 0)
+        return "now";
+    return `in ${formatDurationMs(delta, { t })}`;
+}
+function formatRelativePast(iso, t) {
+    if (!iso)
+        return "—";
+    const ts = typeof iso === "string" ? Date.parse(iso) : iso;
+    if (!Number.isFinite(ts))
+        return "—";
+    const delta = Date.now() - ts;
+    if (delta < 0)
+        return "now";
+    return `${formatDurationMs(delta, { t })} ago`;
+}
+function OverviewMetricCard({ label, value, detail, tone = "default", }) {
+    const valueClass = tone === "ok"
+        ? "text-ok"
+        : tone === "warning"
+            ? "text-warning"
+            : tone === "danger"
+                ? "text-danger"
+                : "text-txt";
+    return (_jsxs("div", { className: "rounded-xl border border-border/25 bg-bg/35 px-3 py-3 shadow-[inset_0_1px_0_rgba(255,255,255,0.04)]", children: [_jsx("div", { className: "text-[10px] font-semibold uppercase tracking-[0.14em] text-muted/70", children: label }), _jsx("div", { className: `mt-2 text-lg font-semibold leading-none ${valueClass}`, children: value }), _jsx("div", { className: "mt-2 text-[11px] leading-snug text-muted/70", children: detail })] }));
+}
+function OverviewListItem({ title, badge, meta, detail, trailing, tone = "muted", onClick, }) {
+    const content = (_jsxs("div", { className: "flex items-start gap-2", children: [_jsx(StatusDot, { tone: tone, className: "mt-1 shrink-0" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "truncate font-medium text-txt", children: title }), badge ? (_jsx("span", { className: "rounded bg-bg/50 px-1.5 py-0.5 text-[10px] uppercase tracking-[0.12em] text-muted/70", children: badge })) : null, trailing ? (_jsx("span", { className: "ml-auto shrink-0 text-[11px] text-muted/70", children: trailing })) : null] }), meta ? (_jsx("div", { className: "mt-0.5 text-[11px] leading-snug text-muted/70", children: meta })) : null, detail ? (_jsx("div", { className: "mt-1 line-clamp-1 text-[11px] leading-snug text-muted/60", children: detail })) : null] })] }));
+    if (!onClick) {
+        return _jsx("div", { className: "px-3 py-2 text-xs-tight", children: content });
+    }
+    return (_jsx("button", { type: "button", onClick: onClick, className: "w-full px-3 py-2 text-left text-xs-tight transition-colors hover:bg-bg-muted/40", children: content }));
+}
+function AutomationsDashboard({ items, onSelectItem, onCreateTask, onCreateWorkflow, onDescribeAutomation, onUseIdea, }) {
+    const { t, uiLanguage } = useAutomationsViewContext();
+    const now = Date.now();
+    const visibleItems = useMemo(() => items.filter((item) => !item.system), [items]);
+    const scheduledEntries = useMemo(() => collectScheduledAutomationEntries(visibleItems), [visibleItems]);
+    const draftItems = useMemo(() => sortAutomationsByUpdatedAtDesc(visibleItems.filter((item) => item.isDraft)).slice(0, 4), [visibleItems]);
+    const taskHighlights = useMemo(() => sortAutomationsByUpdatedAtDesc(visibleItems.filter((item) => item.type !== "n8n_workflow")).slice(0, 6), [visibleItems]);
+    const workflowHighlights = useMemo(() => sortAutomationsByUpdatedAtDesc(visibleItems.filter((item) => item.type === "n8n_workflow")).slice(0, 6), [visibleItems]);
+    const liveItems = useMemo(() => sortAutomationsByUpdatedAtDesc(visibleItems.filter((item) => item.enabled && !item.isDraft)).slice(0, 5), [visibleItems]);
+    const recentItems = useMemo(() => sortAutomationsByUpdatedAtDesc(visibleItems).slice(0, 6), [visibleItems]);
+    const taskCount = visibleItems.filter((item) => item.type !== "n8n_workflow").length;
+    const workflowCount = visibleItems.filter((item) => item.type === "n8n_workflow").length;
+    const activeCount = visibleItems.filter((item) => item.enabled && !item.isDraft).length;
+    const activeScheduleCount = scheduledEntries.filter(({ schedule }) => schedule.enabled && isTimeBasedTrigger(schedule)).length;
+    const activeEventCount = scheduledEntries.filter(({ schedule }) => schedule.enabled && schedule.triggerType === "event").length;
+    const upcoming = useMemo(() => scheduledEntries
+        .filter(({ schedule }) => schedule.enabled &&
+        isTimeBasedTrigger(schedule) &&
+        typeof schedule.nextRunAtMs === "number" &&
+        schedule.nextRunAtMs > now)
+        .sort((a, b) => (a.schedule.nextRunAtMs ?? 0) - (b.schedule.nextRunAtMs ?? 0))
+        .slice(0, 6), [scheduledEntries, now]);
+    const failures = useMemo(() => scheduledEntries
+        .filter(({ schedule }) => toneForLastStatus(schedule.lastStatus) === "danger")
+        .slice(0, 5), [scheduledEntries]);
+    const taskIdeas = useMemo(() => AUTOMATION_DRAFT_EXAMPLES.filter((idea) => idea.kind === "task"), []);
+    const workflowIdeas = useMemo(() => AUTOMATION_DRAFT_EXAMPLES.filter((idea) => idea.kind === "workflow"), []);
+    const nextUpcoming = upcoming[0] ?? null;
+    const attentionEntries = useMemo(() => {
+        const next = failures.map(({ key, item, schedule }) => ({
+            key,
+            item,
+            tone: "danger",
+            title: getOverviewDisplayTitle(item),
+            groupLabel: getAutomationGroupLabel(item),
+            meta: scheduleLabel(schedule, t, uiLanguage),
+            detail: schedule.lastError?.trim() ||
+                `Last run ${formatRelativePast(schedule.lastRunAtIso, t)}.`,
+            trailing: formatRelativePast(schedule.lastRunAtIso, t),
+        }));
+        return next.slice(0, 6);
+    }, [failures, t, uiLanguage]);
+    const statusEntries = [
+        {
+            label: "Live",
+            value: activeCount,
+            tone: activeCount > 0 ? "success" : "muted",
+        },
+        {
+            label: "Timed",
+            value: activeScheduleCount,
+            tone: activeScheduleCount > 0 ? "success" : "muted",
+        },
+        {
+            label: "Events",
+            value: activeEventCount,
+            tone: activeEventCount > 0 ? "success" : "muted",
+        },
+        {
+            label: "Attention",
+            value: attentionEntries.length,
+            tone: attentionEntries.length > 0 ? "danger" : "success",
+        },
+    ];
+    if (taskCount === 0 && workflowCount === 0) {
+        return (_jsxs("div", { className: "space-y-4 px-1 pt-4", children: [_jsx("section", { className: "overflow-hidden rounded-xl border border-border/25 bg-[radial-gradient(circle_at_top_left,rgba(34,211,238,0.14),transparent_38%),radial-gradient(circle_at_top_right,rgba(34,197,94,0.12),transparent_32%),rgba(255,255,255,0.02)]", children: _jsxs("div", { className: "space-y-3 px-4 py-4 sm:px-5", children: [_jsxs("div", { className: "inline-flex items-center gap-2 rounded-full border border-border/25 bg-bg/40 px-2 py-1 text-[10px] font-semibold uppercase tracking-[0.14em] text-muted/70", children: [_jsx(LayoutDashboard, { className: "h-3 w-3", "aria-hidden": true }), "Overview"] }), _jsxs("div", { className: "space-y-1", children: [_jsx("h2", { className: "text-lg font-semibold text-txt", children: "Build your first automation" }), _jsx("p", { className: "text-xs-tight text-muted/80", children: "Workflows handle multi-step pipelines; tasks are simple prompts that run on a schedule or from an event." })] }), _jsx(AutomationCommandBar, { onSubmit: onDescribeAutomation, autoFocus: true }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx(Button, { variant: "default", size: "sm", onClick: onCreateTask, children: "New task" }), _jsx(Button, { variant: "outline", size: "sm", onClick: onCreateWorkflow, children: "New workflow" })] })] }) }), _jsxs("div", { className: "grid gap-3 xl:grid-cols-2", children: [_jsx(DetailSection, { title: "Task ideas", children: _jsx("div", { className: "p-2", children: _jsx(OverviewIdeaGrid, { ideas: taskIdeas, onSelect: (idea) => onUseIdea(idea) }) }) }), _jsx(DetailSection, { title: "Workflow ideas", children: _jsx("div", { className: "p-2", children: _jsx(OverviewIdeaGrid, { ideas: workflowIdeas, onSelect: (idea) => onUseIdea(idea) }) }) })] }), draftItems.length > 0 && (_jsx(DetailSection, { title: "Drafts in progress", children: _jsx("div", { className: "divide-y divide-border/20", children: draftItems.map((item) => (_jsx(OverviewListItem, { onClick: () => onSelectItem(item), title: getOverviewDisplayTitle(item), badge: "Draft", meta: formatRelativePast(item.updatedAt, t), detail: item.description.trim() ||
+                                "Open it and keep shaping it in the sidebar agent.", tone: "warning" }, item.id))) }) }))] }));
+    }
+    return (_jsxs("div", { className: "space-y-4 px-1 pt-4", children: [_jsxs("section", { className: "grid gap-4 xl:grid-cols-[minmax(0,1.15fr)_minmax(320px,0.85fr)]", children: [_jsx("div", { className: "rounded-xl border border-border/25 bg-[radial-gradient(circle_at_top_left,rgba(34,197,94,0.1),transparent_34%),radial-gradient(circle_at_top_right,rgba(56,189,248,0.12),transparent_30%),rgba(255,255,255,0.02)] px-4 py-4 sm:px-5", children: _jsxs("div", { className: "space-y-3", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [_jsxs("div", { className: "inline-flex items-center gap-2 rounded-full border border-border/25 bg-bg/40 px-2 py-1 text-[10px] font-semibold uppercase tracking-[0.14em] text-muted/70", children: [_jsx(LayoutDashboard, { className: "h-3 w-3", "aria-hidden": true }), "Overview"] }), _jsx(AutomationStatusStrip, { entries: statusEntries })] }), _jsx(AutomationCommandBar, { onSubmit: onDescribeAutomation }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx(Button, { variant: "ghost", size: "sm", onClick: onCreateTask, children: "New task" }), _jsx(Button, { variant: "ghost", size: "sm", onClick: onCreateWorkflow, children: "New workflow" })] })] }) }), _jsx(DetailSection, { title: "Next up", className: "h-full", children: nextUpcoming?.schedule.nextRunAtMs ? (_jsxs("button", { type: "button", onClick: () => onSelectItem(nextUpcoming.item), className: "flex w-full flex-col gap-2 px-4 py-4 text-left transition-colors hover:bg-bg-muted/40", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(StatusDot, { tone: "success", className: "shrink-0" }), _jsx("span", { className: "truncate text-sm font-semibold text-txt", children: getOverviewDisplayTitle(nextUpcoming.item) }), _jsx("span", { className: "rounded bg-bg/50 px-1.5 py-0.5 text-[10px] uppercase tracking-[0.12em] text-muted/70", children: getAutomationGroupLabel(nextUpcoming.item) })] }), _jsx("div", { className: "pl-4 text-[11px] text-muted/70", children: scheduleLabel(nextUpcoming.schedule, t, uiLanguage) }), _jsxs("div", { className: "pl-4", children: [_jsx("div", { className: "text-lg font-semibold text-txt", children: formatRelativeFuture(nextUpcoming.schedule.nextRunAtMs, t) }), _jsx("div", { className: "mt-1 text-[11px] text-muted/70", children: formatDateTime(nextUpcoming.schedule.nextRunAtMs, {
+                                                fallback: "—",
+                                                locale: uiLanguage,
+                                            }) })] })] })) : (_jsxs("div", { className: "flex h-full min-h-[11.75rem] flex-col justify-between gap-3 px-4 py-4", children: [_jsx("div", { className: "space-y-1", children: _jsx("div", { className: "text-sm font-medium text-txt", children: "None queued." }) }), draftItems[0] ? (_jsx(Button, { variant: "outline", size: "sm", className: "w-fit", onClick: () => onSelectItem(draftItems[0]), children: "Continue draft" })) : null] })) })] }), attentionEntries.length > 0 ? (_jsx(DetailSection, { title: "Needs attention", children: _jsx("div", { className: "divide-y divide-border/20", children: attentionEntries.map((entry) => (_jsx(OverviewListItem, { onClick: () => onSelectItem(entry.item), title: entry.title, badge: entry.groupLabel, meta: entry.meta, detail: entry.detail, trailing: entry.trailing, tone: entry.tone }, entry.key))) }) })) : null, _jsxs("div", { className: "grid gap-4 xl:grid-cols-2", children: [_jsx(DetailSection, { title: "Running", className: "h-full", children: liveItems.length > 0 ? (_jsx("div", { className: "divide-y divide-border/20", children: liveItems.map((item) => (_jsx(OverviewListItem, { onClick: () => onSelectItem(item), title: getOverviewDisplayTitle(item), badge: getAutomationGroupLabel(item), meta: item.schedules[0]
+                                    ? scheduleLabel(item.schedules[0], t, uiLanguage)
+                                    : "Manual or event", trailing: formatRelativePast(item.updatedAt, t), tone: "success" }, item.id))) })) : (_jsx("div", { className: "px-3 py-4 text-xs-tight text-muted/70", children: "Nothing live." })) }), _jsx(DetailSection, { title: "Drafts", className: "h-full", children: draftItems.length > 0 ? (_jsx("div", { className: "divide-y divide-border/20", children: draftItems.map((item) => (_jsx(OverviewListItem, { onClick: () => onSelectItem(item), title: getOverviewDisplayTitle(item), badge: getAutomationGroupLabel(item), meta: "Continue", trailing: formatRelativePast(item.updatedAt, t), tone: "warning" }, item.id))) })) : (_jsx("div", { className: "px-3 py-4 text-xs-tight text-muted/70", children: "No drafts." })) })] }), _jsx(DetailSection, { title: "Recently changed", children: recentItems.length > 0 ? (_jsx("div", { className: "grid divide-y divide-border/20 md:grid-cols-2 md:divide-x md:divide-y-0", children: recentItems.map((item) => (_jsx(OverviewListItem, { onClick: () => onSelectItem(item), title: getOverviewDisplayTitle(item), badge: getAutomationGroupLabel(item), meta: item.schedules[0]
+                            ? scheduleLabel(item.schedules[0], t, uiLanguage)
+                            : item.isDraft
+                                ? "Draft"
+                                : "Manual or event", trailing: formatRelativePast(item.updatedAt, t), tone: getAutomationStatusTone(item) }, item.id))) })) : (_jsx("div", { className: "px-3 py-4 text-xs-tight text-muted/70", children: "No recent changes." })) }), _jsxs("div", { className: "grid gap-4 xl:grid-cols-2", children: [_jsx(DetailSection, { title: "Tasks", className: "h-full", action: _jsx(Button, { variant: "ghost", size: "sm", className: "h-7 px-2 text-xs", onClick: onCreateTask, children: "New task" }), children: taskHighlights.length > 0 ? (_jsx("div", { className: "divide-y divide-border/20", children: taskHighlights.map((item) => (_jsx(OverviewListItem, { onClick: () => onSelectItem(item), title: getOverviewDisplayTitle(item), badge: item.isDraft
+                                    ? "Draft"
+                                    : item.schedules.length > 0
+                                        ? formatScheduleCount(item.schedules.length)
+                                        : undefined, meta: item.isDraft
+                                    ? "In progress"
+                                    : item.schedules.length > 0
+                                        ? scheduleLabel(item.schedules[0], t, uiLanguage)
+                                        : "Event or manual", trailing: formatRelativePast(item.updatedAt, t), tone: getAutomationStatusTone(item) }, item.id))) })) : (_jsx("div", { className: "px-3 py-4 text-xs-tight text-muted/70", children: "No tasks yet." })) }), _jsx(DetailSection, { title: "Workflows", className: "h-full", action: _jsx(Button, { variant: "ghost", size: "sm", className: "h-7 px-2 text-xs", onClick: onCreateWorkflow, children: "New workflow" }), children: workflowHighlights.length > 0 ? (_jsx("div", { className: "divide-y divide-border/20", children: workflowHighlights.map((item) => (_jsx(OverviewListItem, { onClick: () => onSelectItem(item), title: getOverviewDisplayTitle(item), badge: item.isDraft
+                                    ? "Draft"
+                                    : `${getWorkflowNodeCount(item)} nodes`, meta: item.isDraft
+                                    ? "In progress"
+                                    : item.schedules.length > 0
+                                        ? scheduleLabel(item.schedules[0], t, uiLanguage)
+                                        : "Event or manual", trailing: formatRelativePast(item.updatedAt, t), tone: getAutomationStatusTone(item) }, item.id))) })) : (_jsx("div", { className: "px-3 py-4 text-xs-tight text-muted/70", children: "No workflows yet." })) })] })] }));
+}
+function AutomationDraftPane({ automation, onSeedPrompt, onDeleteDraft, }) {
+    const chatChrome = useAppWorkspaceChatChrome();
+    const openSidebarDraftChat = useCallback((prompt) => {
+        chatChrome?.openChat();
+        onSeedPrompt(prompt);
+    }, [chatChrome, onSeedPrompt]);
+    return (_jsxs("div", { className: "space-y-4 px-4 pt-6", children: [_jsxs("div", { className: "flex flex-wrap items-start justify-between gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("h2", { className: "text-lg font-semibold text-txt", children: getAutomationDisplayTitle(automation) }), _jsx("p", { className: "max-w-2xl text-xs-tight text-muted/80", children: "Use the sidebar agent to turn this draft into a task or workflow. Say what should start it and what result you want." })] }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx(Button, { variant: "outline", size: "sm", className: "h-8 gap-1.5 px-3 text-sm", onClick: () => openSidebarDraftChat(DESCRIBE_WORKFLOW_PROMPT), children: DESCRIBE_WORKFLOW_PROMPT }), _jsx(Button, { variant: "ghost", size: "sm", className: "h-8 px-3 text-sm text-danger hover:bg-danger/10 hover:text-danger", onClick: () => void onDeleteDraft(automation), children: "Delete draft" })] })] }), _jsx("div", { className: "grid gap-1.5 sm:grid-cols-2", children: AUTOMATION_DRAFT_EXAMPLES.map((example) => {
+                    const Icon = example.icon;
+                    return (_jsxs("button", { type: "button", onClick: () => openSidebarDraftChat(example.prompt), className: "group flex items-start gap-2 rounded-[var(--radius-sm)] border border-border/25 bg-bg/30 px-3 py-2 text-left transition-colors hover:border-accent/40 hover:bg-accent/5", children: [_jsx(Icon, { className: "mt-0.5 h-3.5 w-3.5 shrink-0 text-accent/80", "aria-hidden": true }), _jsxs("div", { className: "min-w-0 flex-1 space-y-0.5", children: [_jsx("div", { className: "text-xs-tight font-semibold text-txt", children: example.label }), _jsx("div", { className: "line-clamp-2 text-[11px] leading-snug text-muted/70", children: example.prompt })] })] }, example.label));
+                }) }), _jsx("p", { className: "px-1 text-[11px] text-muted/60", children: "The draft updates here as the automation takes shape." })] }));
+}
+function IconAction({ icon, label, onClick, tone, disabled, ariaBusy, }) {
+    const toneClass = tone === "warning"
+        ? "text-warning hover:bg-warning/10"
+        : tone === "ok"
+            ? "text-ok hover:bg-ok/10"
+            : tone === "danger"
+                ? "text-danger hover:bg-danger/10"
+                : "text-muted hover:text-txt hover:bg-bg-muted/50";
+    return (_jsx("button", { type: "button", onClick: onClick, "aria-label": label, "aria-busy": ariaBusy, title: label, disabled: disabled, className: `inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-[var(--radius-sm)] transition-colors disabled:cursor-not-allowed disabled:opacity-40 ${toneClass}`, children: icon }));
+}
+function DetailHeader({ icon, title, description, status, actions, }) {
+    return (_jsxs("div", { className: "flex items-start gap-3 border-b border-border/20 pb-3", children: [_jsxs("div", { className: "min-w-0 flex-1 space-y-0.5", children: [_jsxs("div", { className: "flex items-center gap-1.5 text-muted", children: [icon, _jsx("h2", { className: "truncate text-base font-semibold text-txt", children: title }), status] }), description ? (_jsx("p", { className: "text-xs-tight leading-snug text-muted/80", children: description })) : null] }), actions ? (_jsx("div", { className: "flex shrink-0 items-center gap-0.5", children: actions })) : null] }));
+}
+function DetailStatusIndicator({ label, tone, dotOnly = false, }) {
+    if (dotOnly) {
+        return (_jsxs("span", { className: "inline-flex items-center", children: [_jsx(StatusDot, { tone: tone }), _jsx("span", { className: "sr-only", children: label })] }));
+    }
+    return _jsx(StatusBadge, { label: label, variant: tone, withDot: true });
+}
+function DetailSection({ title, action, children, className, }) {
+    return (_jsxs("section", { className: `rounded-[var(--radius-sm)] border border-border/25 bg-bg/20 ${className ?? ""}`, children: [_jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-border/20 px-3 py-1.5", children: [_jsx("div", { className: "text-2xs font-semibold uppercase tracking-[0.14em] text-muted", children: title }), action] }), _jsx("div", { className: "py-1", children: children })] }));
+}
+function DetailFactList({ items, }) {
+    return (_jsx("dl", { className: "divide-y divide-border/20", children: items.map((item) => (_jsxs("div", { className: "flex items-start justify-between gap-3 px-3 py-2 text-xs-tight", children: [_jsx("dt", { className: "shrink-0 text-muted/70", children: item.label }), _jsx("dd", { className: "min-w-0 text-right text-txt", children: item.value })] }, item.label))) }));
+}
+function getWorkflowFlowNodes(workflow) {
+    const nodes = workflow?.nodes ?? [];
+    return [...nodes]
+        .sort((left, right) => {
+        const leftX = left.position?.[0] ?? 0;
+        const rightX = right.position?.[0] ?? 0;
+        if (leftX !== rightX)
+            return leftX - rightX;
+        const leftY = left.position?.[1] ?? 0;
+        const rightY = right.position?.[1] ?? 0;
+        if (leftY !== rightY)
+            return leftY - rightY;
+        return left.name.localeCompare(right.name);
+    })
+        .map((node) => ({
+        id: node.id ?? node.name,
+        label: node.name,
+        type: (node.type ?? "node").split(".").pop() ?? "node",
+    }));
+}
+function WorkflowDataFlowStrip({ workflow }) {
+    const flowNodes = getWorkflowFlowNodes(workflow);
+    if (flowNodes.length === 0) {
+        return (_jsx("div", { className: "px-4 py-3 text-xs-tight text-muted/70", children: "Generate the workflow to see its data path." }));
+    }
+    return (_jsxs("div", { className: "flex flex-wrap items-center gap-2 px-3 py-3", children: [_jsx("span", { className: "rounded-full border border-border/25 bg-bg/40 px-2 py-1 text-[10px] font-semibold uppercase tracking-[0.12em] text-muted", children: "Input" }), flowNodes.map((node, index) => (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(ArrowRight, { className: "h-3 w-3 text-muted/50", "aria-hidden": true }), _jsx("span", { className: "max-w-[12rem] truncate rounded-full border border-border/25 bg-bg/45 px-2.5 py-1 text-xs text-txt", children: node.label }), _jsx("span", { className: "hidden rounded bg-bg/40 px-1.5 py-0.5 text-[9px] uppercase tracking-[0.1em] text-muted/60 sm:inline", children: node.type }), index === flowNodes.length - 1 ? (_jsxs(_Fragment, { children: [_jsx(ArrowRight, { className: "h-3 w-3 text-muted/50", "aria-hidden": true }), _jsx("span", { className: "rounded-full border border-border/25 bg-bg/40 px-2 py-1 text-[10px] font-semibold uppercase tracking-[0.12em] text-muted", children: "Output" })] })) : null] }, node.id)))] }));
+}
+function TriggerAutomationDetailPane({ automation, onPromoteToWorkflow, }) {
+    const { t, uiLanguage, openEditTrigger, onRunSelectedTrigger, onToggleTriggerEnabled, loadTriggerRuns, triggerRunsById, setForm, setEditorOpen, setEditingId, setSelectedItemId, setSelectedItemKind, } = useAutomationsViewContext();
+    const trigger = automation.trigger;
+    const triggerId = trigger?.id;
+    const selectedRuns = triggerId ? (triggerRunsById[triggerId] ?? []) : [];
+    const hasLoadedRuns = triggerId
+        ? Object.hasOwn(triggerRunsById, triggerId)
+        : false;
+    useEffect(() => {
+        if (triggerId && !hasLoadedRuns) {
+            void loadTriggerRuns(triggerId);
+        }
+    }, [hasLoadedRuns, loadTriggerRuns, triggerId]);
+    if (!trigger) {
+        return null;
+    }
+    const { failureCount, successCount } = selectedRuns.reduce((counts, run) => {
+        const tone = toneForLastStatus(run.status);
+        if (tone === "success")
+            counts.successCount += 1;
+        else if (tone === "danger")
+            counts.failureCount += 1;
+        return counts;
+    }, { failureCount: 0, successCount: 0 });
+    const nextRunLabel = trigger.nextRunAtMs
+        ? trigger.triggerType === "event"
+            ? `On ${humanizeEventKind(trigger.eventKind ?? "event")}`
+            : formatRelativeFuture(trigger.nextRunAtMs, t)
+        : "Event or manual";
+    const whatRuns = trigger.kind === "workflow"
+        ? trigger.workflowName || "Selected workflow"
+        : trigger.instructions || "No prompt yet.";
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx(DetailHeader, { icon: _jsx(Clock3, { className: "h-3.5 w-3.5", "aria-hidden": true }), title: getAutomationDisplayTitle(automation), description: automation.description, status: _jsx(DetailStatusIndicator, { label: trigger.enabled ? "Active" : "Paused", tone: trigger.enabled ? "success" : "muted", dotOnly: trigger.enabled }), actions: _jsxs(_Fragment, { children: [_jsx(IconAction, { label: trigger.enabled ? "Pause" : "Resume", onClick: () => void onToggleTriggerEnabled(trigger.id, trigger.enabled), icon: trigger.enabled ? (_jsx(Pause, { className: "h-3.5 w-3.5" })) : (_jsx(Play, { className: "h-3.5 w-3.5" })), tone: trigger.enabled ? "warning" : "ok" }), _jsx(IconAction, { label: t("triggersview.RunNow"), onClick: () => void onRunSelectedTrigger(trigger.id), icon: _jsx(Zap, { className: "h-3.5 w-3.5" }) }), _jsx(IconAction, { label: t("common.edit"), onClick: () => openEditTrigger(trigger), icon: _jsx(EditIcon, { className: "h-3.5 w-3.5" }) }), _jsx(IconAction, { label: t("heartbeatsview.duplicate"), onClick: () => {
+                                setForm({
+                                    ...formFromTrigger(trigger),
+                                    displayName: `${trigger.displayName} (copy)`,
+                                });
+                                setEditorOpen(true);
+                                setEditingId(null);
+                                setSelectedItemId(null);
+                                setSelectedItemKind(null);
+                            }, icon: _jsx(Copy, { className: "h-3.5 w-3.5" }) }), _jsx(IconAction, { label: "Compile to Workflow", onClick: () => void onPromoteToWorkflow(automation), icon: _jsx(GitBranch, { className: "h-3.5 w-3.5" }) })] }) }), _jsxs("div", { className: "grid gap-2 sm:grid-cols-2 xl:grid-cols-5", children: [_jsx(OverviewMetricCard, { label: "Runs", value: _jsx("span", { className: "tabular-nums", children: selectedRuns.length }), detail: `${successCount} successful · ${failureCount} failed`, tone: failureCount > 0 ? "danger" : successCount > 0 ? "ok" : "default" }), _jsx(OverviewMetricCard, { label: "Starts", value: getTriggerStartModeLabel(trigger), detail: scheduleLabel(trigger, t, uiLanguage) }), _jsx(OverviewMetricCard, { label: "When it fires", value: getTriggerWakeModeLabel(trigger), detail: trigger.enabled ? "Enabled" : "Paused", tone: trigger.enabled ? "ok" : "default" }), _jsx(OverviewMetricCard, { label: "Next run", value: nextRunLabel, detail: trigger.triggerType === "event"
+                            ? "Waiting for event input"
+                            : formatDateTime(trigger.nextRunAtMs, {
+                                fallback: "No time-based run queued",
+                                locale: uiLanguage,
+                            }), tone: trigger.nextRunAtMs || trigger.triggerType === "event"
+                            ? "ok"
+                            : "default" }), _jsx(OverviewMetricCard, { label: "Last run", value: formatRelativePast(trigger.lastRunAtIso, t), detail: formatDateTime(trigger.lastRunAtIso, {
+                            fallback: "Not run yet",
+                            locale: uiLanguage,
+                        }) })] }), _jsx(DetailSection, { title: trigger.kind === "workflow" ? "Runs this workflow" : "Prompt", children: _jsx("div", { className: "min-h-[8rem] px-4 py-4 text-sm leading-relaxed text-muted/85 whitespace-pre-wrap", children: whatRuns }) }), _jsxs("div", { className: "grid gap-4 xl:grid-cols-[minmax(0,1fr)_minmax(320px,0.95fr)]", children: [_jsx(DetailSection, { title: "Run history", className: "h-full", action: _jsx(IconAction, { label: t("common.refresh"), onClick: () => void loadTriggerRuns(trigger.id), icon: _jsx(RefreshCw, { className: "h-3.5 w-3.5" }) }), children: !hasLoadedRuns ? (_jsxs("div", { className: "flex items-center gap-2 px-3 py-2 text-xs-tight text-muted/70", children: [_jsx("div", { className: "h-3 w-3 animate-spin rounded-full border-2 border-muted/30 border-t-muted/80" }), t("appsview.Loading")] })) : selectedRuns.length === 0 ? (_jsx("div", { className: "px-3 py-3 text-xs-tight text-muted/60", children: "No runs yet." })) : (_jsx("div", { className: "divide-y divide-border/20", children: selectedRuns.map((run) => (_jsxs("div", { className: "flex flex-wrap items-center gap-2 px-3 py-2 text-xs-tight", children: [_jsx(StatusBadge, { label: localizedExecutionStatus(run.status, t), variant: toneForLastStatus(run.status) }), _jsx("span", { className: "text-muted/70 tabular-nums", children: formatDateTime(run.startedAt, { locale: uiLanguage }) }), _jsx("span", { className: "text-muted/60", children: formatDurationMs(run.latencyMs, { t }) }), _jsx("span", { className: "ml-auto rounded bg-bg/40 px-1 py-0.5 font-mono text-[10px] text-muted/60", children: run.source }), run.error ? (_jsx("div", { className: "basis-full whitespace-pre-wrap rounded border border-danger/20 bg-danger/10 px-2 py-1 font-mono text-[11px] text-danger/90", children: run.error })) : null] }, run.triggerRunId))) })) }), _jsx(DetailSection, { title: "Schedule & behavior", className: "h-full", children: _jsx(DetailFactList, { items: [
+                                {
+                                    label: "Schedule",
+                                    value: scheduleLabel(trigger, t, uiLanguage),
+                                },
+                                {
+                                    label: "Trigger type",
+                                    value: getTriggerStartModeLabel(trigger),
+                                },
+                                ...(trigger.triggerType === "event"
+                                    ? [
+                                        {
+                                            label: "Event",
+                                            value: trigger.eventKind
+                                                ? humanizeEventKind(trigger.eventKind)
+                                                : "Unknown",
+                                        },
+                                    ]
+                                    : []),
+                                {
+                                    label: "Wake mode",
+                                    value: getTriggerWakeModeLabel(trigger),
+                                },
+                                {
+                                    label: "Status",
+                                    value: trigger.enabled ? "Enabled" : "Paused",
+                                },
+                                {
+                                    label: "Max runs",
+                                    value: trigger.maxRuns ? String(trigger.maxRuns) : "Unlimited",
+                                },
+                            ] }) })] })] }));
+}
+function WorkflowAutomationDetailPane({ automation, n8nStatus, workflowFetchError, workflowBusyId, workflowOpsBusy, onDeleteDraft, onDeleteWorkflow, onDuplicateWorkflow, onGenerateWorkflow, onRefreshWorkflows, onScheduleWorkflow, onStartLocalN8n, onToggleWorkflowActive, }) {
+    const { t, uiLanguage } = useApp();
+    const chatChrome = useAppWorkspaceChatChrome();
+    const [fullWorkflow, setFullWorkflow] = useState(automation.workflow ?? null);
+    const [workflowLoading, setWorkflowLoading] = useState(false);
+    const [workflowPrompt, setWorkflowPrompt] = useState("");
+    const [workflowPromptError, setWorkflowPromptError] = useState(null);
+    const [workflowPromptSaving, setWorkflowPromptSaving] = useState(false);
+    const workflowGenerating = useWorkflowGenerationState(automation.workflowId);
+    const busy = workflowOpsBusy ||
+        (automation.workflowId != null && workflowBusyId === automation.workflowId);
+    const graphWorkflow = fullWorkflow ?? automation.workflow ?? null;
+    const nodeCount = graphWorkflow?.nodeCount ??
+        graphWorkflow?.nodes?.length ??
+        getWorkflowNodeCount(automation);
+    const workflowIsActive = graphWorkflow?.active ?? automation.enabled;
+    const nextWorkflowRun = automation.schedules
+        .filter(isTimeBasedTrigger)
+        .map((schedule) => schedule.nextRunAtMs ?? 0)
+        .filter((value) => value > 0)
+        .sort((left, right) => left - right)[0];
+    const workflowIdeas = AUTOMATION_DRAFT_EXAMPLES.filter((idea) => idea.kind === "workflow");
+    const showWorkflowStarterIdeas = automation.isDraft || nodeCount === 0;
+    const showWorkflowPromptBox = automation.isDraft || nodeCount === 0;
+    const handleDescribeWorkflow = useCallback(() => {
+        chatChrome?.openChat();
+        prefillPageChat(DESCRIBE_WORKFLOW_PROMPT, { select: true });
+    }, [chatChrome]);
+    const handleUseWorkflowIdea = useCallback((idea) => {
+        chatChrome?.openChat();
+        prefillPageChat(idea.prompt, { select: true });
+    }, [chatChrome]);
+    const submitWorkflowPrompt = useCallback(async () => {
+        const prompt = workflowPrompt.trim();
+        if (!prompt) {
+            setWorkflowPromptError("Describe what this workflow should do.");
+            return;
+        }
+        setWorkflowPromptError(null);
+        setWorkflowPromptSaving(true);
+        try {
+            await onGenerateWorkflow(automation, prompt);
+            setWorkflowPrompt("");
+            chatChrome?.openChat();
+            prefillPageChat(prompt, { select: false });
+        }
+        catch (error) {
+            setWorkflowPromptError(error instanceof Error ? error.message : "Failed to generate workflow.");
+        }
+        finally {
+            setWorkflowPromptSaving(false);
+        }
+    }, [automation, chatChrome, onGenerateWorkflow, workflowPrompt]);
+    useEffect(() => {
+        let cancelled = false;
+        setFullWorkflow(automation.workflow ?? null);
+        if (!automation.workflowId || !automation.hasBackingWorkflow) {
+            setWorkflowLoading(false);
+            return undefined;
+        }
+        setWorkflowLoading(true);
+        void client
+            .getN8nWorkflow(automation.workflowId)
+            .then((workflow) => {
+            if (!cancelled) {
+                setFullWorkflow(workflow);
+            }
+        })
+            .catch(() => {
+            if (!cancelled) {
+                setFullWorkflow(automation.workflow ?? null);
+            }
+        })
+            .finally(() => {
+            if (!cancelled) {
+                setWorkflowLoading(false);
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [
+        automation.hasBackingWorkflow,
+        automation.workflow,
+        automation.workflowId,
+    ]);
+    return (_jsxs("div", { className: "space-y-4", children: [_jsx(WorkflowRuntimeNotice, { status: n8nStatus, workflowFetchError: workflowFetchError, busy: busy, onRefresh: () => void onRefreshWorkflows(), onStartLocal: () => void onStartLocalN8n() }), _jsx(DetailHeader, { icon: _jsx(Workflow, { className: "h-3.5 w-3.5", "aria-hidden": true }), title: getAutomationDisplayTitle(automation), description: null, status: _jsx(DetailStatusIndicator, { label: automation.isDraft
+                        ? "Draft"
+                        : automation.enabled
+                            ? "Active"
+                            : "Paused", tone: automation.isDraft
+                        ? "warning"
+                        : automation.enabled
+                            ? "success"
+                            : "muted", dotOnly: !automation.isDraft && automation.enabled }), actions: automation.isDraft ? (_jsx(IconAction, { label: "Delete draft", onClick: () => void onDeleteDraft(automation), icon: _jsx(Trash2, { className: "h-3.5 w-3.5" }), tone: "danger" })) : automation.workflowId ? (_jsxs(_Fragment, { children: [_jsx(IconAction, { label: busy
+                                ? t("common.updating", {
+                                    defaultValue: "Updating...",
+                                })
+                                : workflowIsActive
+                                    ? t("automations.n8n.deactivate", {
+                                        defaultValue: "Deactivate",
+                                    })
+                                    : t("automations.n8n.activate", {
+                                        defaultValue: "Activate",
+                                    }), onClick: () => void onToggleWorkflowActive(automation), disabled: busy, ariaBusy: busy, icon: workflowIsActive ? (_jsx(Pause, { className: "h-3.5 w-3.5" })) : (_jsx(Play, { className: "h-3.5 w-3.5" })), tone: workflowIsActive ? "warning" : "ok" }), _jsx(IconAction, { label: "Schedule workflow", onClick: () => onScheduleWorkflow(automation), disabled: busy, icon: _jsx(Clock3, { className: "h-3.5 w-3.5" }) }), _jsx(IconAction, { label: "Duplicate workflow", onClick: () => void onDuplicateWorkflow(automation), disabled: busy, icon: _jsx(Copy, { className: "h-3.5 w-3.5" }) }), _jsx(IconAction, { label: busy
+                                ? t("common.updating", {
+                                    defaultValue: "Updating...",
+                                })
+                                : t("automations.n8n.deleteWorkflow", {
+                                    defaultValue: "Delete workflow",
+                                }), onClick: () => void onDeleteWorkflow(automation), disabled: busy, ariaBusy: busy, icon: _jsx(Trash2, { className: "h-3.5 w-3.5" }), tone: "danger" })] })) : null }), _jsxs("div", { className: "grid gap-2 sm:grid-cols-2 xl:grid-cols-5", children: [_jsx(OverviewMetricCard, { label: "Status", value: automation.isDraft
+                            ? "Draft"
+                            : workflowIsActive
+                                ? "Active"
+                                : "Paused", detail: automation.schedules.length > 0
+                            ? formatScheduleCount(automation.schedules.length)
+                            : "No schedule attached", tone: automation.isDraft ? "warning" : workflowIsActive ? "ok" : "default" }), _jsx(OverviewMetricCard, { label: "Nodes", value: _jsx("span", { className: "tabular-nums", children: nodeCount }), detail: nodeCount > 0 ? "Visible in the graph below" : "Still blank" }), _jsx(OverviewMetricCard, { label: "Starts", value: automation.schedules.length > 0
+                            ? formatScheduleCount(automation.schedules.length)
+                            : "Event or manual", detail: automation.schedules.length > 0
+                            ? scheduleLabel(automation.schedules[0], t, uiLanguage)
+                            : "No time-based schedule yet" }), _jsx(OverviewMetricCard, { label: "Next run", value: nextWorkflowRun
+                            ? formatRelativeFuture(nextWorkflowRun, t)
+                            : "Not queued", detail: nextWorkflowRun
+                            ? formatDateTime(nextWorkflowRun, {
+                                fallback: "—",
+                                locale: uiLanguage,
+                            })
+                            : "Trigger it from an event or attach a schedule", tone: nextWorkflowRun ? "ok" : "default" }), _jsx(OverviewMetricCard, { label: "Updated", value: formatRelativePast(automation.updatedAt, t), detail: formatDateTime(automation.updatedAt, {
+                            fallback: "—",
+                            locale: uiLanguage,
+                        }) })] }), showWorkflowPromptBox && (_jsx(DetailSection, { title: "Create workflow", children: _jsxs("div", { className: "p-3", children: [_jsxs("div", { className: "flex flex-col gap-2 rounded-full border border-border/30 bg-bg/50 p-1.5 shadow-sm sm:flex-row sm:items-center", children: [_jsx(Input, { "data-workflow-prompt-input": "true", value: workflowPrompt, onChange: (event) => setWorkflowPrompt(event.target.value), onKeyDown: (event) => {
+                                        if (event.key === "Enter" && !event.shiftKey) {
+                                            event.preventDefault();
+                                            void submitWorkflowPrompt();
+                                        }
+                                    }, placeholder: WORKFLOW_PROMPT_PLACEHOLDER, className: "min-h-10 flex-1 border-0 bg-transparent px-4 shadow-none focus-visible:ring-0", autoFocus: automation.isDraft }), _jsx(Button, { variant: "default", size: "sm", className: "h-10 shrink-0 rounded-full px-5", disabled: workflowPromptSaving || busy, onClick: () => void submitWorkflowPrompt(), children: workflowPromptSaving ? "Generating..." : "Generate" })] }), workflowPromptError && (_jsx("div", { className: "mt-2 text-xs text-danger", children: workflowPromptError }))] }) })), _jsx(DetailSection, { title: "Workflow graph", action: automation.isDraft || nodeCount === 0 ? (_jsx(Button, { variant: "ghost", size: "sm", className: "h-7 px-2 text-xs", onClick: () => {
+                        const input = document.querySelector("[data-workflow-prompt-input='true']");
+                        input?.focus();
+                        if (!input)
+                            handleDescribeWorkflow();
+                    }, children: DESCRIBE_WORKFLOW_PROMPT })) : undefined, children: _jsx("div", { className: "p-3", children: _jsx(WorkflowGraphViewer, { workflow: graphWorkflow, loading: workflowLoading, isGenerating: workflowGenerating, emptyStateActionLabel: DESCRIBE_WORKFLOW_PROMPT, emptyStateHelpText: "Describe it above to generate the graph.", onEmptyStateAction: () => {
+                            const input = document.querySelector("[data-workflow-prompt-input='true']");
+                            input?.focus();
+                            if (!input)
+                                handleDescribeWorkflow();
+                        }, status: n8nStatus }) }) }), _jsx(DetailSection, { title: "Data flow", children: _jsx(WorkflowDataFlowStrip, { workflow: graphWorkflow }) }), _jsxs("div", { className: "grid gap-4 xl:grid-cols-[minmax(0,1fr)_minmax(320px,0.95fr)]", children: [_jsx(DetailSection, { title: "Starts when", className: "h-full", children: automation.schedules.length > 0 ? (_jsx("div", { className: "divide-y divide-border/20", children: automation.schedules.map((schedule) => (_jsx(OverviewListItem, { title: schedule.displayName, meta: scheduleLabel(schedule, t, uiLanguage), detail: formatDateTime(schedule.nextRunAtMs ?? null, {
+                                    fallback: "No next run queued",
+                                    locale: uiLanguage,
+                                }), trailing: schedule.enabled ? "Live" : "Paused", tone: schedule.enabled ? "success" : "muted" }, schedule.id))) })) : (_jsx("div", { className: "px-4 py-4 text-xs-tight text-muted/70", children: "No schedule yet. Start it from an event or add one in the sidebar." })) }), showWorkflowStarterIdeas ? (_jsx(DetailSection, { title: "Starter ideas", className: "h-full", children: _jsx("div", { className: "p-2", children: _jsx(OverviewIdeaGrid, { ideas: workflowIdeas, onSelect: handleUseWorkflowIdea }) }) })) : (_jsx(DetailSection, { title: "Details", className: "h-full", children: _jsx(DetailFactList, { items: [
+                                {
+                                    label: "Type",
+                                    value: automation.isDraft ? "Draft" : "n8n workflow",
+                                },
+                                {
+                                    label: "Nodes",
+                                    value: String(nodeCount),
+                                },
+                                {
+                                    label: "Schedules",
+                                    value: String(automation.schedules.length),
+                                },
+                                {
+                                    label: "Updated",
+                                    value: formatRelativePast(automation.updatedAt, t),
+                                },
+                            ] }) }))] })] }));
+}
+function AutomationSidebarItem({ item, selected, onClick, onDoubleClick, }) {
+    let Icon = Zap;
+    let tone = "muted";
+    let titleClass = "text-txt";
+    if (item.type === "n8n_workflow") {
+        Icon = Workflow;
+        tone = item.isDraft ? "warning" : item.enabled ? "success" : "muted";
+    }
+    else if (item.type === "automation_draft") {
+        Icon = FileText;
+        tone = "warning";
+    }
+    else if (item.trigger) {
+        Icon = Clock3;
+        tone = item.trigger.enabled ? "success" : "muted";
+        if (item.trigger.lastStatus) {
+            const lastTone = toneForLastStatus(item.trigger.lastStatus);
+            if (lastTone === "danger")
+                tone = "danger";
+        }
+    }
+    else if (item.task) {
+        if (item.system) {
+            Icon = Settings;
+            tone = "muted";
+            titleClass = "text-muted";
+        }
+        else if (item.task.isCompleted) {
+            Icon = CheckCircle2;
+            tone = "muted";
+            titleClass = "text-muted line-through";
+        }
+        else {
+            Icon = Circle;
+            tone = "success";
+        }
+    }
+    else {
+        return null;
+    }
+    return (_jsxs("button", { type: "button", onClick: onClick, onDoubleClick: onDoubleClick, "aria-current": selected ? "page" : undefined, className: `group flex w-full min-w-0 items-center gap-1.5 rounded-[var(--radius-sm)] py-1 pl-2 pr-1.5 text-left transition-colors ${selected ? "bg-accent/15 text-txt" : "text-txt hover:bg-bg-muted/50"} ${item.system ? "opacity-60" : ""}`, children: [_jsx(Icon, { className: "h-3.5 w-3.5 shrink-0 text-muted/70", "aria-hidden": true }), _jsx("span", { className: `truncate text-xs-tight ${titleClass}`, children: getAutomationDisplayTitle(item) }), _jsx(StatusDot, { tone: tone, className: "ml-auto h-1.5 w-1.5 shrink-0" })] }));
+}
+function AutomationsSidebarChatGuideActions() {
+    return (_jsx(Button, { variant: "outline", size: "sm", className: "h-8 gap-1.5 px-3 text-sm", onClick: () => prefillPageChat(DESCRIBE_WORKFLOW_PROMPT, { select: true }), children: DESCRIBE_WORKFLOW_PROMPT }));
+}
+function AutomationsSidebarChat({ activeItem, }) {
+    const { activeConversationId, conversations, t } = useApp();
+    const { refreshAutomations } = useAutomationsViewContext();
+    const [overviewVisible, setOverviewVisible] = useState(false);
+    const scopedActiveItem = overviewVisible ? null : activeItem;
+    useEffect(() => {
+        const overviewWindow = window;
+        setOverviewVisible(Boolean(overviewWindow.__miladyAutomationsOverviewVisible));
+        const handleOverviewVisibility = (event) => {
+            const detail = event
+                .detail;
+            setOverviewVisible(Boolean(detail?.visible));
+        };
+        window.addEventListener(AUTOMATIONS_OVERVIEW_VISIBILITY_EVENT, handleOverviewVisibility);
+        return () => window.removeEventListener(AUTOMATIONS_OVERVIEW_VISIBILITY_EVENT, handleOverviewVisibility);
+    }, []);
+    const automationConversationAdapter = useMemo(() => {
+        if (!scopedActiveItem) {
+            return null;
+        }
+        const bridgeConversationId = getAutomationBridgeIdForItem(scopedActiveItem, activeConversationId, conversations);
+        if (scopedActiveItem.type === "n8n_workflow") {
+            const metadata = scopedActiveItem.workflowId
+                ? buildWorkflowConversationMetadata(scopedActiveItem.workflowId, scopedActiveItem.title, bridgeConversationId)
+                : buildWorkflowDraftConversationMetadata(scopedActiveItem.draftId ?? scopedActiveItem.id, bridgeConversationId);
+            return {
+                allowClear: false,
+                buildRoutingMetadata: () => buildAutomationResponseRoutingMetadata(metadata),
+                identityKey: JSON.stringify({
+                    metadata,
+                    title: scopedActiveItem.title,
+                }),
+                onAfterSend: () => void refreshAutomations(),
+                resolveConversation: () => resolveAutomationConversation({
+                    title: scopedActiveItem.title,
+                    metadata,
+                }),
+            };
+        }
+        if (scopedActiveItem.type === "automation_draft") {
+            const metadata = buildAutomationDraftConversationMetadata(scopedActiveItem.draftId ?? scopedActiveItem.id, bridgeConversationId);
+            return {
+                allowClear: false,
+                buildRoutingMetadata: () => buildAutomationResponseRoutingMetadata(metadata),
+                identityKey: JSON.stringify({
+                    metadata,
+                    title: getAutomationDisplayTitle(scopedActiveItem),
+                }),
+                onAfterSend: () => void refreshAutomations(),
+                resolveConversation: () => resolveAutomationConversation({
+                    title: getAutomationDisplayTitle(scopedActiveItem),
+                    metadata,
+                }),
+            };
+        }
+        return null;
+    }, [
+        scopedActiveItem,
+        activeConversationId,
+        conversations,
+        refreshAutomations,
+    ]);
+    if (scopedActiveItem?.type === "n8n_workflow") {
+        return (_jsx(PageScopedChatPane, { scope: "page-automations", conversationAdapter: automationConversationAdapter ?? undefined, introOverride: {
+                title: scopedActiveItem.isDraft ? "Workflow draft" : "Workflow",
+                body: scopedActiveItem.isDraft
+                    ? "Describe the trigger and steps. The graph updates here."
+                    : "Ask to inspect, change, or troubleshoot this workflow.",
+                actions: scopedActiveItem.isDraft ? (_jsx(AutomationsSidebarChatGuideActions, {})) : undefined,
+            }, placeholderOverride: scopedActiveItem.isDraft
+                ? DESCRIBE_WORKFLOW_PROMPT
+                : t("automations.chat.placeholder"), systemAddendumOverride: WORKFLOW_SYSTEM_ADDENDUM }));
+    }
+    if (scopedActiveItem?.type === "automation_draft") {
+        return (_jsx(PageScopedChatPane, { scope: "page-automations", conversationAdapter: automationConversationAdapter ?? undefined, introOverride: {
+                title: "Draft",
+                body: "Describe the result and what should start it.",
+            }, placeholderOverride: "Describe your automation", systemAddendumOverride: AUTOMATION_DRAFT_SYSTEM_ADDENDUM }));
+    }
+    return (_jsx(PageScopedChatPane, { scope: "page-automations", placeholderOverride: "Describe your workflow, task, or schedule", introOverride: {
+            title: "Automations",
+            body: "Create or inspect a task or workflow.",
+            actions: _jsx(AutomationsSidebarChatGuideActions, {}),
+        } }));
+}
+function AutomationsLayout() {
+    const { activeConversationId, conversations, setTab } = useApp();
+    const ctx = useAutomationsViewContext();
+    const { closeEditor, editorEnabled, editingId, editingTaskId, editorOpen, editorMode, form, formError, loadTriggerRuns, modalTitle, onDeleteTrigger, onRunSelectedTrigger, onSubmitTrigger, onToggleTriggerEnabled, openCreateTrigger, openCreateTask, saveFormAsTemplate, selectedItemId, setEditingId, setEditorOpen, setEditorMode, setField, setFilter, setForm, setFormError, setSelectedItemId, setSelectedItemKind, showDetailPane, showFirstRunEmptyState, resolvedSelectedItem, t, templateNotice, triggers, filteredItems, triggerRunsById, triggersSaving, automationNodes, combinedError, isLoading, n8nStatus, workflowFetchError, } = ctx;
+    const [showDashboard, setShowDashboard] = useState(true);
+    const [collapsedSections, setCollapsedSections] = useState(() => new Set(["agent-owned"]));
+    const toggleSectionCollapsed = useCallback((key) => {
+        setCollapsedSections((prev) => {
+            const next = new Set(prev);
+            if (next.has(key))
+                next.delete(key);
+            else
+                next.add(key);
+            return next;
+        });
+    }, []);
+    const [pageNotice, setPageNotice] = useState(null);
+    const [missingCredentials, setMissingCredentials] = useState(null);
+    const [workflowBusyId, setWorkflowBusyId] = useState(null);
+    const [workflowOpsBusy, setWorkflowOpsBusy] = useState(false);
+    const [activeWorkflowConversation, setActiveWorkflowConversation] = useState(null);
+    const [createDialogMode, setCreateDialogMode] = useState(null);
+    const [templatesModalOpen, setTemplatesModalOpen] = useState(false);
+    const [activeSubpage, setActiveSubpage] = useState(() => getAutomationSubpageFromPath(getNavigationPathFromWindow()));
+    const visibleItems = filteredItems;
+    useEffect(() => {
+        if (!showDashboard)
+            return;
+        setSelectedItemId(null);
+        setSelectedItemKind(null);
+    }, [setSelectedItemId, setSelectedItemKind, showDashboard]);
+    useEffect(() => {
+        window.__miladyAutomationsOverviewVisible =
+            showDashboard;
+        window.dispatchEvent(new CustomEvent(AUTOMATIONS_OVERVIEW_VISIBILITY_EVENT, {
+            detail: { visible: showDashboard },
+        }));
+    }, [showDashboard]);
+    const syncSubpageFromLocation = useCallback(() => {
+        const pathname = getNavigationPathFromWindow();
+        const nextSubpage = getAutomationSubpageFromPath(pathname);
+        setActiveSubpage((previous) => previous === nextSubpage ? previous : nextSubpage);
+        if (normalizeAutomationPath(pathname) === "/node-catalog") {
+            syncAutomationSubpagePath("node-catalog", "replace");
+        }
+    }, []);
+    useEffect(() => {
+        syncSubpageFromLocation();
+        window.addEventListener("popstate", syncSubpageFromLocation);
+        window.addEventListener("hashchange", syncSubpageFromLocation);
+        return () => {
+            window.removeEventListener("popstate", syncSubpageFromLocation);
+            window.removeEventListener("hashchange", syncSubpageFromLocation);
+        };
+    }, [syncSubpageFromLocation]);
+    const showAutomationsList = useCallback((mode = "push") => {
+        setActiveSubpage("list");
+        syncAutomationSubpagePath("list", mode);
+    }, []);
+    const showNodeCatalog = useCallback((mode = "push") => {
+        setEditorOpen(false);
+        setEditingId(null);
+        ctx.setEditingTaskId(null);
+        setActiveSubpage("node-catalog");
+        syncAutomationSubpagePath("node-catalog", mode);
+    }, [ctx, setEditingId, setEditorOpen]);
+    const mobileSidebarLabel = activeSubpage === "node-catalog"
+        ? "Nodes"
+        : showDashboard
+            ? "Overview"
+            : editorOpen || editingId || editingTaskId
+                ? modalTitle
+                : resolvedSelectedItem
+                    ? getAutomationDisplayTitle(resolvedSelectedItem)
+                    : "Automations";
+    const selectItem = useCallback((item) => {
+        showAutomationsList();
+        setShowDashboard(false);
+        setSelectedItemId(item.id);
+        setSelectedItemKind(getSelectionKind(item));
+        setEditorOpen(false);
+        setEditingId(null);
+        ctx.setEditingTaskId(null);
+        if (item.trigger) {
+            void loadTriggerRuns(item.trigger.id);
+        }
+    }, [
+        ctx,
+        loadTriggerRuns,
+        setEditingId,
+        setEditorOpen,
+        setSelectedItemId,
+        setSelectedItemKind,
+        showAutomationsList,
+    ]);
+    const showOverview = useCallback(() => {
+        showAutomationsList();
+        setShowDashboard(true);
+        setSelectedItemId(null);
+        setSelectedItemKind(null);
+        setEditorOpen(false);
+        setEditingId(null);
+        ctx.setEditingTaskId(null);
+    }, [
+        ctx,
+        setEditingId,
+        setEditorOpen,
+        setSelectedItemId,
+        setSelectedItemKind,
+        showAutomationsList,
+    ]);
+    // Event consumer for agent-driven graph focus
+    useEffect(() => {
+        const handler = (event) => {
+            const { workflowId } = event.detail;
+            const match = filteredItems.find((item) => item.workflowId === workflowId || item.id === workflowId);
+            if (match) {
+                selectItem(match);
+            }
+        };
+        window.addEventListener(VISUALIZE_WORKFLOW_EVENT, handler);
+        return () => window.removeEventListener(VISUALIZE_WORKFLOW_EVENT, handler);
+    }, [filteredItems, selectItem]);
+    const findAutomationForConversation = useCallback((data, conversationId) => data?.automations.find((item) => item.room?.conversationId === conversationId) ?? null, []);
+    const refreshAutomationsWithDraftBinding = useCallback(async (draftConversation) => {
+        const previousWorkflowIds = new Set(ctx.allItems
+            .filter((item) => item.type === "n8n_workflow" &&
+            item.workflowId != null &&
+            !item.isDraft)
+            .map((item) => item.workflowId));
+        const previousTriggerIds = new Set(ctx.allItems
+            .filter((item) => item.trigger?.id)
+            .map((item) => item.trigger?.id));
+        const previousTaskIds = new Set(ctx.allItems
+            .filter((item) => item.task?.id)
+            .map((item) => item.task?.id));
+        const data = await ctx.refreshAutomations();
+        const draftScope = draftConversation?.metadata?.scope;
+        if (!draftConversation || !draftScope) {
+            return data;
+        }
+        const bridgeConversationId = draftConversation.metadata?.terminalBridgeConversationId;
+        // Workflow-draft scope: rebind on new n8n workflow (existing path).
+        if (draftScope === "automation-workflow-draft" &&
+            draftConversation.metadata?.automationType === "n8n_workflow") {
+            const createdWorkflows = data?.automations.filter((item) => item.type === "n8n_workflow" &&
+                item.workflowId != null &&
+                !item.isDraft &&
+                !previousWorkflowIds.has(item.workflowId)) ?? [];
+            if (createdWorkflows.length !== 1)
+                return data;
+            const created = createdWorkflows[0];
+            const reboundMetadata = buildWorkflowConversationMetadata(created.workflowId, created.title, bridgeConversationId);
+            const { conversation } = await client.updateConversation(draftConversation.id, { title: created.title, metadata: reboundMetadata });
+            setActiveWorkflowConversation(conversation);
+            return await ctx.refreshAutomations();
+        }
+        // Shape-undecided draft: detect what the agent created and rebind.
+        if (draftScope === "automation-draft") {
+            const createdTriggers = data?.automations.filter((item) => item.trigger != null && !previousTriggerIds.has(item.trigger.id)) ?? [];
+            const createdTasks = data?.automations.filter((item) => item.task != null &&
+                !item.system &&
+                !previousTaskIds.has(item.task.id)) ?? [];
+            const createdWorkflows = data?.automations.filter((item) => item.type === "n8n_workflow" &&
+                item.workflowId != null &&
+                !item.isDraft &&
+                !previousWorkflowIds.has(item.workflowId)) ?? [];
+            const createdCount = createdTriggers.length +
+                createdTasks.length +
+                createdWorkflows.length;
+            if (createdCount !== 1) {
+                return data;
+            }
+            const draftItemId = `automation-draft:${draftConversation.metadata?.draftId ?? ""}`;
+            const draftWasSelected = selectedItemId === draftItemId;
+            const followSelection = (nextItemId, kind) => {
+                if (!draftWasSelected)
+                    return;
+                setSelectedItemId(nextItemId);
+                setSelectedItemKind(kind);
+            };
+            if (createdTriggers.length === 1) {
+                const created = createdTriggers[0];
+                const trigger = created.trigger;
+                if (!trigger)
+                    return await ctx.refreshAutomations();
+                const reboundMetadata = buildCoordinatorTriggerConversationMetadata(trigger.id, bridgeConversationId);
+                await client.updateConversation(draftConversation.id, {
+                    title: created.title,
+                    metadata: reboundMetadata,
+                });
+                followSelection(created.id, "trigger");
+                return await ctx.refreshAutomations();
+            }
+            if (createdTasks.length === 1) {
+                const created = createdTasks[0];
+                const task = created.task;
+                if (!task)
+                    return await ctx.refreshAutomations();
+                const reboundMetadata = buildCoordinatorConversationMetadata(task.id, bridgeConversationId);
+                await client.updateConversation(draftConversation.id, {
+                    title: created.title,
+                    metadata: reboundMetadata,
+                });
+                followSelection(created.id, "task");
+                return await ctx.refreshAutomations();
+            }
+            if (createdWorkflows.length === 1) {
+                const created = createdWorkflows[0];
+                const reboundMetadata = buildWorkflowConversationMetadata(created.workflowId, created.title, bridgeConversationId);
+                const { conversation } = await client.updateConversation(draftConversation.id, { title: created.title, metadata: reboundMetadata });
+                setActiveWorkflowConversation(conversation);
+                followSelection(created.id, "workflow");
+                return await ctx.refreshAutomations();
+            }
+        }
+        return data;
+    }, [ctx, selectedItemId, setSelectedItemId, setSelectedItemKind]);
+    const bindConversationToWorkflow = useCallback(async (conversation, workflow, bridgeConversationId) => {
+        const reboundMetadata = buildWorkflowConversationMetadata(workflow.id, workflow.name, bridgeConversationId ?? undefined);
+        const { conversation: reboundConversation } = await client.updateConversation(conversation.id, {
+            title: workflow.name,
+            metadata: reboundMetadata,
+        });
+        setActiveWorkflowConversation(reboundConversation);
+        return reboundConversation;
+    }, []);
+    const selectWorkflowById = useCallback((workflowId) => {
+        setShowDashboard(false);
+        setSelectedItemId(`workflow:${workflowId}`);
+        setSelectedItemKind("workflow");
+        setEditorOpen(false);
+        setEditingId(null);
+        ctx.setEditingTaskId(null);
+    }, [ctx, setEditingId, setEditorOpen, setSelectedItemId, setSelectedItemKind]);
+    const generateWorkflowFromPrompt = useCallback(async ({ prompt, title, conversation, bridgeConversationId, workflowId, }) => {
+        setWorkflowOpsBusy(true);
+        setPageNotice(null);
+        setMissingCredentials(null);
+        try {
+            const result = await client.generateN8nWorkflow({
+                prompt,
+                ...(title?.trim() ? { name: title.trim() } : {}),
+                ...(workflowId ? { workflowId } : {}),
+            });
+            if (isMissingCredentialsResponse(result)) {
+                setMissingCredentials(result.missingCredentials);
+                return null;
+            }
+            if (conversation) {
+                await bindConversationToWorkflow(conversation, result, bridgeConversationId);
+            }
+            await ctx.refreshAutomations();
+            selectWorkflowById(result.id);
+            return result;
+        }
+        finally {
+            setWorkflowOpsBusy(false);
+        }
+    }, [bindConversationToWorkflow, ctx, selectWorkflowById]);
+    const createWorkflowDraft = useCallback(async (options) => {
+        setPageNotice(null);
+        showAutomationsList();
+        const draftId = createWorkflowDraftId();
+        setShowDashboard(false);
+        setFilter("all");
+        setSelectedItemId(`workflow-draft:${draftId}`);
+        setSelectedItemKind("workflow");
+        setEditorOpen(false);
+        setEditingId(null);
+        ctx.setEditingTaskId(null);
+        const bridgeConversationId = getAutomationBridgeIdForItem(resolvedSelectedItem, activeConversationId, conversations);
+        const metadata = buildWorkflowDraftConversationMetadata(draftId, bridgeConversationId);
+        try {
+            const conversation = await resolveAutomationConversation({
+                title: options?.title?.trim() || WORKFLOW_DRAFT_TITLE,
+                metadata,
+            });
+            setActiveWorkflowConversation(conversation);
+            if (options?.initialPrompt?.trim()) {
+                await generateWorkflowFromPrompt({
+                    prompt: options.initialPrompt.trim(),
+                    title: options.title?.trim() || undefined,
+                    conversation,
+                    bridgeConversationId,
+                });
+                return;
+            }
+            const data = await ctx.refreshAutomations();
+            const resolvedItem = findAutomationForConversation(data, conversation.id);
+            setSelectedItemId(resolvedItem?.id ?? `workflow-draft:${draftId}`);
+            setSelectedItemKind("workflow");
+        }
+        catch (error) {
+            setPageNotice(error instanceof Error
+                ? error.message
+                : "Failed to create the workflow draft room.");
+        }
+    }, [
+        activeConversationId,
+        conversations,
+        ctx,
+        findAutomationForConversation,
+        generateWorkflowFromPrompt,
+        resolvedSelectedItem,
+        setFilter,
+        setEditingId,
+        setEditorOpen,
+        setSelectedItemId,
+        setSelectedItemKind,
+        showAutomationsList,
+    ]);
+    const promoteAutomationToWorkflow = useCallback(async (item) => {
+        await createWorkflowDraft({
+            title: `${item.title} Workflow`,
+            initialPrompt: buildWorkflowCompilationPrompt(item),
+        });
+    }, [createWorkflowDraft]);
+    // Open a workflow draft and seed it with the selected template prompt.
+    const handleTemplateSelected = useCallback(async (seedPrompt) => {
+        setTemplatesModalOpen(false);
+        await createWorkflowDraft({ initialPrompt: seedPrompt });
+    }, [createWorkflowDraft]);
+    // Zero-state: open trigger or task forms, switching filter first.
+    const handleZeroStateNewTrigger = useCallback(() => {
+        showAutomationsList();
+        openCreateTrigger();
+    }, [openCreateTrigger, showAutomationsList]);
+    const handleZeroStateNewTask = useCallback(() => {
+        showAutomationsList();
+        openCreateTask();
+    }, [openCreateTask, showAutomationsList]);
+    const openSeededTask = useCallback((idea) => {
+        showAutomationsList();
+        openCreateTrigger();
+        setForm({
+            ...emptyForm,
+            displayName: idea.label,
+            instructions: idea.prompt,
+        });
+    }, [openCreateTrigger, setForm, showAutomationsList]);
+    const handleDescribeAutomation = useCallback(async (prompt) => {
+        const trimmed = prompt.trim();
+        if (!trimmed)
+            return;
+        if (inferAutomationPromptKind(trimmed) === "workflow") {
+            await createWorkflowDraft({
+                title: titleFromAutomationPrompt(trimmed),
+                initialPrompt: trimmed,
+            });
+            return;
+        }
+        showAutomationsList();
+        openCreateTrigger();
+        setForm({
+            ...emptyForm,
+            displayName: titleFromAutomationPrompt(trimmed),
+            instructions: trimmed,
+        });
+    }, [createWorkflowDraft, openCreateTrigger, setForm, showAutomationsList]);
+    const handleRefreshWorkflows = useCallback(async () => {
+        setPageNotice(null);
+        const data = await refreshAutomationsWithDraftBinding(activeWorkflowConversation);
+        if (!data && ctx.automationsError) {
+            setPageNotice(ctx.automationsError);
+        }
+    }, [
+        activeWorkflowConversation,
+        ctx.automationsError,
+        refreshAutomationsWithDraftBinding,
+    ]);
+    const handleStartLocalN8n = useCallback(async () => {
+        setWorkflowOpsBusy(true);
+        setPageNotice(null);
+        try {
+            await client.startN8nSidecar();
+            await ctx.refreshAutomations();
+        }
+        catch (error) {
+            setPageNotice(error instanceof Error
+                ? error.message
+                : t("automations.n8n.startFailed", {
+                    defaultValue: "Failed to start local automations.",
+                }));
+        }
+        finally {
+            setWorkflowOpsBusy(false);
+        }
+    }, [ctx, t]);
+    const handleToggleWorkflowActive = useCallback(async (item) => {
+        if (!item.workflowId) {
+            return;
+        }
+        setWorkflowBusyId(item.workflowId);
+        setPageNotice(null);
+        try {
+            if (item.enabled) {
+                await client.deactivateN8nWorkflow(item.workflowId);
+            }
+            else {
+                await client.activateN8nWorkflow(item.workflowId);
+            }
+            await ctx.refreshAutomations();
+        }
+        catch (error) {
+            setPageNotice(error instanceof Error
+                ? error.message
+                : t("automations.n8n.updateStateFailed", {
+                    defaultValue: "Failed to update workflow state.",
+                }));
+        }
+        finally {
+            setWorkflowBusyId(null);
+        }
+    }, [ctx, t]);
+    const handleGenerateWorkflow = useCallback(async (item, prompt) => {
+        const conversationId = item.room?.conversationId;
+        const conversation = conversationId
+            ? (conversations.find((candidate) => candidate.id === conversationId) ??
+                null)
+            : null;
+        const title = item.title.trim() && item.title !== WORKFLOW_DRAFT_TITLE
+            ? item.title
+            : undefined;
+        await generateWorkflowFromPrompt({
+            prompt,
+            title,
+            conversation,
+            bridgeConversationId: item.room?.terminalBridgeConversationId,
+            workflowId: item.hasBackingWorkflow ? item.workflowId : null,
+        });
+    }, [conversations, generateWorkflowFromPrompt]);
+    const handleScheduleWorkflow = useCallback((item) => {
+        if (!item.workflowId) {
+            setPageNotice("Generate the workflow before scheduling it.");
+            return;
+        }
+        setForm({
+            ...emptyForm,
+            displayName: `Run ${item.title}`,
+            kind: "workflow",
+            workflowId: item.workflowId,
+            workflowName: item.title,
+        });
+        setEditorMode("trigger");
+        setEditingId(null);
+        ctx.setEditingTaskId(null);
+        setSelectedItemId(null);
+        setSelectedItemKind(null);
+        setEditorOpen(true);
+        setShowDashboard(false);
+    }, [
+        ctx,
+        setEditingId,
+        setEditorMode,
+        setEditorOpen,
+        setForm,
+        setSelectedItemId,
+        setSelectedItemKind,
+    ]);
+    const handleDeleteWorkflow = useCallback(async (item) => {
+        if (!item.workflowId) {
+            return;
+        }
+        const confirmed = await confirmDesktopAction({
+            title: t("automations.n8n.deleteWorkflow", {
+                defaultValue: "Delete workflow",
+            }),
+            message: item.schedules.length > 0
+                ? `Delete "${item.title}" and ${item.schedules.length} attached schedule${item.schedules.length === 1 ? "" : "s"}? This cannot be undone.`
+                : t("automations.n8n.deleteConfirmWorkflow", {
+                    defaultValue: 'Delete "{{name}}"? This cannot be undone.',
+                    name: item.title,
+                }),
+            confirmLabel: t("automations.n8n.deleteWorkflow", {
+                defaultValue: "Delete workflow",
+            }),
+            cancelLabel: t("common.cancel"),
+            type: "warning",
+        });
+        if (!confirmed)
+            return;
+        setWorkflowBusyId(item.workflowId);
+        setPageNotice(null);
+        try {
+            await client.deleteN8nWorkflow(item.workflowId);
+            await Promise.all(item.schedules.map((schedule) => client.deleteTrigger(schedule.id)));
+            // Also delete the chat conversation/room that backed this workflow.
+            // Without this, the `/api/automations` aggregator keeps surfacing the
+            // workflow row as a ghost entry because rooms with workflowId
+            // metadata are listed even when the underlying n8n workflow is gone.
+            const conversationId = item.room?.conversationId;
+            if (conversationId) {
+                try {
+                    await client.deleteConversation(conversationId);
+                }
+                catch (roomErr) {
+                    // Non-fatal: the workflow itself is deleted; surface the room
+                    // failure to the user but don't roll back.
+                    setPageNotice(`Workflow deleted, but its chat room could not be removed: ${roomErr instanceof Error ? roomErr.message : String(roomErr)}`);
+                }
+            }
+            if (selectedItemId === item.id) {
+                setSelectedItemId(null);
+                setSelectedItemKind(null);
+            }
+            // Mirror handleDeleteDraft: also clear the active workflow
+            // conversation if it's the one tied to the deleted workflow.
+            // Without this, refreshAutomationsWithDraftBinding keeps receiving
+            // a stale conversation reference on subsequent refreshes.
+            if (conversationId &&
+                activeWorkflowConversation?.id === conversationId) {
+                setActiveWorkflowConversation(null);
+            }
+            await ctx.refreshAutomations();
+        }
+        catch (error) {
+            setPageNotice(error instanceof Error
+                ? error.message
+                : t("automations.n8n.deleteFailed", {
+                    defaultValue: "Failed to delete workflow.",
+                }));
+        }
+        finally {
+            setWorkflowBusyId(null);
+        }
+    }, [
+        activeWorkflowConversation?.id,
+        ctx,
+        selectedItemId,
+        setSelectedItemId,
+        setSelectedItemKind,
+        t,
+    ]);
+    const handleDuplicateWorkflow = useCallback(async (item) => {
+        if (!item.workflowId) {
+            return;
+        }
+        setPageNotice(null);
+        try {
+            const workflow = await client.getN8nWorkflow(item.workflowId);
+            const copy = await client.createN8nWorkflow(buildWorkflowCopyRequest(workflow, `${item.title} Copy`));
+            await ctx.refreshAutomations();
+            selectWorkflowById(copy.id);
+        }
+        catch (error) {
+            setPageNotice(error instanceof Error
+                ? error.message
+                : "Failed to duplicate workflow.");
+        }
+    }, [ctx, selectWorkflowById]);
+    const handleDeleteDraft = useCallback(async (item) => {
+        // Synthesized in-flight drafts (workflow-draft:* ids surfaced
+        // before refreshAutomations completes) have no `room` because the
+        // controller's resolvedSelectedItem useMemo can't reach
+        // activeWorkflowConversation from its scope. Fall back to the
+        // live activeWorkflowConversation when item.room is missing —
+        // that's the same conversation the synthesized item represents.
+        const conversationId = item.room?.conversationId ?? activeWorkflowConversation?.id ?? null;
+        if (!conversationId) {
+            setPageNotice("This draft is missing its automation room.");
+            return;
+        }
+        const confirmed = await confirmDesktopAction({
+            title: "Delete draft",
+            message: `Delete "${getAutomationDisplayTitle(item)}"? This removes the draft room and its conversation.`,
+            confirmLabel: "Delete draft",
+            cancelLabel: t("common.cancel"),
+            type: "warning",
+        });
+        if (!confirmed)
+            return;
+        setPageNotice(null);
+        try {
+            await client.deleteConversation(conversationId);
+            if (selectedItemId === item.id) {
+                setSelectedItemId(null);
+                setSelectedItemKind(null);
+            }
+            if (activeWorkflowConversation?.id === conversationId) {
+                setActiveWorkflowConversation(null);
+            }
+            await ctx.refreshAutomations();
+            setShowDashboard(true);
+        }
+        catch (error) {
+            setPageNotice(error instanceof Error ? error.message : "Failed to delete draft.");
+        }
+    }, [
+        activeWorkflowConversation?.id,
+        ctx,
+        selectedItemId,
+        setSelectedItemId,
+        setSelectedItemKind,
+        t,
+    ]);
+    const workflowItems = useMemo(() => visibleItems.filter((item) => item.type === "n8n_workflow"), [visibleItems]);
+    const taskItems = useMemo(() => visibleItems.filter((item) => item.type === "automation_draft" || item.trigger != null), [visibleItems]);
+    const agentOwnedItems = useMemo(() => visibleItems.filter((item) => item.task != null && item.system), [visibleItems]);
+    // Watch active drafts: while any unbound draft exists, poll the
+    // automations list and try to rebind it to whatever the agent
+    // materialized (trigger / task / workflow). Loop self-terminates as
+    // soon as the draft is rebound (it disappears from `allItems`).
+    const allDraftItems = useMemo(() => ctx.allItems.filter((item) => item.type === "automation_draft"), [ctx.allItems]);
+    useEffect(() => {
+        if (allDraftItems.length === 0)
+            return undefined;
+        const draftConversations = allDraftItems
+            .map((item) => {
+            const conversationId = item.room?.conversationId;
+            if (!conversationId)
+                return null;
+            return conversations.find((c) => c.id === conversationId) ?? null;
+        })
+            .filter((c) => c != null);
+        if (draftConversations.length === 0)
+            return undefined;
+        const interval = window.setInterval(() => {
+            for (const draftConversation of draftConversations) {
+                void refreshAutomationsWithDraftBinding(draftConversation);
+            }
+        }, 5000);
+        return () => window.clearInterval(interval);
+    }, [allDraftItems, conversations, refreshAutomationsWithDraftBinding]);
+    const renderItem = (item) => (_jsx(AutomationSidebarItem, { item: item, selected: selectedItemId === item.id, onClick: () => selectItem(item), onDoubleClick: item.task && !item.system
+            ? () => {
+                showAutomationsList();
+                ctx.openEditTask(item.task);
+            }
+            : item.trigger
+                ? () => {
+                    showAutomationsList();
+                    ctx.openEditTrigger(item.trigger);
+                    void loadTriggerRuns(item.trigger.id);
+                }
+                : undefined }, item.id));
+    const nodeCatalogActive = activeSubpage === "node-catalog";
+    const nodeCatalogLabel = t("automations.nodeCatalog", {
+        defaultValue: "Nodes",
+    });
+    const automationsSidebar = (_jsx(AppPageSidebar, { testId: "automations-sidebar", collapsible: true, contentIdentity: "automations", collapseButtonTestId: "automations-sidebar-collapse-toggle", expandButtonTestId: "automations-sidebar-expand-toggle", collapseButtonAriaLabel: t("automations.collapse", {
+            defaultValue: "Collapse automations",
+        }), expandButtonAriaLabel: t("automations.expand", {
+            defaultValue: "Expand automations",
+        }), bottomAction: _jsxs("button", { type: "button", onClick: () => showNodeCatalog(), "aria-pressed": nodeCatalogActive, title: nodeCatalogLabel, className: `inline-flex h-6 shrink-0 items-center gap-1.5 rounded-[var(--radius-sm)] bg-transparent px-1.5 text-2xs font-semibold uppercase tracking-[0.12em] transition-colors ${nodeCatalogActive ? "text-txt" : "text-muted hover:text-txt"}`, children: [_jsx(Grid3x3, { className: "h-3.5 w-3.5", "aria-hidden": true }), _jsx("span", { children: nodeCatalogLabel })] }), collapsedRailAction: _jsx(SidebarCollapsedActionButton, { "aria-label": "Create task or workflow", onClick: () => setCreateDialogMode("all"), children: _jsx(Plus, { className: "h-4 w-4" }) }), collapsedRailItems: visibleItems.map((item) => (_jsx(SidebarContent.RailItem, { "aria-label": getAutomationDisplayTitle(item), title: getAutomationDisplayTitle(item), active: item.id === selectedItemId, indicatorTone: getAutomationIndicatorTone(item), onClick: () => selectItem(item), children: railMonogram(getAutomationDisplayTitle(item)) }, item.id))), children: _jsx(SidebarScrollRegion, { className: "!px-0 !pb-2 !pt-0 [scrollbar-gutter:auto]", style: { scrollbarGutter: "auto" }, children: _jsxs(SidebarPanel, { className: "bg-transparent gap-0 p-0 shadow-none", children: [isLoading && (_jsxs("div", { className: "flex items-center gap-2 px-2 py-1.5 text-2xs text-muted", children: [_jsx("div", { className: "h-3 w-3 animate-spin rounded-full border-2 border-muted/30 border-t-muted/80" }), t("common.loading")] })), _jsxs("button", { type: "button", onClick: showOverview, "aria-current": showDashboard ? "page" : undefined, className: `mt-0 flex w-full items-center gap-2 rounded-[var(--radius-sm)] px-2 py-1 text-left text-xs-tight transition-colors ${showDashboard
+                            ? "bg-accent/15 text-txt"
+                            : "text-txt hover:bg-bg-muted/50"}`, children: [_jsx(LayoutDashboard, { className: "h-3.5 w-3.5 shrink-0 text-muted/70", "aria-hidden": true }), _jsx("span", { className: "truncate", children: "Overview" })] }), _jsxs("div", { className: "mt-0.5 space-y-1", children: [_jsx(AutomationCollapsibleSection, { sectionKey: "tasks", label: "Tasks", icon: _jsx(FileText, { className: "h-3.5 w-3.5", "aria-hidden": true }), count: taskItems.length, collapsed: collapsedSections.has("tasks"), onToggleCollapsed: toggleSectionCollapsed, onAdd: handleZeroStateNewTask, addLabel: "Create task", emptyLabel: "No tasks", children: taskItems.map(renderItem) }), _jsx(AutomationCollapsibleSection, { sectionKey: "workflows", label: "Workflows", icon: _jsx(Workflow, { className: "h-3.5 w-3.5", "aria-hidden": true }), count: workflowItems.length, collapsed: collapsedSections.has("workflows"), onToggleCollapsed: toggleSectionCollapsed, onAdd: () => void createWorkflowDraft(), addLabel: "Create workflow", emptyLabel: "No workflows", children: workflowItems.map(renderItem) }), _jsx(AutomationCollapsibleSection, { sectionKey: "agent-owned", label: "Internal", icon: _jsx(SquareTerminal, { className: "h-3.5 w-3.5", "aria-hidden": true }), count: agentOwnedItems.length, collapsed: collapsedSections.has("agent-owned"), onToggleCollapsed: toggleSectionCollapsed, emptyLabel: "No internal automations", children: agentOwnedItems.map(renderItem) })] })] }) }) }));
+    return (_jsxs(PageLayout, { className: "h-full bg-transparent", "data-testid": "automations-shell", sidebar: automationsSidebar, contentInnerClassName: "w-full", footer: _jsx(WidgetHost, { slot: "automations", className: "py-2" }), mobileSidebarLabel: mobileSidebarLabel, children: [_jsxs("div", { className: "flex min-h-0 flex-1 flex-col", children: [activeSubpage === "node-catalog" ||
+                        (!showDashboard && showDetailPane) ? (_jsx("button", { type: "button", className: "mb-3 flex items-center gap-2 rounded-2xl border border-border/30 bg-bg/25 px-4 py-3 text-base font-medium text-muted hover:text-txt md:hidden", onClick: () => {
+                            if (activeSubpage === "node-catalog") {
+                                showAutomationsList();
+                                return;
+                            }
+                            setSelectedItemId(null);
+                            setSelectedItemKind(null);
+                            setEditorOpen(false);
+                            setEditingId(null);
+                            ctx.setEditingTaskId(null);
+                        }, children: "\u2190 Back" })) : null, missingCredentials && missingCredentials.length > 0 && (_jsx(PagePanel, { variant: "padded", className: "mb-4 border border-warn/40 bg-warn-subtle", children: _jsxs("div", { className: "flex items-start justify-between gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsxs("p", { className: "text-sm font-semibold text-warn", children: ["Workflow needs ", missingCredentials.length, " credential", missingCredentials.length === 1 ? "" : "s"] }), _jsxs("p", { className: "text-xs text-muted", children: ["Connect", " ", missingCredentials
+                                                    .map((cred) => prettyCredName(cred.credType))
+                                                    .join(", "), " ", "to activate this workflow."] }), _jsx("div", { className: "mt-2 flex flex-wrap gap-2", children: missingCredentials.map((cred) => (_jsxs(Button, { size: "sm", variant: "outline", onClick: () => {
+                                                    setTab("settings");
+                                                    setMissingCredentials(null);
+                                                }, children: ["Connect ", prettyCredName(cred.credType), " \u2192"] }, cred.credType))) })] }), _jsx(Button, { variant: "ghost", size: "sm", className: "text-muted hover:text-txt", onClick: () => setMissingCredentials(null), children: "Dismiss" })] }) })), (pageNotice || combinedError) && (_jsx(PagePanel, { variant: "padded", className: "mb-4 border border-danger/20 bg-danger/5", children: _jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx("p", { className: "text-sm text-danger", children: pageNotice ?? combinedError }), pageNotice && (_jsx(Button, { variant: "ghost", size: "sm", className: "text-danger hover:bg-danger/10", onClick: () => setPageNotice(null), children: "Dismiss" }))] }) })), editorOpen || editingId || editingTaskId ? (editorMode === "task" || editingTaskId ? (_jsx(TaskForm, {})) : (_jsx(HeartbeatForm, { form: form, editingId: editingId, editorEnabled: editorEnabled, modalTitle: modalTitle, formError: formError, triggersSaving: triggersSaving, templateNotice: templateNotice, triggers: triggers, triggerRunsById: triggerRunsById, t: t, selectedTriggerId: editingId, setField: setField, setForm: setForm, setFormError: setFormError, closeEditor: closeEditor, onSubmit: onSubmitTrigger, onDelete: onDeleteTrigger, onRunSelectedTrigger: onRunSelectedTrigger, onToggleTriggerEnabled: onToggleTriggerEnabled, saveFormAsTemplate: saveFormAsTemplate, loadTriggerRuns: loadTriggerRuns, kickerLabelCreate: form.kind === "workflow" ? "New schedule" : "New task", kickerLabelEdit: form.kind === "workflow" ? "Edit schedule" : "Edit task", submitLabelCreate: form.kind === "workflow" ? "Create schedule" : "Create task", submitLabelEdit: form.kind === "workflow" ? "Save schedule" : "Save task" }))) : activeSubpage === "node-catalog" ? (_jsx(AutomationNodeCatalogPane, { nodes: automationNodes })) : showDashboard ? (_jsx(AutomationsDashboard, { items: ctx.allItems, onSelectItem: selectItem, onCreateTask: handleZeroStateNewTask, onCreateWorkflow: () => void createWorkflowDraft(), onDescribeAutomation: handleDescribeAutomation, onUseIdea: (idea) => {
+                            if (idea.kind === "workflow") {
+                                void createWorkflowDraft({
+                                    title: idea.label,
+                                    initialPrompt: idea.prompt,
+                                });
+                                return;
+                            }
+                            openSeededTask(idea);
+                        } })) : resolvedSelectedItem?.type === "automation_draft" ? (_jsx(AutomationDraftPane, { automation: resolvedSelectedItem, onSeedPrompt: (prompt) => prefillPageChat(prompt, { select: true }), onDeleteDraft: handleDeleteDraft })) : resolvedSelectedItem?.type === "n8n_workflow" ? (_jsx(WorkflowAutomationDetailPane, { automation: resolvedSelectedItem, n8nStatus: n8nStatus, workflowFetchError: workflowFetchError, workflowBusyId: workflowBusyId, workflowOpsBusy: workflowOpsBusy, onDeleteDraft: handleDeleteDraft, onDeleteWorkflow: handleDeleteWorkflow, onDuplicateWorkflow: handleDuplicateWorkflow, onGenerateWorkflow: handleGenerateWorkflow, onRefreshWorkflows: handleRefreshWorkflows, onScheduleWorkflow: handleScheduleWorkflow, onStartLocalN8n: handleStartLocalN8n, onToggleWorkflowActive: handleToggleWorkflowActive })) : resolvedSelectedItem?.trigger ? (_jsx(TriggerAutomationDetailPane, { automation: resolvedSelectedItem, onPromoteToWorkflow: promoteAutomationToWorkflow })) : resolvedSelectedItem?.task ? (_jsx(TaskAutomationDetailPane, { automation: resolvedSelectedItem, onPromoteToWorkflow: promoteAutomationToWorkflow })) : showFirstRunEmptyState ? (_jsx(AutomationsZeroState, { onBrowseTemplates: () => setTemplatesModalOpen(true), onNewTrigger: handleZeroStateNewTrigger, onNewTask: handleZeroStateNewTask })) : (_jsx("div", { className: "flex min-h-0 flex-1 items-center justify-center px-8 py-10 text-center", children: _jsx("div", { className: "space-y-3", children: _jsx("h3", { className: "text-lg font-semibold text-txt-strong", children: "Select a task or workflow" }) }) }))] }), _jsx(CreateAutomationDialog, { open: createDialogMode !== null, onOpenChange: (open) => {
+                    if (!open) {
+                        setCreateDialogMode(null);
+                    }
+                }, onCreateTask: () => {
+                    setCreateDialogMode(null);
+                    handleZeroStateNewTask();
+                }, onCreateWorkflow: () => {
+                    setCreateDialogMode(null);
+                    void createWorkflowDraft();
+                }, onDescribeAutomation: handleDescribeAutomation }), _jsx(WorkflowTemplatesModal, { open: templatesModalOpen, onOpenChange: setTemplatesModalOpen, onSelectTemplate: (seedPrompt) => void handleTemplateSelected(seedPrompt), onSelectCustom: () => {
+                    setTemplatesModalOpen(false);
+                    void createWorkflowDraft();
+                } })] }));
+}
+export function AutomationsView() {
+    const controller = useAutomationsViewController();
+    return (_jsx(AutomationsViewContext.Provider, { value: controller, children: _jsx(AutomationsLayout, {}) }));
+}
+export function AutomationsDesktopShell() {
+    const controller = useAutomationsViewController();
+    // Collapse the right-rail chat dock when no workflow / draft is
+    // selected. The Automations Overview page already has a centered hero
+    // compose ("Describe a task or workflow…") that's the canonical create
+    // surface; the bottom-right dock + hero showed two inputs at once and
+    // confused users. When a workflow or draft IS selected, the rail (and
+    // its PageScopedChatPane) opens so the user can edit/refine.
+    //
+    // Stay in CONTROLLED mode at all times. An earlier revision flipped
+    // between controlled (when nothing selected) and uncontrolled (when
+    // something selected); that left AppWorkspaceChrome's internal
+    // `internalCollapsed` stuck at `true` after the controlled phase, so
+    // the rail never opened on the first selection. Always-controlled
+    // avoids that transition entirely.
+    const hasScopedItem = controller.resolvedSelectedItem != null;
+    const [userCollapsedWhenSelected, setUserCollapsedWhenSelected] = useState(false);
+    // When the user clears the selection, also reset the toggle so the next
+    // selection starts with the rail open by default.
+    useEffect(() => {
+        if (!hasScopedItem)
+            setUserCollapsedWhenSelected(false);
+    }, [hasScopedItem]);
+    const chatCollapsed = hasScopedItem ? userCollapsedWhenSelected : true;
+    const handleToggleChat = useCallback((next) => {
+        // No-op when nothing is selected — the rail is force-closed in that
+        // state and the toggle button is hidden, so this should never fire.
+        if (hasScopedItem)
+            setUserCollapsedWhenSelected(next);
+    }, [hasScopedItem]);
+    return (_jsx(AutomationsViewContext.Provider, { value: controller, children: _jsx(AppWorkspaceChrome, { testId: "automations-workspace", chat: _jsx(AutomationsSidebarChat, { activeItem: controller.resolvedSelectedItem }), chatCollapsed: chatCollapsed, onToggleChat: handleToggleChat, hideCollapseButton: !hasScopedItem, main: _jsx("div", { className: "flex flex-col flex-1 min-h-0 min-w-0 overflow-hidden", children: _jsx(AutomationsLayout, {}) }) }) }));
+}