@jami-studio/dispatch 0.13.14

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

@@ -0,0 +1,295 @@
+import {
+  agentNativePath,
+  appBasePath,
+  appPath,
+  markAgentChatHomeHandoff,
+} from "@agent-native/core/client";
+import { extensionIdFromPathname } from "@agent-native/core/client/extensions";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { useEffect } from "react";
+import { useLocation, useNavigate } from "react-router";
+
+import type {
+  DispatchExtensionConfig,
+  DispatchNavItem,
+} from "../components/index.js";
+
+export interface NavigationState {
+  view: string;
+  path?: string;
+  extensionId?: string;
+  extensionSlug?: string;
+  dreamId?: string;
+  sourceId?: string;
+  query?: string;
+  threadId?: string;
+}
+
+export function useNavigationState(extensions?: DispatchExtensionConfig) {
+  const location = useLocation();
+  const navigate = useNavigate();
+  const qc = useQueryClient();
+
+  // Sync current route to application state
+  useEffect(() => {
+    const localPathname = routerPath(location.pathname);
+    const state = buildDispatchNavigationState(
+      localPathname,
+      location.search,
+      extensions,
+    );
+
+    fetch(agentNativePath("/_agent-native/application-state/navigation"), {
+      method: "PUT",
+      keepalive: true,
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify(state),
+    }).catch(() => {});
+  }, [extensions, location.pathname, location.search]);
+
+  // Listen for navigate commands from agent
+  const { data: navCommand } = useQuery({
+    queryKey: ["navigate-command"],
+    queryFn: async () => {
+      const res = await fetch(
+        agentNativePath("/_agent-native/application-state/navigate"),
+      );
+      if (!res.ok) return null;
+      const data = await res.json();
+      if (data) {
+        // Return with a timestamp to ensure uniqueness
+        return { ...data, _ts: Date.now() };
+      }
+      return null;
+    },
+    structuralSharing: false,
+  });
+
+  useEffect(() => {
+    if (!navCommand) return;
+    // Delete the one-shot command AFTER reading it
+    fetch(agentNativePath("/_agent-native/application-state/navigate"), {
+      method: "DELETE",
+      headers: { "X-Agent-Native-CSRF": "1" },
+    }).catch(() => {});
+    const cmd = navCommand as NavigationState;
+
+    // Navigate to a specific path or resolve view name to path
+    const resolvedPath =
+      cmd.path || resolvePath(cmd.view, extensions, cmd) || "/overview";
+    const path =
+      cmd.view === "dreams" && cmd.dreamId && !resolvedPath.includes("?")
+        ? `${resolvedPath}?dreamId=${encodeURIComponent(cmd.dreamId)}`
+        : resolvedPath;
+    const nextPath = routerPath(path);
+    if (
+      isChatPath(routerPath(location.pathname)) &&
+      !isChatPath(pathnameFromPath(nextPath))
+    ) {
+      markAgentChatHomeHandoff("dispatch");
+    }
+    navigate(nextPath);
+    qc.setQueryData(["navigate-command"], null);
+  }, [extensions, location.pathname, navCommand, navigate, qc]);
+}
+
+function pathnameFromPath(path: string): string {
+  return path.split(/[?#]/, 1)[0] || "/";
+}
+
+function isChatPath(pathname: string): boolean {
+  return pathname === "/chat" || pathname.startsWith("/chat/");
+}
+
+function threadIdFromPath(pathname: string): string | null {
+  const match = pathname.match(/^\/chat\/([^/]+)/);
+  if (!match) return null;
+  try {
+    const value = decodeURIComponent(match[1]).trim();
+    return value || null;
+  } catch {
+    return null;
+  }
+}
+
+export function buildDispatchNavigationState(
+  pathname: string,
+  search = "",
+  extensions?: DispatchExtensionConfig,
+): NavigationState {
+  const state: NavigationState = {
+    view: resolveView(pathname, extensions),
+    path: appPath(pathname),
+  };
+
+  const threadId = threadIdFromPath(pathname);
+  if (threadId) state.threadId = threadId;
+
+  const extensionId = extensionIdFromPathname(pathname);
+  if (extensionId) {
+    state.view = "extensions";
+    state.extensionId = extensionId;
+    const slug = extensionSlugFromPathname(pathname);
+    if (slug) state.extensionSlug = slug;
+    return state;
+  }
+
+  if (state.view === "dreams") {
+    const params = new URLSearchParams(search);
+    const dreamId = params.get("dreamId");
+    const sourceId = params.get("sourceId");
+    const query = params.get("query");
+    if (dreamId) state.dreamId = dreamId;
+    if (sourceId) state.sourceId = sourceId;
+    if (query) state.query = query;
+  }
+
+  return state;
+}
+
+function routerPath(path: string): string {
+  const basePath = appBasePath();
+  if (!basePath) return path;
+  let result = path;
+  // Iteratively strip basename. A path that arrives doubly-prefixed
+  // (e.g. "/dispatch/dispatch/overview", possibly from a stale link or a
+  // prior bug) would otherwise get partially stripped here and then
+  // re-prefixed by react-router's basename, restoring the bad URL.
+  for (let i = 0; i < 4; i += 1) {
+    if (result === basePath) return "/";
+    if (!result.startsWith(`${basePath}/`)) break;
+    result = result.slice(basePath.length) || "/";
+  }
+  return result;
+}
+
+function extensionItemMatchesPath(
+  item: DispatchNavItem,
+  pathname: string,
+): boolean {
+  if (item.match) {
+    try {
+      if (item.match(pathname)) return true;
+    } catch {
+      return false;
+    }
+  }
+  return pathname === item.to || pathname.startsWith(`${item.to}/`);
+}
+
+function resolveExtensionView(
+  pathname: string,
+  extensions?: DispatchExtensionConfig,
+): string | undefined {
+  return extensions?.navItems?.find((item) =>
+    extensionItemMatchesPath(item, pathname),
+  )?.id;
+}
+
+function resolveExtensionPath(
+  view: string | undefined,
+  extensions?: DispatchExtensionConfig,
+): string | undefined {
+  if (!view) return undefined;
+  return extensions?.navItems?.find((item) => item.id === view)?.to;
+}
+
+function resolveView(
+  pathname: string,
+  extensions?: DispatchExtensionConfig,
+): string {
+  const extensionView = resolveExtensionView(pathname, extensions);
+  if (extensionView) return extensionView;
+  if (pathname === "/extensions" || pathname.startsWith("/extensions/")) {
+    return "extensions";
+  }
+  if (pathname.startsWith("/chat")) return "chat";
+  if (pathname.startsWith("/apps")) return "apps";
+  if (pathname.startsWith("/metrics")) return "metrics";
+  if (pathname.startsWith("/new-app")) return "new-app";
+  if (pathname.startsWith("/vault")) return "vault";
+  if (pathname.startsWith("/integrations")) return "integrations";
+  if (pathname.startsWith("/workspace")) return "workspace";
+  if (pathname.startsWith("/agents")) return "agents";
+  if (pathname.startsWith("/messaging")) return "messaging";
+  if (pathname.startsWith("/destinations")) return "destinations";
+  if (pathname.startsWith("/identities")) return "identities";
+  if (pathname.startsWith("/approvals")) return "approvals";
+  if (pathname.startsWith("/automations")) return "automations";
+  if (pathname.startsWith("/audit")) return "audit";
+  if (pathname.startsWith("/dreams")) return "dreams";
+  if (pathname.startsWith("/thread-debug")) return "thread-debug";
+  if (pathname.startsWith("/team")) return "settings";
+  return "overview";
+}
+
+function resolvePath(
+  view?: string,
+  extensions?: DispatchExtensionConfig,
+  command?: Pick<NavigationState, "extensionId" | "threadId">,
+): string | undefined {
+  switch (view) {
+    case "chat":
+    case "ask":
+      return command?.threadId && command.threadId.trim()
+        ? `/chat/${encodeURIComponent(command.threadId.trim())}`
+        : "/chat";
+    case "overview":
+      return "/overview";
+    case "apps":
+      return "/apps";
+    case "metrics":
+    case "usage":
+      return "/metrics";
+    case "new-app":
+    case "create-app":
+      return "/new-app";
+    case "vault":
+    case "secrets":
+      return "/vault";
+    case "integrations":
+      return "/integrations";
+    case "workspace":
+    case "resources":
+      return "/workspace";
+    case "agents":
+      return "/agents";
+    case "messaging":
+      return "/messaging";
+    case "destinations":
+    case "routes":
+      return "/destinations";
+    case "identities":
+      return "/identities";
+    case "approvals":
+      return "/approvals";
+    case "automations":
+    case "jobs":
+      return "/automations";
+    case "audit":
+      return "/audit";
+    case "dreams":
+      return "/dreams";
+    case "thread-debug":
+    case "threads":
+      return "/thread-debug";
+    case "team":
+      return "/settings#organization";
+    case "extensions":
+      return command?.extensionId
+        ? `/extensions/${encodeURIComponent(command.extensionId)}`
+        : "/extensions";
+    default:
+      return resolveExtensionPath(view, extensions);
+  }
+}
+
+function extensionSlugFromPathname(pathname: string): string | undefined {
+  const match = pathname.match(/^\/extensions\/[^/]+\/([^/?#]+)/);
+  if (!match?.[1]) return undefined;
+  try {
+    return decodeURIComponent(match[1]);
+  } catch {
+    return match[1];
+  }
+}

package/src/hooks/use-toast.ts

@@ -0,0 +1,188 @@
+import * as React from "react";
+
+import type { ToastActionElement, ToastProps } from "../components/ui/toast";
+
+const TOAST_LIMIT = 1;
+const TOAST_REMOVE_DELAY = 1000000;
+
+type ToasterToast = ToastProps & {
+  id: string;
+  title?: React.ReactNode;
+  description?: React.ReactNode;
+  action?: ToastActionElement;
+};
+
+const actionTypes = {
+  ADD_TOAST: "ADD_TOAST",
+  UPDATE_TOAST: "UPDATE_TOAST",
+  DISMISS_TOAST: "DISMISS_TOAST",
+  REMOVE_TOAST: "REMOVE_TOAST",
+} as const;
+
+let count = 0;
+
+function genId() {
+  count = (count + 1) % Number.MAX_SAFE_INTEGER;
+  return count.toString();
+}
+
+type ActionType = typeof actionTypes;
+
+type Action =
+  | {
+      type: ActionType["ADD_TOAST"];
+      toast: ToasterToast;
+    }
+  | {
+      type: ActionType["UPDATE_TOAST"];
+      toast: Partial<ToasterToast>;
+    }
+  | {
+      type: ActionType["DISMISS_TOAST"];
+      toastId?: ToasterToast["id"];
+    }
+  | {
+      type: ActionType["REMOVE_TOAST"];
+      toastId?: ToasterToast["id"];
+    };
+
+interface State {
+  toasts: ToasterToast[];
+}
+
+const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>();
+
+const addToRemoveQueue = (toastId: string) => {
+  if (toastTimeouts.has(toastId)) {
+    return;
+  }
+
+  const timeout = setTimeout(() => {
+    toastTimeouts.delete(toastId);
+    dispatch({
+      type: "REMOVE_TOAST",
+      toastId: toastId,
+    });
+  }, TOAST_REMOVE_DELAY);
+
+  toastTimeouts.set(toastId, timeout);
+};
+
+export const reducer = (state: State, action: Action): State => {
+  switch (action.type) {
+    case "ADD_TOAST":
+      return {
+        ...state,
+        toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
+      };
+
+    case "UPDATE_TOAST":
+      return {
+        ...state,
+        toasts: state.toasts.map((t) =>
+          t.id === action.toast.id ? { ...t, ...action.toast } : t,
+        ),
+      };
+
+    case "DISMISS_TOAST": {
+      const { toastId } = action;
+
+      // ! Side effects ! - This could be extracted into a dismissToast() action,
+      // but I'll keep it here for simplicity
+      if (toastId) {
+        addToRemoveQueue(toastId);
+      } else {
+        state.toasts.forEach((toast) => {
+          addToRemoveQueue(toast.id);
+        });
+      }
+
+      return {
+        ...state,
+        toasts: state.toasts.map((t) =>
+          t.id === toastId || toastId === undefined
+            ? {
+                ...t,
+                open: false,
+              }
+            : t,
+        ),
+      };
+    }
+    case "REMOVE_TOAST":
+      if (action.toastId === undefined) {
+        return {
+          ...state,
+          toasts: [],
+        };
+      }
+      return {
+        ...state,
+        toasts: state.toasts.filter((t) => t.id !== action.toastId),
+      };
+  }
+};
+
+const listeners: Array<(state: State) => void> = [];
+
+let memoryState: State = { toasts: [] };
+
+function dispatch(action: Action) {
+  memoryState = reducer(memoryState, action);
+  listeners.forEach((listener) => {
+    listener(memoryState);
+  });
+}
+
+type Toast = Omit<ToasterToast, "id">;
+
+function toast({ ...props }: Toast) {
+  const id = genId();
+
+  const update = (props: ToasterToast) =>
+    dispatch({
+      type: "UPDATE_TOAST",
+      toast: { ...props, id },
+    });
+  const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id });
+
+  dispatch({
+    type: "ADD_TOAST",
+    toast: {
+      ...props,
+      id,
+      open: true,
+      onOpenChange: (open) => {
+        if (!open) dismiss();
+      },
+    },
+  });
+
+  return {
+    id: id,
+    dismiss,
+    update,
+  };
+}
+
+function useToast() {
+  const [state, setState] = React.useState<State>(memoryState);
+
+  React.useEffect(() => {
+    listeners.push(setState);
+    return () => {
+      const index = listeners.indexOf(setState);
+      if (index > -1) {
+        listeners.splice(index, 1);
+      }
+    };
+  }, [state]);
+
+  return {
+    ...state,
+    toast,
+    dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }),
+  };
+}
+
+export { useToast, toast };

package/src/index.ts

@@ -0,0 +1,19 @@
+/**
+ * @agent-native/dispatch — workspace control plane for agent-native apps.
+ *
+ * Most consumers import from one of the subpaths instead of this top-level
+ * entry, since each subpath has different runtime needs (server vs client):
+ *
+ *   import { dispatchRoutes } from "@agent-native/dispatch/routes";
+ *   import { setupDispatch } from "@agent-native/dispatch/server";
+ *   import { dispatchSchema, dispatchMigrations } from "@agent-native/dispatch/db";
+ *
+ * The top-level export only re-exports the universal config types so callers
+ * can write `DispatchConfig` once and reuse across server/client modules.
+ */
+
+export type {
+  DispatchConfig,
+  DispatchAuthConfig,
+  DispatchIntegrationsConfig,
+} from "./config.js";

package/src/lib/automation-display.spec.ts

@@ -0,0 +1,95 @@
+import { describe, expect, it } from "vitest";
+
+import {
+  automationIdentity,
+  automationNextRun,
+  automationStatus,
+  automationTarget,
+  sortAutomations,
+} from "./automation-display.js";
+import type { DispatchAutomationItem } from "./automations.js";
+
+function item(
+  overrides: Partial<DispatchAutomationItem> &
+    Pick<DispatchAutomationItem, "id" | "name" | "path" | "owner">,
+): DispatchAutomationItem {
+  return {
+    enabled: true,
+    ...overrides,
+  };
+}
+
+describe("automation-display", () => {
+  it("builds a stable owner:path identity", () => {
+    expect(
+      automationIdentity({ owner: "user@example.com", path: "jobs/digest.md" }),
+    ).toBe("user@example.com:jobs/digest.md");
+  });
+
+  it("prefers event names, then schedule descriptions", () => {
+    expect(
+      automationTarget(
+        item({
+          id: "1",
+          name: "Alert",
+          path: "jobs/alert.md",
+          owner: "user@example.com",
+          triggerType: "event",
+          event: "calendar.booking.created",
+        }),
+      ),
+    ).toBe("calendar.booking.created");
+
+    expect(
+      automationTarget(
+        item({
+          id: "2",
+          name: "Digest",
+          path: "jobs/digest.md",
+          owner: "user@example.com",
+          scheduleDescription: "Weekdays at 9am",
+          schedule: "0 9 * * 1-5",
+        }),
+      ),
+    ).toBe("Weekdays at 9am");
+  });
+
+  it("reports paused next-run and status for disabled automations", () => {
+    const paused = item({
+      id: "3",
+      name: "Paused",
+      path: "jobs/paused.md",
+      owner: "user@example.com",
+      enabled: false,
+      lastStatus: "success",
+    });
+    expect(automationNextRun(paused)).toBe("paused");
+    expect(automationStatus(paused)).toEqual({
+      label: "Paused",
+      tone: "muted",
+    });
+  });
+
+  it("sorts enabled errors ahead of healthy runs", () => {
+    const healthy = item({
+      id: "healthy",
+      name: "Healthy",
+      path: "jobs/healthy.md",
+      owner: "user@example.com",
+      lastStatus: "success",
+      lastRun: "2026-07-08T10:00:00.000Z",
+    });
+    const errored = item({
+      id: "error",
+      name: "Broken",
+      path: "jobs/broken.md",
+      owner: "user@example.com",
+      lastStatus: "error",
+      lastRun: "2026-07-08T09:00:00.000Z",
+    });
+    expect(sortAutomations([healthy, errored]).map((row) => row.id)).toEqual([
+      "error",
+      "healthy",
+    ]);
+  });
+});

package/src/lib/automation-display.ts

@@ -0,0 +1,70 @@
+import type { DispatchAutomationItem } from "./automations.js";
+
+export type AutomationStatusTone =
+  | "default"
+  | "success"
+  | "warning"
+  | "danger"
+  | "muted";
+
+export function automationIdentity(
+  item: Pick<DispatchAutomationItem, "owner" | "path">,
+): string {
+  return `${item.owner}:${item.path}`;
+}
+
+export function automationTarget(item: DispatchAutomationItem): string {
+  if (item.triggerType === "event" && item.event) return item.event;
+  if (item.scheduleDescription) return item.scheduleDescription;
+  if (item.schedule) return item.schedule;
+  return item.triggerType || "schedule";
+}
+
+export function relativeRunTime(value: string | null | undefined): string {
+  if (!value) return "never";
+  const timestamp = new Date(value).getTime();
+  if (!Number.isFinite(timestamp)) return "never";
+  const diff = timestamp - Date.now();
+  const abs = Math.abs(diff);
+  const suffix = diff >= 0 ? "from now" : "ago";
+  if (abs < 60_000) return diff >= 0 ? "soon" : "now";
+  if (abs < 3_600_000) return `${Math.floor(abs / 60_000)}m ${suffix}`;
+  if (abs < 86_400_000) return `${Math.floor(abs / 3_600_000)}h ${suffix}`;
+  return `${Math.floor(abs / 86_400_000)}d ${suffix}`;
+}
+
+export function automationLastRun(item: DispatchAutomationItem): string {
+  return item.lastRun ? relativeRunTime(item.lastRun) : "never";
+}
+
+export function automationNextRun(item: DispatchAutomationItem): string {
+  if (!item.enabled) return "paused";
+  if (item.triggerType === "event") return "on event";
+  return item.nextRun ? relativeRunTime(item.nextRun) : "not scheduled";
+}
+
+export function automationStatus(item: DispatchAutomationItem): {
+  label: string;
+  tone: AutomationStatusTone;
+} {
+  if (!item.enabled) return { label: "Paused", tone: "muted" };
+  if (item.lastStatus === "error") return { label: "Error", tone: "danger" };
+  if (item.lastStatus === "running")
+    return { label: "Running", tone: "warning" };
+  if (item.lastStatus === "skipped")
+    return { label: "Skipped", tone: "warning" };
+  if (item.lastStatus === "success")
+    return { label: "Healthy", tone: "success" };
+  return { label: "Ready", tone: "default" };
+}
+
+export function sortAutomations(
+  automations: DispatchAutomationItem[],
+): DispatchAutomationItem[] {
+  return [...automations].sort((a, b) => {
+    const aError = a.enabled && a.lastStatus === "error" ? 1 : 0;
+    const bError = b.enabled && b.lastStatus === "error" ? 1 : 0;
+    if (aError !== bError) return bError - aError;
+    return (b.lastRun || "").localeCompare(a.lastRun || "");
+  });
+}