fix(plex): a short "Known for" rail sits right beside the text (E30 S6)

With one to three titles (about one person in five) the rail sat at the far edge of the hero with a gap between it and the bio. The person's column is now capped at the bio's reading measure and a short rail follows it directly, so the leftover is the panel's end (owner pick "b"). Four or more keep half the hero.
2026-09-30 02:27:28 +02:00
parent ca94a716d8
commit 59e6cc027d
2 changed files with 44 additions and 4 deletions
@@ -251,3 +251,40 @@ describe("PlexPersonView — a bio on its way (E30 S6)", () => {
    expect(screen.queryByText("plex.person.more")).toBeNull(); // jsdom: nothing is cut
  });
 });
+
+describe("PlexPersonView — the hero's columns (E30 S6)", () => {
+  const heroGrid = async (knownFor: number) => {
+    plexPerson.mockReset();
+    plexPerson.mockResolvedValue({
+      name: "Jane Doe",
+      photo: null,
+      biography: "Bio.",
+      also_known_as: [],
+      known_for: Array.from({ length: knownFor }, (_, i) => card(`k${i}`, `Known ${i}`)),
+      movies: [card("m1", "Movie One")],
+      shows: [],
+    });
+    const { container, unmount } = wrap(
+      <PlexPersonView
+        name="Jane Doe"
+        onBack={() => {}}
+        onOpenCard={() => {}}
+        onRestartCard={() => {}}
+        onInfoCard={() => {}}
+        onFilter={() => {}}
+      />,
+    );
+    await screen.findByText("Movie One");
+    const cls = container.querySelector('section[class~="@container"] > div')!.className;
+    unmount();
+    return cls;
+  };
+
+  it("gives a full rail half the hero and puts a short one right beside the text", async () => {
+    expect(await heroGrid(4)).toContain("@3xl:grid-cols-[minmax(0,1fr)_minmax(0,1fr)]");
+    const short = await heroGrid(1);
+    expect(short).toContain("@3xl:grid-cols-[auto_auto]");
+    expect(short).toContain("@3xl:justify-start");
+    expect(await heroGrid(0)).not.toContain("grid");
+  });
+});