Can't even keep track anymore

frontend/src/hooks/useAiFilters.ts

@@ -0,0 +1,55 @@
+import { useState, useCallback, useRef } from 'react';
+import type { FeatureFilters } from '../types';
+import { apiUrl, authHeaders, logNonAbortError } from '../lib/api';
+
+interface UseAiFiltersResult {
+  fetchAiFilters: (query: string) => Promise<FeatureFilters | null>;
+  loading: boolean;
+  error: string | null;
+}
+
+export function useAiFilters(): UseAiFiltersResult {
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const abortRef = useRef<AbortController | null>(null);
+
+  const fetchAiFilters = useCallback(async (query: string): Promise<FeatureFilters | null> => {
+    abortRef.current?.abort();
+    const controller = new AbortController();
+    abortRef.current = controller;
+
+    setLoading(true);
+    setError(null);
+
+    try {
+      const url = apiUrl('ai-filters');
+      const response = await fetch(
+        url,
+        authHeaders({
+          method: 'POST',
+          headers: { 'Content-Type': 'application/json' },
+          body: JSON.stringify({ query }),
+          signal: controller.signal,
+        })
+      );
+
+      if (!response.ok) {
+        const text = await response.text();
+        throw new Error(text || `HTTP ${response.status}`);
+      }
+
+      const json = await response.json();
+      setLoading(false);
+      return json.filters as FeatureFilters;
+    } catch (err) {
+      if (controller.signal.aborted) return null;
+      logNonAbortError('ai-filters', err);
+      const message = err instanceof Error ? err.message : 'Failed to generate filters';
+      setError(message);
+      setLoading(false);
+      return null;
+    }
+  }, []);
+
+  return { fetchAiFilters, loading, error };
+}

frontend/src/hooks/useDeckLayers.ts

@@ -11,12 +11,8 @@ import type {
   Bounds,
 } from '../types';
 import type { SearchedPostcode } from '../components/map/PostcodeSearch';
-import {
-  emojiToTwemojiUrl,
-  DENSITY_GRADIENT,
-  DENSITY_GRADIENT_DARK,
-  getFeatureFillColor,
-} from '../lib/map-utils';
+import { DENSITY_GRADIENT, DENSITY_GRADIENT_DARK } from '../lib/consts';
+import { emojiToTwemojiUrl, getFeatureFillColor } from '../lib/map-utils';
 
 /** Convert POI id (e.g. "n12345") to OpenStreetMap URL */
 function osmIdToUrl(id: string): string | null {
@@ -242,7 +238,7 @@ export function useDeckLayers({
   }, []);
 
   // --- Color triggers ---
-  const ttTrigger = `${travelTimeEnabled}|${travelTimeColorRange?.[0]}|${travelTimeColorRange?.[1]}|${travelTimeRange?.[0]}|${travelTimeRange?.[1]}|${travelTimeDestination?.[0]}`;
+  const ttTrigger = `${travelTimeEnabled}|${travelTimeColorRange?.[0]}|${travelTimeColorRange?.[1]}|${travelTimeRange?.[0]}|${travelTimeRange?.[1]}|${travelTimeDestination?.[0]}|${travelTimeDestination?.[1]}`;
   const colorTrigger = `${viewFeature}|${colorRange?.[0]}|${colorRange?.[1]}|${filterRange?.[0]}|${filterRange?.[1]}|${countRange.min}|${countRange.max}|${selectedHexagonId}|${hoveredHexagonId}|${theme}|${ttTrigger}`;
   const postcodeColorTrigger = `${viewFeature}|${colorRange?.[0]}|${colorRange?.[1]}|${filterRange?.[0]}|${filterRange?.[1]}|${postcodeCountRange.min}|${postcodeCountRange.max}|${selectedPostcode}|${hoveredPostcode}|${theme}|${ttTrigger}`;
 

frontend/src/hooks/useFilters.ts

@@ -118,6 +118,14 @@ export function useFilters({ initialFilters, features }: UseFiltersOptions) {
     }
   }, [activeFeature, dragValue]);
 
+  const handleSetFilters = useCallback((newFilters: FeatureFilters) => {
+    setFilters(newFilters);
+    setActiveFeature(null);
+    setDragValue(null);
+    setDragData(null);
+    setPinnedFeature(null);
+  }, []);
+
   const handleTogglePin = useCallback((name: string) => {
     setPinnedFeature((prev) => (prev === name ? null : name));
   }, []);
@@ -144,6 +152,7 @@ export function useFilters({ initialFilters, features }: UseFiltersOptions) {
     handleAddFilter,
     handleFilterChange,
     handleRemoveFilter,
+    handleSetFilters,
     handleDragStart,
     handleDragChange,
     handleDragEnd,

frontend/src/hooks/useHexagonSelection.ts

@@ -29,7 +29,7 @@ export function useHexagonSelection({ filters, features, resolution }: UseHexago
   const [areaStats, setAreaStats] = useState<HexagonStatsResponse | null>(null);
   const [loadingAreaStats, setLoadingAreaStats] = useState(false);
   const [hoveredHexagon, setHoveredHexagon] = useState<string | null>(null);
-  const [rightPaneTab, setRightPaneTab] = useState<'pois' | 'properties' | 'area'>('pois');
+  const [rightPaneTab, setRightPaneTab] = useState<'properties' | 'area'>('area');
 
   const fetchHexagonStats = useCallback(
     async (h3: string, res: number, signal?: AbortSignal, fields?: string[]) => {

frontend/src/hooks/useTravelTime.ts

@@ -1,6 +1,6 @@
 import { useState, useCallback } from 'react';
 
-export type TransportMode = 'transit' | 'car' | 'bicycle';
+export type TransportMode = 'car' | 'bicycle' | 'walking' | 'transit';
 
 export interface TravelTimeState {
   enabled: boolean;
@@ -23,7 +23,7 @@ export function useTravelTime(initial?: TravelTimeInitial) {
     initial?.destination ?? null
   );
   const [destinationLabel, setDestinationLabel] = useState(initial?.destinationLabel ?? '');
-  const [mode, setMode] = useState<TransportMode>(initial?.mode ?? 'transit');
+  const [mode, setMode] = useState<TransportMode>(initial?.mode ?? 'car');
   const [timeRange, setTimeRange] = useState<[number, number] | null>(
     initial?.timeRange ?? null
   );

frontend/src/hooks/useUrlSync.ts

@@ -18,7 +18,7 @@ export function useUrlSync(
   filters: FeatureFilters,
   features: FeatureMeta[],
   selectedPOICategories: Set<string>,
-  rightPaneTab: 'pois' | 'properties' | 'area',
+  rightPaneTab: 'properties' | 'area',
   travelTime?: TravelTimeUrlState
 ) {
   const urlDebounceRef = useRef<ReturnType<typeof setTimeout> | null>(null);