Merge remote-tracking branch 'origin/main' into ci/parallel-safe-tests

Author: RhysSullivan

RUNNING.md

@@ -30,6 +30,9 @@ develop on its `main`, publish a bump, then bump the dependency here. The
 - Self-host boots standalone with just env vars — see
   `e2e/setup/selfhost.globalsetup.ts` for the canonical recipe (data dir,
   bootstrap admin email/password, base URL, `EXECUTOR_ALLOW_LOCAL_NETWORK`)
+- Self-host Vite dev shows first-run setup by default. Set
+  `EXECUTOR_DEV_SEED_ADMIN=1` to seed `admin@example.com` /
+  `executor-dev-admin` instead.
 - Cloud needs WorkOS + Autumn; for a no-.env boot, point it at emulators —
   see `e2e/setup/cloud.globalsetup.ts` for the canonical recipe (the real
   SDKs against emulated services, PGlite dev DB)

apps/host-selfhost/src/admin/invites.node.test.ts

@@ -27,6 +27,15 @@ const signUp = (body: Record<string, unknown>) =>
     }),
   );
 
+const inviteStatus = async (code: string): Promise<boolean> => {
+  const response = await handler(
+    new Request(`${BASE}/api/invite-status/${encodeURIComponent(code)}`),
+  );
+  expect(response.status).toBe(200);
+  const body = (await response.json()) as { valid?: boolean };
+  return body.valid === true;
+};
+
 test("open signup is closed: a signup without a valid invite code is rejected", async () => {
   const res = await signUp({
     email: "intruder@invite.test",
@@ -47,6 +56,8 @@ test("open signup is closed: a signup without a valid invite code is rejected",
 test("a code minted via the admin API redeems into a real org membership", async () => {
   // Minted through the TYPED admin HttpApi client (see mint-invite.ts).
   const inviteCode = await mintInviteCode(handler);
+  expect(await inviteStatus("AAAA-BBBB-CCCC")).toBe(false);
+  expect(await inviteStatus(inviteCode)).toBe(true);
 
   const res = await signUp({
     email: "member@invite.test",
@@ -76,4 +87,5 @@ test("a code minted via the admin API redeems into a real org membership", async
     inviteCode,
   });
   expect(reuse.status).not.toBe(200);
+  expect(await inviteStatus(inviteCode)).toBe(false);
 });

apps/host-selfhost/src/system/api.ts

@@ -20,6 +20,9 @@ export class SystemError extends Schema.TaggedErrorClass<SystemError>()(
 
 export const HealthResponse = Schema.Struct({ status: Schema.String });
 export const SetupStatusResponse = Schema.Struct({ needsSetup: Schema.Boolean });
+export const InviteStatusResponse = Schema.Struct({ valid: Schema.Boolean });
+
+const InviteStatusParams = { code: Schema.String };
 
 export const SystemApi = HttpApiGroup.make("system")
   .add(
@@ -33,6 +36,13 @@ export const SystemApi = HttpApiGroup.make("system")
       success: SetupStatusResponse,
       error: [SystemError],
     }),
+  )
+  .add(
+    HttpApiEndpoint.get("inviteStatus", "/invite-status/:code", {
+      params: InviteStatusParams,
+      success: InviteStatusResponse,
+      error: [SystemError],
+    }),
   );
 
 export const SystemHttpApi = HttpApi.make("executor-self-host-system").add(SystemApi);

apps/host-selfhost/src/system/handlers.ts

@@ -5,6 +5,7 @@ import { Effect, Layer } from "effect";
 import { SystemError, SystemHttpApi } from "./api";
 import { BetterAuth, countOrgMembers, type BetterAuthHandle } from "../auth/better-auth";
 import { SelfHostDb, type SelfHostDbHandle } from "../db/self-host-db";
+import { findRedeemableCode } from "../auth/invites";
 
 // ---------------------------------------------------------------------------
 // Handlers for the public system API. Unauthenticated; every DB touch is an
@@ -38,6 +39,16 @@ export const SystemHandlers = HttpApiBuilder.group(SystemHttpApi, "system", (han
         });
         return { needsSetup: count === 0 };
       }),
+    )
+    .handle("inviteStatus", ({ params }) =>
+      Effect.gen(function* () {
+        const { client } = yield* SelfHostDb;
+        const code = yield* Effect.tryPromise({
+          try: () => findRedeemableCode(client, params.code),
+          catch: () => new SystemError({ message: "failed to read invite status" }),
+        });
+        return { valid: code !== null };
+      }),
     ),
 );
 

apps/host-selfhost/vite.config.ts

@@ -34,8 +34,10 @@ const DEV_PORT = 5173;
 // via real env for anything you care about (esp. BETTER_AUTH_SECRET in prod).
 process.env.EXECUTOR_DATA_DIR ??= fileURLToPath(new URL("./.executor-dev/", import.meta.url));
 process.env.BETTER_AUTH_SECRET ??= "executor-selfhost-dev-secret-change-me-0123456789";
-process.env.EXECUTOR_BOOTSTRAP_ADMIN_EMAIL ??= "admin@example.com";
-process.env.EXECUTOR_BOOTSTRAP_ADMIN_PASSWORD ??= "executor-dev-admin";
+if (process.env.EXECUTOR_DEV_SEED_ADMIN === "1") {
+  process.env.EXECUTOR_BOOTSTRAP_ADMIN_EMAIL ??= "admin@example.com";
+  process.env.EXECUTOR_BOOTSTRAP_ADMIN_PASSWORD ??= "executor-dev-admin";
+}
 process.env.EXECUTOR_WEB_BASE_URL ??= `http://localhost:${DEV_PORT}`;
 
 // Dev-only: forward /api, /mcp, /docs to the self-host Effect handler in-process

apps/host-selfhost/web/auth-layout.tsx

@@ -0,0 +1,90 @@
+import type { ReactNode } from "react";
+
+import { Wordmark } from "@executor-js/react/components/wordmark";
+
+// Split auth layout for the chromeless pages (setup, login, join): a promo
+// panel on the left, the form on the right. The panel follows design.md's
+// registry-minimal rules — graph-paper texture, mono eyebrow + index numerals,
+// grayscale only — so the first screen a person ever sees speaks the same
+// language as the app behind it. Collapses to form-only below lg.
+const PANEL_POINTS: ReadonlyArray<{ index: string; title: string; body: string }> = [
+  {
+    index: "01",
+    title: "Connect",
+    body: "OpenAPI, GraphQL, and MCP sources become tools your agent can call.",
+  },
+  {
+    index: "02",
+    title: "Control",
+    body: "Policies decide which tools run, which ask first, and which are blocked.",
+  },
+  {
+    index: "03",
+    title: "Audit",
+    body: "Every invocation is recorded, with approvals where they matter.",
+  },
+];
+
+export function AuthLayout(props: { readonly children: ReactNode }) {
+  return (
+    <div className="grid min-h-screen bg-background lg:grid-cols-[1.1fr_1fr]">
+      <aside className="relative hidden flex-col justify-between overflow-hidden border-r border-border bg-sidebar p-12 lg:flex">
+        {/* Graph-paper texture, faded toward the bottom (design.md signature). */}
+        <div
+          aria-hidden
+          className="pointer-events-none absolute inset-0 text-foreground opacity-[0.05]"
+          style={{
+            backgroundImage:
+              "linear-gradient(currentColor 1px, transparent 1px), linear-gradient(90deg, currentColor 1px, transparent 1px)",
+            backgroundSize: "32px 32px",
+            maskImage: "linear-gradient(to bottom, black 30%, transparent 85%)",
+          }}
+        />
+
+        <div className="relative">
+          <Wordmark />
+        </div>
+
+        <div className="relative max-w-md space-y-10">
+          <div className="space-y-4">
+            <p className="font-mono text-[11px] font-medium uppercase tracking-[0.18em] text-muted-foreground">
+              The integration layer for AI agents
+            </p>
+            <h2 className="text-4xl font-semibold tracking-[-0.04em] text-foreground">
+              Every tool your agent needs, behind one endpoint.
+            </h2>
+            <p className="text-sm leading-6 text-muted-foreground">
+              Connect your APIs once. Any MCP-compatible agent gets the whole catalog, governed by
+              your policies.
+            </p>
+          </div>
+
+          <ul className="space-y-5">
+            {PANEL_POINTS.map((point) => (
+              <li key={point.index} className="flex gap-4">
+                <span className="font-mono text-[11px] font-medium tracking-[0.08em] text-muted-foreground/70 pt-0.5">
+                  {point.index}
+                </span>
+                <div>
+                  <p className="text-sm font-medium text-foreground">{point.title}</p>
+                  <p className="text-sm leading-6 text-muted-foreground">{point.body}</p>
+                </div>
+              </li>
+            ))}
+          </ul>
+        </div>
+
+        <p className="relative font-mono text-[11px] tracking-[0.08em] text-muted-foreground">
+          self-hosted
+        </p>
+      </aside>
+
+      <main className="flex flex-col items-center justify-center gap-6 p-6">
+        <div className="lg:hidden">
+          <Wordmark />
+        </div>
+        {props.children}
+      </main>
+    </div>
+  );
+}

apps/host-selfhost/web/login.tsx

@@ -5,6 +5,7 @@ import { Input } from "@executor-js/react/components/input";
 import { Label } from "@executor-js/react/components/label";
 
 import { authClient } from "./auth-client";
+import { AuthLayout } from "./auth-layout";
 import { mcpAuthorizeResumeTarget, safeReturnTo } from "../src/auth/return-to";
 
 // Self-host login: email + password sign-in via Better Auth. On success we
@@ -54,12 +55,16 @@ export const LoginPage = () => {
   };
 
   return (
-    <div className="flex min-h-screen items-center justify-center bg-background p-6">
+    <AuthLayout>
       <div className="w-full max-w-sm space-y-4 rounded-xl border border-border bg-card p-6 shadow-sm">
-        <div className="space-y-1 text-center">
-          <h1 className="font-mono text-2xl tracking-tight text-foreground">Executor</h1>
+        <div className="space-y-1">
+          <h1 className="text-xl font-semibold tracking-tight text-foreground">
+            {mode === "signin" ? "Sign in" : "Join this instance"}
+          </h1>
           <p className="text-sm text-muted-foreground">
-            {mode === "signin" ? "Sign in to your instance" : "Join with your invite code"}
+            {mode === "signin"
+              ? "Welcome back. Use your instance account."
+              : "Enter the invite code you were given."}
           </p>
         </div>
 
@@ -127,6 +132,6 @@ export const LoginPage = () => {
           </Button>
         </div>
       </div>
-    </div>
+    </AuthLayout>
   );
 };

apps/host-selfhost/web/routes/__root.tsx

@@ -33,6 +33,7 @@ import { fetchNeedsSetup } from "../setup-status";
 // ---------------------------------------------------------------------------
 
 export const Route = createRootRoute({
+  notFoundComponent: NotFoundPage,
   component: RootComponent,
 });
 
@@ -50,6 +51,26 @@ const signOut = async () => {
   window.location.href = "/";
 };
 
+function NotFoundPage() {
+  return (
+    <main className="flex min-h-screen items-center justify-center bg-background px-6 py-10">
+      <section className="w-full max-w-md text-center">
+        <p className="text-xs font-medium uppercase tracking-wide text-muted-foreground">404</p>
+        <h1 className="mt-2 text-xl font-semibold text-foreground">Page not found</h1>
+        <p className="mt-2 text-sm leading-6 text-muted-foreground">
+          There&apos;s nothing at this address.
+        </p>
+        <a
+          href="/"
+          className="mt-6 inline-flex h-9 items-center justify-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground shadow transition-colors hover:bg-primary/90"
+        >
+          Go home
+        </a>
+      </section>
+    </main>
+  );
+}
+
 const Loading = () => (
   <div className="flex min-h-screen items-center justify-center text-sm text-muted-foreground">
     Loading…

apps/host-selfhost/web/routes/app/admin.tsx

@@ -10,6 +10,7 @@ import { CopyButton } from "@executor-js/react/components/copy-button";
 import { Input } from "@executor-js/react/components/input";
 import { Label } from "@executor-js/react/components/label";
 import { NativeSelect, NativeSelectOption } from "@executor-js/react/components/native-select";
+import { useExecutorDocumentTitle } from "@executor-js/react/lib/document-title";
 import {
   orgMembersAtom,
   removeMember,
@@ -29,6 +30,7 @@ const ROLES = ["member", "admin"] as const;
 // are the self-host join mechanism. The API gates to owner/admin, so a
 // non-admin who opens this just sees load failures.
 function AdminPage() {
+  useExecutorDocumentTitle("Admin");
   return (
     <div className="min-h-0 flex-1 overflow-y-auto">
       <div className="mx-auto flex max-w-3xl flex-col gap-10 px-6 py-10 lg:px-8 lg:py-14">

apps/host-selfhost/web/routes/public/join.$code.tsx

@@ -1,7 +1,8 @@
 import { createFileRoute } from "@tanstack/react-router";
-import { useState, type FormEvent } from "react";
+import { useEffect, useState, type FormEvent } from "react";
 
 import { Button } from "@executor-js/react/components/button";
+import { Card, CardDescription, CardHeader, CardTitle } from "@executor-js/react/components/card";
 import { Input } from "@executor-js/react/components/input";
 import { Label } from "@executor-js/react/components/label";
 
@@ -18,12 +19,37 @@ export const Route = createFileRoute("/join/$code")({
 // auth gate (an un-redeemed visitor has no session yet).
 function JoinPage() {
   const { code } = Route.useParams();
+  const [inviteState, setInviteState] = useState<"checking" | "valid" | "invalid">("checking");
   const [name, setName] = useState("");
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
   const [error, setError] = useState<string | null>(null);
   const [busy, setBusy] = useState(false);
 
+  useEffect(() => {
+    let alive = true;
+    setInviteState("checking");
+    void fetch(`/api/invite-status/${encodeURIComponent(code)}`, {
+      credentials: "same-origin",
+    }).then(
+      async (response) => {
+        const body = response.ok
+          ? ((await response.json().then(
+              (value) => value,
+              () => ({}),
+            )) as { valid?: boolean })
+          : {};
+        if (alive) setInviteState(body.valid === true ? "valid" : "invalid");
+      },
+      () => {
+        if (alive) setInviteState("invalid");
+      },
+    );
+    return () => {
+      alive = false;
+    };
+  }, [code]);
+
   const submit = async (event: FormEvent) => {
     event.preventDefault();
     setBusy(true);
@@ -43,6 +69,30 @@ function JoinPage() {
     window.location.href = "/";
   };
 
+  if (inviteState === "checking") {
+    return (
+      <div className="flex min-h-screen items-center justify-center text-sm text-muted-foreground">
+        Loading…
+      </div>
+    );
+  }
+
+  if (inviteState === "invalid") {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-background p-6">
+        <Card className="w-full max-w-md">
+          <CardHeader>
+            <CardTitle>Invite not valid</CardTitle>
+            <CardDescription>
+              This invite link is invalid or has expired. Ask the person who invited you for a new
+              link.
+            </CardDescription>
+          </CardHeader>
+        </Card>
+      </div>
+    );
+  }
+
   return (
     <div className="flex min-h-screen items-center justify-center bg-background p-6">
       <form