Locked-account profiles: private = stub + Pending follow flow

Replaces the earlier 404-for-private model with Mastodon-style locked
accounts. A private profile now returns 200 with a stub layout and
gates content behind follow approval. Default for new users flips from
'public' to 'private' to align with trails.cool's privacy-first
content defaults.

Schema:
- users.profile_visibility default flipped to 'private'. Existing rows
  remain 'public' (backfill on first migration handled them).

Follow API (follow.server.ts):
- followUser now creates Pending (accepted_at = NULL) against private
  targets and Accepted against public targets — no more refusal.
- New: countPendingFollowRequests, listPendingFollowRequests,
  approveFollowRequest, rejectFollowRequest. Approve/reject are
  owner-bound: only the followed user can act on their own incoming
  requests.
- countFollowers / countFollowing / listFollowers / listFollowing now
  filter to accepted-only relations.

Loader (users.$username.tsx):
- Drops the 404 paths. New canSeeContent flag = isOwn ||
  profile_visibility='public' || (followState.following === true).
- When canSeeContent=false, render a stub: header + 🔒 badge + body
  copy + Request-to-follow / sign-in CTA. Routes/activities sections
  are not rendered.

UI:
- FollowButton gains a "Request to follow" / "Requested" state for
  private targets via a new isPrivateTarget prop. Cancel-request reuses
  the unfollow endpoint.
- New /follows/requests page lists incoming Pending requests with
  Approve / Reject buttons.
- New API routes: POST /api/follows/:id/approve and /reject.
- Navbar shows a count badge linking to /follows/requests when
  pending > 0.

Privacy manifest already documents the follows relation; no changes
needed (the locked-account semantics don't add new data — same row,
different lifecycle).

Specs / design (social-feed change):
- public-profiles delta rewritten around the four-mode locked model
  (public, private+anon, private+pending, private+accepted) with
  scenarios for each.
- social-follows delta gains Pending lifecycle requirements (auto vs.
  manual accept, approve/reject endpoints, pending request management,
  Pending follows do not contribute to feed).
- design.md decision section reflects the new model and rationale for
  default-private; non-goal "locked-local-accounts as a follow-up" is
  removed since this change ships it.

Tests:
- follow.integration.test.ts: pending-against-private, approve flips
  to accepted, reject deletes, owner-bound enforcement.
- e2e/social.test.ts: full Request → Pending → Approve → full-view
  flow, plus stub-for-anonymous and /follows/requests auth gate.

Supersedes PR #309 (closed): the empty-public-profile 200 is now a
side-effect of the new render path.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

apps/journal/app/components/FollowButton.tsx

@@ -8,21 +8,36 @@ interface FollowState {
 
 interface Props {
   username: string;
+  // Whether the followed profile is private/locked. Drives the "Request to
+  // follow" label vs. plain "Follow" before any click happens.
+  isPrivateTarget: boolean;
   initialState: FollowState | null;
 }
 
-export function FollowButton({ username, initialState }: Props) {
+type Display = "follow" | "request" | "pending" | "unfollow";
+
+function displayFor(state: FollowState | null, isPrivateTarget: boolean): Display {
+  if (state?.following) return "unfollow";
+  if (state?.pending) return "pending";
+  return isPrivateTarget ? "request" : "follow";
+}
+
+export function FollowButton({ username, isPrivateTarget, initialState }: Props) {
   const { t } = useTranslation("journal");
   const [state, setState] = useState<FollowState>(
     initialState ?? { following: false, pending: false },
   );
-  const [isPending, startTransition] = useTransition();
+  const [isInFlight, startTransition] = useTransition();
   const [error, setError] = useState<string | null>(null);
 
+  const display = displayFor(state, isPrivateTarget);
+
   const onClick = () => {
     setError(null);
     startTransition(async () => {
-      const path = state.following
+      // For "pending" we treat the click as cancel-request: same /unfollow
+      // endpoint deletes the row whether it's accepted or pending.
+      const path = state.following || state.pending
         ? `/api/users/${username}/unfollow`
         : `/api/users/${username}/follow`;
       try {
@@ -40,21 +55,33 @@ export function FollowButton({ username, initialState }: Props) {
     });
   };
 
-  const label = state.following ? t("social.unfollow") : t("social.follow");
+  const label = (() => {
+    switch (display) {
+      case "unfollow":
+        return t("social.unfollow");
+      case "pending":
+        return t("social.pendingCancel");
+      case "request":
+        return t("social.requestToFollow");
+      case "follow":
+      default:
+        return t("social.follow");
+    }
+  })();
+
+  const baseClass = display === "follow" || display === "request"
+    ? "rounded-md bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700 disabled:opacity-50"
+    : "rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:opacity-50";
 
   return (
     <div className="flex flex-col items-end gap-1">
       <button
         type="button"
         onClick={onClick}
-        disabled={isPending}
-        className={
-          state.following
-            ? "rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:opacity-50"
-            : "rounded-md bg-blue-600 px-4 py-2 text-sm font-medium text-white hover:bg-blue-700 disabled:opacity-50"
-        }
+        disabled={isInFlight}
+        className={baseClass}
       >
-        {isPending ? "…" : label}
+        {isInFlight ? "…" : label}
       </button>
       {error && <p className="text-xs text-red-600">{error}</p>}
     </div>

apps/journal/app/lib/follow.integration.test.ts

@@ -9,7 +9,10 @@ import {
   getFollowState,
   countFollowers,
   countFollowing,
-  FollowError,
+  countPendingFollowRequests,
+  listPendingFollowRequests,
+  approveFollowRequest,
+  rejectFollowRequest,
 } from "./follow.server.ts";
 
 // Opt-in: these talk to real Postgres. Gated by an env flag so laptop
@@ -74,12 +77,14 @@ describe.skipIf(!runIntegration)("follow.server integration", () => {
     expect(aRow.username.startsWith("f_a_")).toBe(true);
   });
 
-  it("refuses to follow a private profile", async () => {
+  it("creates a Pending follow against a private profile (not a refusal)", async () => {
     const a = await makeUser({ username: `f_pa_${Date.now()}` });
     const b = await makeUser({ username: `f_pb_${Date.now()}`, profileVisibility: "private" });
     const bRow = (await getDb().select().from(users).where(eq(users.id, b)))[0]!;
-    await expect(followUser(a, bRow.username)).rejects.toBeInstanceOf(FollowError);
-    await expect(followUser(a, bRow.username)).rejects.toMatchObject({ code: "private_profile" });
+    const s = await followUser(a, bRow.username);
+    expect(s).toEqual({ following: false, pending: true });
+    // Pending is excluded from accepted-only counts.
+    expect(await countFollowers(b)).toBe(0);
     expect(await countFollowing(a)).toBe(0);
   });
 
@@ -89,6 +94,48 @@ describe.skipIf(!runIntegration)("follow.server integration", () => {
     await expect(followUser(a, aRow.username)).rejects.toMatchObject({ code: "self_follow" });
   });
 
+  it("approve flips Pending → Accepted; reject deletes the request", async () => {
+    const a = await makeUser({ username: `f_apr_${Date.now()}` });
+    const b = await makeUser({ username: `f_apb_${Date.now()}`, profileVisibility: "private" });
+    const bRow = (await getDb().select().from(users).where(eq(users.id, b)))[0]!;
+    await followUser(a, bRow.username);
+    expect(await countPendingFollowRequests(b)).toBe(1);
+
+    const reqs = await listPendingFollowRequests(b);
+    expect(reqs.length).toBe(1);
+    const reqId = reqs[0]!.id;
+
+    const approved = await approveFollowRequest(b, reqId);
+    expect(approved).toBe(true);
+    expect(await countPendingFollowRequests(b)).toBe(0);
+    expect(await countFollowers(b)).toBe(1);
+    expect(await getFollowState(a, bRow.username)).toEqual({ following: true, pending: false });
+
+    // Idempotent: approving again is a no-op.
+    expect(await approveFollowRequest(b, reqId)).toBe(false);
+
+    // Reject path: a fresh request from a 3rd user, B rejects.
+    const c = await makeUser({ username: `f_apc_${Date.now()}` });
+    await followUser(c, bRow.username);
+    const reqs2 = await listPendingFollowRequests(b);
+    expect(reqs2.length).toBe(1);
+    expect(await rejectFollowRequest(b, reqs2[0]!.id)).toBe(true);
+    expect(await countPendingFollowRequests(b)).toBe(0);
+    expect(await getFollowState(c, bRow.username)).toBeNull();
+  });
+
+  it("approve/reject is owner-bound (other users can't approve someone else's request)", async () => {
+    const a = await makeUser({ username: `f_obA_${Date.now()}` });
+    const b = await makeUser({ username: `f_obB_${Date.now()}`, profileVisibility: "private" });
+    const bRow = (await getDb().select().from(users).where(eq(users.id, b)))[0]!;
+    const c = await makeUser({ username: `f_obC_${Date.now()}` });
+    await followUser(a, bRow.username);
+    const reqs = await listPendingFollowRequests(b);
+    // C tries to approve B's incoming request — should be a no-op.
+    expect(await approveFollowRequest(c, reqs[0]!.id)).toBe(false);
+    expect(await countPendingFollowRequests(b)).toBe(1);
+  });
+
   it("404s on unknown username", async () => {
     const a = await makeUser({ username: `f_404_${Date.now()}` });
     await expect(followUser(a, "no_such_user_xyz")).rejects.toMatchObject({ code: "user_not_found" });

apps/journal/app/lib/follow.server.ts

@@ -1,11 +1,11 @@
 import { randomUUID } from "node:crypto";
-import { eq, and, count, desc } from "drizzle-orm";
+import { eq, and, count, desc, isNull, isNotNull } from "drizzle-orm";
 import { getDb } from "./db.ts";
 import { users, follows } from "@trails-cool/db/schema/journal";
 import { localActorIri } from "./actor-iri.ts";
 
 export class FollowError extends Error {
-  readonly code: "self_follow" | "private_profile" | "user_not_found" | "not_found";
+  readonly code: "self_follow" | "user_not_found" | "not_found" | "forbidden";
   constructor(code: FollowError["code"], message: string) {
     super(message);
     this.name = "FollowError";
@@ -34,18 +34,16 @@ async function loadFollowableTarget(targetUsername: string) {
 
 /**
  * Create a follow row from `followerId` to the local user with username
- * `targetUsername`. Auto-accepted because the target is local + public.
- * Idempotent: re-following an already-followed user returns the same state
- * without creating a duplicate row.
+ * `targetUsername`. Public targets auto-accept (`accepted_at = now()`),
+ * private (locked) targets land Pending (`accepted_at = NULL`) and
+ * appear in the target's /follows/requests list for manual approval.
+ * Idempotent: re-following keeps the existing row's state.
  */
 export async function followUser(followerId: string, targetUsername: string): Promise<FollowState> {
   const target = await loadFollowableTarget(targetUsername);
   if (target.id === followerId) {
     throw new FollowError("self_follow", "Users cannot follow themselves");
   }
-  if (target.profileVisibility !== "public") {
-    throw new FollowError("private_profile", "This profile is not followable");
-  }
 
   const db = getDb();
   const followedActorIri = localActorIri(target.username);
@@ -57,15 +55,19 @@ export async function followUser(followerId: string, targetUsername: string): Pr
     return { following: existing.acceptedAt !== null, pending: existing.acceptedAt === null };
   }
 
+  const acceptedAt = target.profileVisibility === "public" ? new Date() : null;
   await db.insert(follows).values({
     id: randomUUID(),
     followerId,
     followedActorIri,
     followedUserId: target.id,
-    acceptedAt: new Date(),
+    acceptedAt,
   });
 
-  return { following: true, pending: false };
+  return {
+    following: acceptedAt !== null,
+    pending: acceptedAt === null,
+  };
 }
 
 /**
@@ -101,12 +103,16 @@ export async function getFollowState(
   return { following: row.acceptedAt !== null, pending: row.acceptedAt === null };
 }
 
+// Counts include only accepted relations — Pending requests don't count
+// toward the public follower/following tallies (a request not yet
+// approved isn't a real follow).
+
 export async function countFollowers(userId: string): Promise<number> {
   const db = getDb();
   const [row] = await db
     .select({ n: count() })
     .from(follows)
-    .where(eq(follows.followedUserId, userId));
+    .where(and(eq(follows.followedUserId, userId), isNotNull(follows.acceptedAt)));
   return row?.n ?? 0;
 }
 
@@ -115,10 +121,91 @@ export async function countFollowing(userId: string): Promise<number> {
   const [row] = await db
     .select({ n: count() })
     .from(follows)
-    .where(eq(follows.followerId, userId));
+    .where(and(eq(follows.followerId, userId), isNotNull(follows.acceptedAt)));
   return row?.n ?? 0;
 }
 
+/**
+ * Count of incoming Pending follow requests for `userId`. Drives the
+ * navbar badge. Distinct from countFollowers (which is accepted-only).
+ */
+export async function countPendingFollowRequests(userId: string): Promise<number> {
+  const db = getDb();
+  const [row] = await db
+    .select({ n: count() })
+    .from(follows)
+    .where(and(eq(follows.followedUserId, userId), isNull(follows.acceptedAt)));
+  return row?.n ?? 0;
+}
+
+export interface FollowRequest {
+  id: string;
+  followerUsername: string;
+  followerDisplayName: string | null;
+  followerDomain: string;
+  createdAt: Date;
+}
+
+/**
+ * Pending incoming follow requests for `userId`. Used by /follows/requests.
+ * Reverse-chronological by request creation time.
+ */
+export async function listPendingFollowRequests(userId: string): Promise<FollowRequest[]> {
+  const db = getDb();
+  const rows = await db
+    .select({
+      id: follows.id,
+      followerUsername: users.username,
+      followerDisplayName: users.displayName,
+      followerDomain: users.domain,
+      createdAt: follows.createdAt,
+    })
+    .from(follows)
+    .innerJoin(users, eq(follows.followerId, users.id))
+    .where(and(eq(follows.followedUserId, userId), isNull(follows.acceptedAt)))
+    .orderBy(desc(follows.createdAt));
+  return rows;
+}
+
+/**
+ * Approve a Pending follow request. Owner-bound: `ownerId` must equal
+ * `follows.followedUserId` for the row, otherwise the call is a no-op.
+ */
+export async function approveFollowRequest(ownerId: string, followId: string): Promise<boolean> {
+  const db = getDb();
+  const result = await db
+    .update(follows)
+    .set({ acceptedAt: new Date() })
+    .where(
+      and(
+        eq(follows.id, followId),
+        eq(follows.followedUserId, ownerId),
+        isNull(follows.acceptedAt),
+      ),
+    )
+    .returning({ id: follows.id });
+  return result.length > 0;
+}
+
+/**
+ * Reject a Pending follow request. Deletes the row entirely so the
+ * follower can re-request later if they want.
+ */
+export async function rejectFollowRequest(ownerId: string, followId: string): Promise<boolean> {
+  const db = getDb();
+  const result = await db
+    .delete(follows)
+    .where(
+      and(
+        eq(follows.id, followId),
+        eq(follows.followedUserId, ownerId),
+        isNull(follows.acceptedAt),
+      ),
+    )
+    .returning({ id: follows.id });
+  return result.length > 0;
+}
+
 export interface CollectionEntry {
   username: string;
   displayName: string | null;
@@ -128,7 +215,8 @@ export interface CollectionEntry {
 const COLLECTION_PAGE_SIZE = 50;
 
 /**
- * Paginated list of users who follow `userId`. Newest acceptance first.
+ * Paginated list of accepted followers of `userId`. Newest acceptance first.
+ * Pending requests are excluded — they live in /follows/requests.
  */
 export async function listFollowers(userId: string, page: number = 1): Promise<CollectionEntry[]> {
   const db = getDb();
@@ -141,7 +229,7 @@ export async function listFollowers(userId: string, page: number = 1): Promise<C
     })
     .from(follows)
     .innerJoin(users, eq(follows.followerId, users.id))
-    .where(eq(follows.followedUserId, userId))
+    .where(and(eq(follows.followedUserId, userId), isNotNull(follows.acceptedAt)))
     .orderBy(desc(follows.acceptedAt))
     .limit(COLLECTION_PAGE_SIZE)
     .offset(offset);
@@ -149,9 +237,8 @@ export async function listFollowers(userId: string, page: number = 1): Promise<C
 }
 
 /**
- * Paginated list of users that `userId` follows. Newest acceptance first.
- * Limited to local follows in this change (`followedUserId IS NOT NULL`);
- * federation will surface remote actors here too.
+ * Paginated list of accepted follows from `userId`. Newest acceptance first.
+ * Pending outgoing follows (against private/locked targets) are excluded.
  */
 export async function listFollowing(userId: string, page: number = 1): Promise<CollectionEntry[]> {
   const db = getDb();
@@ -164,7 +251,7 @@ export async function listFollowing(userId: string, page: number = 1): Promise<C
     })
     .from(follows)
     .innerJoin(users, eq(follows.followedUserId, users.id))
-    .where(eq(follows.followerId, userId))
+    .where(and(eq(follows.followerId, userId), isNotNull(follows.acceptedAt)))
     .orderBy(desc(follows.acceptedAt))
     .limit(COLLECTION_PAGE_SIZE)
     .offset(offset);

apps/journal/app/root.tsx

@@ -62,10 +62,30 @@ export async function loader({ request }: Route.LoaderArgs) {
     }
   }
 
-  return { user: user ? { id: user.id, username: user.username } : null, locale };
+  // Pending follow-request count for the navbar badge. Cheap (a single
+  // `count(*) WHERE accepted_at IS NULL`); only computed for signed-in
+  // users. Hidden behind a dynamic import so the root layout doesn't
+  // pull in the follow module on anonymous renders.
+  let pendingFollowRequests = 0;
+  if (user) {
+    const { countPendingFollowRequests } = await import("./lib/follow.server.ts");
+    pendingFollowRequests = await countPendingFollowRequests(user.id);
+  }
+
+  return {
+    user: user ? { id: user.id, username: user.username } : null,
+    locale,
+    pendingFollowRequests,
+  };
 }
 
-function NavBar({ user }: { user: { id: string; username: string } | null }) {
+function NavBar({
+  user,
+  pendingFollowRequests,
+}: {
+  user: { id: string; username: string } | null;
+  pendingFollowRequests: number;
+}) {
   const { t } = useTranslation("journal");
   const location = useLocation();
 
@@ -103,6 +123,18 @@ function NavBar({ user }: { user: { id: string; username: string } | null }) {
         <div className="flex items-center gap-4">
           {user ? (
             <>
+              <Link
+                to="/follows/requests"
+                className={`relative ${linkClass("/follows/requests")}`}
+                title={t("social.requests.title")}
+              >
+                {t("social.requests.title")}
+                {pendingFollowRequests > 0 && (
+                  <span className="ml-1 inline-flex h-5 min-w-[1.25rem] items-center justify-center rounded-full bg-red-500 px-1.5 text-xs font-semibold text-white">
+                    {pendingFollowRequests}
+                  </span>
+                )}
+              </Link>
               <Link
                 to={`/users/${user.username}`}
                 className={linkClass(`/users/${user.username}`)}
@@ -143,6 +175,7 @@ function NavBar({ user }: { user: { id: string; username: string } | null }) {
 export default function App({ loaderData }: Route.ComponentProps) {
   const user = loaderData?.user;
   const locale = loaderData?.locale ?? "en";
+  const pendingFollowRequests = loaderData?.pendingFollowRequests ?? 0;
   useEffect(() => {
     if (user) {
       initSentryClient();
@@ -156,7 +189,7 @@ export default function App({ loaderData }: Route.ComponentProps) {
   return (
     <LocaleProvider locale={locale}>
       <AlphaBanner />
-      <NavBar user={user ?? null} />
+      <NavBar user={user ?? null} pendingFollowRequests={pendingFollowRequests} />
       <Outlet />
       <Footer />
     </LocaleProvider>

apps/journal/app/routes.ts

@@ -27,6 +27,9 @@ export default [
   route("users/:username/following", "routes/users.$username.following.tsx"),
   route("api/users/:username/follow", "routes/api.users.$username.follow.ts"),
   route("api/users/:username/unfollow", "routes/api.users.$username.unfollow.ts"),
+  route("follows/requests", "routes/follows.requests.tsx"),
+  route("api/follows/:id/approve", "routes/api.follows.$id.approve.ts"),
+  route("api/follows/:id/reject", "routes/api.follows.$id.reject.ts"),
   route("feed", "routes/feed.tsx"),
   route("settings", "routes/settings.tsx"),
   route("api/settings/profile", "routes/api.settings.profile.ts"),

apps/journal/app/routes/api.follows.$id.approve.ts

@@ -0,0 +1,19 @@
+import { data } from "react-router";
+import type { Route } from "./+types/api.follows.$id.approve";
+import { getSessionUser } from "~/lib/auth.server";
+import { approveFollowRequest } from "~/lib/follow.server";
+
+export async function action({ request, params }: Route.ActionArgs) {
+  if (request.method !== "POST") {
+    return data({ error: "Method not allowed" }, { status: 405 });
+  }
+  const user = await getSessionUser(request);
+  if (!user) return data({ error: "Unauthorized" }, { status: 401 });
+
+  const id = params.id;
+  if (!id) return data({ error: "id required" }, { status: 400 });
+
+  const ok = await approveFollowRequest(user.id, id);
+  if (!ok) return data({ error: "Not found" }, { status: 404 });
+  return data({ ok: true });
+}

apps/journal/app/routes/api.follows.$id.reject.ts

@@ -0,0 +1,19 @@
+import { data } from "react-router";
+import type { Route } from "./+types/api.follows.$id.reject";
+import { getSessionUser } from "~/lib/auth.server";
+import { rejectFollowRequest } from "~/lib/follow.server";
+
+export async function action({ request, params }: Route.ActionArgs) {
+  if (request.method !== "POST") {
+    return data({ error: "Method not allowed" }, { status: 405 });
+  }
+  const user = await getSessionUser(request);
+  if (!user) return data({ error: "Unauthorized" }, { status: 401 });
+
+  const id = params.id;
+  if (!id) return data({ error: "id required" }, { status: 400 });
+
+  const ok = await rejectFollowRequest(user.id, id);
+  if (!ok) return data({ error: "Not found" }, { status: 404 });
+  return data({ ok: true });
+}

apps/journal/app/routes/follows.requests.tsx

@@ -0,0 +1,99 @@
+import { data, redirect, useFetcher } from "react-router";
+import { useTranslation } from "react-i18next";
+import type { Route } from "./+types/follows.requests";
+import { getSessionUser } from "~/lib/auth.server";
+import { listPendingFollowRequests } from "~/lib/follow.server";
+import { ClientDate } from "~/components/ClientDate";
+
+export async function loader({ request }: Route.LoaderArgs) {
+  const user = await getSessionUser(request);
+  if (!user) throw redirect("/auth/login");
+
+  const requests = await listPendingFollowRequests(user.id);
+  return data({
+    requests: requests.map((r) => ({
+      id: r.id,
+      followerUsername: r.followerUsername,
+      followerDisplayName: r.followerDisplayName,
+      followerDomain: r.followerDomain,
+      createdAt: r.createdAt.toISOString(),
+    })),
+  });
+}
+
+export function meta(_args: Route.MetaArgs) {
+  return [{ title: "Follow requests — trails.cool" }];
+}
+
+interface RequestRow {
+  id: string;
+  followerUsername: string;
+  followerDisplayName: string | null;
+  followerDomain: string;
+  createdAt: string;
+}
+
+function RequestItem({ row }: { row: RequestRow }) {
+  const { t } = useTranslation("journal");
+  const approve = useFetcher();
+  const reject = useFetcher();
+  const inFlight = approve.state !== "idle" || reject.state !== "idle";
+
+  return (
+    <li className="flex items-center justify-between px-4 py-3">
+      <div>
+        <a
+          href={`/users/${row.followerUsername}`}
+          className="text-sm font-medium text-gray-900 hover:underline"
+        >
+          {row.followerDisplayName ?? row.followerUsername}
+        </a>
+        <p className="text-xs text-gray-500">
+          @{row.followerUsername}@{row.followerDomain} ·{" "}
+          <ClientDate iso={row.createdAt} />
+        </p>
+      </div>
+      <div className="flex gap-2">
+        <reject.Form method="post" action={`/api/follows/${row.id}/reject`}>
+          <button
+            type="submit"
+            disabled={inFlight}
+            className="rounded-md border border-gray-300 bg-white px-3 py-1.5 text-sm font-medium text-gray-700 hover:bg-gray-50 disabled:opacity-50"
+          >
+            {t("social.requests.reject")}
+          </button>
+        </reject.Form>
+        <approve.Form method="post" action={`/api/follows/${row.id}/approve`}>
+          <button
+            type="submit"
+            disabled={inFlight}
+            className="rounded-md bg-blue-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-blue-700 disabled:opacity-50"
+          >
+            {t("social.requests.approve")}
+          </button>
+        </approve.Form>
+      </div>
+    </li>
+  );
+}
+
+export default function FollowRequests({ loaderData }: Route.ComponentProps) {
+  const { requests } = loaderData;
+  const { t } = useTranslation("journal");
+
+  return (
+    <div className="mx-auto max-w-2xl px-4 py-8">
+      <h1 className="text-2xl font-bold text-gray-900">{t("social.requests.title")}</h1>
+
+      {requests.length === 0 ? (
+        <p className="mt-8 text-center text-gray-500">{t("social.requests.empty")}</p>
+      ) : (
+        <ul className="mt-6 divide-y divide-gray-200 rounded-lg border border-gray-200 bg-white">
+          {requests.map((r) => (
+            <RequestItem key={r.id} row={r} />
+          ))}
+        </ul>
+      )}
+    </div>
+  );
+}

apps/journal/app/routes/users.$username.tsx

@@ -20,33 +20,36 @@ export async function loader({ params, request }: Route.LoaderArgs) {
     throw data({ error: "User not found" }, { status: 404 });
   }
 
-  const [publicRoutes, publicActivities, currentUser, followers, following] = await Promise.all([
-    listPublicRoutesForOwner(user.id),
-    listPublicActivitiesForOwner(user.id),
-    getSessionUser(request),
-    countFollowers(user.id),
-    countFollowing(user.id),
-  ]);
-
+  const currentUser = await getSessionUser(request);
   const isOwn = currentUser?.id === user.id;
 
-  // Profile-visibility gate: a `private` profile 404s for everyone but
-  // the owner, regardless of how much public content they have.
-  if (!isOwn && user.profileVisibility !== "public") {
-    throw data({ error: "User not found" }, { status: 404 });
-  }
-
-  // 404 for public-but-empty profiles to prevent account enumeration.
-  // Owners still see their own profile even when empty.
-  if (!isOwn && publicRoutes.length === 0 && publicActivities.length === 0) {
-    throw data({ error: "User not found" }, { status: 404 });
-  }
-
-  // Follow state for non-owner viewers (null when anonymous).
+  // Follow state: null when anonymous or owner; { following, pending }
+  // otherwise.
   const followState = !isOwn && currentUser
     ? await getFollowState(currentUser.id, user.username)
     : null;
 
+  // Locked-account model: a private profile renders a stub for
+  // non-followers (anonymous OR signed-in but not an accepted follower).
+  // Owners always see their own profile in full.
+  const canSeeContent =
+    isOwn ||
+    user.profileVisibility === "public" ||
+    (followState !== null && followState.following === true);
+
+  // For private-stub viewers we still want counts (cheap) but skip the
+  // expensive content fetches.
+  const [followers, following] = await Promise.all([
+    countFollowers(user.id),
+    countFollowing(user.id),
+  ]);
+  const [publicRoutes, publicActivities] = canSeeContent
+    ? await Promise.all([
+        listPublicRoutesForOwner(user.id),
+        listPublicActivitiesForOwner(user.id),
+      ])
+    : [[], []];
+
   // Demo-account badge: true when this profile matches the instance's
   // configured demo persona username. Computed server-side so we don't
   // ship the persona config through client HTML.
@@ -84,6 +87,7 @@ export async function loader({ params, request }: Route.LoaderArgs) {
     followState,
     isLoggedIn: currentUser !== null,
     profileVisibility: user.profileVisibility,
+    canSeeContent,
   });
 }
 
@@ -109,7 +113,7 @@ export function meta({ data: loaderData }: Route.MetaArgs) {
 }
 
 export default function UserProfilePage({ loaderData }: Route.ComponentProps) {
-  const { user, routes, activities, isOwn, isDemoUser, followers, following, followState, isLoggedIn } = loaderData;
+  const { user, routes, activities, isOwn, isDemoUser, followers, following, followState, isLoggedIn, canSeeContent } = loaderData;
   const { t } = useTranslation("journal");
 
   return (
@@ -123,6 +127,14 @@ export default function UserProfilePage({ loaderData }: Route.ComponentProps) {
             <h1 className="text-2xl font-bold text-gray-900">
               {user.displayName ?? user.username}
             </h1>
+            {loaderData.profileVisibility === "private" && !isOwn && (
+              <span
+                className="rounded-full bg-gray-200 px-2 py-0.5 text-xs font-medium text-gray-700"
+                title={t("profile.lockedTitle")}
+              >
+                🔒 {t("profile.lockedBadge")}
+              </span>
+            )}
             {isDemoUser && (
               <span className="rounded-full bg-amber-100 px-2 py-0.5 text-xs font-medium text-amber-800">
                 {t("demo.badge")}
@@ -153,11 +165,34 @@ export default function UserProfilePage({ loaderData }: Route.ComponentProps) {
         {!isOwn && isLoggedIn && (
           <FollowButton
             username={user.username}
+            isPrivateTarget={loaderData.profileVisibility === "private"}
             initialState={followState}
           />
         )}
       </div>
 
+      {!canSeeContent && (
+        <div className="mt-8 rounded-lg border border-gray-200 bg-gray-50 p-6 text-center">
+          <p className="text-2xl" aria-hidden="true">🔒</p>
+          <p className="mt-2 text-sm font-medium text-gray-900">
+            {t("profile.privateStub.heading")}
+          </p>
+          <p className="mt-1 text-sm text-gray-500">
+            {isLoggedIn
+              ? t("profile.privateStub.bodyAuth")
+              : t("profile.privateStub.bodyAnon")}
+          </p>
+          {!isLoggedIn && (
+            <a
+              href="/auth/login"
+              className="mt-4 inline-block rounded-md border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50"
+            >
+              {t("auth.login")}
+            </a>
+          )}
+        </div>
+      )}
+
       {isOwn && loaderData.profileVisibility === "private" && (
         <div className="mt-6 rounded-md border border-amber-200 bg-amber-50 p-3 text-sm text-amber-800">
           {t("profile.privateNote")}{" "}
@@ -175,6 +210,8 @@ export default function UserProfilePage({ loaderData }: Route.ComponentProps) {
         </div>
       )}
 
+      {canSeeContent && (
+        <>
       <section className="mt-8">
         <h2 className="text-lg font-semibold text-gray-900">
           {t("routes.title")} ({routes.length})
@@ -238,6 +275,8 @@ export default function UserProfilePage({ loaderData }: Route.ComponentProps) {
           </ul>
         )}
       </section>
+        </>
+      )}
     </div>
   );
 }

e2e/social.test.ts

@@ -26,6 +26,17 @@ async function registerUser(page: Page, email: string, username: string) {
   await expect(page).toHaveURL("/", { timeout: 10000 });
 }
 
+async function setProfileVisibility(page: Page, value: "public" | "private") {
+  await page.goto("/settings");
+  if (value === "public") {
+    await page.getByLabel("Public").check();
+  } else {
+    await page.getByLabel(/Private/).check();
+  }
+  await page.getByRole("button", { name: /^Save$/ }).first().click();
+  await page.waitForLoadState("networkidle");
+}
+
 // WebAuthn + parallel workers + shared local Postgres race; serialize.
 test.describe.configure({ mode: "serial" });
 
@@ -35,6 +46,11 @@ test.describe("Social follows + /feed", () => {
     await expect(page).toHaveURL(/\/auth\/login/, { timeout: 10000 });
   });
 
+  test("/follows/requests redirects anonymous visitors to login", async ({ page }) => {
+    await page.goto("/follows/requests");
+    await expect(page).toHaveURL(/\/auth\/login/, { timeout: 10000 });
+  });
+
   test("Follow button toggles state on a public profile", async ({ page, browser }) => {
     const cdp = await page.context().newCDPSession(page);
     await setupVirtualAuthenticator(cdp);
@@ -45,31 +61,17 @@ test.describe("Social follows + /feed", () => {
     const bEmail = `social-b-${stamp}@example.com`;
     const bUsername = `sb${stamp}`;
 
-    // Register A in the main page.
     await registerUser(page, aEmail, aUsername);
 
-    // Register B in a separate browser context (independent session).
+    // Register B in a separate browser context so we have two independent
+    // sessions. New users default to `private` — B flips to public so this
+    // test exercises the auto-accept path.
     const bCtx = await browser.newContext();
     const bPage = await bCtx.newPage();
     const bCdp = await bPage.context().newCDPSession(bPage);
     await setupVirtualAuthenticator(bCdp);
     await registerUser(bPage, bEmail, bUsername);
-
-    // B's profile alone won't render publicly without any public content;
-    // that's tested elsewhere. For follow-button transitions, we use the
-    // user-list page directly (which gates only on profile_visibility).
-    // Instead, seed a public route from B via the existing routes.new
-    // flow so B's profile renders.
-    await bPage.goto("/routes/new");
-    await bPage.getByLabel("Name").fill("Public ride");
-    await bPage.getByRole("button", { name: "Create Route" }).click();
-    await bPage.waitForURL(/\/routes\/[0-9a-f-]+$/, { timeout: 10000 });
-    const url = bPage.url();
-    const id = url.split("/").pop()!;
-    await bPage.goto(`/routes/${id}/edit`);
-    await bPage.getByLabel("Visibility").selectOption("public");
-    await bPage.getByRole("button", { name: "Save Changes" }).click();
-    await bPage.waitForURL(new RegExp(`/routes/${id}$`), { timeout: 10000 });
+    await setProfileVisibility(bPage, "public");
 
     // A visits B's profile and follows.
     await page.goto(`/users/${bUsername}`);
@@ -81,57 +83,76 @@ test.describe("Social follows + /feed", () => {
     await page.reload();
     await expect(page.getByRole("link", { name: /1\s+Followers/i })).toBeVisible();
 
-    // Unfollow goes back to Follow.
+    // Unfollow.
     await page.getByRole("button", { name: "Unfollow" }).click();
     await expect(page.getByRole("button", { name: "Follow" })).toBeVisible({ timeout: 5000 });
 
     await bCtx.close();
   });
 
-  test("Profile visibility toggle: private 404s, public restores", async ({ page, browser }) => {
+  test("Private profile: stub for visitors, Request → Pending → Approve → full view", async ({ page, browser }) => {
     const cdp = await page.context().newCDPSession(page);
     await setupVirtualAuthenticator(cdp);
 
     const stamp = Date.now();
-    const ownerEmail = `vis-${stamp}@example.com`;
-    const ownerUsername = `vu${stamp}`;
-    await registerUser(page, ownerEmail, ownerUsername);
+    const aEmail = `req-a-${stamp}@example.com`;
+    const aUsername = `ra${stamp}`;
+    const bEmail = `req-b-${stamp}@example.com`;
+    const bUsername = `rb${stamp}`;
 
-    // Create a public route so the owner's profile would otherwise render.
-    await page.goto("/routes/new");
-    await page.getByLabel("Name").fill("Trail run");
-    await page.getByRole("button", { name: "Create Route" }).click();
-    await page.waitForURL(/\/routes\/[0-9a-f-]+$/, { timeout: 10000 });
-    const url = page.url();
-    const id = url.split("/").pop()!;
-    await page.goto(`/routes/${id}/edit`);
-    await page.getByLabel("Visibility").selectOption("public");
-    await page.getByRole("button", { name: "Save Changes" }).click();
-    await page.waitForURL(new RegExp(`/routes/${id}$`), { timeout: 10000 });
+    await registerUser(page, aEmail, aUsername);
+
+    const bCtx = await browser.newContext();
+    const bPage = await bCtx.newPage();
+    const bCdp = await bPage.context().newCDPSession(bPage);
+    await setupVirtualAuthenticator(bCdp);
+    await registerUser(bPage, bEmail, bUsername);
+    // B stays at the default `private`. Verify by loading the profile
+    // anonymously and seeing the stub.
 
-    // Visitor: profile reachable.
     const anonCtx = await browser.newContext();
     const anon = await anonCtx.newPage();
-    const before = await anon.goto(`/users/${ownerUsername}`);
-    expect(before?.status()).toBe(200);
+    const anonResp = await anon.goto(`/users/${bUsername}`);
+    expect(anonResp?.status()).toBe(200);
+    await expect(anon.getByText(/This profile is private/i)).toBeVisible();
 
-    // Owner flips to private.
-    await page.goto("/settings");
-    await page.getByLabel("Private").check();
-    await page.getByRole("button", { name: /^Save$/ }).first().click();
-    await page.waitForLoadState("networkidle");
+    // A (signed in) visits B's private profile — sees stub + Request button.
+    await page.goto(`/users/${bUsername}`);
+    await expect(page.getByText(/This profile is private/i)).toBeVisible();
+    await expect(page.getByRole("button", { name: /Request to follow/i })).toBeVisible();
+    await page.getByRole("button", { name: /Request to follow/i }).click();
+    await expect(page.getByRole("button", { name: /Requested/i })).toBeVisible({ timeout: 5000 });
 
-    const after = await anon.goto(`/users/${ownerUsername}`);
-    expect(after?.status()).toBe(404);
+    // B sees the request in /follows/requests with badge in nav.
+    await bPage.goto("/follows/requests");
+    await expect(bPage.getByText(`@${aUsername}`)).toBeVisible();
+    await bPage.getByRole("button", { name: "Approve" }).click();
+    await bPage.waitForLoadState("networkidle");
+    // Empty state after approval.
+    await expect(bPage.getByText(/No pending follow requests/i)).toBeVisible();
 
-    // Flip back to public.
-    await page.goto("/settings");
-    await page.getByLabel("Public").check();
-    await page.getByRole("button", { name: /^Save$/ }).first().click();
-    await page.waitForLoadState("networkidle");
+    // A reloads B's profile — now sees full content (no stub) + Unfollow.
+    await page.goto(`/users/${bUsername}`);
+    await expect(page.getByText(/This profile is private/i)).not.toBeVisible();
+    await expect(page.getByRole("button", { name: "Unfollow" })).toBeVisible();
 
-    const restored = await anon.goto(`/users/${ownerUsername}`);
-    expect(restored?.status()).toBe(200);
+    await bCtx.close();
+    await anonCtx.close();
+  });
+
+  test("Private profile: visitor sees stub layout (200, not 404)", async ({ page, browser }) => {
+    const cdp = await page.context().newCDPSession(page);
+    await setupVirtualAuthenticator(cdp);
+    const stamp = Date.now();
+    const username = `priv${stamp}`;
+    await registerUser(page, `priv-${stamp}@example.com`, username);
+    // User stays at default `private`.
+
+    const anonCtx = await browser.newContext();
+    const anon = await anonCtx.newPage();
+    const resp = await anon.goto(`/users/${username}`);
+    expect(resp?.status()).toBe(200);
+    await expect(anon.getByText(/This profile is private/i)).toBeVisible();
 
     await anonCtx.close();
   });

openspec/changes/social-feed/design.md

@@ -20,34 +20,35 @@ This change is local-only social: follows between users on the same Journal inst
 
 **Non-Goals:**
 - **All ActivityPub federation primitives** — Fedify integration, actor objects, WebFinger, signed inbox/outbox, remote actor caching, audience-aware ingestion. Deferred to `social-federation`. The `follows` schema is shaped to accept remote IRIs but no remote IRIs will land in this change.
-- **Locked local accounts** (a manual approval flow for our own users). Out of scope; the `'public' | 'private'` enum on `profile_visibility` is intentionally minimal so a `locked` value or `users.locked` flag can extend it cleanly. Tracked as follow-up `locked-local-accounts`.
 - Blocking, muting, or report flows.
 - Direct messages or any non-activity ActivityPub object.
 - Real-time WebSocket feed updates. The feed is loader-driven and refreshes on page load.
 - A "people you may know" / suggestions surface.
+- A unified notification center. The follow-request count badge in the navbar covers this one signal; broader notifications (for new public activities from people you follow, replies, etc.) will be designed in a follow-up.
 
 ## Decisions
 
-### Decision: Make profile visibility explicit on the `users` row
+### Decision: Locked-account model — `private` means stub-with-request, not 404
 
-Today the Journal has no profile-level visibility setting. A profile is "public" implicitly: `/users/:username` returns 200 iff the user has at least one `public` route or activity, otherwise 404 (and the 404 doesn't distinguish "no such user" from "private content only" so existence isn't leaked).
+`users.profile_visibility: 'public' | 'private'` (NOT NULL). New users default to **`'private'`**; existing users were backfilled to **`'public'`** on first migration so behavior didn't change for anyone already on the instance.
 
-Add `users.profile_visibility: 'public' | 'private'` (NOT NULL, default `'public'`).
+Behavior:
 
-The new rules:
+- **Public profile**: `/users/:username` renders fully to anyone. Follows auto-accept.
+- **Private (locked) profile**: `/users/:username` renders a stub for non-owner viewers without an accepted follow — header (display name, handle, follower/following counts) plus a 🔒 badge plus a "this profile is private" body and a Request-to-Follow button. Accepted followers (from earlier approval) see the full profile; the owner always sees their own profile. Follows against a private profile create a Pending row (`accepted_at = NULL`) which the owner approves or rejects from `/follows/requests`.
+- **Approve/reject**: dedicated endpoints + a navbar entry with a count badge. Approving sets `accepted_at = now()`; rejecting deletes the row so the requester can re-request later.
 
-- `/users/:username` returns 200 iff `profile_visibility = 'public'` **AND** the user has at least one `public` route or activity. The "has public content" gate is preserved so a brand-new public-by-default account doesn't expose a 200 page that says "no posts yet" — that would leak existence.
-- A user is followable iff `profile_visibility = 'public'`, regardless of whether they have content yet. (Following someone before they post is reasonable; the follower's feed just stays empty for that follow until the user posts.)
+This is the Mastodon "locked account" pattern, applied locally. It composes with federation cleanly: when `social-federation` lands, remote inbound `Follow` activities targeting a local private user will follow the same Pending → Accepted lifecycle.
 
-When `social-federation` lands, the local user's ActivityPub actor object will gate on the same `profile_visibility = 'public'` check — private profiles will return 404 to federation lookups too.
+**Default `'private'`:** matches trails.cool's privacy-first content defaults (activities and routes already default `'private'`). The earlier proposal defaulted public to mirror Mastodon, but Mastodon's default-public is for discoverable + auto-accept; ours is now stronger ("locked"), so opt-in is the right inversion.
 
-**Default `'public'`:** matches fediverse convention (Mastodon defaults to discoverable; "lock" is opt-in), aligns with the existing implicit behavior where any user *could* be public, and keeps onboarding smooth (post a public route → it's listed on your profile, no extra toggle). Activity-level privacy still defaults to `'private'`, so content stays private by default; *being findable on the network* is the part we default open.
+**Existence is observable.** Even on a private profile the URL returns 200 with a stub. We accept that "the username exists" is leaked — `private` is about gating *content*, not gating *existence*. Hiding existence entirely is a different feature (and not one we ship; if you want to be undiscoverable, don't share your handle).
 
-**Migration:** backfill all existing users to `'public'`. Their effective profile reachability is unchanged (still gated on having public content). Operators can flip themselves to `'private'` post-migration if desired.
+**Migration:** backfill existing users to `'public'` so accounts created before this change keep their open behavior; new accounts post-deploy default `'private'`. No backfill of follow state needed because the social layer didn't exist before.
 
-**Why explicit, why now:** with follows landing, the question "can someone follow you?" needs a deterministic answer. Deriving it from "do you have any public content?" is fragile (toggling content visibility silently flips followability). The toggle also pre-pays for `locked-local-accounts`, which will extend this enum or add a `users.locked` flag.
+**Why now (not deferred to a separate change):** the 404-for-private model that an earlier draft of this spec described would have required a follow-up that re-implements the entire profile loader to switch to a stub. Doing the locked model from the start avoids that churn.
 
-**Alternative considered:** add a `'public' | 'unlisted' | 'private'` triple to mirror activity visibility. Rejected for now — `'unlisted'` for profiles ("actor object resolvable but profile page 404s") is a real fediverse pattern but a confusing UX surface to ship before users ask for it. Add as a third state if needed later.
+**Alternative considered:** add a `'public' | 'unlisted' | 'private'` triple where `unlisted` means "profile page 404s but actor object exists for federation." Rejected for now; we don't need three states, and `unlisted` is a confusing UX surface to ship without user demand.
 
 ### Decision: Pull-based feed, not fan-out-on-write
 

openspec/changes/social-feed/proposal.md

@@ -6,17 +6,18 @@ This change ships the *local* social layer: follows between users on the same Jo
 
 ## What Changes
 
-- Add an explicit `users.profile_visibility` setting (`'public' | 'private'`, default `'public'`). Today profile-publicness is implicit (derived from "has any public content"); making it explicit unifies the mental model with activity/route visibility, gives users a real toggle for "be discoverable at all," and gates future federation cleanly. Existing users migrate to `'public'`.
-- Users SHALL be able to follow another *local* user (same instance) by clicking a Follow button on the user's profile page. Local public profiles auto-accept the follow.
-- A signed-in user SHALL be able to view a **social feed** of public activities from the users they follow, reverse-chronological, at a dedicated `/feed` route linked from the nav.
+- Add an explicit `users.profile_visibility` setting (`'public' | 'private'`). New accounts default to `'private'` (matches trails.cool's privacy-first content defaults); existing accounts are backfilled to `'public'` so deploy doesn't lock anyone down. `private` is functionally Mastodon's "locked" account: profile renders a stub with a Request-to-follow button for non-followers; only accepted followers see content; follows land Pending until the owner approves.
+- Users SHALL be able to follow another *local* user (same instance) by clicking a Follow / Request-to-follow button on the user's profile page. Public targets auto-accept; private targets create a Pending row that the owner approves or rejects from `/follows/requests`.
+- A signed-in user SHALL have a `/follows/requests` page listing all incoming Pending requests with Approve / Reject actions; the navbar shows a count badge linking to that page.
+- A signed-in user SHALL be able to view a **social feed** of public activities from the users they follow with an accepted relation, reverse-chronological, at a dedicated `/feed` route linked from the nav.
 - The logged-in home (`/`) SHALL link prominently to the new social feed; personal dashboard content stays as-is for now.
-- Public profile pages SHALL show follower and following counts and a Follow / Unfollow toggle for the viewing user.
-- Privacy: the follow relationship on a single instance is queryable (follower/following lists are public) matching Mastodon-style conventions. Only `public` activities appear in the feed — `unlisted` and `private` stay out even if you follow the owner.
+- Profile pages SHALL show follower and following counts (accepted-only) and a context-aware Follow control (Follow / Request to follow / Requested / Unfollow).
+- Privacy: follower/following counts and lists are public per instance. Only `public` activities appear in the feed; pending follows don't contribute content.
 - Privacy manifest: documents the new `follows` relation as data the instance retains about who follows whom.
 - **Forward-compatible schema**: `follows` is keyed by an `actor_iri TEXT` column even though all rows are local now (local user IRIs look like `https://{DOMAIN}/users/{username}`). When `social-federation` lands, remote IRIs go in the same column with no migration.
 - **Out of scope** (tracked as follow-ups):
   - ActivityPub federation primitives — `social-federation`. Goal there is "Mastodon can follow a trails account" inbound and "trails can follow other trails instances" outbound.
-  - Locked local accounts (manual follow approval) — `locked-local-accounts`. The current `'public' | 'private'` enum is intentionally minimal so the locked enum value (or a separate `users.locked` flag) can be added cleanly later.
+  - A unified notification UI. The follow-request count badge is a one-off; broader notifications (e.g., "your follow request was approved", "new public activity from people you follow") will be designed in a follow-up.
 
 ## Capabilities
 

openspec/changes/social-feed/specs/public-profiles/spec.md

@@ -1,49 +1,58 @@
 ## ADDED Requirements
 
-### Requirement: Profile visibility setting
-Every user SHALL have an explicit `profile_visibility` of `public` or `private`. New accounts SHALL default to `public`. Users SHALL be able to change their profile visibility from account settings at any time.
+### Requirement: Profile visibility setting (locked accounts)
+Every user SHALL have an explicit `profile_visibility` of `public` or `private`. New accounts SHALL default to `private` (locked: profile is reachable but content is gated behind follow approval). Users SHALL be able to change their profile visibility from account settings at any time. `private` is functionally Mastodon's "locked" / "manually approves followers" — visitors see a stub with a Request-to-follow button, follows land in a Pending state, and content is only revealed to accepted followers.
 
 #### Scenario: Default for a new account
 - **WHEN** a user registers
-- **THEN** their `profile_visibility` is `public`
+- **THEN** their `profile_visibility` is `private`
 
 #### Scenario: Existing user backfilled to public
 - **WHEN** the migration that introduces `profile_visibility` runs against pre-existing rows
-- **THEN** every existing user's `profile_visibility` is set to `public`, preserving current effective behavior
+- **THEN** every existing user's `profile_visibility` is set to `public`, preserving current effective behavior (no surprise lock-down at deploy)
 
 #### Scenario: User toggles profile to private
 - **WHEN** a user changes their profile visibility to `private` in settings and saves
-- **THEN** subsequent requests to `/users/:username` return HTTP 404 (regardless of how much public content they have), and they become unfollowable (existing follow rows are unaffected, but no new follows can be created)
+- **THEN** subsequent visitor requests to `/users/:username` return HTTP 200 but render a stub page (header + Request-to-follow button) with no content; existing follow rows are unaffected; new follows from anyone other than already-accepted followers are recorded as Pending
 
 #### Scenario: User toggles profile back to public
 - **WHEN** a previously-private user switches `profile_visibility` to `public` and saves
-- **THEN** their `/users/:username` becomes reachable again (subject to the existing "has public content" gate) and Follow buttons reappear for visitors
+- **THEN** their `/users/:username` renders the full profile to anyone again, and any incoming follows auto-accept going forward
 
 ## MODIFIED Requirements
 
 ### Requirement: Public profile page
-The Journal SHALL serve a public profile page at `/users/:username` that lists the user's public routes and activities in reverse chronological order, viewable without authentication. The page SHALL render only when the user's `profile_visibility` is `public` AND they have at least one `public` route or activity. For signed-in viewers other than the owner, the page SHALL display a Follow / Unfollow toggle that mirrors the current follow relation (see `social-follows` spec). The page SHALL also display follower and following counts with links to the respective collections.
+The Journal SHALL serve a profile page at `/users/:username` for any user who exists. The render SHALL depend on the viewer relationship to the profile owner:
+- If the username does not exist, return HTTP 404.
+- If the owner's `profile_visibility = 'public'`, render the full profile (display name, handle, follower/following counts, public routes, public activities) regardless of who is viewing.
+- If the owner's `profile_visibility = 'private'`, render a stub page (header + handle + counts + lock badge) for non-owner viewers who do NOT have an accepted follow relation. Render the full profile for the owner themselves and for accepted followers.
 
-#### Scenario: Logged-out visitor views a public profile with public content
-- **WHEN** an unauthenticated visitor navigates to `/users/:username` for a user whose `profile_visibility` is `public` and who has at least one `public` route or activity
-- **THEN** the page renders that user's display name (falling back to username), the `@username@domain` handle, follower and following counts, and a reverse-chronological list of their `public` routes and `public` activities
-- **AND** items marked `unlisted` or `private` do NOT appear in the list
+The page SHALL display follower and following counts (always, regardless of stub vs. full). For signed-in viewers other than the owner, the page SHALL render a Follow button whose label depends on the relation: "Follow" against a public profile with no relation, "Request to follow" against a private profile with no relation, "Requested" (cancellable) when a Pending request exists, "Unfollow" when an accepted relation exists.
 
-#### Scenario: Profile 404 cases are indistinguishable
-- **WHEN** a visitor navigates to `/users/:username` for any of: a user with `profile_visibility = 'private'`, a user with `profile_visibility = 'public'` but zero public items, a user whose content is all `private` or `unlisted`, or a username that does not exist
-- **THEN** the server responds with HTTP 404
-- **AND** the response does NOT distinguish the cases, so existence of a private account is not leaked
+#### Scenario: Logged-out visitor views a public profile
+- **WHEN** an unauthenticated visitor navigates to `/users/:username` for a user whose `profile_visibility` is `public`
+- **THEN** the page renders the full profile (display name, handle, counts, public routes, public activities)
+
+#### Scenario: Logged-out visitor views a private profile
+- **WHEN** an unauthenticated visitor navigates to `/users/:username` for a user whose `profile_visibility` is `private`
+- **THEN** the page returns HTTP 200 and renders the stub layout — header with display name, handle, and counts; a 🔒 "Private" badge; a body block with "This profile is private" and a sign-in prompt; no routes or activities are rendered
+
+#### Scenario: Signed-in visitor views a private profile they don't follow
+- **WHEN** a signed-in user other than the owner navigates to `/users/:username` for a private profile, with no follow row OR a Pending follow row
+- **THEN** the page returns 200 and renders the stub layout, plus a Follow button (or Pending indicator) so the viewer can request access
+
+#### Scenario: Signed-in viewer with accepted follow sees full private profile
+- **WHEN** a signed-in user with an accepted follow against a private user navigates to that user's profile
+- **THEN** the page returns 200 and renders the full profile — same as a public profile would render — plus an Unfollow button
 
 #### Scenario: Owner sees their own profile
 - **WHEN** a user navigates to their own `/users/:username` while logged in
-- **THEN** if their `profile_visibility = 'public'` and they have at least one public item, the page renders exactly the same as for a logged-out visitor, plus a small owner-only control strip linking to settings
-- **AND** if their profile would 404 for visitors (private or no public content), they are redirected to settings or shown an owner-only "your profile isn't public yet" view (implementation detail)
-- **AND** no Follow button is shown (users cannot follow themselves)
+- **THEN** the full profile renders regardless of `profile_visibility`, plus a small owner-only banner (blue "ownNote" for public profiles, amber "private/locked" explanation for private profiles), plus a link to settings; no Follow button is shown
 
-#### Scenario: Signed-in viewer sees a Follow control on a public profile
-- **WHEN** a signed-in user other than the owner loads a profile that returns 200
-- **THEN** the page renders a Follow button if no follow row exists for them against this user, and an Unfollow button if one does
+#### Scenario: Profile 404 only for nonexistent users
+- **WHEN** a visitor navigates to `/users/:username` for a username that does not exist
+- **THEN** the server responds with HTTP 404
 
 #### Scenario: Profile page emits social-share metadata
-- **WHEN** any visitor loads a populated `/users/:username`
+- **WHEN** any visitor loads a populated `/users/:username` (full or stub)
 - **THEN** the page emits Open Graph tags (`og:title`, `og:site_name`, `og:type="profile"`) so links shared on social platforms render a meaningful preview

openspec/changes/social-feed/specs/social-follows/spec.md

@@ -1,44 +1,79 @@
 ## ADDED Requirements
 
 ### Requirement: Follow another user
-A signed-in user SHALL be able to follow another local user from a profile page. Local users with `profile_visibility = 'public'` auto-accept the follow. Local users with `profile_visibility = 'private'` SHALL NOT be followable. Following remote ActivityPub actors is out of scope and tracked in the `social-federation` change.
+A signed-in user SHALL be able to follow another local user from a profile page. Public targets auto-accept (`accepted_at = now()`); private (locked) targets land in a Pending state (`accepted_at = NULL`) until the target approves the request from `/follows/requests`. Following remote ActivityPub actors is out of scope here and tracked in the `social-federation` change.
 
 #### Scenario: Follow a local public profile
 - **WHEN** a signed-in user clicks "Follow" on a local user with `profile_visibility = 'public'`
 - **THEN** a follow row is recorded with `accepted_at = now()`, the button becomes "Unfollow", and the target's follower count increments
 
-#### Scenario: Cannot follow a private profile
-- **WHEN** a signed-in user attempts to follow a local user with `profile_visibility = 'private'`
-- **THEN** the follow API returns an error (4xx) and no follow row is created
+#### Scenario: Follow a local private (locked) profile
+- **WHEN** a signed-in user clicks "Request to follow" on a local user with `profile_visibility = 'private'`
+- **THEN** a follow row is recorded with `accepted_at = NULL`, the button becomes "Requested" (cancellable), the request appears in the target's `/follows/requests` page, and the target's follower count does NOT increment
 
 #### Scenario: Cannot follow yourself
 - **WHEN** a signed-in user attempts to follow their own profile
 - **THEN** the follow API returns an error (4xx) and no follow row is created
 
-#### Scenario: Unfollow
-- **WHEN** the follower clicks "Unfollow" on a profile they already follow
-- **THEN** the follow row is deleted and the target's follower count decrements
+#### Scenario: Unfollow (or cancel a Pending request)
+- **WHEN** the follower clicks "Unfollow" or "Requested" on a profile they currently have a follow row against
+- **THEN** the follow row is deleted regardless of state; the target's follower count decrements only if the row had been accepted
+
+#### Scenario: Owner approves a Pending request
+- **WHEN** a private user POSTs to `/api/follows/:id/approve` for a Pending row targeting them
+- **THEN** the row's `accepted_at` is set to `now()`, the requester transitions from "Requested" to "Unfollow" view, and the target's follower count increments
+
+#### Scenario: Owner rejects a Pending request
+- **WHEN** a private user POSTs to `/api/follows/:id/reject` for a Pending row targeting them
+- **THEN** the row is deleted; the requester sees the "Request to follow" state again and can re-request later
+
+#### Scenario: Approve/reject is owner-bound
+- **WHEN** any user other than the followed party POSTs `/api/follows/:id/approve` or `/reject`
+- **THEN** the API returns 404 (no leak of who the row targets) and the row state is unchanged
 
 ### Requirement: Follower and following collections
-Every local user with `profile_visibility = 'public'` SHALL expose a publicly queryable list of followers and a list of who they follow.
+Every local user SHALL expose follower and following counts on their profile and paginated collection pages, listing only **accepted** relations. Pending requests do not count toward the public tallies.
 
 #### Scenario: Follower count on profile
-- **WHEN** any visitor loads a public profile
-- **THEN** the page displays the follower and following counts, linking to paginated `/users/:username/followers` and `/users/:username/following` pages
+- **WHEN** any visitor loads a profile (public or private stub)
+- **THEN** the page displays the follower and following counts of accepted relations, linking to paginated `/users/:username/followers` and `/users/:username/following` pages
 
 #### Scenario: Collection pagination
 - **WHEN** a visitor loads `/users/:username/followers` or `/users/:username/following`
-- **THEN** the page lists the relations in reverse-chronological order of acceptance, 50 per page
+- **THEN** the page lists the accepted relations in reverse-chronological order of acceptance, 50 per page
+
+### Requirement: Pending follow request management
+A signed-in user SHALL have a dedicated `/follows/requests` page listing every Pending follow request targeting them (where `followed_user_id = currentUser.id` AND `accepted_at IS NULL`). The page SHALL provide Approve and Reject actions for each request. The navbar SHALL surface a count badge linking to this page when at least one request is pending.
+
+#### Scenario: Owner sees their pending requests
+- **WHEN** a signed-in user with N Pending incoming requests loads `/follows/requests`
+- **THEN** the page lists all N requests reverse-chronologically by request creation time, with Approve and Reject buttons per request
+
+#### Scenario: Empty requests page
+- **WHEN** a signed-in user with zero pending requests loads `/follows/requests`
+- **THEN** the page renders an empty-state message
+
+#### Scenario: Anonymous visitor cannot access requests page
+- **WHEN** an unauthenticated visitor requests `/follows/requests`
+- **THEN** they are redirected to `/auth/login`
+
+#### Scenario: Navbar badge reflects pending count
+- **WHEN** a signed-in user has N > 0 pending follow requests
+- **THEN** the "Follow requests" link in the navbar renders with a small red count badge of N; when N = 0 the link still renders but without a badge
 
 ### Requirement: Social activity feed
-The Journal SHALL expose a feed at `/feed`, visible only to signed-in users, listing public activities from the local users they follow. `private` and `unlisted` activities SHALL NOT appear in this feed even if the viewer follows the owner.
+The Journal SHALL expose a feed at `/feed`, visible only to signed-in users, listing public activities from the local users they follow with an accepted relation. `private` and `unlisted` activities SHALL NOT appear regardless of follow state. Pending follows SHALL NOT contribute content to the feed.
 
-#### Scenario: Feed aggregates followed users' public activities
-- **WHEN** a signed-in user with one or more follows loads `/feed`
-- **THEN** the page shows the most recent public activities across all users they follow, reverse-chronological, up to 50 per page, with owner attribution, distance, date, and a map thumbnail
+#### Scenario: Feed aggregates accepted-followed users' public activities
+- **WHEN** a signed-in user with one or more accepted follows loads `/feed`
+- **THEN** the page shows the most recent public activities across all accepted-followed users, reverse-chronological, up to 50 per page, with owner attribution, distance, date, and a map thumbnail
+
+#### Scenario: Pending follows don't contribute to the feed
+- **WHEN** a signed-in user has only Pending follows (no acceptance yet)
+- **THEN** the feed renders the empty state — no Pending-target content is fetched or shown
 
 #### Scenario: Empty feed state
-- **WHEN** a signed-in user with zero follows loads `/feed`
+- **WHEN** a signed-in user with zero accepted follows loads `/feed`
 - **THEN** the page shows an empty-state message pointing them to `/users/:username` pages to follow someone, and suggests the instance public feed as an alternative
 
 #### Scenario: Logged-out visitor cannot access the feed
@@ -52,6 +87,6 @@ The `follows` table SHALL key the followed side by an `actor_iri TEXT` column (n
 - **WHEN** a local user A follows local user B
 - **THEN** the follow row has `followed_actor_iri = 'https://{DOMAIN}/users/{B.username}'` AND `followed_user_id = B.id`
 
-#### Scenario: Lifecycle column ready for Pending state
-- **WHEN** any local follow row is created in this change
-- **THEN** `accepted_at` is set to `now()` (auto-accepted), but the column remains nullable so future remote follows can land in a Pending state without schema change
+#### Scenario: Lifecycle column already supports Pending
+- **WHEN** any local follow row is created against a private target in this change
+- **THEN** `accepted_at` is set to `NULL`; against a public target it is set to `now()`. Federation's remote-Pending state lands here without schema change

packages/db/src/schema/journal.ts

@@ -34,11 +34,14 @@ export const users = journalSchema.table("users", {
   displayName: text("display_name"),
   bio: text("bio"),
   domain: text("domain").notNull(),
-  // Whether the user is discoverable on this instance and (later) over
-  // ActivityPub. `private` 404s the profile and disables follows; `public`
-  // means /users/:username renders when the user has any public content.
-  // See spec: journal-landing + public-profiles + social-follows.
-  profileVisibility: text("profile_visibility").$type<ProfileVisibility>().notNull().default("public"),
+  // Profile visibility / lock setting. `public` means anyone can view
+  // the profile and follows auto-accept. `private` is Mastodon-style
+  // locked: the profile renders a stub for non-followers, and follows
+  // require manual approval (Pending → Accepted via /follows/requests).
+  // New users default to `private` to match trails.cool's privacy-first
+  // content defaults; existing users were backfilled to `public` by an
+  // earlier migration so behavior didn't change for them.
+  profileVisibility: text("profile_visibility").$type<ProfileVisibility>().notNull().default("private"),
   termsAcceptedAt: timestamp("terms_accepted_at", { withTimezone: true }),
   termsVersion: text("terms_version"),
   createdAt: timestamp("created_at", { withTimezone: true }).notNull().defaultNow(),

packages/i18n/src/locales/de.ts

@@ -229,14 +229,30 @@ export default {
     },
     profile: {
       ownNote: "Das ist dein Profil — Besucher:innen sehen nur Inhalte, die du als öffentlich markiert hast.",
-      privateNote: "Dein Profil ist auf Privat gestellt. Besucher:innen sehen 404; öffentliche Inhalte sind weiterhin per direkter URL erreichbar, aber du kannst nicht gefolgt werden.",
+      privateNote: "Dein Profil ist auf Privat (gesperrt) gestellt. Besucher:innen sehen eine Hinweisseite mit einem Anfrage-Button; nur akzeptierte Follower sehen deine öffentlichen Inhalte.",
       goToSettings: "Zu den Einstellungen",
       noPublicRoutes: "Noch keine öffentlichen Routen.",
       noPublicActivities: "Noch keine öffentlichen Aktivitäten.",
+      lockedBadge: "Privat",
+      lockedTitle: "Dieses Profil ist privat. Folge-Anfragen müssen genehmigt werden.",
+      privateStub: {
+        heading: "Dieses Profil ist privat",
+        bodyAuth: "Sende eine Folge-Anfrage, um die öffentlichen Routen und Aktivitäten zu sehen. Die Person muss sie freigeben.",
+        bodyAnon: "Melde dich an und sende eine Folge-Anfrage, um die öffentlichen Routen und Aktivitäten zu sehen.",
+      },
     },
     social: {
       follow: "Folgen",
       unfollow: "Entfolgen",
+      requestToFollow: "Folgen anfragen",
+      pendingCancel: "Angefragt",
+      requests: {
+        title: "Folge-Anfragen",
+        empty: "Keine offenen Folge-Anfragen.",
+        approve: "Annehmen",
+        reject: "Ablehnen",
+        receivedAt: "Angefragt am {{date}}",
+      },
       followers: {
         label: "Follower",
         heading: "Follower von {{user}}",
@@ -290,9 +306,9 @@ export default {
         visibility: {
           label: "Profil-Sichtbarkeit",
           public: "Öffentlich",
-          publicHelp: "Deine Profilseite ist für alle sichtbar (sobald du öffentliche Inhalte hast). Du kannst gefolgt werden.",
-          private: "Privat",
-          privateHelp: "Deine Profilseite gibt 404 zurück. Öffentliche Inhalte sind weiterhin per direkter URL erreichbar, aber du kannst nicht gefolgt werden.",
+          publicHelp: "Alle sehen dein Profil und deine öffentlichen Inhalte. Folge-Anfragen werden automatisch akzeptiert.",
+          private: "Privat (gesperrt)",
+          privateHelp: "Besucher:innen sehen nur eine Hinweisseite mit Anfrage-Button. Nur akzeptierte Follower sehen deine öffentlichen Inhalte. Anfragen verwaltest du unter /follows/requests.",
         },
       },
       security: {

packages/i18n/src/locales/en.ts

@@ -229,14 +229,30 @@ export default {
     },
     profile: {
       ownNote: "This is your profile — visitors see only what you've marked public.",
-      privateNote: "Your profile is set to private. Visitors see a 404; public posts are still reachable by direct URL but you can't be followed.",
+      privateNote: "Your profile is set to private (locked). Visitors see a stub with a Request-to-follow button; only accepted followers see your public content.",
       goToSettings: "Go to settings",
       noPublicRoutes: "No public routes yet.",
       noPublicActivities: "No public activities yet.",
+      lockedBadge: "Private",
+      lockedTitle: "This profile is private. Follow requests need approval.",
+      privateStub: {
+        heading: "This profile is private",
+        bodyAuth: "Send a follow request to see their public routes and activities. They'll need to approve it.",
+        bodyAnon: "Sign in and request to follow them to see their public routes and activities.",
+      },
     },
     social: {
       follow: "Follow",
       unfollow: "Unfollow",
+      requestToFollow: "Request to follow",
+      pendingCancel: "Requested",
+      requests: {
+        title: "Follow requests",
+        empty: "No pending follow requests.",
+        approve: "Approve",
+        reject: "Reject",
+        receivedAt: "Requested {{date}}",
+      },
       followers: {
         label: "Followers",
         heading: "Followers of {{user}}",
@@ -290,9 +306,9 @@ export default {
         visibility: {
           label: "Profile visibility",
           public: "Public",
-          publicHelp: "Your profile page is visible to anyone (when you have any public content). You can be followed.",
-          private: "Private",
-          privateHelp: "Your profile page returns 404. Public posts are still reachable by direct URL but you can't be followed.",
+          publicHelp: "Anyone can view your profile and your public content. Follows auto-accept.",
+          private: "Private (locked)",
+          privateHelp: "Visitors see a stub with a Request-to-follow button. Only accepted followers see your public content. You manage requests at /follows/requests.",
         },
       },
       security: {