@agent-native/dispatch 0.32.0 → 0.33.0-nightly-20260831223557

package/src/components/automation-details-panel.tsx

@@ -1,11 +1,17 @@
+import { appPath } from "@agent-native/core/client/api-path";
+import { writeClipboardText } from "@agent-native/core/client/clipboard";
 import { useActionQuery } from "@agent-native/core/client/hooks";
+import { useT } from "@agent-native/core/client/i18n";
 import {
   IconAlertTriangle,
+  IconCheck,
+  IconCopy,
   IconClock,
   IconExternalLink,
   IconPlayerPause,
   IconPlayerPlay,
 } from "@tabler/icons-react";
+import { useState } from "react";
 import { Link } from "react-router";
 
 import {
@@ -107,6 +113,7 @@ export function AutomationDetailsPanel({
   isToggling = false,
   onToggle,
 }: AutomationDetailsPanelProps) {
+  const t = useT();
   const runsQuery = useActionQuery<AutomationRun[]>(
     "list-automation-runs",
     {
@@ -118,7 +125,18 @@ export function AutomationDetailsPanel({
   );
   const runs = runsQuery.data ?? [];
   const status = automationStatus(automation);
-  const isScheduled = automation.triggerType !== "event";
+  const isScheduled = automation.triggerType === "schedule";
+  const [copied, setCopied] = useState(false);
+  const webhookUrl =
+    automation.webhookPath && typeof window !== "undefined"
+      ? window.location.origin + appPath(automation.webhookPath)
+      : null;
+  const triggerLabel =
+    automation.triggerType === "webhook"
+      ? t("jobs.webhook", { defaultValue: "Webhook" })
+      : isScheduled
+        ? "Schedule"
+        : "Event";
   const prompt = automation.body?.trim();
   const hasExecutionTarget = Boolean(
     automation.executionHostId ||
@@ -156,8 +174,7 @@ export function AutomationDetailsPanel({
             {automation.name}
           </h2>
           <p className="mt-1 text-xs text-muted-foreground">
-            {isScheduled ? "Schedule" : "Event"} ·{" "}
-            {automationScopeLabel(automation)}
+            {triggerLabel} · {automationScopeLabel(automation)}
           </p>
         </div>
       </header>
@@ -183,7 +200,15 @@ export function AutomationDetailsPanel({
           <dl className="mt-3 grid grid-cols-2 gap-x-4 gap-y-4">
             <DetailField
               label="Trigger"
-              value={isScheduled ? "Scheduled" : "Event-triggered"}
+              value={
+                automation.triggerType === "webhook"
+                  ? t("jobs.webhookTrigger", {
+                      defaultValue: "Webhook-triggered",
+                    })
+                  : isScheduled
+                    ? "Scheduled"
+                    : "Event-triggered"
+              }
             />
             <DetailField
               label={isScheduled ? "Schedule" : "Event"}
@@ -204,6 +229,47 @@ export function AutomationDetailsPanel({
                 />
               </>
             ) : null}
+            {webhookUrl ? (
+              <div className="col-span-2 rounded-md border border-primary/20 bg-primary/5 p-3">
+                <div className="flex items-center justify-between gap-3">
+                  <span className="text-xs font-medium text-foreground">
+                    {t("jobs.webhookUrl", { defaultValue: "Webhook URL" })}
+                  </span>
+                  <Button
+                    type="button"
+                    variant="outline"
+                    size="sm"
+                    className="h-7 shrink-0 gap-1.5 text-xs"
+                    onClick={() => {
+                      void writeClipboardText(webhookUrl).then((didCopy) => {
+                        setCopied(didCopy);
+                        if (didCopy) {
+                          window.setTimeout(() => setCopied(false), 1800);
+                        }
+                      });
+                    }}
+                  >
+                    {copied ? (
+                      <IconCheck className="size-3.5" />
+                    ) : (
+                      <IconCopy className="size-3.5" />
+                    )}
+                    {copied
+                      ? t("common.copied", { defaultValue: "Copied" })
+                      : t("common.copy", { defaultValue: "Copy URL" })}
+                  </Button>
+                </div>
+                <code className="mt-2 block break-all text-[11px] leading-5 text-muted-foreground">
+                  {webhookUrl}
+                </code>
+                <p className="mt-2 text-xs text-muted-foreground">
+                  {t("jobs.webhookUrlHint", {
+                    defaultValue:
+                      "Paste this URL into a service that sends HTTP POST webhooks.",
+                  })}
+                </p>
+              </div>
+            ) : null}
             <DetailField
               label="Condition"
               value={automation.condition || "Always"}
@@ -218,14 +284,16 @@ export function AutomationDetailsPanel({
             />
             <DetailField label="Mode" value={automation.mode || "Agentic"} />
             <DetailField label="Runs as" value={runAsLabel(automation.runAs)} />
-            <DetailField
-              label="Next run"
-              value={
-                automation.enabled
-                  ? formatTimestamp(automation.nextRun)
-                  : "Paused"
-              }
-            />
+            {isScheduled ? (
+              <DetailField
+                label="Next run"
+                value={
+                  automation.enabled
+                    ? formatTimestamp(automation.nextRun)
+                    : "Paused"
+                }
+              />
+            ) : null}
             <DetailField
               label="Last run"
               value={formatTimestamp(automation.lastRun)}

package/src/hooks/use-navigation-state.spec.ts

@@ -97,6 +97,19 @@ describe("buildDispatchNavigationState", () => {
     });
   });
 
+  it("keeps the selected automation in application state", () => {
+    expect(
+      buildDispatchNavigationState(
+        "/automations",
+        "?automationId=personal%3Amorning-digest",
+      ),
+    ).toEqual({
+      view: "automations",
+      path: "/automations",
+      automationId: "personal:morning-digest",
+    });
+  });
+
   it("recognizes Admin routes without losing the underlying view", () => {
     expect(buildDispatchNavigationState("/admin/metrics")).toEqual({
       view: "metrics",

package/src/hooks/use-navigation-state.ts

@@ -42,6 +42,7 @@ export interface NavigationState {
   usageScope?: "me" | "workspace" | "app";
   usageUserEmail?: string;
   usageAppId?: string;
+  automationId?: string;
 }
 
 export function useNavigationState(extensions?: DispatchExtensionConfig) {
@@ -214,6 +215,11 @@ export function buildDispatchNavigationState(
     if (usageUserEmail) state.usageUserEmail = usageUserEmail;
   }
 
+  if (state.view === "automations") {
+    const automationId = new URLSearchParams(search).get("automationId");
+    if (automationId) state.automationId = automationId;
+  }
+
   return state;
 }
 

package/src/lib/automation-display.ts

@@ -33,6 +33,7 @@ export function automationTroubleshootPath(
 
 export function automationTarget(item: DispatchAutomationItem): string {
   if (item.triggerType === "event" && item.event) return item.event;
+  if (item.triggerType === "webhook") return "On webhook";
   if (item.scheduleDescription) return item.scheduleDescription;
   if (item.schedule) return item.schedule;
   return item.triggerType || "schedule";
@@ -72,6 +73,7 @@ export function automationLastCheck(item: DispatchAutomationItem): string {
 export function automationNextRun(item: DispatchAutomationItem): string {
   if (!item.enabled) return "paused";
   if (item.triggerType === "event") return "on event";
+  if (item.triggerType === "webhook") return "on webhook";
   return item.nextRun ? relativeRunTime(item.nextRun) : "not scheduled";
 }
 

package/src/lib/automations.ts

@@ -9,8 +9,9 @@ export interface DispatchAutomationItem {
   orgId?: string;
   scope?: "personal" | "organization";
   canUpdate?: boolean;
-  triggerType?: "schedule" | "event" | (string & {});
+  triggerType?: "schedule" | "event" | "webhook" | (string & {});
   event?: string;
+  webhookPath?: string;
   schedule?: string;
   scheduleDescription?: string;
   condition?: string;

package/src/routes/pages/automations.spec.tsx

@@ -64,7 +64,18 @@ vi.mock("@tanstack/react-query", () => ({
 }));
 
 vi.mock("@agent-native/core/client/hooks", () => ({
+  useActionMutation: () => ({
+    isPending: false,
+    mutate: vi.fn(),
+    reset: vi.fn(),
+    error: null,
+  }),
   useChangeVersions: () => 0,
+  useActionQuery: () => ({
+    data: [],
+    isLoading: false,
+    error: null,
+  }),
 }));
 
 vi.mock("@agent-native/core/client/agent-chat", () => ({

package/src/routes/pages/automations.tsx

@@ -1,5 +1,3 @@
-import { sendToAgentChat } from "@agent-native/core/client/agent-chat";
-import { PromptComposer } from "@agent-native/core/client/composer";
 import { useChangeVersions } from "@agent-native/core/client/hooks";
 import {
   IconFileSearch,
@@ -13,16 +11,12 @@ import { useMemo, useState } from "react";
 import { Link, useSearchParams } from "react-router";
 import { toast } from "sonner";
 
+import { AutomationCreateDialog } from "../../components/automation-create-dialog";
 import { AutomationDetailsPanel } from "../../components/automation-details-panel";
 import { DispatchShell } from "../../components/dispatch-shell";
 import { Badge } from "../../components/ui/badge";
 import { Button } from "../../components/ui/button";
 import { Input } from "../../components/ui/input";
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from "../../components/ui/popover";
 import {
   Select,
   SelectContent,
@@ -134,57 +128,24 @@ function useToggleAutomation() {
   });
 }
 
-function CreateAutomationButton() {
+function CreateAutomationButton({ onCreated }: { onCreated: () => void }) {
   const [open, setOpen] = useState(false);
-  const [scope, setScope] = useState<"personal" | "organization">("personal");
-
-  function handleSubmit(text: string) {
-    const trimmed = text.trim();
-    if (!trimmed) return;
-    window.dispatchEvent(
-      new CustomEvent("agent-panel:set-mode", {
-        detail: { mode: "chat" },
-      }),
-    );
-    sendToAgentChat({
-      message: trimmed,
-      context: `The user wants to create a new automation. Scope: ${scope}. Use manage-automations with action=define to create it. Ask clarifying questions if needed about what event to trigger on, conditions, and what actions to take.`,
-      submit: true,
-      newTab: true,
-    });
-    setOpen(false);
-  }
 
   return (
-    <Popover open={open} onOpenChange={setOpen}>
-      <PopoverTrigger asChild>
-        <Button size="sm">
-          <IconPlus size={14} />
-          New automation
-        </Button>
-      </PopoverTrigger>
-      <PopoverContent align="end" className="w-[min(100vw-2rem,24rem)] p-3">
-        <p className="pb-2 text-sm font-semibold text-foreground">
-          New automation
-        </p>
-        <PromptComposer
-          autoFocus
-          placeholder="Describe what you want to automate..."
-          draftScope="dispatch-automations:create"
-          onSubmit={handleSubmit}
-        />
-        <select
-          value={scope}
-          onChange={(event) =>
-            setScope(event.target.value as "personal" | "organization")
-          }
-          className="mt-2 w-full cursor-pointer rounded-md border border-input bg-background px-3 py-1.5 text-xs text-foreground"
-        >
-          <option value="personal">Personal</option>
-          <option value="organization">Organization</option>
-        </select>
-      </PopoverContent>
-    </Popover>
+    <>
+      <Button size="sm" onClick={() => setOpen(true)}>
+        <IconPlus size={14} />
+        New automation
+      </Button>
+      <AutomationCreateDialog
+        open={open}
+        onOpenChange={setOpen}
+        onCreated={() => {
+          setOpen(false);
+          onCreated();
+        }}
+      />
+    </>
   );
 }
 
@@ -194,6 +155,7 @@ export default function AutomationsRoute() {
   const [query, setQuery] = useState("");
   const automationsQuery = useAutomations();
   const toggleAutomation = useToggleAutomation();
+  const queryClient = useQueryClient();
   const automations = automationsQuery.data ?? [];
   const visibleAutomations = useMemo(
     () =>
@@ -215,6 +177,7 @@ export default function AutomationsRoute() {
         item.event,
         item.schedule,
         item.scheduleDescription,
+        item.webhookPath,
         item.body,
         item.model,
         item.domain,
@@ -259,7 +222,7 @@ export default function AutomationsRoute() {
   return (
     <DispatchShell
       title="Automations"
-      description="See scheduled and event-triggered jobs, inspect their checks and past runs, pause them, or ask the agent to create one."
+      description="Create schedule, webhook, or app-event automations, then inspect their checks and past runs."
     >
       <section className="flex flex-col gap-4">
         <div className="flex flex-wrap items-center justify-between gap-3">
@@ -304,7 +267,14 @@ export default function AutomationsRoute() {
                 <SelectItem value="all">All apps</SelectItem>
               </SelectContent>
             </Select>
-            <CreateAutomationButton />
+            <CreateAutomationButton
+              onCreated={() => {
+                toast.success("Automation created");
+                void queryClient.invalidateQueries({
+                  queryKey: AUTOMATIONS_QUERY_KEY,
+                });
+              }}
+            />
           </div>
         </div>
 

package/src/server/lib/mcp-gateway.spec.ts

@@ -415,14 +415,16 @@ describe("askGrantedDispatchMcpApp", () => {
           { type: "text", text: "Build a weekly active users dashboard." },
         ],
       },
-      {
+      expect.objectContaining({
         async: true,
+        deadlineMs: expect.any(Number),
+        idempotencyKey: expect.stringMatching(/^ask-app:/),
         metadata: {
           userEmail: "owner@example.test",
           orgDomain: "builder.io",
           requestOrigin: "http://localhost:8092",
         },
-      },
+      }),
     );
     expect(result).toMatchObject({
       app: "analytics",
@@ -433,6 +435,31 @@ describe("askGrantedDispatchMcpApp", () => {
     });
   });
 
+  it("reuses the MCP request identity for transport retries", async () => {
+    const requestContext = {
+      userEmail: "owner@example.test",
+      orgId: "org-1",
+      requestOrigin: "http://localhost:8092",
+      mcpRequestId: "session-1:request-42",
+    };
+
+    await runWithRequestContext(requestContext, () =>
+      askGrantedDispatchMcpApp("analytics", "Retry this request.", {
+        async: true,
+      }),
+    );
+    await runWithRequestContext(requestContext, () =>
+      askGrantedDispatchMcpApp("analytics", "Retry this request.", {
+        async: true,
+      }),
+    );
+
+    const firstKey = mocks.a2aSend.mock.calls[0]?.[1].idempotencyKey;
+    const secondKey = mocks.a2aSend.mock.calls[1]?.[1].idempotencyKey;
+    expect(firstKey).toMatch(/^ask-app:v1:[0-9a-f]{64}$/);
+    expect(secondKey).toBe(firstKey);
+  });
+
   it("preserves authenticated structured mutation receipts from the target app", async () => {
     const orgSecret = "org-receipt-secret";
     mocks.getOrgA2ASecret.mockResolvedValueOnce(orgSecret);
@@ -742,6 +769,14 @@ describe("askGrantedDispatchMcpApp", () => {
       message:
         'ask_app is still working. Call ask_app_status with taskId "task-working" to retrieve the final response.',
     });
+    expect(mocks.a2aSend).toHaveBeenCalledWith(
+      expect.anything(),
+      expect.objectContaining({
+        async: true,
+        deadlineMs: expect.any(Number),
+        idempotencyKey: expect.stringMatching(/^ask-app:/),
+      }),
+    );
   });
 
   it("counts submission and every poll against one inline deadline", async () => {

package/src/server/lib/mcp-gateway.ts

@@ -53,7 +53,8 @@ const TARGET_EMBED_SESSION_RETRY_BASE_MS = 250;
 const TARGET_EMBED_SESSION_CONNECT_TIMEOUT_MS = 90_000;
 const TARGET_EMBED_SESSION_BUDGET_MS = 95_000;
 const DISPATCH_ASK_APP_DEFAULT_INLINE_WAIT_MS = 20_000;
-const DISPATCH_ASK_APP_MAX_INLINE_WAIT_MS = 25_000;
+// Leave response headroom for the hosted MCP transport after the inline wait.
+const DISPATCH_ASK_APP_MAX_INLINE_WAIT_MS = 20_000;
 const DISPATCH_ASK_APP_POLL_INTERVAL_MS = 1_500;
 const DISPATCH_A2A_REQUEST_TIMEOUT_MS = 10_000;
 const DISPATCH_ASK_APP_STATUS_RETRY_DELAYS_MS = [250, 750, 1_500] as const;
@@ -98,6 +99,31 @@ function boundedDispatchAskAppWaitMs(raw: unknown): number {
   );
 }
 
+async function dispatchAskAppIdempotencyKey(
+  target: DispatchMcpAccessibleApp,
+  message: string,
+): Promise<string> {
+  const requestId = getRequestContext()?.mcpRequestId;
+  if (!requestId) return `ask-app:${globalThis.crypto.randomUUID()}`;
+
+  const digest = await globalThis.crypto.subtle.digest(
+    "SHA-256",
+    new TextEncoder().encode(
+      JSON.stringify({
+        requestId,
+        app: target.id,
+        targetUrl: target.url,
+        message,
+      }),
+    ),
+  );
+  let hex = "";
+  for (const byte of new Uint8Array(digest)) {
+    hex += byte.toString(16).padStart(2, "0");
+  }
+  return `ask-app:v1:${hex}`;
+}
+
 function isTerminalDispatchTask(task: Task): boolean {
   return DISPATCH_ASK_APP_TERMINAL_STATES.has(String(task.status.state));
 }
@@ -801,20 +827,31 @@ export async function askGrantedDispatchMcpApp(
       ? 0
       : boundedDispatchAskAppWaitMs(options?.maxWaitMs);
   const deadline = inlineWaitMs > 0 ? Date.now() + inlineWaitMs : undefined;
+  const submissionDeadline =
+    deadline ?? Date.now() + DISPATCH_A2A_REQUEST_TIMEOUT_MS;
 
   const { client, metadata } = await createDispatchA2AClient({
     targetUrl: target.url,
     userEmail,
     orgDomain: orgDomain ?? undefined,
     orgSecret: orgSecret ?? undefined,
-    deadline,
+    deadline: submissionDeadline,
   });
+  const idempotencyKey = await dispatchAskAppIdempotencyKey(
+    target,
+    trimmedMessage,
+  );
   const task = await client.send(
     {
       role: "user",
       parts: [{ type: "text", text: trimmedMessage }],
     },
-    { async: true, metadata },
+    {
+      async: true,
+      metadata,
+      idempotencyKey,
+      deadlineMs: submissionDeadline,
+    },
   );
   const finalOrRunning = await waitForDispatchA2ATask(client, task, deadline);
   return dispatchAskAppTaskResult(target.id, finalOrRunning, {