feat: Add dismissible warning UI for threshold loading errors

- Replace console.warn with visible MessageBar warning when map color thresholds fail to load
- Add DismissRegular icon button to allow users to dismiss the warning
- Add dismissedThresholdWarning state to manage warning visibility
- Add mock and test for useMapColorThresholds hook
- Add test case verifying warning displays and can be dismissed
- Remove TASK-QUALITY-04 from Tasks.md (completed)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

frontend/src/pages/MapPage.tsx

@@ -10,6 +10,7 @@ import { useState, useMemo, useEffect } from "react";
 import {
   Button,
   MessageBar,
+  MessageBarActions,
   MessageBarBody,
   Spinner,
   Text,
@@ -142,12 +143,7 @@ export function MapPage(): React.JSX.Element {
   const thresholdMedium = mapThresholds?.threshold_medium ?? 50;
   const thresholdHigh = mapThresholds?.threshold_high ?? 100;
 
-  useEffect(() => {
-    if (mapThresholdError) {
-      // Silently fall back to defaults if fetch fails
-      console.warn("Failed to load map color thresholds:", mapThresholdError);
-    }
-  }, [mapThresholdError]);
+  const [dismissedThresholdWarning, setDismissedThresholdWarning] = useState(false);
 
   useEffect(() => {
     setPage(1);
@@ -223,6 +219,24 @@ export function MapPage(): React.JSX.Element {
         </MessageBar>
       )}
 
+      {mapThresholdError && !dismissedThresholdWarning && (
+        <MessageBar intent="warning">
+          <MessageBarBody>
+            Map color thresholds could not be loaded. Using default thresholds.
+          </MessageBarBody>
+          <MessageBarActions>
+            <Button
+              appearance="transparent"
+              size="small"
+              icon={<DismissRegular />}
+              onClick={(): void => {
+                setDismissedThresholdWarning(true);
+              }}
+            />
+          </MessageBarActions>
+        </MessageBar>
+      )}
+
       {/* Initial load spinner — only shown before the first data arrives. */}
       {loading && !error && !hasLoadedOnce && (
         <div className={styles.initialLoad}>