Merge release into dev - synchronize branches

Author: evulins

src/app/component.js

@@ -104,11 +104,10 @@ const App = (props) => {
     const isResultsPage = pathname === '/observed-outcomes';
 
     // Home page needs predictions and sparse data for the map
-    // Fetch years, predictions, and available states immediately
+    // First fetch available years to ensure predictionYear is valid (e.g., 2024 not 2025)
+    // The reducer will auto-correct predictionYear, which triggers the other useEffect to fetch predictions
     if (isHomePage) {
       getAvailableYears();
-      getPredictions(predictionYear);
-      getAvailableStates({ predictionYear });
     }
 
     // Blog pages need blog posts
@@ -125,7 +124,6 @@ const App = (props) => {
     getAggregateStateData,
     getAggregateYearData,
     getAllBlogPosts,
-    getAvailableStates,
     getAvailableYears,
     getPredictions,
     getSparseData,

src/components/loader/index.js

@@ -1,9 +1,11 @@
-import React from 'react';
+import React, { useRef } from 'react';
 import Modal from 'react-modal';
 
 import './style.scss';
 
 const Loader = ({ visible, message = 'Loading...', inline = false }) => {
+  const modalIdRef = useRef(`loader-modal-${Math.random().toString(36).substring(2, 11)}`);
+
   const spinnerContent = (
     <div className={inline ? 'loading-container loading-container--inline' : 'loading-container'}>
       <div className="loading-spinner">
@@ -21,7 +23,7 @@ const Loader = ({ visible, message = 'Loading...', inline = false }) => {
 
   return (
     <Modal
-      key={visible ? 'loader-open' : 'loader-closed'}
+      key={modalIdRef.current}
       ariaHideApp={false}
       className="loading-modal"
       closeTimeoutMS={200}