v4: a profile's lists of dumps can be narrowed to a category — /@name/dumps and /@name/upvoted showed every dump, with no way to see only those filed under one category, as the index can. The title row of each list now has the index's category menu, and the category picked goes in the URL as ?category=<slug>, which the other list keeps and every other tab drops (a path segment would collide with /@name/dumps/<slug>, a dump's own page). GET /api/users/:key/dumps and /upvoted take ?category= as the followed feed does, an unknown slug answering an empty list; resolveCategoryFilter moves to category-service.ts for both. useUserDumpFeed passes everything the socket changes through the category, so a dump edited out of it leaves and an upvote outside it doesn't come in. CategorySwitcher now reports the category picked to its owner (onSelect) instead of navigating to the index's path itself, and the divider after it in the index's tab row is drawn by CSS, so the profile gets none. useTabParam's setter takes the query string to go to, the current one by default.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -175,6 +175,48 @@ describe("UserPublicProfile", () => {
|
||||
expect(titles).toEqual(["T-x", "T-y", "T-z"]);
|
||||
});
|
||||
|
||||
test("the dumps tab narrows to a category, in its URL, and drops a dump edited out of it; only the dump lists keep it", async () => {
|
||||
const music = makeCategory({ id: "c1", slug: "music", name: "Music" });
|
||||
const tagged = makeDump({
|
||||
id: "m",
|
||||
title: "Tagged",
|
||||
userId: "ann",
|
||||
categoryIds: ["c1"],
|
||||
});
|
||||
const { user, socket } = open({ url: "/@ann/dumps", categories: [music] });
|
||||
route("GET /api/users/:u/dumps", (req) =>
|
||||
page(
|
||||
req.url.searchParams.get("category") === "music"
|
||||
? [tagged]
|
||||
: [tagged, makeDump({ id: "o", title: "Other", userId: "ann" })],
|
||||
));
|
||||
await screen.findByText("Other");
|
||||
await user.click(screen.getByRole("button", { name: "All" }));
|
||||
await user.click(screen.getByRole("option", { name: "Music" }));
|
||||
expect(currentPath()).toBe("/@ann/dumps?category=music");
|
||||
await waitFor(() =>
|
||||
expect(screen.queryByText("Other")).not.toBeInTheDocument()
|
||||
);
|
||||
expect(screen.getByText("Tagged")).toBeInTheDocument();
|
||||
socket.welcome();
|
||||
socket.receive({
|
||||
type: "dump_updated",
|
||||
dump: wire({ ...tagged, categoryIds: [] }),
|
||||
});
|
||||
expect(screen.queryByText("Tagged")).not.toBeInTheDocument();
|
||||
// Switching to the upvoted list keeps the category.
|
||||
await user.click(screen.getByRole("button", { name: "Upvoted" }));
|
||||
expect(currentPath()).toBe("/@ann/upvoted?category=music");
|
||||
await waitFor(() =>
|
||||
expect(calls("GET /api/users/:u/upvoted").at(-1)!.url.searchParams.get(
|
||||
"category",
|
||||
)).toBe("music")
|
||||
);
|
||||
// Any other tab drops it.
|
||||
await user.click(screen.getByRole("button", { name: "Playlists" }));
|
||||
expect(currentPath()).toBe("/@ann/playlists");
|
||||
});
|
||||
|
||||
test("the dumps tab loads more as its end scrolls into view", async () => {
|
||||
open({ url: "/@ann/dumps" });
|
||||
// After open's, so that it wins.
|
||||
|
||||
Reference in New Issue
Block a user