v4: every request about a user, and the dump editor's path, come from one builder each — fourteen places wrote /api/users/<key>/… by hand, some encoding a handle (@alice%40music.example) and some not, a slug never; userApiUrl (src/utils/shared/urls.ts) now writes them all, by the user's id or by @ and the handle a page's path gives, each segment encoded. The editor's path was the dump's page's with /edit added in two places; dumpPath takes the view, as userPath and feedPath do.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/pages/Dump.tsx

@@ -9,7 +9,12 @@ import { useEffect, useRef, useState } from "react";
 import { Link, useLocation, useNavigate, useParams } from "react-router";
 import { t } from "@lingui/core/macro";
 import { Trans } from "@lingui/react/macro";
-import { dumpThumbnailUrl, dumpUrl, isAt } from "../utils/shared/urls.ts";
+import {
+  dumpThumbnailUrl,
+  dumpUrl,
+  isAt,
+  userApiUrl,
+} from "../utils/shared/urls.ts";
 import { can } from "../utils/auth/permissions.ts";
 import { CategoryChips } from "../components/category/CategoryChips.tsx";
 import { AddToPlaylistModal } from "../components/playlist/AddToPlaylistModal.tsx";
@@ -132,7 +137,7 @@ export function Dump(): React.JSX.Element {
     const controller = new AbortController();
 
     if (preloaded) {
-      fetch(`${API_URL}/api/users/${preloaded.userId}`, {
+      fetch(userApiUrl({ id: preloaded.userId }), {
         signal: controller.signal,
       })
         .then((r) => r.json())
@@ -148,7 +153,7 @@ export function Dump(): React.JSX.Element {
       setOp(null);
       try {
         const res = await authFetch(
-          `${API_URL}/api/users/@${username}/dumps/${slug}`,
+          userApiUrl({ username }, "dumps", slug),
           { cache: "no-store", signal: controller.signal },
         );
         const apiResponse = parseAPIResponse<Wire<Dump>>(await res.json());
@@ -158,7 +163,7 @@ export function Dump(): React.JSX.Element {
         const dump: Dump = deserializeDump(apiResponse.data);
         setDumpState({ status: "loaded", dump });
 
-        fetch(`${API_URL}/api/users/${dump.userId}`, {
+        fetch(userApiUrl({ id: dump.userId }), {
           signal: controller.signal,
         })
           .then((r) => r.json())
@@ -544,7 +549,7 @@ export function Dump(): React.JSX.Element {
 
         <div className="dump-actions">
           {canEdit && (
-            <Link to={`${dumpUrl(dump)}/edit`}>
+            <Link to={dumpUrl(dump, "edit")}>
               <Trans>Edit</Trans>
             </Link>
           )}