asepharyana
392db8eba1
Ground-up rebuild of the GMW frontend as an Ambient Field console: - WebGL ambient background (Three.js shader, drifting motes, reduced-motion aware) - Glassmorphism dark cyber theme across all 8 routes - SSR page + client view split with SWR fallback; realtime via WebSocket - Command palette (Cmd+K), chatbot FAB, guild/channel pickers - Chart primitives: donut, radial-gauge, area-activity, sparkline, equalizer Cleanup (review pass): - Remove stray Puppeteer nav-test/nav-debug scripts - Replace non-null assertions with guards (dashboard/moderation) - Drop unused useGuilds fetches in messages/voice views - Type implicit-any `let` declarations across pages - Add a11y roles/labels to SVG charts and audio, tidy imports
76 lines
1.9 KiB
TypeScript
76 lines
1.9 KiB
TypeScript
import { AlertTriangle, Inbox, Loader2 } from "lucide-react";
|
|
import { Spinner } from "@/components/primitives";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
export function EmptyState({
|
|
title = "Nothing here yet",
|
|
description,
|
|
icon,
|
|
className,
|
|
}: {
|
|
title?: string;
|
|
description?: string;
|
|
icon?: React.ReactNode;
|
|
className?: string;
|
|
}) {
|
|
return (
|
|
<div
|
|
className={cn(
|
|
"flex flex-col items-center justify-center gap-2 py-12 text-center",
|
|
className,
|
|
)}
|
|
>
|
|
<div className="text-ink-faint">
|
|
{icon ?? <Inbox className="size-7" />}
|
|
</div>
|
|
<div className="text-sm font-medium text-ink-soft">{title}</div>
|
|
{description && (
|
|
<div className="max-w-xs text-xs text-ink-faint">{description}</div>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function ErrorState({
|
|
title = "Couldn't load",
|
|
error,
|
|
onRetry,
|
|
}: {
|
|
title?: string;
|
|
error?: unknown;
|
|
onRetry?: () => void;
|
|
}) {
|
|
const msg = error instanceof Error ? error.message : String(error ?? "");
|
|
return (
|
|
<div className="glass flex flex-col items-center gap-3 p-8 text-center">
|
|
<AlertTriangle className="size-7 text-vermilion" />
|
|
<div className="text-sm font-medium text-ink">{title}</div>
|
|
{msg && (
|
|
<div className="mono max-w-md break-words text-xs text-ink-faint">
|
|
{msg}
|
|
</div>
|
|
)}
|
|
{onRetry && (
|
|
<button
|
|
type="button"
|
|
onClick={onRetry}
|
|
className="mt-1 rounded-[10px] border border-hairline px-3 py-1.5 text-xs text-ink-soft hover:text-ink hover:border-signal/40"
|
|
>
|
|
Retry
|
|
</button>
|
|
)}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export function LoadingState({ label = "Syncing" }: { label?: string }) {
|
|
return (
|
|
<div className="flex items-center justify-center gap-2 py-12 text-ink-faint">
|
|
<Spinner />
|
|
<span className="mono text-xs uppercase tracking-wider">{label}</span>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export { Loader2 };
|