@agent-native/dispatch 0.23.5 → 0.24.2

package/src/routes/pages/settings.tsx

@@ -10,6 +10,7 @@ import {
   SettingsTabsPage,
   useAgentSettingsTabs,
 } from "@agent-native/core/client/settings";
+import { IconShield } from "@tabler/icons-react";
 import { useState } from "react";
 import { Link } from "react-router";
 
@@ -25,6 +26,7 @@ import {
 } from "../../components/ui/card";
 import { Label } from "../../components/ui/label";
 import { Switch } from "../../components/ui/switch";
+import { dispatchAccessDescriptor } from "../../shared/app-roles.js";
 
 export function meta() {
   return [{ title: "Settings - Dispatch" }];
@@ -32,7 +34,30 @@ export function meta() {
 
 export default function SettingsRoute() {
   const t = useT();
-  const agentSettingsTabs = useAgentSettingsTabs();
+  const agentSettingsTabs = useAgentSettingsTabs({
+    usageAppId: "dispatch",
+    usageViewAllHref: "/admin/metrics",
+    organizationContent: (
+      <div className="mx-auto w-full max-w-3xl">
+        <TeamPage
+          showTitle={false}
+          appRoles={dispatchAccessDescriptor}
+          createOrgDescription="Set up a team to share dispatch destinations and approvals with your colleagues."
+        />
+      </div>
+    ),
+  });
+  const settingsTabs = [
+    ...agentSettingsTabs.filter((tab) => tab.id !== "integrations"),
+    {
+      id: "admin",
+      label: t("dispatch.nav.admin", { defaultValue: "Admin" }),
+      icon: IconShield,
+      group: "Admin",
+      href: "/admin",
+      content: null,
+    },
+  ];
   const [chatFirstModeState] = useState(() => readChatFirstModeState());
   const [chatFirstMode, setChatFirstMode] = useState(
     () => chatFirstModeState.enabled,
@@ -68,7 +93,7 @@ export default function SettingsRoute() {
       description={t("settings.description")}
     >
       <SettingsTabsPage
-        extraTabs={agentSettingsTabs.filter((tab) => tab.id !== "integrations")}
+        extraTabs={settingsTabs}
         general={
           <div className="mx-auto w-full max-w-3xl space-y-6">
             <Card>
@@ -160,14 +185,6 @@ export default function SettingsRoute() {
             </Card>
           </div>
         }
-        team={
-          <div className="mx-auto w-full max-w-3xl">
-            <TeamPage
-              showTitle={false}
-              createOrgDescription="Set up a team to share dispatch destinations and approvals with your colleagues."
-            />
-          </div>
-        }
         whatsNew={
           <div className="mx-auto w-full max-w-3xl">
             <ChangelogSettingsCard markdown={changelog} />

package/src/routes/pages/thread-debug.tsx

@@ -520,20 +520,18 @@ function ResultCard({
         selected ? "bg-accent/70" : "hover:bg-muted/50",
       )}
     >
-      <div className="flex items-start justify-between gap-3">
-        <div className="min-w-0">
-          <div className="truncate text-sm font-medium text-foreground">
-            {title}
-          </div>
-        </div>
-        <Badge variant="outline" className="shrink-0">
+      <div className="truncate text-sm font-medium text-foreground">
+        {title}
+      </div>
+      <div className="mt-1 flex flex-wrap items-center gap-x-2 gap-y-1 text-[11px] text-muted-foreground">
+        <span>
           {result.messageCount}{" "}
           {result.messageCount === 1 ? "message" : "messages"}
-        </Badge>
-      </div>
-      <div className="mt-2 flex items-center justify-between gap-3 text-[11px] text-muted-foreground">
+        </span>
+        <span aria-hidden="true">·</span>
         <span className="min-w-0 truncate">{result.ownerEmail}</span>
-        <span className="shrink-0">{formatRelativeDate(result.updatedAt)}</span>
+        <span aria-hidden="true">·</span>
+        <span>{formatRelativeDate(result.updatedAt)}</span>
       </div>
     </button>
   );
@@ -1621,31 +1619,6 @@ export default function ThreadDebugRoute() {
                   </SelectContent>
                 </Select>
               </div>
-              <div className="mt-3 flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
-                <span className="font-medium text-foreground">
-                  {failures.length} loaded{" "}
-                  {failures.length === 1 ? "run" : "runs"}
-                </span>
-                <span>·</span>
-                <span>
-                  {failuresData?.access?.scope ??
-                    t("dispatch.pages.threadDebugCurrentScope", {
-                      defaultValue: "current scope",
-                    })}
-                </span>
-                {failurePatterns.slice(0, 3).map((pattern) => (
-                  <Badge key={pattern.label} variant="outline">
-                    {pattern.count} {pattern.label}
-                  </Badge>
-                ))}
-                {failuresData?.partial ? (
-                  <Badge variant="outline">
-                    {t("dispatch.pages.threadDebugPartialResults", {
-                      defaultValue: "Partial results",
-                    })}
-                  </Badge>
-                ) : null}
-              </div>
               {unavailableFailureSources.length > 0 ? (
                 <div className="mt-2 flex items-start gap-1.5 text-xs text-muted-foreground">
                   <IconAlertTriangle className="mt-0.5 size-3.5 shrink-0" />
@@ -1662,6 +1635,15 @@ export default function ThreadDebugRoute() {
                   </span>
                 </div>
               ) : null}
+              {failuresData?.partial ? (
+                <div className="mt-2">
+                  <Badge variant="outline">
+                    {t("dispatch.pages.threadDebugPartialResults", {
+                      defaultValue: "Partial results",
+                    })}
+                  </Badge>
+                </div>
+              ) : null}
             </section>
 
             {failuresError ? (

package/src/routes/pages/vault.tsx

@@ -829,8 +829,13 @@ export default function VaultRoute() {
 
         <TabsContent value="secrets" className="mt-4 space-y-3">
           {!accessReady ? (
-            <div className="rounded-2xl border border-dashed px-6 py-12 text-center text-sm text-muted-foreground">
-              Checking workspace access…
+            <div className="space-y-3">
+              {Array.from({ length: 3 }).map((_, index) => (
+                <div key={index} className="rounded-lg bg-card px-4 py-4">
+                  <Skeleton className="h-4 w-1/3" />
+                  <Skeleton className="mt-2 h-3 w-2/3" />
+                </div>
+              ))}
             </div>
           ) : !canManageVault ? (
             <div className="rounded-2xl border border-dashed px-6 py-12 text-center">

package/src/routes/pages/workspace.tsx

@@ -67,7 +67,7 @@ import {
 } from "../../components/workspace-resource-impact-preview";
 
 export function meta() {
-  return [{ title: "Agent Resources — Dispatch" }];
+  return [{ title: "Resources — Dispatch" }];
 }
 
 const KIND_CONFIG = {
@@ -600,7 +600,11 @@ function EffectiveContextPreview({ resource }: { resource: any }) {
             organization/app override, then personal override.
           </p>
         </div>
-        <Badge variant="outline">{availabilityLabel(availability)}</Badge>
+        {isLoading ? (
+          <Skeleton className="h-6 w-24 rounded-full" />
+        ) : (
+          <Badge variant="outline">{availabilityLabel(availability)}</Badge>
+        )}
       </div>
 
       <div className="mt-3 grid gap-3 md:grid-cols-2">
@@ -881,14 +885,13 @@ function ResourceRow({ resource, grants }: { resource: any; grants: any[] }) {
   );
 }
 
-function GlobalContextSection({ resources }: { resources: any[] }) {
-  const byPath = new Map(
-    resources.map((resource) => [resource.path, resource]),
-  );
-  const missingPaths = STARTER_GLOBAL_CONTEXT.filter(
-    (item) => !byPath.has(item.path),
-  ).map((item) => item.path);
-  const presentCount = STARTER_GLOBAL_CONTEXT.length - missingPaths.length;
+function GlobalContextSection({
+  resources,
+  isLoading,
+}: {
+  resources: any[];
+  isLoading: boolean;
+}) {
   const restoreStarter = useActionMutation(
     "restore-starter-workspace-resources",
     {
@@ -905,6 +908,44 @@ function GlobalContextSection({ resources }: { resources: any[] }) {
     },
   );
 
+  if (isLoading && resources.length === 0) {
+    return (
+      <section className="space-y-3">
+        <div>
+          <Skeleton className="h-4 w-28" />
+          <Skeleton className="mt-2 h-3 w-full max-w-xl" />
+          <Skeleton className="mt-1.5 h-3 w-2/3 max-w-lg" />
+        </div>
+        <div className="overflow-hidden rounded-lg bg-card">
+          {Array.from({ length: STARTER_GLOBAL_CONTEXT.length }).map(
+            (_, index) => (
+              <div
+                key={index}
+                className="flex items-center gap-3 border-t px-4 py-3 first:border-t-0"
+              >
+                <Skeleton className="size-4 rounded-full" />
+                <div className="min-w-0 flex-1 space-y-1.5">
+                  <Skeleton className="h-4 w-28" />
+                  <Skeleton className="h-3 w-64 max-w-full" />
+                  <Skeleton className="h-3 w-40 max-w-full" />
+                </div>
+                <Skeleton className="h-6 w-16 rounded-full" />
+              </div>
+            ),
+          )}
+        </div>
+      </section>
+    );
+  }
+
+  const byPath = new Map(
+    resources.map((resource) => [resource.path, resource]),
+  );
+  const missingPaths = STARTER_GLOBAL_CONTEXT.filter(
+    (item) => !byPath.has(item.path),
+  ).map((item) => item.path);
+  const presentCount = STARTER_GLOBAL_CONTEXT.length - missingPaths.length;
+
   return (
     <section className="space-y-3">
       <div className="flex items-center justify-between gap-3">
@@ -938,35 +979,44 @@ function GlobalContextSection({ resources }: { resources: any[] }) {
           </Badge>
         </div>
       </div>
-      <div className="grid gap-3 md:grid-cols-2 xl:grid-cols-5">
+      <div className="overflow-hidden rounded-lg bg-card">
         {STARTER_GLOBAL_CONTEXT.map((item) => {
           const resource = byPath.get(item.path);
           const exists = !!resource;
           const global = resource?.scope === "all";
           return (
-            <div key={item.path} className="rounded-lg bg-card p-4">
-              <div className="flex items-start justify-between gap-3">
-                <div className="min-w-0">
-                  <div className="flex items-center gap-2">
-                    {exists ? (
-                      <IconCircleCheck
-                        size={15}
-                        className="shrink-0 text-green-600 dark:text-green-400"
-                      />
-                    ) : (
-                      <IconAlertCircle
-                        size={15}
-                        className="shrink-0 text-amber-600 dark:text-amber-400"
-                      />
-                    )}
-                    <h3 className="truncate text-sm font-medium text-foreground">
-                      {item.label}
-                    </h3>
-                  </div>
-                  <p className="mt-1 line-clamp-2 text-xs text-muted-foreground">
-                    {item.description}
-                  </p>
+            <div
+              key={item.path}
+              className="flex flex-wrap items-center gap-3 border-t px-4 py-3 first:border-t-0"
+            >
+              {exists ? (
+                <IconCircleCheck size={16} className="shrink-0 text-primary" />
+              ) : (
+                <IconAlertCircle
+                  size={16}
+                  className="shrink-0 text-amber-600 dark:text-amber-400"
+                />
+              )}
+              <div className="min-w-0 flex-1">
+                <div className="truncate text-sm font-medium text-foreground">
+                  {item.label}
+                </div>
+                <div className="mt-0.5 truncate text-xs text-muted-foreground">
+                  {item.description}
+                </div>
+                <div className="mt-1 truncate font-mono text-[11px] text-muted-foreground/80">
+                  {item.path}
                 </div>
+              </div>
+              <div className="flex items-center gap-1.5">
+                {exists ? (
+                  <Badge variant="outline">
+                    {global ? "All apps" : "Selected"}
+                  </Badge>
+                ) : null}
+                {resource && isAutoLoadedInstruction(resource) ? (
+                  <Badge variant="outline">Auto-loaded</Badge>
+                ) : null}
                 {resource ? (
                   <EditResourceDialog
                     resource={resource}
@@ -992,24 +1042,6 @@ function GlobalContextSection({ resources }: { resources: any[] }) {
                   </Button>
                 )}
               </div>
-              <div className="mt-3 space-y-2">
-                <div className="truncate font-mono text-[11px] text-muted-foreground">
-                  {item.path}
-                </div>
-                <div className="flex flex-wrap gap-1.5">
-                  <Badge variant={exists ? "secondary" : "outline"}>
-                    {exists ? "Present" : "Missing"}
-                  </Badge>
-                  {exists ? (
-                    <Badge variant="outline">
-                      {global ? "All apps" : "Selected"}
-                    </Badge>
-                  ) : null}
-                  {resource && isAutoLoadedInstruction(resource) ? (
-                    <Badge variant="outline">Auto-loaded</Badge>
-                  ) : null}
-                </div>
-              </div>
             </div>
           );
         })}
@@ -1086,7 +1118,7 @@ export default function WorkspaceRoute() {
 
   return (
     <DispatchShell
-      title="Agent Resources"
+      title="Resources"
       description="Manage inherited skills, guardrail instructions, agent profiles, reference resources, and MCP servers. All-app resources are available to every app without syncing."
     >
       {resourcesQuery.isError || grantsQuery.isError ? (
@@ -1111,13 +1143,10 @@ export default function WorkspaceRoute() {
         </div>
       </div>
 
-      {!resourcesQuery.isError ? (
-        <GlobalContextSection resources={resources || []} />
-      ) : null}
-
       {!resourcesQuery.isError && !grantsQuery.isError ? (
         <Tabs defaultValue="skills">
           <TabsList>
+            <TabsTrigger value="context">Global context</TabsTrigger>
             <TabsTrigger value="skills">
               Skills {skills.length > 0 && `(${skills.length})`}
             </TabsTrigger>
@@ -1136,6 +1165,13 @@ export default function WorkspaceRoute() {
             </TabsTrigger>
           </TabsList>
 
+          <TabsContent value="context" className="mt-4">
+            <GlobalContextSection
+              resources={resources || []}
+              isLoading={isLoading}
+            />
+          </TabsContent>
+
           <TabsContent value="skills" className="mt-4">
             <ResourceList
               items={skills}

package/src/server/index.ts

@@ -1,3 +1,4 @@
+import { defineAppRoles } from "@agent-native/core/org";
 import {
   registerPackageActions,
   type NitroPluginDef,
@@ -5,6 +6,9 @@ import {
 
 import { dispatchActions } from "../actions/index.js";
 import type { DispatchConfig } from "../config.js";
+import { dispatchAccessDescriptor } from "../shared/app-roles.js";
+
+defineAppRoles(dispatchAccessDescriptor);
 
 /**
  * Register dispatch's package-contributed actions on import. The framework's

package/src/server/lib/app-creation-store.spec.ts

@@ -3,6 +3,7 @@ import { afterEach, describe, expect, it, vi } from "vitest";
 
 import {
   generateWorkspaceAppDescription,
+  getAppCreationSettings,
   listAvailableWorkspaceTemplates,
   listWorkspaceApps,
   setAppCreationSettings,
@@ -46,7 +47,6 @@ const mocks = vi.hoisted(() => {
     })),
     ensureBuilderProject: vi.fn(),
     runBuilderAgent: vi.fn(),
-    resolveBuilderBranchProjectId: vi.fn(async () => ""),
     getBuilderBranchProjectId: vi.fn(() => ""),
     writeAppSecret: vi.fn(async () => "secret-id"),
     deleteAppSecret: vi.fn(async () => true),
@@ -86,8 +86,6 @@ vi.mock("@agent-native/core/server", async (importOriginal) => {
     ensureBuilderProject: (...args: any[]) =>
       mocks.ensureBuilderProject(...args),
     runBuilderAgent: (...args: any[]) => mocks.runBuilderAgent(...args),
-    resolveBuilderBranchProjectId: (...args: any[]) =>
-      mocks.resolveBuilderBranchProjectId(...args),
     getBuilderBranchProjectId: (...args: any[]) =>
       mocks.getBuilderBranchProjectId(...args),
   };
@@ -121,12 +119,50 @@ afterEach(() => {
     source: null,
     lookupFailed: false,
   });
-  mocks.resolveBuilderBranchProjectId.mockResolvedValue("");
   mocks.getBuilderBranchProjectId.mockReturnValue("");
   mocks.ensureBuilderProject.mockReset();
   globalThis.fetch = originalFetch;
 });
 
+describe("getAppCreationSettings", () => {
+  it("treats the Dispatch project as authoritative over the environment", async () => {
+    mocks.settings.set("dispatch-app-creation-settings:org:builder_io", {
+      builderProjectId: "dispatch-project",
+    });
+    vi.stubEnv("DISPATCH_BUILDER_PROJECT_ID", "stale-env-project");
+
+    const result = await runWithRequestContext(
+      { userEmail: "dev@example.test", orgId: "builder_io" },
+      () => getAppCreationSettings(),
+    );
+
+    expect(result).toMatchObject({
+      builderProjectId: "dispatch-project",
+      builderProjectIdSource: "dispatch",
+      envBuilderProjectId: "stale-env-project",
+    });
+  });
+
+  it("treats an explicit Dispatch null as disabled over the environment", async () => {
+    mocks.settings.set("dispatch-app-creation-settings:org:builder_io", {
+      builderProjectId: null,
+    });
+    vi.stubEnv("DISPATCH_BUILDER_PROJECT_ID", "stale-env-project");
+
+    const result = await runWithRequestContext(
+      { userEmail: "dev@example.test", orgId: "builder_io" },
+      () => getAppCreationSettings(),
+    );
+
+    expect(result).toMatchObject({
+      builderProjectId: null,
+      builderProjectIdSource: "dispatch",
+      envBuilderProjectId: "stale-env-project",
+      builderBranchingEnabled: false,
+    });
+  });
+});
+
 describe("listWorkspaceApps", () => {
   function stubNoPendingContext() {
     for (const key of [
@@ -399,9 +435,11 @@ describe("listWorkspaceApps", () => {
             name: "Todo Board",
           }),
       ),
-    ).rejects.toThrow(
-      "Only organization owners and admins can update app creation settings.",
-    );
+    ).rejects.toMatchObject({
+      message:
+        "Only organization owners and admins can update app creation settings.",
+      statusCode: 403,
+    });
     expect(
       mocks.settings.get("workspace-app-metadata:org:org-123"),
     ).toBeUndefined();
@@ -603,12 +641,11 @@ describe("startWorkspaceAppCreation", () => {
     expect(mocks.runBuilderAgent).toHaveBeenCalledWith(
       expect.objectContaining({ projectId: "project-provisioned" }),
     );
-    expect(mocks.writeAppSecret).toHaveBeenCalledWith(
-      expect.objectContaining({
-        key: "BUILDER_BRANCH_PROJECT_ID",
-        value: "project-provisioned",
-      }),
-    );
+    expect(mocks.settings.get(settingsKey)).toMatchObject({
+      builderProjectId: "project-provisioned",
+    });
+    expect(mocks.writeAppSecret).not.toHaveBeenCalled();
+    expect(mocks.deleteAppSecret).not.toHaveBeenCalled();
   });
 
   it("does not let an organization member persist an auto-provisioned project", async () => {
@@ -653,58 +690,68 @@ describe("setAppCreationSettings", () => {
     );
   }
 
-  it("stores the project id as an org-scoped credential so member apps resolve it", async () => {
+  it("stores the project id in the org-scoped Dispatch settings row", async () => {
     await save(projectId);
 
-    expect(mocks.writeAppSecret).toHaveBeenCalledWith(
-      expect.objectContaining({
-        key: "BUILDER_BRANCH_PROJECT_ID",
-        value: projectId,
-        scope: "org",
-        scopeId: orgId,
-      }),
+    expect(
+      mocks.settings.get("dispatch-app-creation-settings:org:builder_io"),
+    ).toEqual({ builderProjectId: projectId });
+    expect(mocks.putSetting).toHaveBeenCalledWith(
+      "dispatch-app-creation-settings:org:builder_io",
+      { builderProjectId: projectId },
     );
     expect(mocks.deleteAppSecret).not.toHaveBeenCalled();
+    expect(mocks.writeAppSecret).not.toHaveBeenCalled();
   });
 
-  it("scopes the credential to one organization rather than every tenant", async () => {
+  it("scopes the settings row to one organization rather than every tenant", async () => {
     await save(projectId);
 
-    const [args] = mocks.writeAppSecret.mock.calls.at(-1) as [
-      { scope: string; scopeId: string },
-    ];
-    expect(args.scope).not.toBe("user");
-    expect(args.scopeId).toBe(orgId);
+    expect(mocks.putSetting.mock.calls.at(-1)?.[0]).toBe(
+      "dispatch-app-creation-settings:org:builder_io",
+    );
+    expect(mocks.putSetting.mock.calls.at(-1)?.[0]).not.toContain(":user:");
+    expect(mocks.writeAppSecret).not.toHaveBeenCalled();
   });
 
-  it("falls back to a solo workspace scope when there is no active org", async () => {
+  it("uses a user-scoped settings row when there is no active org", async () => {
     await save(projectId, { userEmail: "dev@example.test" });
 
-    expect(mocks.writeAppSecret).toHaveBeenCalledWith(
-      expect.objectContaining({
-        scope: "workspace",
-        scopeId: "solo:dev@example.test",
-      }),
-    );
+    expect(mocks.settings.get(settingsKey)).toEqual({
+      builderProjectId: projectId,
+    });
+    expect(mocks.putSetting).toHaveBeenCalledWith(settingsKey, {
+      builderProjectId: projectId,
+    });
+    expect(mocks.writeAppSecret).not.toHaveBeenCalled();
   });
 
-  it("removes the credential when the project id is cleared", async () => {
+  it("persists an explicit null when the project id is cleared", async () => {
     await save(null);
 
-    expect(mocks.deleteAppSecret).toHaveBeenCalledWith({
-      key: "BUILDER_BRANCH_PROJECT_ID",
-      scope: "org",
-      scopeId: orgId,
-    });
+    expect(
+      mocks.settings.get("dispatch-app-creation-settings:org:builder_io"),
+    ).toEqual({ builderProjectId: null });
+    expect(mocks.putSetting).toHaveBeenCalledWith(
+      "dispatch-app-creation-settings:org:builder_io",
+      { builderProjectId: null },
+    );
+    expect(mocks.deleteAppSecret).not.toHaveBeenCalled();
     expect(mocks.writeAppSecret).not.toHaveBeenCalled();
   });
 
-  it("does not save the setting when the credential write fails", async () => {
+  it("never consults the project secret store when saving settings", async () => {
     mocks.writeAppSecret.mockRejectedValueOnce(
       new Error("credential store down"),
     );
 
-    await expect(save(projectId)).rejects.toThrow("credential store down");
-    expect(mocks.putSetting).not.toHaveBeenCalled();
+    await expect(save(projectId)).resolves.toMatchObject({
+      builderProjectId: projectId,
+    });
+    expect(
+      mocks.settings.get("dispatch-app-creation-settings:org:builder_io"),
+    ).toEqual({ builderProjectId: projectId });
+    expect(mocks.writeAppSecret).not.toHaveBeenCalled();
+    expect(mocks.deleteAppSecret).not.toHaveBeenCalled();
   });
 });