ui: style the boot-request wait like the wasm loading overlay

The pre-boot state was a white page with bare 'loading…' text; now it's the
same dark full-viewport centered spinner + mono status as WasmTool's boot
overlay, so the boot wait, the download screen and the editor read as one
continuous load with no white flash.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01VLSht9cadprtT2mhynawWu
This commit is contained in:
Gergő Törcsvári 2026-08-18 21:05:42 +02:00
commit fe57caeb92
No known key found for this signature in database
GPG key ID: 8E75F2CDE64E5322

View file

@ -1,6 +1,7 @@
import { useMemo } from "react"; import { useMemo } from "react";
import { useParams, useSearchParams } from "react-router-dom"; import { useParams, useSearchParams } from "react-router-dom";
import { parseToolParam, toolForFile, type Tool } from "@pcbjam/shared"; import { parseToolParam, toolForFile, type Tool } from "@pcbjam/shared";
import { Loader2 } from "lucide-react";
import { import {
createProjectFileIfMissing, createProjectFileIfMissing,
fetchFileBytes, fetchFileBytes,
@ -50,7 +51,15 @@ export function ToolPage() {
} }
if (isLoading) { if (isLoading) {
return <div className="container py-10 text-muted-foreground">loading</div>; // Same look as WasmTool's boot overlay so the boot-request wait, the
// download screen and the editor read as ONE continuous load (no white
// flash between them).
return (
<div className="fixed inset-0 flex flex-col items-center justify-center gap-3 bg-[#1a1a2e] text-white">
<Loader2 className="animate-spin" size={32} />
<p className="font-mono text-sm text-white/80">Loading project</p>
</div>
);
} }
if (error || !data) { if (error || !data) {
return ( return (