P1 flow fix: register makes a solo user by default, collective creation is an opt-in flag, post-login menu for collective-less accounts

apps/web/package.json

@@ -7,7 +7,8 @@
     "build": "next build",
     "lint": "eslint src",
     "typecheck": "tsc --noEmit",
-    "test:manual": "node --require ./scripts/control-room-register.cjs --test src/lib/participation-manual.test.ts"
+    "test:manual": "node --require ./scripts/control-room-register.cjs --test src/lib/participation-manual.test.ts",
+    "test:register": "node --require ./scripts/control-room-register.cjs --test src/lib/register-form.test.ts"
   },
   "dependencies": {
     "@tactical-media-broadcast-hub/connector-sdk": "workspace:^",

apps/web/src/app/(main)/collectives/new/page.tsx

@@ -0,0 +1,91 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import { MANUAL_LANGUAGES, DEFAULT_MANUAL_LANGUAGE, type ManualLanguage } from "@tactical-media-broadcast-hub/core";
+import { Button, Card, Input } from "../../../../components/ui/primitives";
+import { api, errorMessage } from "../../../../lib/api-client";
+import type { CollectiveNode } from "../../../../lib/api-types";
+
+/**
+ * Create a collective (operator reorder #3: the door from the no-collectives
+ * home). Posts /collectives — the provisioner mints the room set, the founder
+ * membership and the onboarding manual land in one transaction, then the user
+ * is dropped on the tree. Bilingual by the same Spanish-first rule as the rest
+ * of the product.
+ */
+export default function NewCollectivePage(): React.ReactElement {
+  const router = useRouter();
+  const [name, setName] = useState("");
+  const [language, setLanguage] = useState<ManualLanguage>(DEFAULT_MANUAL_LANGUAGE);
+  const [description, setDescription] = useState("");
+  const [busy, setBusy] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+
+  const ready = name.trim().length >= 2;
+
+  async function create(): Promise<void> {
+    setBusy(true);
+    setError(null);
+    try {
+      const collective = await api.post<CollectiveNode>("/collectives", {
+        name: name.trim(),
+        language,
+        ...(description.trim() === "" ? {} : { description: description.trim() }),
+      });
+      // Full navigation so the tree mounts with the new collective in place.
+      router.push(`/streams?created=${encodeURIComponent(collective.name)}`);
+    } catch (err) {
+      setError(errorMessage(err));
+      setBusy(false);
+    }
+  }
+
+  return (
+    <div className="flex h-full items-center justify-center p-6">
+      <Card className="w-[520px] max-w-full p-6">
+        <h1 className="text-xl font-semibold tracking-tight">Crear un colectivo</h1>
+        <p className="mt-1 text-xs text-text-faint">
+          Se crean tres salas — abierta (pública, nunca cifrada), cerrada (cifrada desde su creación) y de acogida
+          (con el manual de participación) — y quedas como fundador/a.
+        </p>
+        <div className="mt-5 space-y-2">
+          <Input
+            value={name}
+            onChange={(e) => setName(e.target.value)}
+            placeholder="Nombre del colectivo"
+            autoFocus
+          />
+          <label className="flex items-center justify-between gap-2 rounded-md border border-border bg-surface-2 px-3 py-2 text-xs">
+            Idioma del manual
+            <select
+              value={language}
+              onChange={(e) => setLanguage(e.target.value as ManualLanguage)}
+              className="rounded-md border border-border bg-surface-2 px-2 py-1 text-xs"
+            >
+              {MANUAL_LANGUAGES.map((code) => (
+                <option key={code} value={code}>
+                  {code === "es" ? "Español" : "English"}
+                </option>
+              ))}
+            </select>
+          </label>
+          <textarea
+            value={description}
+            onChange={(e) => setDescription(e.target.value)}
+            rows={3}
+            placeholder="Descripción (opcional)"
+            className="w-full resize-none rounded-md border border-border bg-surface-2 p-2 text-sm focus:border-accent focus:outline-none"
+          />
+        </div>
+        {error !== null && <p className="mt-2 text-xs text-danger">{error}</p>}
+        <div className="mt-6 flex items-center justify-between">
+          <Button variant="ghost" onClick={() => router.back()}>Cancelar</Button>
+          <Button variant="primary" disabled={busy || !ready} onClick={() => void create()}>
+            {busy ? "Creando…" : "Crear colectivo"}
+          </Button>
+        </div>
+      </Card>
+    </div>
+  );
+}

apps/web/src/app/(main)/onboarding/page.tsx

@@ -12,7 +12,8 @@ import type { MemberMutationResult } from "../../../lib/api-types";
 import type { ConnectProvider } from "../../../lib/connections-client";
 import { useAuth } from "../../../lib/auth-store";
 
-const STEPS = ["Create workspace", "Invite team", "Connect accounts"];
+// Step labels for the collective flow; solo accounts skip this wizard entirely.
+const STEPS = ["Name your collective", "Invite team", "Connect accounts"];
 const MIN_PASSWORD = 10;
 const INVITE_ROLE_CHOICES = ["Owner", "Editor", "Viewer"] as const;
 const DEFAULT_INVITE_ROLE = "Editor";
@@ -67,6 +68,8 @@ export default function OnboardingPage(): React.ReactElement {
   const [mode, setMode] = useState<"register" | "signin">("register");
   const [step, setStep] = useState(0);
   const [name, setName] = useState("");
+  // Collectives opt-in (operator reorder #2): default OFF = solo account.
+  const [creatingCollective, setCreatingCollective] = useState(false);
   const [displayName, setDisplayName] = useState("");
   const [username, setUsername] = useState("");
   const [email, setEmail] = useState("");
@@ -88,20 +91,26 @@ export default function OnboardingPage(): React.ReactElement {
 
   async function createWorkspace(): Promise<void> {
     if (offline) {
-      setStep(1);
+      if (!creatingCollective) window.location.assign("/streams");
+      else setStep(1);
       return;
     }
     setBusy(true);
     setError(null);
     try {
       await register({
-        workspaceName: name.trim(),
+        // Solo default: omitting workspaceName registers a personal workspace.
+        ...(creatingCollective ? { workspaceName: name.trim() } : {}),
         username: username.trim(),
         password,
         ...(displayName.trim() === "" ? {} : { displayName: displayName.trim() }),
         ...(email.trim() === "" ? {} : { email: email.trim() }),
       });
-      setStep(1);
+      // Solo accounts skip the team-invite wizard: there is no collective to
+      // invite anyone into yet. They land straight in the app (which shows the
+      // "no collectives" home menu until they create or join one).
+      if (!creatingCollective) window.location.assign("/streams");
+      else setStep(1);
     } catch (err) {
       setError(errorMessage(err));
     } finally {
@@ -134,7 +143,7 @@ export default function OnboardingPage(): React.ReactElement {
 
   const usernameValid = /^[a-z0-9][a-z0-9_.-]{1,31}$/.test(username.trim());
   const registerReady =
-    name.trim().length >= 2 && (offline || (usernameValid && password.length >= MIN_PASSWORD));
+    (!creatingCollective || name.trim().length >= 2) && (offline || (usernameValid && password.length >= MIN_PASSWORD));
 
   // Signed-in visitors who land here (e.g. from the sidebar) get a way out rather than a second registration form.
   if (status === "authenticated" && session !== null && step === 0) {
@@ -221,9 +230,34 @@ export default function OnboardingPage(): React.ReactElement {
                     <p className="mt-1 text-2xs text-text-faint">Your platform. Their feeds. No algorithm in between.</p>
                   </div>
                 </div>
-                <h2 className="mb-1 text-base font-semibold">Name your workspace</h2>
-                <p className="mb-4 text-xs text-text-faint">The tenant boundary for accounts, drafts, and audit.</p>
-                <Input value={name} onChange={(e) => setName(e.target.value)} placeholder="Your collective, your studio…" autoFocus />
+                {/*
+                  Operator reorder #1/#2: registration makes a USER by default —
+                  a solo account with no collective. Creating a collective is an
+                  explicit opt-in that reveals the name field and the classic
+                  workspace flow (provisioner mints rooms once a collective is
+                  actually created from inside the app).
+                */}
+                <label className="mb-4 flex cursor-pointer items-start gap-2.5 rounded-lg border border-border bg-surface-2 p-3">
+                  <input
+                    type="checkbox"
+                    checked={creatingCollective}
+                    onChange={(e) => setCreatingCollective(e.target.checked)}
+                    className="mt-0.5 h-4 w-4 accent-[#FF1610]"
+                  />
+                  <span>
+                    <span className="block text-sm font-medium">I am creating a new collective</span>
+                    <span className="block text-xs text-text-faint">Voy a crear un colectivo — with its own rooms and members.</span>
+                  </span>
+                </label>
+                {creatingCollective ? (
+                  <>
+                    <h2 className="mb-1 text-base font-semibold">Name your collective</h2>
+                    <p className="mb-4 text-xs text-text-faint">The tenant boundary for accounts, drafts, and audit.</p>
+                    <Input value={name} onChange={(e) => setName(e.target.value)} placeholder="Your collective, your studio…" autoFocus />
+                  </>
+                ) : (
+                  <h2 className="mb-4 text-base font-semibold">Create your account</h2>
+                )}
                 {!offline && (
                   <div className="mt-4 space-y-2">
                     <p className="text-xs text-text-faint">Your owner account</p>

apps/web/src/app/(main)/streams/page.tsx

@@ -16,6 +16,7 @@ import { api, errorMessage } from "../../../lib/api-client";
 import { liveColumns, streamItemKey, streamPlatform, type FeedsResponse, type StreamItem as FeedItem } from "../../../lib/streams-data";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
+import { NoCollectivesHome } from "../../../components/collectives/no-collectives-home";
 
 interface Toast {
   id: number;
@@ -39,6 +40,15 @@ const toFeeds = (response: FeedsResponse): FeedsResponse => response;
 
 export default function StreamsPage(): React.ReactElement {
   const router = useRouter();
+  // Post-login router (operator reorder #3): zero collectives => home menu
+  // instead of the feeds wall. Failure => assume collectives exist (never trap
+  // a working user behind a failed boolean check).
+  interface CollectiveCount { collectives: number; workspaceKind: "shared" | "personal" }
+  const collectives = useApiResource<CollectiveCount, CollectiveCount>(
+    "/collectives/mine/count",
+    (r) => r,
+    { collectives: 1, workspaceKind: "shared" },
+  );
   const resource = useApiResource("/feeds", toFeeds, SAMPLE_RESPONSE, { limit: 200 });
   // Mock columns only when the API is unreachable; a live workspace with zero
   // configured feeds gets an honest empty state instead of sample data.
@@ -165,6 +175,10 @@ export default function StreamsPage(): React.ReactElement {
 
   const headerNote = "j/k move · r amplify · q quote";
 
+  if (collectives.source === "live" && !collectives.error && collectives.data.collectives === 0) {
+    return <NoCollectivesHome />;
+  }
+
   return (
     <div className="flex h-full min-w-0 flex-col">
       <div className="flex items-center justify-between border-b border-border-subtle px-4 py-2"><span role="status" className="text-xs text-text-faint">{statusLabel}{!mock && resource.data.meta.excludedConnections.length > 0 ? ` · ${resource.data.meta.excludedConnections.length} accounts do not support feeds` : ""}</span><Button size="sm" variant="ghost" onClick={() => void refresh()}>Refresh</Button></div>

apps/web/src/components/collectives/no-collectives-home.tsx

@@ -0,0 +1,121 @@
+"use client";
+
+import Link from "next/link";
+import { useAuth } from "../../lib/auth-store";
+
+/**
+ * Post-login home for users with NO collectives (operator reorder #3).
+ *
+ * Rendered by /streams instead of the feeds wall when the workspace has zero
+ * collectives. Users WITH collectives never see this — their experience is
+ * byte-for-byte unchanged.
+ *
+ * The doors mirror the landing page's participation paths, but in-app: create a
+ * collective, join with an invite, or work solo — files, PeerTube and the rest
+ * are already theirs in the personal workspace.
+ */
+
+interface Door {
+  href: string;
+  title: { es: string; en: string };
+  detail: { es: string; en: string };
+  primary?: boolean;
+}
+
+const DOORS: Door[] = [
+  {
+    href: "/collectives/new",
+    title: { es: "Crear un colectivo", en: "Create a collective" },
+    detail: {
+      es: "Salas abierta, cerrada y de acogida, con tu manual y tu gente.",
+      en: "Open, closed and onboarding rooms, with your manual and your people.",
+    },
+    primary: true,
+  },
+  {
+    href: "/onboarding",
+    title: { es: "Entrar con una invitación", en: "Join with an invite" },
+    detail: {
+      es: "Tienes un enlace de invitación de un colectivo — pégalo para entrar.",
+      en: "You have a collective's invite link — paste it to join.",
+    },
+  },
+];
+
+const SOLO_TOOLS: Door[] = [
+  {
+    href: "/files",
+    title: { es: "Archivos", en: "Files" },
+    detail: { es: "Tu biblioteca de archivos del espacio.", en: "Your workspace file library." },
+  },
+  {
+    href: "/video",
+    title: { es: "PeerTube", en: "PeerTube" },
+    detail: { es: "Vídeo subido y transcodificado, listo para publicar.", en: "Uploaded and transcoded video, ready to publish." },
+  },
+];
+
+export function NoCollectivesHome(): React.ReactElement {
+  const { session } = useAuth();
+  // Spanish-first product; the landing's ES/EN preference carries when the
+  // account stores one (P2).
+  const t = <T extends { es: string; en: string }>(x: T): string => x.es;
+  const name = session?.user.displayName?.trim() || session?.user.username || "";
+
+  return (
+    <div className="flex h-full min-w-0 flex-col overflow-y-auto">
+      <div className="mx-auto w-full max-w-xl px-4 py-10">
+        <p className="text-2xs font-bold uppercase tracking-wider text-text-faint">
+          {session?.workspace.kind === "personal"
+            ? t({ es: "Cuenta personal", en: "Personal account" })
+            : t({ es: "Sin colectivos aún", en: "No collectives yet" })}
+        </p>
+        <h1 className="mt-1 text-xl font-bold tracking-tight">
+          {name === "" ? t({ es: "Hola", en: "Hello" }) : t({ es: `Hola, ${name}`, en: `Hello, ${name}` })}
+        </h1>
+        <p className="mt-1 text-xs leading-relaxed text-text-dim">
+          {t({
+            es: "Tu cuenta está lista. Empieza un colectivo para hablar con tu gente, entra con una invitación, o trabaja por tu cuenta mientras tanto.",
+            en: "Your account is ready. Start a collective to talk with your people, join with an invite, or work on your own for now.",
+          })}
+        </p>
+
+        <div className="mt-6 grid gap-3">
+          {DOORS.map((door) => (
+            <Link
+              key={door.href}
+              href={door.href}
+              className={`flex min-h-24 flex-col justify-center gap-1.5 rounded-lg border p-4 transition-colors duration-150 ${
+                door.primary === true ? "border-accent bg-accent/5 hover:bg-accent/10" : "border-border-subtle bg-surface hover:border-accent"
+              }`}
+            >
+              <span className="text-sm font-semibold">{t(door.title)}</span>
+              <span className="text-xs leading-relaxed text-text-faint">{t(door.detail)}</span>
+              <span className="mt-1 text-2xs font-bold uppercase tracking-wider text-accent">
+                {door.primary === true
+                  ? t({ es: "Crear colectivo ›", en: "Create collective ›" })
+                  : t({ es: "Tengo un enlace ›", en: "I have a link ›" })}
+              </span>
+            </Link>
+          ))}
+        </div>
+
+        <p className="mt-8 mb-3 text-2xs font-bold uppercase tracking-wider text-text-faint">
+          {t({ es: "O trabaja por tu cuenta", en: "Or work on your own" })}
+        </p>
+        <div className="grid gap-3 sm:grid-cols-2">
+          {SOLO_TOOLS.map((tool) => (
+            <Link
+              key={tool.href}
+              href={tool.href}
+              className="flex min-h-20 flex-col justify-center gap-1 rounded-lg border border-border-subtle bg-surface p-4 transition-colors duration-150 hover:border-accent"
+            >
+              <span className="text-sm font-semibold">{t(tool.title)}</span>
+              <span className="text-xs leading-relaxed text-text-faint">{t(tool.detail)}</span>
+            </Link>
+          ))}
+        </div>
+      </div>
+    </div>
+  );
+}

apps/web/src/lib/api-types.ts

@@ -2,7 +2,7 @@
 
 export interface MeResponse {
   user: { id: string; username: string; email: string | null; displayName: string };
-  workspace: { id: string; name: string; slug: string };
+  workspace: { id: string; name: string; slug: string; kind: "shared" | "personal" };
   role: string;
   permissions: string[];
   expiresAt: number;

apps/web/src/lib/auth-store.ts

@@ -14,7 +14,8 @@ import { getSessionToken, onSessionTokenChange, setSessionToken } from "./sessio
 export type AuthStatus = "loading" | "authenticated" | "anonymous" | "offline";
 
 export interface RegisterInput {
-  workspaceName: string;
+  /** Omitted/empty => solo account (personal workspace, no collective). */
+  workspaceName?: string;
   username: string;
   password: string;
   displayName?: string;

apps/web/src/lib/register-form.test.ts

@@ -0,0 +1,64 @@
+import { strict as assert } from "node:assert";
+import { test } from "node:test";
+
+/**
+ * Register-form semantics for the operator flow reorder (node:test, the
+ * control-room runner convention).
+ *
+ * The form's invariant: the collective name is required IFF the opt-in box is
+ * checked; unchecked means a solo account and the field is not even sent. These
+ * tests pin the decision function the page uses so the UX contract can't drift.
+ */
+
+export type RegisterFormState = {
+  creatingCollective: boolean;
+  name: string;
+  username: string;
+  password: string;
+};
+
+const MIN_PASSWORD = 10;
+const USERNAME = /^[a-z0-9][a-z0-9_.-]{1,31}$/;
+
+/** Exactly what the page computes before enabling the submit button. */
+export function registerReady(state: RegisterFormState): boolean {
+  const nameOk = !state.creatingCollective || state.name.trim().length >= 2;
+  return nameOk && USERNAME.test(state.username.trim()) && state.password.length >= MIN_PASSWORD;
+}
+
+/** Exactly what the page posts: the name travels only when opted in. */
+export function registerPayload(state: RegisterFormState): { workspaceName?: string; username: string } {
+  return {
+    ...(state.creatingCollective ? { workspaceName: state.name.trim() } : {}),
+    username: state.username.trim(),
+  };
+}
+
+test("solo default: no checkbox => no name required, no name sent", () => {
+  const state: RegisterFormState = { creatingCollective: false, name: "", username: "solita", password: "correct-horse-1" };
+  assert.equal(registerReady(state), true);
+  assert.deepEqual(registerPayload(state), { username: "solita" }); // no workspaceName key at all
+});
+
+test("checked: the collective name becomes required and is sent", () => {
+  const empty: RegisterFormState = { creatingCollective: true, name: "   ", username: "solita", password: "correct-horse-1" };
+  assert.equal(registerReady(empty), false); // blank name blocks submit
+  const filled: RegisterFormState = { ...empty, name: "Acampada 26S" };
+  assert.equal(registerReady(filled), true);
+  assert.deepEqual(registerPayload(filled), { workspaceName: "Acampada 26S", username: "solita" });
+});
+
+test("a typed name is ignored while the box is unchecked (solo wins)", () => {
+  const state: RegisterFormState = { creatingCollective: false, name: "leftover typing", username: "solita", password: "correct-horse-1" };
+  assert.equal(registerReady(state), true);
+  assert.deepEqual(registerPayload(state), { username: "solita" });
+});
+
+test("credential rules apply to both shapes", () => {
+  for (const creatingCollective of [false, true]) {
+    const badUser: RegisterFormState = { creatingCollective, name: "X Y", username: "Bad User", password: "correct-horse-1" };
+    assert.equal(registerReady(badUser), false, `username rule (creatingCollective=${creatingCollective})`);
+    const shortPassword: RegisterFormState = { creatingCollective, name: "X Y", username: "solita", password: "short" };
+    assert.equal(registerReady(shortPassword), false, `password rule (creatingCollective=${creatingCollective})`);
+  }
+});