import { useEffect, useRef, useState } from "react"; import type { JSX } from "react"; const REDIRECT_URL: string = "https://meet.google.com"; interface ScheduleFn { (): number; } interface Refs { eyeRef: React.RefObject; pupilRef: React.RefObject; } export default function WatchingYou(): JSX.Element { const eyeRef = useRef(null); const pupilRef = useRef(null); const [blinking, setBlinking] = useState(false); const [glitching, setGlitching] = useState(false); useEffect(() => { const handleMouseMove = (e: MouseEvent) => { if (!eyeRef.current || !pupilRef.current) return; const rect = eyeRef.current.getBoundingClientRect(); const cx = rect.left + rect.width / 2; const cy = rect.top + rect.height / 2; const dx = e.clientX - cx; const dy = e.clientY - cy; const angle = Math.atan2(dy, dx); const dist = Math.min(Math.hypot(dx, dy), 28); pupilRef.current.style.transform = `translate(${Math.cos(angle) * dist}px, ${Math.sin(angle) * dist}px)`; }; window.addEventListener("mousemove", handleMouseMove); return () => window.removeEventListener("mousemove", handleMouseMove); }, []); useEffect(() => { const scheduleBlink: ScheduleFn = () => { const delay: number = 2500 + Math.random() * 3000; return window.setTimeout(() => { setBlinking(true); setTimeout(() => { setBlinking(false); blink = scheduleBlink(); }, 180); }, delay); }; let blink: number = scheduleBlink(); return () => clearTimeout(blink); }, []); useEffect(() => { const scheduleGlitch: ScheduleFn = () => { const delay: number = 4000 + Math.random() * 6000; return window.setTimeout(() => { setGlitching(true); setTimeout(() => { setGlitching(false); glitch = scheduleGlitch(); }, 400); }, delay); }; let glitch: number = scheduleGlitch(); return () => clearTimeout(glitch); }, []); const handleRedirect = (): void => { window.location.href = REDIRECT_URL; }; return (

{/* Vignette overlay */}

{/* Scanlines overlay */}

{/* Content */}

{/* Eye SVG */}

{/* Main heading */}

I'm Watching You,

{/* Name */}

Aariz.

{/* Subtitle */}

Every move. Every click. Every breath.

{/* Buttons */}

{/* Footer whisper */}

There is no escape.

); }