// Side rail nav with active section + scroll progress
const navUseState = React.useState;
const navUseEffect = React.useEffect;
function SideNav({ open, onToggle }) {
const [active, setActive] = navUseState('hero');
const [progress, setProgress] = navUseState(0);
const [time, setTime] = navUseState('');
navUseEffect(() => {
const sections = NAV.map(n => document.getElementById(n.id)).filter(Boolean);
const io = new IntersectionObserver((entries) => {
entries.forEach(e => {
if (e.isIntersecting) setActive(e.target.id);
});
}, { threshold: 0.35, rootMargin: '-20% 0px -45% 0px' });
sections.forEach(s => io.observe(s));
const onScroll = () => {
const h = document.documentElement;
const p = h.scrollTop / Math.max(1, h.scrollHeight - h.clientHeight);
setProgress(p);
};
window.addEventListener('scroll', onScroll, { passive: true });
onScroll();
return () => { io.disconnect(); window.removeEventListener('scroll', onScroll); };
}, []);
navUseEffect(() => {
const tick = () => {
const d = new Date();
const t = d.toLocaleTimeString('en-IN', { hour12: false, timeZone: 'Asia/Kolkata' });
setTime(`IST ${t}`);
};
tick();
const t = setInterval(tick, 1000);
return () => clearInterval(t);
}, []);
return (
<>
{/* TOP BAR — slim, system-status */}
AADIT.PANI
OPERATOR ONLINE
{/* progress bar */}
{time}
{Math.round(progress * 100).toString().padStart(2, '0')}% TRAVERSED
{/* SIDE RAIL */}
);
}
function Logo() {
return (
);
}
Object.assign(window, { SideNav });