React Map Frontend: Interactive surveillance awareness dashboard

[POWDER-RANGER]

CIVWATCH React Map Frontend

This PR introduces a complete interactive surveillance awareness dashboard built with React 19, TypeScript, Leaflet, and Tailwind CSS.

What's New

• Interactive Dark Map — Leaflet-based with CartoDB Dark Matter tiles, centered on Dallas with nationwide coverage
• 5 Surveillance Layers (toggleable):
  • ALPR (teal diamonds ◆) — Flock Safety, Vigilant Solutions, NTTA cameras with pulse animation
  • Facial Recognition (amber triangles ▲) — Clearview AI, NEC, Amazon Rekognition deployments
  • Microphone Arrays (grey circles ●) — ShotSpotter, acoustic surveillance nodes
  • ICE Raids (red squares ■) — Real-time enforcement activity with warning pulse
  • Protest Zones (purple) — Civil demonstration areas
• Heat Map Layer — ALPR density visualization with teal gradient
• Live Alert Sidebar — 10 field reports with color-coded border accents
• Camera Feed Panel — 5 simulated feeds with static noise animation, status indicators
• Detail Modal — Click any marker for full location data, operator info, coordinates
• Scrolling Ticker — Live alerts across the header bar
• Real-time Coordinates — Mouse tracking on footer status bar
• Layer Controls — Toggle visibility per surveillance type

Tech Stack

• React 19 + TypeScript + Vite
• Leaflet + leaflet.heat + react-leaflet
• Tailwind CSS + JetBrains Mono / Inter fonts
• Lucide React icons

Cities Covered

Dallas, Houston, Austin, Atlanta, Los Angeles, New York, Chicago, Philadelphia, Nashville, Phoenix, Washington DC, San Francisco, Seattle, Portland, Oakland, Miami, Minneapolis

Deployment

Production build available at: https://fc2tqtr6kgsvq.kimi.page