From 7a3893fa06ac94081cc11444d4065b9099d343c6 Mon Sep 17 00:00:00 2001 From: Quentin Gliech Date: Sun, 29 Mar 2026 23:00:54 +0200 Subject: [PATCH] fix(web): use Route.useParams() for Link params, ref for GraphQL the normalized ref from context is null for the default repo, but Link params need the raw URL slug (e.g. "_"). Use Route.useParams() for Link params and context.ref for GraphQL variables. also remove unnecessary non-null assertions on params from Route.useParams() which always returns strings Co-Authored-By: Claude Opus 4.6 (1M context) --- webui2/src/routes/$repo/_issues/issues/$id.tsx | 15 ++++++++------- .../src/routes/$repo/_issues/issues/index.tsx | 10 +++++----- webui2/src/routes/$repo/_issues/issues/new.tsx | 8 ++++---- webui2/src/routes/$repo/_issues/user/$id.tsx | 14 +++++++------- webui2/src/routes/$repo/commit/$hash.tsx | 7 ++++--- webui2/src/routes/$repo/index.tsx | 17 +++++++++-------- 6 files changed, 37 insertions(+), 34 deletions(-) diff --git a/webui2/src/routes/$repo/_issues/issues/$id.tsx b/webui2/src/routes/$repo/_issues/issues/$id.tsx index 734b93d87739ea1f2d45c760fc677c71565fc5b2..4684b3fe96077c141e434d57e924c618129e8e91 100644 --- a/webui2/src/routes/$repo/_issues/issues/$id.tsx +++ b/webui2/src/routes/$repo/_issues/issues/$id.tsx @@ -27,7 +27,8 @@ export const Route = createFileRoute("/$repo/_issues/issues/$id")({ // Issue detail page (/:repo/issues/:id). Shows title, status, timeline of // comments and events, and a sidebar with labels and participants. function RouteComponent() { - const { ref: repo } = Route.useRouteContext(); + const { ref } = Route.useRouteContext(); + const { repo } = Route.useParams(); const { bugDetailRef } = Route.useLoaderData(); const { labelsRef } = Route.useRouteContext(); const { data } = useReadQuery(bugDetailRef); @@ -43,7 +44,7 @@ function RouteComponent() {
@@ -53,7 +54,7 @@ function RouteComponent() { {/* Title row — hover reveals edit button when logged in */}
- +
@@ -61,7 +62,7 @@ function RouteComponent() { {bug.author.displayName} @@ -76,7 +77,7 @@ function RouteComponent() { {/* Timeline + comment box */}
- +
{/* Sidebar */} @@ -84,7 +85,7 @@ function RouteComponent() { @@ -100,7 +101,7 @@ function RouteComponent() { diff --git a/webui2/src/routes/$repo/_issues/issues/index.tsx b/webui2/src/routes/$repo/_issues/issues/index.tsx index ad5de3129c208933ca4dfbf09ff5d35c172d8038..bba68297461a51604fcea17523da1b2b13f7437e 100644 --- a/webui2/src/routes/$repo/_issues/issues/index.tsx +++ b/webui2/src/routes/$repo/_issues/issues/index.tsx @@ -46,7 +46,7 @@ const PAGE_SIZE = 25; type StatusFilter = "open" | "closed"; function RouteComponent() { - const { ref: repo } = Route.useRouteContext(); + const { repo } = Route.useParams(); const navigate = useNavigate({ from: "/$repo/issues/" }); const { q, after } = Route.useSearch(); @@ -130,7 +130,7 @@ function RouteComponent() {
@@ -111,7 +111,7 @@ function RouteComponent() {
diff --git a/webui2/src/routes/$repo/_issues/user/$id.tsx b/webui2/src/routes/$repo/_issues/user/$id.tsx index 3fd70c8b931c5b4cb23bd7b29140ea04f378a432..5a88c47c960225843ea5dc39a9e3a730f0793735 100644 --- a/webui2/src/routes/$repo/_issues/user/$id.tsx +++ b/webui2/src/routes/$repo/_issues/user/$id.tsx @@ -6,7 +6,7 @@ // The :id param is treated as a humanId prefix and passed directly to the // identity(prefix) and allBugs(query:"author:...") GraphQL arguments. -import { createFileRoute, useParams, Link } from "@tanstack/react-router"; +import { createFileRoute, Link } from "@tanstack/react-router"; import { formatDistanceToNow } from "date-fns"; import { ArrowLeft, @@ -33,8 +33,8 @@ export const Route = createFileRoute("/$repo/_issues/user/$id")({ const PAGE_SIZE = 25; function RouteComponent() { - const { id } = useParams({ strict: false }); - const { ref: repo } = Route.useRouteContext(); + const { id, repo } = Route.useParams(); + const { ref } = Route.useRouteContext(); const [statusFilter, setStatusFilter] = useState<"open" | "closed">("open"); // Cursor-stack pagination: cursors[i] is the `after` value to fetch page i. @@ -47,8 +47,8 @@ function RouteComponent() { // bugs — paginated list for the selected tab const { data, loading, error } = useUserProfileQuery({ variables: { - ref: repo, - prefix: id!, + ref, + prefix: id, openQuery: `author:${id} status:open`, closedQuery: `author:${id} status:closed`, listQuery: `author:${id} status:${statusFilter}`, @@ -98,7 +98,7 @@ function RouteComponent() {
@@ -218,7 +218,7 @@ function RouteComponent() {
{bug.title} diff --git a/webui2/src/routes/$repo/commit/$hash.tsx b/webui2/src/routes/$repo/commit/$hash.tsx index 1f76a9732c52d294f4562c921647d628cadca12d..452df07af366b9ac7546644abd934901a79a614e 100644 --- a/webui2/src/routes/$repo/commit/$hash.tsx +++ b/webui2/src/routes/$repo/commit/$hash.tsx @@ -64,7 +64,8 @@ export const Route = createFileRoute("/$repo/commit/$hash")({ }); function RouteComponent() { - const { ref: repo } = Route.useRouteContext(); + const { ref } = Route.useRouteContext(); + const { repo } = Route.useParams(); const { commitRef } = Route.useLoaderData(); const { data } = useReadQuery(commitRef); @@ -115,7 +116,7 @@ function RouteComponent() { parent{" "} {p.slice(0, 7)} @@ -136,7 +137,7 @@ function RouteComponent() { {files.map((file: { path: string; oldPath?: string | null; status: string }) => ( (TREE_QUERY, { - variables: { repo, ref: currentRef, path: currentPath || null }, + variables: { repo: repoRef, ref: currentRef, path: currentPath || null }, skip: !inTreeMode, }); const entries: GitTreeEntry[] = treeData?.repository?.tree ?? []; const entryNames = entries.map((e: GitTreeEntry) => e.name); const { data: lastCommitsData } = useQuery(LAST_COMMITS_QUERY, { - variables: { repo, ref: currentRef, path: currentPath || null, names: entryNames }, + variables: { repo: repoRef, ref: currentRef, path: currentPath || null, names: entryNames }, skip: !inTreeMode || entryNames.length === 0, }); const lastCommitsByName = new Map( @@ -176,7 +177,7 @@ function RouteComponent() { })); const { data: blobData, loading: blobLoading } = useQuery(BLOB_QUERY, { - variables: { repo, ref: currentRef, path: currentPath }, + variables: { repo: repoRef, ref: currentRef, path: currentPath }, skip: !inBlobMode, }); const blob: GitBlob | null = blobData?.repository?.blob ?? null; @@ -191,12 +192,12 @@ function RouteComponent() { : readmeEntry.name : null; const { data: readmeBlobData } = useQuery(BLOB_QUERY, { - variables: { repo, ref: currentRef, path: readmePath }, + variables: { repo: repoRef, ref: currentRef, path: readmePath }, skip: !inTreeMode || !readmePath, }); const readme: string | null = readmeBlobData?.repository?.blob?.text ?? null; - const repoName = refsData?.repository?.name ?? repo ?? "default-repo"; + const repoName = refsData?.repository?.name ?? repoRef ?? "default-repo"; function navigateTo(path: string, type: ViewMode = "tree") { void navigate({ search: (prev) => ({ ...prev, path, type }) }); @@ -239,7 +240,7 @@ function RouteComponent() {
{viewMode === "commits" ? ( - + ) : viewMode === "tree" || !blob ? ( <>