From 0b8229d46f679950d8e2654572870e5f47dde357 Mon Sep 17 00:00:00 2001
From: Satyam-Rastogi <satyamrastogi302@gmail.com>
Date: Tue, 19 May 2026 00:51:44 +0530
Subject: [PATCH] fix(storm-intel): hailIn TDZ crash, restore 36mo fetch, Go
 button for radius

- Fix ReferenceError: hailIn was used before declaration in featureToEvent,
  causing every SV event to throw and fall back to empty mock data
- Restore IEM fetch window to 36 months so events are available for all range chips
- Radius input now has explicit Go button (Enter key also applies); draft value
  shows hint until applied so accidental keystrokes don't retrigger search
---
 src/hooks/useStormEvents.js  |  6 +++---
 src/pages/StormIntelPage.jsx | 27 ++++++++++++++++++++-------
 2 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/src/hooks/useStormEvents.js b/src/hooks/useStormEvents.js
index 4343750..e152257 100644
--- a/src/hooks/useStormEvents.js
+++ b/src/hooks/useStormEvents.js
@@ -70,14 +70,14 @@ function featureToEvent(feature, idx) {
 
     const polygon = rawCoords.map(([lon, lat]) => [lat, lon]); // → Leaflet [lat,lon]
 
+    const hailIn = p.hailtag ? parseFloat(p.hailtag) : null;
+
     const type = ph === 'TO'                        ? 'tornado'
                : ph === 'FF'                        ? 'flood'
                : ph === 'WS' || ph === 'BZ'         ? 'snow'
                : ph === 'WW' || ph === 'IS'         ? 'ice'
                : hailIn !== null                    ? 'hail'
                : 'wind';
-
-    const hailIn = p.hailtag ? parseFloat(p.hailtag) : null;
     const severity = ph === 'TO'    ? 'severe'
         : hailIn !== null
             ? (hailIn >= 2.0 ? 'severe' : hailIn >= 1.5 ? 'significant' : hailIn >= 1.0 ? 'moderate' : 'trace')
@@ -101,7 +101,7 @@ function featureToEvent(feature, idx) {
 
 async function fetchIEMEvents() {
     const now    = new Date();
-    const cutoff = new Date(now.getTime() - 6 * 30.44 * 86400000);
+    const cutoff = new Date(now.getTime() - 36 * 30.44 * 86400000);
     const url    = `${IEM_SBW}?sts=${encodeURIComponent(cutoff.toISOString())}&ets=${encodeURIComponent(now.toISOString())}&wfo=${WFO}`;
 
     const res = await fetch(url);
diff --git a/src/pages/StormIntelPage.jsx b/src/pages/StormIntelPage.jsx
index 683bc1d..33d886b 100644
--- a/src/pages/StormIntelPage.jsx
+++ b/src/pages/StormIntelPage.jsx
@@ -991,9 +991,15 @@ const StormIntelPage = () => {
     // Pin drop — up to 5 pins
     const [pinDropMode,     setPinDropMode]     = useState(false);
     const [pins,            setPins]            = useState([]);  // array of [lat,lng]
-    const [pinRadius,       setPinRadius]       = useState(5);  // miles
+    const [pinRadius,       setPinRadius]       = useState(5);  // applied radius (miles)
+    const [radiusInput,     setRadiusInput]     = useState('5'); // draft value in input
     const MAX_PINS = 5;
 
+    const applyRadius = useCallback(() => {
+        const v = parseInt(radiusInput, 10);
+        if (!isNaN(v) && v >= 1) setPinRadius(Math.min(v, 500));
+    }, [radiusInput]);
+
     // Zone drawing state
     const [isDrawing,           setIsDrawing]           = useState(false);
     const [draftPolygon,        setDraftPolygon]        = useState([]);
@@ -1448,15 +1454,22 @@ const StormIntelPage = () => {
                                 <input
                                     type="number"
                                     min="1"
-                                    max="100"
-                                    value={pinRadius}
-                                    onChange={e => {
-                                        const v = parseInt(e.target.value, 10);
-                                        if (!isNaN(v) && v >= 1) setPinRadius(Math.min(v, 100));
-                                    }}
+                                    max="500"
+                                    value={radiusInput}
+                                    onChange={e => setRadiusInput(e.target.value)}
+                                    onKeyDown={e => e.key === 'Enter' && applyRadius()}
                                     className="w-14 text-center text-[11px] font-bold rounded-md border border-violet-200 dark:border-violet-500/30 bg-white dark:bg-violet-500/10 text-violet-700 dark:text-violet-300 outline-none focus:ring-1 focus:ring-violet-400 px-1 py-0.5"
                                 />
                                 <span className="text-[10px] text-violet-400">mi</span>
+                                <button
+                                    onClick={applyRadius}
+                                    className="px-2 py-0.5 rounded-md bg-violet-600 hover:bg-violet-700 text-white text-[10px] font-bold transition-colors"
+                                >
+                                    Go
+                                </button>
+                                {radiusInput !== String(pinRadius) && (
+                                    <span className="text-[9px] text-violet-400 italic">press Go</span>
+                                )}
                             </div>
                         </div>
                     )}