scriptoriumadmin/fabro
1
0
Fork 0
mirror of https://github.com/fabro-sh/fabro.git synced 2026-08-28 05:27:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

fix(web): hide runs landing zero-state until data resolves

Browse source 
Render kanban column shells while board/auth/system queries load, so the
"Your runs will appear here" panel no longer flashes before runs arrive.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Bryan Helmkamp 2026-05-04 13:42:18 -04:00
parent 3eef9ee928
commit 8064aa269e
No known key found for this signature in database
1 changed files with 31 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
apps/fabro-web/app/routes/runs.tsx
View file

@ -64,6 +64,28 @@ type Column = {
items: RunItem[];
};
const SKELETON_STATUSES: ColumnStatus[] = [
"initializing",
"running",
"blocked",
"succeeded",
"failed",
];
function buildSkeletonColumns(): Column[] {
return SKELETON_STATUSES.map((id) => {
const colors = columnStatusDisplay[id];
return {
id,
name: colors.label,
dot: colors.dot,
text: colors.text,
...(columnStyles[id] ?? defaultColumnStyle),
items: [],
};
});
}
export function buildBoardColumns(response: BoardRunsResponse): Column[] {
const grouped = new Map<string, RunItem[]>();
for (const col of response.columns) {
@ -668,8 +690,12 @@ export default function Runs() {
const boardRuns = useBoardsRuns();
const authConfig = useAuthConfig();
const systemInfo = useSystemInfo();
const isLandingReady =
boardRuns.data !== undefined &&
authConfig.data !== undefined &&
systemInfo.data !== undefined;
const initialColumns = useMemo(
() => boardRuns.data ? buildBoardColumns(boardRuns.data) : [],
() => boardRuns.data ? buildBoardColumns(boardRuns.data) : buildSkeletonColumns(),
[boardRuns.data],
);
const hasGitHubAuth = authConfig.data?.methods.includes("github") === true;
@ -795,12 +821,12 @@ export default function Runs() {
</div>
))}
</div>
{totalRuns === 0 ? (
{isLandingReady && totalRuns === 0 ? (
<RunsLandingEmpty
hasGitHubAuth={hasGitHubAuth}
serverUrl={serverUrl}
/>
) : filteredRuns === 0 ? (
) : totalRuns > 0 && filteredRuns === 0 ? (
<div className="py-8">
<EmptyState
title="No matching runs"
@ -850,12 +876,12 @@ export default function Runs() {
);
})}
</div>
{totalRuns === 0 ? (
{isLandingReady && totalRuns === 0 ? (
<RunsLandingEmpty
hasGitHubAuth={hasGitHubAuth}
serverUrl={serverUrl}
/>
) : filteredRuns === 0 ? (
) : totalRuns > 0 && filteredRuns === 0 ? (
<div className="py-8">
<EmptyState
title="No matching runs"