@agent-native/dispatch 0.2.11 → 0.2.13

package/src/components/workspace-app-card.tsx

@@ -0,0 +1,85 @@
+import { IconArrowUpRight, IconClockHour4 } from "@tabler/icons-react";
+import { AppKeysPopover } from "@/components/app-keys-popover";
+import { Badge } from "@/components/ui/badge";
+import { cn } from "@/lib/utils";
+import {
+  isPendingBuilderHref,
+  workspaceAppHref,
+  type WorkspaceAppSummary,
+} from "@/lib/workspace-apps";
+
+export function WorkspaceAppCard({
+  app,
+  className,
+}: {
+  app: WorkspaceAppSummary;
+  className?: string;
+}) {
+  const href = workspaceAppHref(app);
+  const openInNewTab = isPendingBuilderHref(app);
+
+  return (
+    <div
+      aria-disabled={!href}
+      className={cn(
+        "group relative rounded-lg border bg-card p-4 transition hover:border-foreground/30 aria-disabled:opacity-60",
+        className,
+      )}
+    >
+      {href ? (
+        <a
+          href={href}
+          target={openInNewTab ? "_blank" : undefined}
+          rel={openInNewTab ? "noreferrer" : undefined}
+          aria-label={`Open ${app.name}`}
+          className="absolute inset-0 z-0 rounded-lg"
+        />
+      ) : null}
+
+      <div className="pointer-events-none relative z-10 flex h-full items-start justify-between gap-3">
+        <div className="min-w-0">
+          <div className="flex min-w-0 items-center gap-2">
+            <h3 className="truncate text-sm font-semibold text-foreground">
+              {app.name}
+            </h3>
+            {app.status === "pending" ? (
+              <Badge
+                variant="outline"
+                className="shrink-0 gap-1 border-amber-500/30 bg-amber-500/10 text-amber-700 dark:text-amber-300"
+              >
+                <IconClockHour4 size={12} />
+                Building
+              </Badge>
+            ) : null}
+          </div>
+          <p className="mt-1 truncate font-mono text-xs text-muted-foreground">
+            {app.path}
+          </p>
+          {app.status === "pending" && app.branchName ? (
+            <p className="mt-1 truncate text-xs text-muted-foreground">
+              Branch: {app.branchName}
+            </p>
+          ) : null}
+          {app.description ? (
+            <p className="mt-2 line-clamp-2 text-xs leading-relaxed text-muted-foreground">
+              {app.description}
+            </p>
+          ) : null}
+        </div>
+        <div className="flex shrink-0 items-center gap-1">
+          {app.status === "ready" ? (
+            <div className="pointer-events-auto">
+              <AppKeysPopover appId={app.id} appName={app.name} />
+            </div>
+          ) : null}
+          {href ? (
+            <IconArrowUpRight
+              size={16}
+              className="text-muted-foreground transition group-hover:text-foreground"
+            />
+          ) : null}
+        </div>
+      </div>
+    </div>
+  );
+}

package/src/db/schema.ts

@@ -130,13 +130,13 @@ export const vaultAuditLog = table("vault_audit_log", {
   createdAt: integer("created_at").notNull(),
 });
 
-// ─── Workspace Resources: shared skills, instructions, agents ──────
+// ─── Workspace Resources: shared skills, instructions, agents, knowledge ──────
 
 export const workspaceResources = table("workspace_resources", {
   id: text("id").primaryKey(),
   ownerEmail: text("owner_email").notNull(),
   orgId: text("org_id"),
-  kind: text("kind").notNull(), // "skill" | "instruction" | "agent"
+  kind: text("kind").notNull(), // "skill" | "instruction" | "agent" | "knowledge"
   name: text("name").notNull(),
   description: text("description"),
   path: text("path").notNull(), // resource path, e.g. "skills/designer.md"

package/src/lib/workspace-apps.ts

@@ -0,0 +1,21 @@
+export interface WorkspaceAppSummary {
+  id: string;
+  name: string;
+  description?: string;
+  path: string;
+  url?: string | null;
+  isDispatch?: boolean;
+  status?: "ready" | "pending";
+  statusLabel?: string;
+  builderUrl?: string | null;
+  branchName?: string | null;
+}
+
+export function workspaceAppHref(app: WorkspaceAppSummary): string | null {
+  if (app.status === "pending") return app.builderUrl || null;
+  return app.path || app.url || null;
+}
+
+export function isPendingBuilderHref(app: WorkspaceAppSummary): boolean {
+  return app.status === "pending" && !!app.builderUrl;
+}

package/src/routes/pages/apps.$appId.tsx

@@ -9,23 +9,10 @@ import {
 import { DispatchShell } from "@/components/dispatch-shell";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
-
-interface WorkspaceAppSummary {
-  id: string;
-  name: string;
-  description?: string;
-  path: string;
-  url?: string | null;
-  status?: "ready" | "pending";
-  statusLabel?: string;
-  builderUrl?: string | null;
-  branchName?: string | null;
-}
-
-function workspaceAppHref(app: WorkspaceAppSummary): string | null {
-  if (app.status === "pending") return app.builderUrl || null;
-  return app.path || app.url || null;
-}
+import {
+  workspaceAppHref,
+  type WorkspaceAppSummary,
+} from "@/lib/workspace-apps";
 
 export function meta() {
   return [{ title: "Workspace app - Dispatch" }];

package/src/routes/pages/apps.tsx

@@ -1,37 +1,10 @@
 import { useActionQuery } from "@agent-native/core/client";
-import {
-  IconArrowUpRight,
-  IconApps,
-  IconClockHour4,
-  IconPlus,
-} from "@tabler/icons-react";
-import { AppKeysPopover } from "@/components/app-keys-popover";
+import { IconApps, IconPlus } from "@tabler/icons-react";
 import { CreateAppPopover } from "@/components/create-app-popover";
 import { DispatchShell } from "@/components/dispatch-shell";
-import { Badge } from "@/components/ui/badge";
+import { WorkspaceAppCard } from "@/components/workspace-app-card";
 import { Button } from "@/components/ui/button";
-
-interface WorkspaceAppSummary {
-  id: string;
-  name: string;
-  description?: string;
-  path: string;
-  url?: string | null;
-  isDispatch: boolean;
-  status?: "ready" | "pending";
-  statusLabel?: string;
-  builderUrl?: string | null;
-  branchName?: string | null;
-}
-
-function workspaceAppHref(app: WorkspaceAppSummary): string | null {
-  if (app.status === "pending") return app.builderUrl || null;
-  return app.path || app.url || null;
-}
-
-function isPendingBuilderHref(app: WorkspaceAppSummary): boolean {
-  return app.status === "pending" && !!app.builderUrl;
-}
+import type { WorkspaceAppSummary } from "@/lib/workspace-apps";
 
 export function meta() {
   return [{ title: "Apps — Dispatch" }];
@@ -94,65 +67,9 @@ export default function AppsRoute() {
           </div>
 
           <div className="grid gap-3 md:grid-cols-2 xl:grid-cols-3">
-            {typedApps.map((app) => {
-              const href = workspaceAppHref(app);
-              // Pending Builder branches live on a different host; open
-              // those in a new tab. Ready workspace apps stay in-window
-              // so the cards work inside the Builder webview, where new
-              // tabs would escape to the host browser.
-              const openInNewTab = isPendingBuilderHref(app);
-              return (
-                <a
-                  key={app.id}
-                  href={href ?? undefined}
-                  target={openInNewTab ? "_blank" : undefined}
-                  rel={openInNewTab ? "noreferrer" : undefined}
-                  aria-disabled={!href}
-                  className="group rounded-lg border bg-card p-4 transition hover:border-foreground/30 aria-disabled:pointer-events-none aria-disabled:opacity-60"
-                >
-                  <div className="flex items-start justify-between gap-3">
-                    <div className="min-w-0">
-                      <div className="flex min-w-0 items-center gap-2">
-                        <h3 className="truncate text-sm font-semibold text-foreground">
-                          {app.name}
-                        </h3>
-                        {app.status === "pending" ? (
-                          <Badge
-                            variant="outline"
-                            className="shrink-0 gap-1 border-amber-500/30 bg-amber-500/10 text-amber-700 dark:text-amber-300"
-                          >
-                            <IconClockHour4 size={12} />
-                            Building
-                          </Badge>
-                        ) : null}
-                      </div>
-                      <p className="mt-1 truncate font-mono text-xs text-muted-foreground">
-                        {app.path}
-                      </p>
-                      {app.status === "pending" && app.branchName ? (
-                        <p className="mt-1 truncate text-xs text-muted-foreground">
-                          Branch: {app.branchName}
-                        </p>
-                      ) : null}
-                      {app.description ? (
-                        <p className="mt-2 line-clamp-2 text-xs leading-relaxed text-muted-foreground">
-                          {app.description}
-                        </p>
-                      ) : null}
-                    </div>
-                    <div className="flex shrink-0 items-center gap-1">
-                      {app.status === "ready" ? (
-                        <AppKeysPopover appId={app.id} appName={app.name} />
-                      ) : null}
-                      <IconArrowUpRight
-                        size={16}
-                        className="text-muted-foreground transition group-hover:text-foreground"
-                      />
-                    </div>
-                  </div>
-                </a>
-              );
-            })}
+            {typedApps.map((app) => (
+              <WorkspaceAppCard key={app.id} app={app} />
+            ))}
 
             <CreateAppPopover />
           </div>

package/src/routes/pages/overview.tsx

@@ -21,11 +21,10 @@ import {
   IconShieldCheck,
   type IconProps,
 } from "@tabler/icons-react";
-import { AppKeysPopover } from "@/components/app-keys-popover";
 import { CreateAppPopover } from "@/components/create-app-popover";
 import { DispatchShell } from "@/components/dispatch-shell";
+import { WorkspaceAppCard } from "@/components/workspace-app-card";
 import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert";
-import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
 import { Skeleton } from "@/components/ui/skeleton";
 import {
@@ -34,6 +33,7 @@ import {
   TooltipTrigger,
 } from "@/components/ui/tooltip";
 import { submitOverviewPrompt } from "@/lib/overview-chat";
+import type { WorkspaceAppSummary } from "@/lib/workspace-apps";
 
 interface IntegrationStatus {
   platform: string;
@@ -67,28 +67,6 @@ const ZERO_TASK_QUEUE_STATS: TaskQueueStats = {
   recent_failures: [],
 };
 
-interface WorkspaceAppSummary {
-  id: string;
-  name: string;
-  description?: string;
-  path: string;
-  url?: string | null;
-  isDispatch: boolean;
-  status?: "ready" | "pending";
-  statusLabel?: string;
-  builderUrl?: string | null;
-  branchName?: string | null;
-}
-
-function workspaceAppHref(app: WorkspaceAppSummary): string | null {
-  if (app.status === "pending") return app.builderUrl || null;
-  return app.path || app.url || null;
-}
-
-function isPendingBuilderHref(app: WorkspaceAppSummary): boolean {
-  return app.status === "pending" && !!app.builderUrl;
-}
-
 const HOME_CHAT_SUGGESTIONS = [
   "Create a lightweight customer onboarding app",
   "Ask Slides to draft a board update from our latest metrics",
@@ -186,66 +164,9 @@ function WorkspaceAppsSection({
           ? Array.from({ length: 6 }).map((_, index) => (
               <AppCardSkeleton key={index} />
             ))
-          : visibleApps.map((app) => {
-              const href = workspaceAppHref(app);
-              // Pending Builder branches live on a different host (Builder
-              // editor URL); open those in a new tab. Ready workspace apps
-              // navigate the current window so this works inside the
-              // Builder webview, where new tabs would try to open in the
-              // host browser and break the embedded session.
-              const openInNewTab = isPendingBuilderHref(app);
-              return (
-                <a
-                  key={app.id}
-                  href={href ?? undefined}
-                  target={openInNewTab ? "_blank" : undefined}
-                  rel={openInNewTab ? "noreferrer" : undefined}
-                  aria-disabled={!href}
-                  className="group min-h-32 rounded-lg border bg-card p-4 transition hover:border-foreground/30 aria-disabled:pointer-events-none aria-disabled:opacity-60"
-                >
-                  <div className="flex h-full items-start justify-between gap-3">
-                    <div className="min-w-0">
-                      <div className="flex min-w-0 items-center gap-2">
-                        <h3 className="truncate text-sm font-semibold text-foreground">
-                          {app.name}
-                        </h3>
-                        {app.status === "pending" ? (
-                          <Badge
-                            variant="outline"
-                            className="shrink-0 gap-1 border-amber-500/30 bg-amber-500/10 text-amber-700 dark:text-amber-300"
-                          >
-                            <IconClockHour4 size={12} />
-                            Building
-                          </Badge>
-                        ) : null}
-                      </div>
-                      <p className="mt-1 truncate font-mono text-xs text-muted-foreground">
-                        {app.path}
-                      </p>
-                      {app.status === "pending" && app.branchName ? (
-                        <p className="mt-1 truncate text-xs text-muted-foreground">
-                          Branch: {app.branchName}
-                        </p>
-                      ) : null}
-                      {app.description ? (
-                        <p className="mt-2 line-clamp-2 text-xs leading-relaxed text-muted-foreground">
-                          {app.description}
-                        </p>
-                      ) : null}
-                    </div>
-                    <div className="flex shrink-0 items-center gap-1">
-                      {app.status === "ready" ? (
-                        <AppKeysPopover appId={app.id} appName={app.name} />
-                      ) : null}
-                      <IconArrowUpRight
-                        size={16}
-                        className="text-muted-foreground transition group-hover:text-foreground"
-                      />
-                    </div>
-                  </div>
-                </a>
-              );
-            })}
+          : visibleApps.map((app) => (
+              <WorkspaceAppCard key={app.id} app={app} className="min-h-32" />
+            ))}
 
         {!showSkeletons ? <CreateAppPopover /> : null}
       </div>

package/src/routes/pages/workspace.tsx

@@ -6,6 +6,7 @@ import {
   IconChevronDown,
   IconChevronRight,
   IconCode,
+  IconFileText,
   IconPlus,
   IconRefresh,
   IconTrash,
@@ -72,6 +73,13 @@ const KIND_CONFIG = {
     description:
       "Reusable agent profiles — specialist agents shared across apps",
   },
+  knowledge: {
+    label: "Knowledge",
+    icon: IconFileText,
+    pathPrefix: "context/",
+    description:
+      "Knowledge packs — reusable GTM, product, and domain context for apps",
+  },
 } as const;
 
 function AddResourceDialog() {
@@ -127,6 +135,7 @@ function AddResourceDialog() {
                   <SelectItem value="skill">Skill</SelectItem>
                   <SelectItem value="instruction">Instruction</SelectItem>
                   <SelectItem value="agent">Agent</SelectItem>
+                  <SelectItem value="knowledge">Knowledge pack</SelectItem>
                 </SelectContent>
               </Select>
             </div>
@@ -151,7 +160,9 @@ function AddResourceDialog() {
                   ? "Frontend Designer"
                   : kind === "agent"
                     ? "Research Specialist"
-                    : "Code Style Guide"
+                    : kind === "knowledge"
+                      ? "Core GTM Messaging"
+                      : "Code Style Guide"
               }
               value={name}
               onChange={(e) => setName(e.target.value)}
@@ -167,7 +178,7 @@ function AddResourceDialog() {
             />
             <p className="text-xs text-muted-foreground">
               Resource path in target apps. Skills go in skills/, agents in
-              agents/.
+              agents/, knowledge packs in context/.
             </p>
           </div>
           <div className="space-y-2">
@@ -186,7 +197,9 @@ function AddResourceDialog() {
                   ? "---\nname: my-skill\ndescription: What this skill teaches\n---\n\n# My Skill\n\n..."
                   : kind === "agent"
                     ? "---\nname: Research Specialist\ndescription: Handles research tasks\n---\n\n# Instructions\n\n..."
-                    : "# Instructions\n\nBehavioral rules and guidance for agents across apps..."
+                    : kind === "knowledge"
+                      ? "# Core GTM Messaging\n\n## Positioning\n\n## ICP\n\n## Proof points\n\n## Source\n\n"
+                      : "# Instructions\n\nBehavioral rules and guidance for agents across apps..."
               }
               value={content}
               onChange={(e) => setContent(e.target.value)}
@@ -199,7 +212,7 @@ function AddResourceDialog() {
           <Button
             onClick={() =>
               create.mutate({
-                kind: kind as "skill" | "instruction" | "agent",
+                kind: kind as "skill" | "instruction" | "agent" | "knowledge",
                 name,
                 description: description || undefined,
                 path:
@@ -504,6 +517,9 @@ export default function WorkspaceRoute() {
     (r: any) => r.kind === "instruction",
   );
   const agents = (resources || []).filter((r: any) => r.kind === "agent");
+  const knowledge = (resources || []).filter(
+    (r: any) => r.kind === "knowledge",
+  );
 
   function ResourceList({
     items,
@@ -535,7 +551,7 @@ export default function WorkspaceRoute() {
   return (
     <DispatchShell
       title="Workspace Resources"
-      description="Share skills, instructions, and agent profiles across workspace apps. Scope to all apps or grant per-app."
+      description="Share skills, instructions, agent profiles, and knowledge packs across workspace apps. Scope to all apps or grant per-app."
     >
       <div className="flex items-center justify-between">
         <div className="text-sm text-muted-foreground">
@@ -570,6 +586,9 @@ export default function WorkspaceRoute() {
           <TabsTrigger value="agents">
             Agents {agents.length > 0 && `(${agents.length})`}
           </TabsTrigger>
+          <TabsTrigger value="knowledge">
+            Knowledge {knowledge.length > 0 && `(${knowledge.length})`}
+          </TabsTrigger>
         </TabsList>
 
         <TabsContent value="skills" className="mt-4">
@@ -592,6 +611,13 @@ export default function WorkspaceRoute() {
             emptyText="No workspace agents yet. Add a reusable agent profile to share specialist agents across apps."
           />
         </TabsContent>
+
+        <TabsContent value="knowledge" className="mt-4">
+          <ResourceList
+            items={knowledge}
+            emptyText="No knowledge packs yet. Add GTM, product, or domain context that apps can reuse."
+          />
+        </TabsContent>
       </Tabs>
     </DispatchShell>
   );

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

@@ -20,6 +20,11 @@ import {
 } from "./dispatch-store.js";
 import { identityKeyForIncoming } from "./dispatch-integrations.js";
 import { createRequest, listSecrets } from "./vault-store.js";
+import {
+  grantWorkspaceResourcesToApp,
+  listWorkspaceResourceOptions,
+  type WorkspaceResourceOption,
+} from "./workspace-resources-store.js";
 
 const SETTINGS_KEY = "dispatch-app-creation-settings";
 const WORKSPACE_APPS_ENV_KEY = "AGENT_NATIVE_WORKSPACE_APPS_JSON";
@@ -827,6 +832,7 @@ function buildWorkspaceAppPrompt(input: {
   appId?: string | null;
   template?: string | null;
   selectedKeys?: string[];
+  selectedResources?: WorkspaceResourceOption[];
 }): { appId: string; prompt: string } {
   const appId =
     slugify(input.appId || "") ||
@@ -835,6 +841,15 @@ function buildWorkspaceAppPrompt(input: {
     ) ||
     "new-app";
   const selectedKeys = input.selectedKeys || [];
+  const selectedResources = input.selectedResources || [];
+  const resourceList = selectedResources.length
+    ? selectedResources
+        .map(
+          (resource) =>
+            `- ${resource.name} (${resource.kind}, ${resource.path})`,
+        )
+        .join("\n")
+    : "none";
   return {
     appId,
     prompt: [
@@ -846,11 +861,18 @@ function buildWorkspaceAppPrompt(input: {
       selectedKeys.length
         ? `Dispatch vault keys selected for this app: ${selectedKeys.join(", ")}`
         : "Dispatch vault keys selected for this app: none",
+      `Dispatch workspace resources selected for this app:\n${resourceList}`,
       "",
       `Use the workspace app layout: create it under apps/${appId}, mount it at /${appId}, keep it on the shared workspace database/hosting model, and avoid table-name collisions by namespacing any new domain tables to the app.`,
+      "Existing first-party apps are neighbors, not implementation details for this app. If the user prompt mentions Mail, Calendar, Analytics, Dispatch, or other templates, treat them as existing hosted/connected apps that this app can link to or call through A2A/default connected agents. For example, Mail, Calendar, and Analytics already exist at https://mail.agent-native.com, https://calendar.agent-native.com, and https://analytics.agent-native.com.",
+      `Do not clone first-party templates, create wrapper apps, or scaffold child apps/routes for Mail, Calendar, Analytics, etc. inside apps/${appId} just so this app can access them. If the request is a cross-app dashboard or overview, build only the new dashboard/overview app and delegate to the existing apps for domain work.`,
+      "Only create another first-party app copy when the user explicitly asks for a customized fork/copy of that app; otherwise keep using the hosted/shared app so improvements to the base template keep flowing to users.",
       selectedKeys.length
         ? `Dispatch will create pending vault requests for the selected keys for appId "${appId}" after this app creation request is accepted. Do not grant or sync vault keys directly from the app-creation branch.`
         : "Do not grant or request any Dispatch vault keys unless the user asks later.",
+      selectedResources.length
+        ? `Dispatch will create workspace resource grants for the selected resources for appId "${appId}". After the app exists, sync workspace resources so the app receives those shared resources. Add a short note to apps/${appId}/AGENTS.md telling the app agent to read relevant shared resources under context/ or the selected resource paths before doing GTM/domain work.`
+        : "Do not grant any Dispatch workspace resources unless the user asks later.",
       "",
       "Agent-native rules (these are the framework's contract — not optional):",
       `- Persist ALL data in SQL via Drizzle. Add tables to apps/${appId}/server/db/schema.ts and migrations to apps/${appId}/server/plugins/db.ts. NEVER use localStorage, sessionStorage, IndexedDB, or in-memory state for anything the user expects to persist — agent and UI must read the same source of truth.`,
@@ -890,11 +912,29 @@ async function requestSelectedVaultKeys(input: {
   );
 }
 
+async function selectedWorkspaceResourcesForIds(
+  resourceIds: string[] | undefined,
+): Promise<WorkspaceResourceOption[]> {
+  if (!resourceIds?.length) return [];
+  const requested = new Set(resourceIds);
+  const resources = await listWorkspaceResourceOptions();
+  return resources.filter((resource) => requested.has(resource.id));
+}
+
+async function grantSelectedWorkspaceResources(input: {
+  appId: string;
+  resourceIds: string[];
+}) {
+  if (input.resourceIds.length === 0) return;
+  await grantWorkspaceResourcesToApp(input);
+}
+
 export async function startWorkspaceAppCreation(input: {
   prompt: string;
   appId?: string | null;
   template?: string | null;
   secretIds?: string[];
+  resourceIds?: string[];
 }) {
   const initial = buildWorkspaceAppPrompt({
     prompt: input.prompt,
@@ -920,11 +960,15 @@ export async function startWorkspaceAppCreation(input: {
         .filter((secret) => input.secretIds?.includes(secret.id))
         .map((secret) => secret.credentialKey)
     : [];
+  const selectedResources = await selectedWorkspaceResourcesForIds(
+    input.resourceIds,
+  );
   const built = buildWorkspaceAppPrompt({
     prompt: input.prompt,
     appId: input.appId,
     template: input.template,
     selectedKeys,
+    selectedResources,
   });
   const prompt = built.prompt;
 
@@ -933,6 +977,10 @@ export async function startWorkspaceAppCreation(input: {
       appId: built.appId,
       selectedKeys,
     });
+    await grantSelectedWorkspaceResources({
+      appId: built.appId,
+      resourceIds: selectedResources.map((resource) => resource.id),
+    });
     return {
       mode: "local-agent",
       appId: built.appId,
@@ -997,6 +1045,10 @@ export async function startWorkspaceAppCreation(input: {
     appId: built.appId,
     selectedKeys,
   });
+  await grantSelectedWorkspaceResources({
+    appId: built.appId,
+    resourceIds: selectedResources.map((resource) => resource.id),
+  });
 
   return {
     mode: "builder",