Fix apiStages.map crash by using PaginatedRunStageList type

Three routes (run-overview, run-configuration, run-graph) were typing
the stages API response as RunStage[] but the endpoint returns a
paginated wrapper { data, meta }. Destructure .data to get the array.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Bryan Helmkamp 2026-03-05 10:24:23 -05:00
parent 65e3a0bcee
commit 41ed815a19
3 changed files with 9 additions and 9 deletions

View file

@ -4,7 +4,7 @@ import { DocumentTextIcon, MapIcon } from "@heroicons/react/24/outline";
import { CollapsibleFile } from "../components/collapsible-file";
import { apiFetch, apiJson } from "../api-client";
import { formatDurationSecs } from "../lib/format";
import type { RunStage } from "@qltysh/arc-api-client";
import type { PaginatedRunStageList } from "@qltysh/arc-api-client";
import type { Route } from "./+types/run-configuration";
export const handle = { wide: true };
@ -26,8 +26,8 @@ const statusConfig: Record<StageStatus, { icon: typeof CheckCircleIcon; color: s
};
export async function loader({ request, params }: Route.LoaderArgs) {
const [apiStages, configRes] = await Promise.all([
apiJson<RunStage[]>(`/runs/${params.id}/stages`, { request }),
const [{ data: apiStages }, configRes] = await Promise.all([
apiJson<PaginatedRunStageList>(`/runs/${params.id}/stages`, { request }),
apiFetch(`/runs/${params.id}/configuration`, { request }),
]);
const stages: Stage[] = apiStages.map((s) => ({

View file

@ -7,7 +7,7 @@ import { useTheme } from "../lib/theme";
import { getGraphTheme } from "../lib/graph-theme";
import { apiFetch, apiJson } from "../api-client";
import { formatDurationSecs } from "../lib/format";
import type { RunStage } from "@qltysh/arc-api-client";
import type { PaginatedRunStageList } from "@qltysh/arc-api-client";
import type { Route } from "./+types/run-graph";
export const handle = { wide: true };
@ -23,8 +23,8 @@ interface Stage {
}
export async function loader({ request, params }: Route.LoaderArgs) {
const [apiStages, graphRes] = await Promise.all([
apiJson<RunStage[]>(`/runs/${params.id}/stages`, { request }),
const [{ data: apiStages }, graphRes] = await Promise.all([
apiJson<PaginatedRunStageList>(`/runs/${params.id}/stages`, { request }),
apiFetch(`/runs/${params.id}/graph`, { request }),
]);
const stages: Stage[] = apiStages.map((s) => ({

View file

@ -7,7 +7,7 @@ import { useTheme } from "../lib/theme";
import { getGraphTheme } from "../lib/graph-theme";
import { apiJson } from "../api-client";
import { formatDurationSecs } from "../lib/format";
import type { RunStage, PaginatedRunList, WorkflowDetail } from "@qltysh/arc-api-client";
import type { PaginatedRunStageList, PaginatedRunList, WorkflowDetail } from "@qltysh/arc-api-client";
import type { Route } from "./+types/run-overview";
export const handle = { wide: true };
@ -22,8 +22,8 @@ interface Stage {
}
export async function loader({ request, params }: Route.LoaderArgs) {
const [apiStages, response] = await Promise.all([
apiJson<RunStage[]>(`/runs/${params.id}/stages`, { request }),
const [{ data: apiStages }, response] = await Promise.all([
apiJson<PaginatedRunStageList>(`/runs/${params.id}/stages`, { request }),
apiJson<PaginatedRunList>("/runs", { request }),
]);
const stages: Stage[] = apiStages.map((s) => ({