27 lines
799 B
TypeScript
27 lines
799 B
TypeScript
/**
|
|
* Thin connectivity banner — used on pages outside the BidderLayout shell
|
|
* (auth pages, staff tools, display board).
|
|
*
|
|
* Hidden when fully connected.
|
|
*/
|
|
import { useConnectivityStore } from "../store/connectivity.js";
|
|
|
|
const CONFIGS = {
|
|
local: { bg: "bg-gold-500", text: "Local network — offline-capable" },
|
|
offline: { bg: "bg-red-500", text: "Offline — bids will sync when reconnected" },
|
|
} as const;
|
|
|
|
export function ConnectivityBanner() {
|
|
const status = useConnectivityStore((s) => s.status);
|
|
if (status === "connected") return null;
|
|
|
|
const cfg = CONFIGS[status as keyof typeof CONFIGS];
|
|
if (!cfg) return null;
|
|
|
|
return (
|
|
<div className={`${cfg.bg} text-white text-center text-xs py-1.5 px-4 font-semibold tracking-wide`}>
|
|
{cfg.text}
|
|
</div>
|
|
);
|
|
}
|