add working vaa ash-polygons map w/ volcano selection capabilities

client/src/components/Widgets/IvansAlerts.jsx

@@ -17,24 +17,24 @@ export default function IvansAlerts({ settings, widgetID }) {
   const url = useBuildUrl('/api/v2/comm_coor_ivans', settings?.startDate, settings?.endDate);
 
   // VdapApi hook only calls api if the url changes and apiData remains stable since vdapApi uses state to track the data
-  const {data: apiData, isLoading, error} = VdapApi(url);
+  const {data, isLoading, error} = VdapApi(url);
 
   // sort the apiData
-  const data = useMemo(() => {
-    if (apiData?.length === 0) return [];
+  const some_data = useMemo(() => {
+    if (data?.length === 0) return [];
     const sorts = settings?.activeSorts;
 
-    if (sorts?.volcanoSort && sorts?.timeSort === "asc") return [...apiData].sort(ascTimeVolcanoSort);
-    else if (sorts?.volcanoSort && sorts?.timeSort === "desc") return [...apiData].sort(descTimeVolcanoSort);
-    else if (sorts?.timeSort === "asc") return [...apiData].sort(ascTimeSort);
-    else return [...apiData].sort(descTimeSort);
+    if (sorts?.volcanoSort && sorts?.timeSort === "asc") return [...data].sort(ascTimeVolcanoSort);
+    else if (sorts?.volcanoSort && sorts?.timeSort === "desc") return [...data].sort(descTimeVolcanoSort);
+    else if (sorts?.timeSort === "asc") return [...data].sort(ascTimeSort);
+    else return [...data].sort(descTimeSort);
 
-  }, [apiData, settings]);
+  }, [data, settings]);
 
   // copy data to clipboard in formatted way when user clicks on copy btn in widget settings
   useEffect(() => {
     if (settings?.copyToClipboard === true) {
-      const dataText = data.map((item) => {
+      const dataText = some_data.map((item) => {
         return `${item.volcano_name}\n` +
           `Report Number: ${item.report_num}\n` +
           `Send Time: ${item.send_time}\n` +
@@ -50,7 +50,7 @@ export default function IvansAlerts({ settings, widgetID }) {
         }));
       updateSettings(widgetID, {copyToClipboard: false});
     }
-  }, [settings, data, widgetID, updateSettings]);
+  }, [settings, some_data, widgetID, updateSettings]);
 
   if (isLoading) return (
     <Flex w="100%" h="100%" align="center" justify="center" borderRadius="lg" bg="gray.800">
@@ -64,7 +64,7 @@ export default function IvansAlerts({ settings, widgetID }) {
     </Flex>
   );
 
-  if (data.length === 0) return (
+  if (some_data.length === 0) return (
     <Flex w="100%" h="100%" align="center" justify="center" borderRadius="lg" bg="gray.800">
       <Text textAlign="center" color="gray.400">No flight level data available for the selected dates.</Text>
     </Flex>
@@ -80,7 +80,7 @@ export default function IvansAlerts({ settings, widgetID }) {
           borderRadius="xl"
           bg="gray.800"
     >
-      {data.map((item, index) => {
+      {some_data.map((item, index) => {
         if (thisWidget?.size === "large") return (
           <Collapsible.Root key={index} w="100%">
             {/* Using context to dynamically change the border radii of the triggers */}