import React, { useState, useEffect } from "react"; import { motion, AnimatePresence } from "framer-motion"; import { Zap, Activity, ShieldCheck, X, RefreshCw, AlertTriangle, Radio } from "lucide-react"; export default function SmartGridDiagnosticHudOverlay() { const [isOpen, setIsOpen] = useState(false); const [phase, setPhase] = useState<"idle" | "sampling" | "balancing" | "synchronized">("idle"); const [load, setLoad] = useState(98.2); const [frequency, setFrequency] = useState(57.40); useEffect(() => { if (!isOpen) { setPhase("idle"); setLoad(98.2); setFrequency(57.40); return; } setPhase("sampling"); const balancingTimer = setTimeout(() => { setPhase("balancing"); }, 2500); const syncTimer = setTimeout(() => { setPhase("synchronized"); }, 6000); return () => { clearTimeout(balancingTimer); clearTimeout(syncTimer); }; }, [isOpen]); useEffect(() => { let telemetryInterval: NodeJS.Timeout; if (phase === "sampling") { telemetryInterval = setInterval(() => { setLoad(98.2 + (Math.random() * 1.5 - 0.75)); setFrequency(57.40 + (Math.random() * 0.3 - 0.15)); }, 150); } else if (phase === "balancing") { telemetryInterval = setInterval(() => { setLoad((prev) => { const next = prev - (prev - 50.0) * 0.1; return next < 50.5 ? 50.2 : next; }); setFrequency((prev) => { const next = prev + (60.0 - prev) * 0.1; return next > 59.95 ? 60.00 : next; }); }, 100); } else if (phase === "synchronized") { setLoad(50.2); setFrequency(60.00); telemetryInterval = setInterval(() => { setLoad(50.2 + (Math.random() * 0.2 - 0.1)); setFrequency(60.00 + (Math.random() * 0.02 - 0.01)); }, 500); } return () => clearInterval(telemetryInterval); }, [phase]); return (

Substation_Alpha

Phase Imbalance

{isOpen && (

Grid Alignment HUD

{[...Array(16)].map((_, i) => ( ))}

Grid Frequency

{frequency.toFixed(2)} Hz

Bus Load

{load.toFixed(1)} %

Target Threshold 60.00 Hz ±0.05

{phase === "sampling" ? "Sampling" : phase === "balancing" ? "Balancing" : "Isolated"}

{phase === "sampling" && ( Reading harmonics profiles... )} {phase === "balancing" && ( Modulating capacitor banks... )} {phase === "synchronized" && ( Static var compensator locked )}

)}

Grid Telemetry Node Grid_A4

); }