diff --git a/src/components/shared/ScanSkeleton.tsx b/src/components/shared/ScanSkeleton.tsx
new file mode 100644
index 0000000..60559fd
--- /dev/null
+++ b/src/components/shared/ScanSkeleton.tsx
@@ -0,0 +1,33 @@
+import GlassCard from "../GlassCard";
+export default function ScanSkeleton() {
+ return (
+
+ );
+}
\ No newline at end of file
diff --git a/src/index.css b/src/index.css
index e1d1223..055a6c0 100644
--- a/src/index.css
+++ b/src/index.css
@@ -396,4 +396,25 @@ input::placeholder {
@media print {
nav, .print\:hidden { display: none !important; }
+}
+@keyframes shimmer {
+ 0% {
+ background-position: -200% 0;
+ }
+
+ 100% {
+ background-position: 200% 0;
+ }
+}
+
+.skeleton-shimmer {
+ background: linear-gradient(
+ 90deg,
+ var(--color-surface-mid) 25%,
+ var(--color-surface-highest) 50%,
+ var(--color-surface-mid) 75%
+ );
+
+ background-size: 200% 100%;
+ animation: shimmer 1.5s linear infinite;
}
\ No newline at end of file
diff --git a/src/pages/AnalysisDashboard.tsx b/src/pages/AnalysisDashboard.tsx
index 771227f..dd4eca6 100644
--- a/src/pages/AnalysisDashboard.tsx
+++ b/src/pages/AnalysisDashboard.tsx
@@ -5,6 +5,7 @@ import GlassCard from '../components/GlassCard';
import StatusTerminal from '../components/StatusTerminal';
import { api } from '../lib/api';
import type { ScanResult } from '../lib/types';
+import ScanSkeleton from "../components/shared/ScanSkeleton";
const BIOMARKER_META = {
gill_saturation: { label: 'Gill Saturation', icon: Droplets },
@@ -21,6 +22,7 @@ function gradeColor(grade: string) {
}
export default function AnalysisDashboard() {
+
const [params] = useSearchParams();
const [scan, setScan] = useState(null);
const [loading, setLoading] = useState(true);
@@ -43,20 +45,16 @@ export default function AnalysisDashboard() {
} catch (err) {
setError(err instanceof Error ? err.message : 'Failed to load scan data.');
} finally {
- setLoading(false);
+ setLoading(false);
}
}
load();
}, [params]);
// ── Loading state ────────────────────────────────────────────────────────
- if (loading) {
- return (
-
-
-
- );
- }
+if (loading) {
+ return ;
+}
// ── Error state ──────────────────────────────────────────────────────────
if (error || !scan) {