41 lines
1.2 KiB
TypeScript
41 lines
1.2 KiB
TypeScript
/**
|
|
* @license
|
|
* SPDX-License-Identifier: Apache-2.0
|
|
*/
|
|
|
|
import React from 'react';
|
|
import { PlugZap } from 'lucide-react';
|
|
|
|
/**
|
|
* Explicit "this data has no backend yet" placeholder. Used for UI sections whose
|
|
* live API is not built (see docs/03_REQUIRED_BACKEND_APIS.md → [R*] ids). We show
|
|
* this instead of fabricated numbers so nothing fake reaches staging.
|
|
*/
|
|
export default function AwaitingApi({
|
|
label,
|
|
api,
|
|
className = '',
|
|
compact = false,
|
|
}: {
|
|
/** What the section will show once wired (e.g. "Operational alerts"). */
|
|
label: string;
|
|
/** The required-API id from the spec doc, e.g. "[R12]". */
|
|
api?: string;
|
|
className?: string;
|
|
compact?: boolean;
|
|
}) {
|
|
return (
|
|
<div
|
|
className={`flex flex-col items-center justify-center text-center rounded-xl border border-dashed border-slate-300 bg-slate-50/60 text-slate-400 ${
|
|
compact ? 'p-4 gap-1.5' : 'p-8 gap-2'
|
|
} ${className}`}
|
|
>
|
|
<PlugZap size={compact ? 16 : 22} className="text-slate-300" />
|
|
<p className={`font-semibold text-slate-500 ${compact ? 'text-xs' : 'text-sm'}`}>{label}</p>
|
|
<p className="text-[11px] leading-relaxed">
|
|
Awaiting backend API{api ? ` ${api}` : ''} — no live data source yet.
|
|
</p>
|
|
</div>
|
|
);
|
|
}
|