@tribe-nest/forge 3.58.0 → 3.60.0

package/src/ui/styled/members/MemberHomeLayout.tsx

@@ -1,14 +1,30 @@
 import type { CSSProperties, ReactNode } from "react";
-import { ExternalLink } from "lucide-react";
 import { useThemeTokens } from "../../theme/ForgeThemeProvider";
-import { useMemberHomeNav, type MemberHomeNavItem, type UseMemberHomeNavOptions } from "../../headless/memberHome/useMemberHomeNav";
+import { useForgeT } from "../../../i18n";
+import {
+  useMemberHomeNav,
+  type MemberHomeNavItem,
+  type MemberHomeNavKey,
+  type UseMemberHomeNavOptions,
+} from "../../headless/memberHome/useMemberHomeNav";
+
+/** Literal keys, so the translation spec can see every one of them. */
+const TAB_LABEL_KEYS: Record<MemberHomeNavKey, string> = {
+  posts: "forge.member_home_layout.tab_posts",
+  collections: "forge.member_home_layout.tab_collections",
+  spaces: "forge.member_home_layout.tab_spaces",
+  calendar: "forge.member_home_layout.tab_calendar",
+  chat: "forge.member_home_layout.tab_chat",
+  leaderboard: "forge.member_home_layout.tab_leaderboard",
+  notifications: "forge.member_home_layout.tab_notifications",
+};
 
 export interface MemberHomeLayoutProps extends UseMemberHomeNavOptions {
-  /** Current location pathname (drives the active tab). */
-  currentPath: string;
+  /** Current location pathname (drives the active tab when `activeKey` is not given). */
+  currentPath?: string;
   /**
-   * SPA navigation adapter. Defaults to a full-page `window.location` visit —
-   * pass your router's navigate for client-side transitions.
+   * SPA navigation adapter. Defaults to a full-page `window.location` visit.
+   * Pass your router's navigate for client-side transitions.
    */
   navigate?: (href: string) => void;
   children: ReactNode;
@@ -17,11 +33,13 @@ export interface MemberHomeLayoutProps extends UseMemberHomeNavOptions {
 }
 
 /**
- * The unified member home shell (`/i/members`): persistent nav across
- * Posts / Collections / Spaces / Chat / My membership. Top scrollable tab bar
- * on small screens, side nav on `lg+`. Tab visibility comes from
- * `useMemberHomeNav` (conditional tabs hide until the profile has content).
- * Hosts own routing — this only renders `children` for the active route.
+ * A community's member home shell (`/i/communities/<slug>/home`): persistent
+ * nav across Posts / Collections / Spaces / Calendar / Chat / Leaderboard /
+ * Notifications. Top scrollable tab bar on small screens, side nav on `lg+`.
+ * Tab visibility comes from `useMemberHomeNav` (conditional tabs hide until the
+ * community has content). Must sit inside `<CommunityProvider>`; `CommunityHome`
+ * wraps it with the community header. Hosts own routing: this only renders
+ * `children` for the active route.
  */
 export function MemberHomeLayout({
   currentPath,
@@ -32,6 +50,7 @@ export function MemberHomeLayout({
   ...navOptions
 }: MemberHomeLayoutProps) {
   const t = useThemeTokens();
+  const tr = useForgeT();
   const { visibleItems, isReady } = useMemberHomeNav({ currentPath, ...navOptions });
   const go = navigate ?? ((href: string) => window.location.assign(href));
 
@@ -59,8 +78,7 @@ export function MemberHomeLayout({
       aria-current={item.active ? "page" : undefined}
       style={itemStyle(item)}
     >
-      {item.label}
-      {item.external && <ExternalLink size={14} style={{ opacity: 0.7, flexShrink: 0 }} />}
+      {tr(TAB_LABEL_KEYS[item.key])}
     </button>
   );
 
@@ -69,18 +87,18 @@ export function MemberHomeLayout({
       className={`fg:flex fg:w-full fg:flex-col fg:lg:flex-row fg:lg:items-start fg:lg:gap-8 ${className ?? ""}`}
       style={{ color: t.text, fontFamily: t.fontFamily, ...style }}
     >
-      {/* Top tab bar — small screens (horizontally scrollable, no burger). */}
+      {/* Top tab bar on small screens (horizontally scrollable, no burger). */}
       <nav
-        aria-label="Member home"
+        aria-label={tr("forge.member_home_layout.nav_label")}
         className="fg:flex fg:w-full fg:gap-1 fg:overflow-x-auto fg:lg:hidden"
         style={{ borderBottom: `1px solid ${t.border}`, paddingBottom: 8, marginBottom: 16 }}
       >
         {isReady ? visibleItems.map(renderItem) : null}
       </nav>
 
-      {/* Side nav — lg and up. */}
+      {/* Side nav, lg and up. */}
       <nav
-        aria-label="Member home"
+        aria-label={tr("forge.member_home_layout.nav_label")}
         className="fg:sticky fg:top-4 fg:hidden fg:w-52 fg:shrink-0 fg:flex-col fg:gap-1 fg:lg:flex"
         style={{
           border: `1px solid ${t.border}`,

package/src/ui/styled/members/MemberPostCard.tsx

@@ -3,6 +3,7 @@ import { Bookmark, Heart, Lock, MessageCircle, Pause, Play, FileText, BarChart2
 import type { IMedia, IPublicPost } from "../../../types/models";
 import { useAudioPlayer } from "../../../contexts/AudioPlayerContext";
 import { useThemeTokens } from "../../theme/ForgeThemeProvider";
+import { useForgeT } from "../../../i18n";
 import { usePostItem, type UsePostItemOptions } from "../../headless/posts/usePostItem";
 
 export interface MemberPostCardProps extends UsePostItemOptions {
@@ -16,7 +17,7 @@ export interface MemberPostCardProps extends UsePostItemOptions {
 }
 
 /**
- * One member post — parity with the craft members area's `PostItem`: artist
+ * One member post: parity with the craft members area's `PostItem`: artist
  * header, caption, media (image / video / audio via the Forge audio player /
  * document), like / save / comment engagement, and the locked treatment with
  * an upgrade CTA (which tier unlocks + membership checkout deep link). Built
@@ -228,6 +229,7 @@ export function MemberPostCard({
 
 function LockedBody({ item, go }: { item: ReturnType<typeof usePostItem>; go: (href: string) => void }) {
   const t = useThemeTokens();
+  const tr = useForgeT();
   const tierName = item.upsell.tier?.name;
   return (
     <div
@@ -256,14 +258,16 @@ function LockedBody({ item, go }: { item: ReturnType<typeof usePostItem>; go: (h
         <Lock size={24} />
       </span>
       <div>
-        <div style={{ fontSize: 16, fontWeight: 700 }}>Content locked</div>
+        <div style={{ fontSize: 16, fontWeight: 700 }}>{tr("forge.member_post_card.locked_title")}</div>
         <div style={{ fontSize: 13, color: t.muted, marginTop: 2 }}>
-          {tierName ? `Subscribe to ${tierName} to access this content` : "Subscribe to access this content"}
+          {tierName
+            ? tr("forge.member_post_card.locked_body_tier", { tier_name: tierName })
+            : tr("forge.member_post_card.locked_body")}
         </div>
       </div>
       <button
         type="button"
-        onClick={() => go(item.upsell.href)}
+        onClick={() => (item.upsell.unlock ? item.upsell.unlock() : go(item.upsell.href))}
         style={{
           padding: "10px 18px",
           borderRadius: t.cornerRadius,
@@ -274,7 +278,7 @@ function LockedBody({ item, go }: { item: ReturnType<typeof usePostItem>; go: (h
           cursor: "pointer",
         }}
       >
-        Subscribe
+        {tierName ? tr("forge.member_post_card.unlock_with", { tier_name: tierName }) : tr("forge.member_post_card.unlock")}
       </button>
     </div>
   );

package/src/ui/styled/members/PostCollectionDetail.tsx

@@ -1,6 +1,9 @@
 import type { CSSProperties } from "react";
 import { ArrowLeft, Lock } from "lucide-react";
 import { useThemeTokens } from "../../theme/ForgeThemeProvider";
+import { useOptionalCommunityContext } from "../../../contexts/CommunityContext";
+import { internalPath } from "../../../runtime/pages";
+import { useForgeT } from "../../../i18n";
 import {
   usePostCollectionDetail,
   type UsePostCollectionDetailOptions,
@@ -9,9 +12,9 @@ import { Loading } from "../Loading";
 import { MemberPostCard } from "./MemberPostCard";
 
 export interface PostCollectionDetailProps extends UsePostCollectionDetailOptions {
-  /** A collection uuid OR its per-profile slug — the public detail endpoint resolves either. */
+  /** A collection uuid OR its per-profile slug: the public detail endpoint resolves either. */
   collectionId: string;
-  /** Where the back button returns to (default `/i/members/collections`). */
+  /** Where the back button returns to (default: the surrounding community's collections). */
   backHref?: string;
   /** Shown as the audio track artist for audio posts inside the collection. */
   artistName?: string;
@@ -26,17 +29,17 @@ export interface PostCollectionDetailProps extends UsePostCollectionDetailOption
 }
 
 /**
- * One collection's drill-in view — parity with the craft members area's
+ * One collection's drill-in view: parity with the craft members area's
  * `CollectionsContent` detail: back link, cover + title + rich-text
  * description header, then the collection's posts as full member post cards
  * (engagement, audio queue scoped to the collection, per-post gating). A
- * locked collection renders the upgrade CTA instead of posts — access is
+ * locked collection renders the upgrade CTA instead of posts: access is
  * server-computed, never faked client-side. Built on the headless
  * `usePostCollectionDetail`.
  */
 export function PostCollectionDetail({
   collectionId,
-  backHref = "/i/members/collections",
+  backHref: backHrefProp,
   artistName,
   navigate,
   onRequireAuth,
@@ -46,6 +49,9 @@ export function PostCollectionDetail({
   ...detailOptions
 }: PostCollectionDetailProps) {
   const t = useThemeTokens();
+  const tr = useForgeT();
+  const slug = useOptionalCommunityContext()?.slug;
+  const backHref = backHrefProp ?? (slug ? internalPath("communities/$slug/home/collections", { slug }) : "");
   const detail = usePostCollectionDetail(collectionId, detailOptions);
   const go = navigate ?? ((href: string) => window.location.assign(href));
   const requireAuth =
@@ -169,17 +175,17 @@ export function PostCollectionDetail({
             <Lock size={24} />
           </span>
           <div>
-            <div style={{ fontSize: 16, fontWeight: 700 }}>Content locked</div>
+            <div style={{ fontSize: 16, fontWeight: 700 }}>{tr("forge.post_collection_detail.locked_title")}</div>
             <div style={{ fontSize: 13, color: t.muted, marginTop: 2 }}>
               {detail.upsell?.tier?.name
-                ? `Subscribe to ${detail.upsell.tier.name} to access this content`
-                : "Subscribe to access this content"}
+                ? tr("forge.post_collection_detail.locked_body_tier", { tier_name: detail.upsell.tier.name })
+                : tr("forge.post_collection_detail.locked_body")}
             </div>
           </div>
           {detail.upsell && (
             <button
               type="button"
-              onClick={() => go(detail.upsell!.href)}
+              onClick={() => (detail.upsell!.unlock ? detail.upsell!.unlock() : go(detail.upsell!.href))}
               style={{
                 padding: "10px 18px",
                 borderRadius: t.cornerRadius,
@@ -190,7 +196,9 @@ export function PostCollectionDetail({
                 cursor: "pointer",
               }}
             >
-              Subscribe
+              {detail.upsell.tier?.name
+                ? tr("forge.post_collection_detail.unlock_with", { tier_name: detail.upsell.tier.name })
+                : tr("forge.post_collection_detail.unlock")}
             </button>
           )}
         </div>

package/src/ui/styled/members/PostCollectionsGrid.tsx

@@ -2,6 +2,9 @@ import { useState, type CSSProperties } from "react";
 import { ChevronLeft, ChevronRight, FileText, Lock, Search, X } from "lucide-react";
 import type { IPublicPostCollection } from "../../../types/models";
 import { useThemeTokens } from "../../theme/ForgeThemeProvider";
+import { useOptionalCommunityContext } from "../../../contexts/CommunityContext";
+import { internalPath } from "../../../runtime/pages";
+import { useForgeT } from "../../../i18n";
 import {
   usePostCollectionsList,
   type UsePostCollectionsListOptions,
@@ -12,8 +15,8 @@ import { Loading } from "../Loading";
 export interface PostCollectionsGridProps extends UsePostCollectionsListOptions {
   /**
    * Builds the drill-in href for an accessible collection. Receives the
-   * collection's slug when it has one, else its uuid — the public detail
-   * endpoint resolves either. Default `` (idOrSlug) => `/i/members/collections/${idOrSlug}` ``.
+   * collection's slug when it has one, else its uuid: the public detail
+   * endpoint resolves either. Default: the collection's page inside the surrounding community.
    */
   getCollectionHref?: (idOrSlug: string) => string;
   /** SPA navigation adapter (drill-in + locked-collection upsell CTA). Defaults to a full-page visit. */
@@ -31,22 +34,27 @@ const stripHtml = (html: string, len = 100) => {
 };
 
 /**
- * The member collections grid — parity with the craft members area's
+ * The member collections grid: parity with the craft members area's
  * `CollectionsContent` list: cover, title, description, post count per
- * collection; locked collections render dimmed with a Subscribe CTA that
- * deep-links membership checkout (`hasAccess` is server-computed — a locked
+ * collection; locked collections render dimmed with an Unlock CTA that
+ * deep-links membership checkout (`hasAccess` is server-computed: a locked
  * collection never opens); accessible collections drill into the detail view.
  * Debounced search + numbered paging. Built on the headless
  * `usePostCollectionsList`.
  */
 export function PostCollectionsGrid({
-  getCollectionHref = (idOrSlug) => `/i/members/collections/${idOrSlug}`,
+  getCollectionHref: getCollectionHrefProp,
   navigate,
   className,
   style,
   ...listOptions
 }: PostCollectionsGridProps) {
   const t = useThemeTokens();
+  const slug = useOptionalCommunityContext()?.slug;
+  const getCollectionHref =
+    getCollectionHrefProp ??
+    ((collectionId: string) =>
+      slug ? internalPath("communities/$slug/home/collections/$collectionId", { slug, collectionId }) : "");
   const list = usePostCollectionsList(listOptions);
   const go = navigate ?? ((href: string) => window.location.assign(href));
   const [searchFocused, setSearchFocused] = useState(false);
@@ -176,6 +184,7 @@ function CollectionCard({
   go: (href: string) => void;
 }) {
   const t = useThemeTokens();
+  const tr = useForgeT();
   const locked = !collection.hasAccess;
   const cover = collection.media?.[0];
   const description = collection.description ? stripHtml(collection.description) : "";
@@ -255,15 +264,18 @@ function CollectionCard({
             >
               <Lock size={18} />
             </span>
-            <div style={{ fontSize: 15, fontWeight: 700 }}>Content locked</div>
+            <div style={{ fontSize: 15, fontWeight: 700 }}>{tr("forge.post_collections_grid.locked_title")}</div>
             <div style={{ fontSize: 13, color: t.muted }}>
-              {tierName ? `Subscribe to ${tierName} to access this content` : "Subscribe to access this content"}
+              {tierName
+                ? tr("forge.post_collections_grid.locked_body_tier", { tier_name: tierName })
+                : tr("forge.post_collections_grid.locked_body")}
             </div>
             <button
               type="button"
               onClick={(e) => {
                 e.stopPropagation();
-                go(upsell.href);
+                if (upsell.unlock) upsell.unlock();
+                else go(upsell.href);
               }}
               style={{
                 marginTop: 4,
@@ -277,7 +289,9 @@ function CollectionCard({
                 cursor: "pointer",
               }}
             >
-              Subscribe
+              {tierName
+                ? tr("forge.post_collections_grid.unlock_with", { tier_name: tierName })
+                : tr("forge.post_collections_grid.unlock")}
             </button>
           </div>
         )}

package/src/ui/styled/members/_tests/MemberCallsCalendar.spec.tsx

@@ -1,5 +1,6 @@
 // @vitest-environment jsdom
-import { cleanup, fireEvent, render, waitFor } from "@testing-library/react";
+import { act, cleanup, fireEvent, render, waitFor } from "@testing-library/react";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { afterEach, describe, expect, it, vi } from "vitest";
 
 import { ForgeThemeProvider } from "../../../theme/ForgeThemeProvider";
@@ -30,8 +31,33 @@ vi.mock("../../../headless/memberHome/useMemberCalls", () => ({
   }),
 }));
 
+/** The transcript reads go through the Forge client; stub it at the provider. */
+const clientGet = vi.fn();
+vi.mock("../../../../provider/ForgeProvider", () => ({
+  useForge: () => ({ client: { get: clientGet }, profileId: "profile-1" }),
+}));
+
 import { MemberCallsCalendar } from "../MemberCallsCalendar";
 
+const transcriptDetail = {
+  recordingId: "r1",
+  callId: "call-1",
+  title: "Weekly Q&A",
+  startsAt: "2026-03-10T17:00:00.000Z",
+  timezone: "UTC",
+  durationSeconds: 1800,
+  watchUrl: "https://cdn.test/rec.mp4?sig=fresh",
+  transcript: {
+    status: "ready",
+    language: "en",
+    segments: [
+      { name: "Ada", startMs: 0, endMs: 2_000, text: "Shall we ship Friday?" },
+      { name: "Grace", startMs: 65_000, endMs: 66_000, text: "Agreed." },
+    ],
+    summary: { title: "Launch", summary: "They agreed to ship.", decisions: ["Ship Friday"], actionItems: [] },
+  },
+};
+
 const call = (over: Partial<MyMembershipCall> = {}): MyMembershipCall => ({
   id: "call-1",
   title: "Weekly Q&A",
@@ -52,13 +78,17 @@ const call = (over: Partial<MyMembershipCall> = {}): MyMembershipCall => ({
 
 const mount = (navigate = vi.fn()) =>
   render(
-    <ForgeThemeProvider theme={{ colors: { text: "#111", background: "#fff", primary: "#6d28d9" }, cornerRadius: 8 }}>
-      <MemberCallsCalendar navigate={navigate} now={new Date("2026-03-10T12:00:00Z")} />
-    </ForgeThemeProvider>,
+    <QueryClientProvider client={new QueryClient({ defaultOptions: { queries: { retry: false } } })}>
+      <ForgeThemeProvider theme={{ colors: { text: "#111", background: "#fff", primary: "#6d28d9" }, cornerRadius: 8 }}>
+        <MemberCallsCalendar navigate={navigate} now={new Date("2026-03-10T12:00:00Z")} />
+      </ForgeThemeProvider>
+    </QueryClientProvider>,
   );
 
 afterEach(() => {
   calls.length = 0;
+  clientGet.mockReset();
+  vi.restoreAllMocks();
   cleanup();
 });
 
@@ -95,11 +125,11 @@ describe("MemberCallsCalendar", () => {
     // The details the list used to show now live in the modal.
     expect(dialog.textContent).toContain("Bring your questions.");
     expect(dialog.textContent).toContain("All members");
-    // Recording, transcript and chat are the modal's remit; the two future
-    // ones are present as clearly-labelled placeholders.
-    expect(dialog.textContent).toContain("Transcript");
+    // Chat history is the one capability still to come, shown as a labelled
+    // placeholder. A call with no recording has no transcript to show.
     expect(dialog.textContent).toContain("Chat history");
     expect(dialog.textContent).toContain("Coming soon");
+    expect(dialog.textContent).not.toContain("Transcript");
 
     // The call is open, so Join is offered and routes to the call page.
     fireEvent.click(getByText("Join call"));
@@ -111,7 +141,13 @@ describe("MemberCallsCalendar", () => {
       call({
         isOpen: false,
         closesAt: "2026-03-09T20:00:00.000Z",
-        recording: { id: "r1", status: "ready", durationSeconds: 1800, watchUrl: "https://cdn.test/rec.mp4" },
+        recording: {
+          id: "r1",
+          status: "ready",
+          durationSeconds: 1800,
+          watchUrl: "https://cdn.test/rec.mp4",
+          transcript: null,
+        },
       }),
     );
     const { getByTitle, getByText, getByRole, queryByText } = mount();
@@ -124,6 +160,129 @@ describe("MemberCallsCalendar", () => {
     expect(dialog.textContent).toContain("30 min");
   });
 
+  const readyCall = () =>
+    call({
+      isOpen: false,
+      closesAt: "2026-03-09T20:00:00.000Z",
+      recording: {
+        id: "r1",
+        status: "ready",
+        durationSeconds: 1800,
+        watchUrl: "https://cdn.test/rec.mp4?sig=abc",
+        transcript: {
+          status: "ready",
+          summary: { title: "Launch", summary: "They agreed to ship.", decisions: ["Ship Friday"], actionItems: [] },
+        },
+      },
+    });
+
+  it("shows the SUMMARY in the modal and none of the lines: a long meeting does not belong there", () => {
+    calls.push(readyCall());
+    const { getByTitle, getByRole, getByText } = mount();
+    fireEvent.click(getByTitle("Weekly Q&A"));
+    const dialog = getByRole("dialog");
+
+    expect(dialog.textContent).toContain("They agreed to ship.");
+    expect(dialog.textContent).not.toContain("Shall we ship Friday?");
+    expect(getByText("Read transcript")).toBeTruthy();
+    expect(getByText("Download")).toBeTruthy();
+    expect(clientGet).not.toHaveBeenCalled();
+  });
+
+  it("opens the transcript full-screen beside the video, and a line seeks it", async () => {
+    clientGet.mockResolvedValue({ data: transcriptDetail });
+    vi.spyOn(HTMLMediaElement.prototype, "play").mockResolvedValue(undefined);
+    calls.push(readyCall());
+    const { getByTitle, getByText, findByTestId, getByRole } = mount();
+    fireEvent.click(getByTitle("Weekly Q&A"));
+
+    fireEvent.click(getByText("Read transcript"));
+
+    const video = (await findByTestId("member-transcript-video")) as HTMLVideoElement;
+    expect(clientGet).toHaveBeenCalledWith("/public/scheduled-calls/mine/recordings/r1/transcript", {
+      params: { profileId: "profile-1" },
+    });
+    expect(video.getAttribute("src")).toBe("https://cdn.test/rec.mp4?sig=fresh");
+    // Summary first; the lines one tab away.
+    expect(getByText("They agreed to ship.")).toBeTruthy();
+    fireEvent.click(getByRole("tab", { name: "Transcript" }));
+    fireEvent.click(getByText("Agreed."));
+    expect(video.currentTime).toBe(65);
+  });
+
+  it("narrows a long transcript to a search", async () => {
+    clientGet.mockResolvedValue({ data: transcriptDetail });
+    calls.push(readyCall());
+    const { getByTitle, getByText, findByTestId, getByRole, getByLabelText, queryByText } = mount();
+    fireEvent.click(getByTitle("Weekly Q&A"));
+    fireEvent.click(getByText("Read transcript"));
+    await findByTestId("member-transcript-video");
+    fireEvent.click(getByRole("tab", { name: "Transcript" }));
+
+    fireEvent.change(getByLabelText("Search the transcript"), { target: { value: "friday" } });
+
+    expect(getByRole("status").textContent).toBe("1 match");
+    expect(queryByText("Agreed.")).toBeNull();
+  });
+
+  it("recovers a lapsed video address by fetching a fresh one", async () => {
+    clientGet.mockResolvedValue({ data: transcriptDetail });
+    calls.push(readyCall());
+    const { getByTitle, getByText, findByTestId } = mount();
+    fireEvent.click(getByTitle("Weekly Q&A"));
+    fireEvent.click(getByText("Read transcript"));
+    const video = await findByTestId("member-transcript-video");
+    clientGet.mockResolvedValue({ data: { ...transcriptDetail, watchUrl: "https://cdn.test/rec.mp4?sig=again" } });
+
+    await act(async () => {
+      fireEvent.error(video);
+    });
+
+    await waitFor(() =>
+      expect(
+        (document.querySelector("[data-testid=member-transcript-video]") as HTMLVideoElement).getAttribute("src"),
+      ).toBe("https://cdn.test/rec.mp4?sig=again"),
+    );
+  });
+
+  it("downloads the transcript from the modal without opening it", async () => {
+    clientGet.mockResolvedValue({ data: transcriptDetail });
+    const createObjectURL = vi.fn(() => "blob:transcript");
+    Object.assign(URL, { createObjectURL, revokeObjectURL: vi.fn() });
+    const click = vi.spyOn(HTMLAnchorElement.prototype, "click").mockImplementation(() => undefined);
+    calls.push(readyCall());
+    const { getByTitle, getByText, queryByTestId } = mount();
+    fireEvent.click(getByTitle("Weekly Q&A"));
+
+    fireEvent.click(getByText("Download"));
+
+    await waitFor(() => expect(click).toHaveBeenCalledTimes(1));
+    expect(clientGet).toHaveBeenCalledWith("/public/scheduled-calls/mine/recordings/r1/transcript", {
+      params: { profileId: "profile-1" },
+    });
+    expect(queryByTestId("member-transcript-video")).toBeNull();
+  });
+
+  it("tells a member a transcript is being prepared, and nothing about why one might not exist", () => {
+    calls.push(
+      call({
+        isOpen: false,
+        closesAt: "2026-03-09T20:00:00.000Z",
+        recording: {
+          id: "r1",
+          status: "ready",
+          durationSeconds: 1800,
+          watchUrl: "https://cdn.test/rec.mp4",
+          transcript: { status: "processing" },
+        },
+      }),
+    );
+    const { getByTitle, getByRole } = mount();
+    fireEvent.click(getByTitle("Weekly Q&A"));
+
+    expect(getByRole("status").textContent).toContain("The transcript is being prepared");
+  });
+
   it("closes on the backdrop", () => {
     calls.push(call());
     const { getByTitle, getByRole, queryByRole } = mount();

package/src/ui/styled/members/callTranscriptText.ts

@@ -0,0 +1,67 @@
+import type { MemberCallTranscriptDetail, MemberCallTranscriptSegment } from "../../../data/queries/useMembershipCalls";
+
+/** `12:05`, or `1:02:05` past the hour. */
+export function formatOffset(ms: number): string {
+  const total = Math.max(0, Math.floor(ms / 1000));
+  const hours = Math.floor(total / 3600);
+  const minutes = Math.floor((total % 3600) / 60);
+  const seconds = String(total % 60).padStart(2, "0");
+  return hours > 0 ? `${hours}:${String(minutes).padStart(2, "0")}:${seconds}` : `${minutes}:${seconds}`;
+}
+
+/**
+ * The index of the line being spoken at `ms`: the last one that has started.
+ * Binary search, because a long meeting has thousands of lines and this runs
+ * on every `timeupdate`.
+ */
+export function activeSegmentIndex(segments: MemberCallTranscriptSegment[], ms: number): number {
+  let low = 0;
+  let high = segments.length - 1;
+  let found = -1;
+  while (low <= high) {
+    const mid = (low + high) >> 1;
+    if (segments[mid]!.startMs <= ms) {
+      found = mid;
+      low = mid + 1;
+    } else {
+      high = mid - 1;
+    }
+  }
+  return found;
+}
+
+/** The whole transcript as a plain-text file: the call, the summary, every line. */
+export function transcriptDocument(detail: MemberCallTranscriptDetail): string {
+  const when = new Date(detail.startsAt).toLocaleString("en-US", {
+    dateStyle: "long",
+    timeStyle: "short",
+    timeZone: detail.timezone || undefined,
+  });
+  const parts = [detail.title, when, ""];
+  const summary = detail.transcript.summary;
+  if (summary) {
+    parts.push("SUMMARY", summary.summary, "");
+    if (summary.decisions.length) parts.push("DECISIONS", ...summary.decisions.map((d) => `- ${d}`), "");
+    if (summary.actionItems.length) parts.push("ACTION ITEMS", ...summary.actionItems.map((a) => `- ${a}`), "");
+  }
+  parts.push(
+    "TRANSCRIPT",
+    ...detail.transcript.segments.map((s) => `[${formatOffset(s.startMs)}] ${s.name}: ${s.text}`),
+  );
+  return parts.join("\n") + "\n";
+}
+
+/** Hand the browser a .txt of the transcript. */
+export function downloadTranscript(detail: MemberCallTranscriptDetail): void {
+  const slug = detail.title
+    .toLowerCase()
+    .replace(/[^a-z0-9]+/g, "-")
+    .replace(/^-+|-+$/g, "")
+    .slice(0, 60);
+  const url = URL.createObjectURL(new Blob([transcriptDocument(detail)], { type: "text/plain;charset=utf-8" }));
+  const link = document.createElement("a");
+  link.href = url;
+  link.download = `${slug || "call"}-${detail.startsAt.slice(0, 10)}-transcript.txt`;
+  link.click();
+  URL.revokeObjectURL(url);
+}

package/src/utils/_tests/safeRedirect.spec.ts

@@ -72,11 +72,11 @@ describe("safeRedirectPath (C13)", () => {
   describe("keeps legitimate in-app destinations", () => {
     it.each([
       "/i/account",
-      "/i/members",
+      "/i/communities",
       "/i/courses/123",
       "/i/checkout?step=2",
       "/i/orders?status=paid&page=3",
-      "/i/members#section",
+      "/i/communities#section",
       "/",
       // A path that merely CONTAINS a scheme-looking segment is still a path.
       "/i/redirect?to=https%3A%2F%2Fexample.com",