updates

src/components/Comparison.tsx

@@ -242,17 +242,46 @@ function Comparison({ data, showDataLabels, setShowDataLabels, includeVAT, setIn
     return null;
   };
 
-  // Calculate capture rate and pilgrim data for quarters
+  // Estimate pilgrims for any date range by prorating quarterly data
+  const estimatePilgrims = useCallback((start: string, end: string): number | null => {
+    const startDate = new Date(start);
+    const endDate = new Date(end);
+    let total = 0;
+    let hasData = false;
+    
+    // Iterate through each quarter that overlaps with the range
+    const startYear = startDate.getFullYear();
+    const endYear = endDate.getFullYear();
+    
+    for (let year = startYear; year <= endYear; year++) {
+      for (let q = 1; q <= 4; q++) {
+        const qStart = new Date(year, (q - 1) * 3, 1);
+        const qEnd = new Date(year, q * 3, 0); // last day of quarter
+        
+        // Check overlap
+        if (qEnd < startDate || qStart > endDate) continue;
+        
+        const pilgrims = umrahData[year]?.[q];
+        if (!pilgrims) continue;
+        
+        // Calculate overlap fraction
+        const overlapStart = new Date(Math.max(qStart.getTime(), startDate.getTime()));
+        const overlapEnd = new Date(Math.min(qEnd.getTime(), endDate.getTime()));
+        const overlapDays = (overlapEnd.getTime() - overlapStart.getTime()) / (1000 * 60 * 60 * 24) + 1;
+        const quarterDays = (qEnd.getTime() - qStart.getTime()) / (1000 * 60 * 60 * 24) + 1;
+        
+        total += pilgrims * (overlapDays / quarterDays);
+        hasData = true;
+      }
+    }
+    
+    return hasData ? Math.round(total) : null;
+  }, []);
+
+  // Calculate capture rate and pilgrim data for any date range
   const quarterData = useMemo(() => {
-    const prevYear = parseInt(ranges.prev.start.substring(0, 4));
-    const currYear = parseInt(ranges.curr.start.substring(0, 4));
-    const prevQ = getQuarterFromRange(ranges.prev.start, ranges.prev.end);
-    const currQ = getQuarterFromRange(ranges.curr.start, ranges.curr.end);
-    
-    if (!prevQ || !currQ) return null; // Only show for quarter comparisons
-    
-    const prevPilgrims = umrahData[prevYear]?.[prevQ];
-    const currPilgrims = umrahData[currYear]?.[currQ];
+    const prevPilgrims = estimatePilgrims(ranges.prev.start, ranges.prev.end);
+    const currPilgrims = estimatePilgrims(ranges.curr.start, ranges.curr.end);
     
     if (!prevPilgrims && !currPilgrims) return null;
     
@@ -263,7 +292,7 @@ function Comparison({ data, showDataLabels, setShowDataLabels, includeVAT, setIn
       pilgrims: { prev: prevPilgrims, curr: currPilgrims },
       captureRate: { prev: prevRate, curr: currRate }
     };
-  }, [ranges, prevMetrics.visitors, currMetrics.visitors]);
+  }, [ranges, prevMetrics.visitors, currMetrics.visitors, estimatePilgrims]);
 
   const captureRates = quarterData?.captureRate || null;
   const pilgrimCounts = quarterData?.pilgrims || null;

src/components/Dashboard.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useMemo } from 'react';
+import React, { useState, useMemo, useEffect } from 'react';
 import { useSearchParams } from 'react-router-dom';
 import { Line, Doughnut, Bar } from 'react-chartjs-2';
 import { Carousel, EmptyState, FilterControls, StatCard } from './shared';
@@ -14,6 +14,7 @@ import {
   groupByMuseum,
   groupByDistrict,
   umrahData,
+  fetchPilgrimStats,
   getUniqueYears,
   getUniqueDistricts,
   getDistrictMuseumMap,
@@ -32,6 +33,12 @@ const filterKeys = ['year', 'district', 'museum', 'quarter'];
 function Dashboard({ data, showDataLabels, setShowDataLabels, includeVAT, setIncludeVAT }) {
   const { t } = useLanguage();
   const [searchParams, setSearchParams] = useSearchParams();
+  const [pilgrimLoaded, setPilgrimLoaded] = useState(false);
+
+  // Fetch pilgrim stats from NocoDB on mount
+  useEffect(() => {
+    fetchPilgrimStats().then(() => setPilgrimLoaded(true));
+  }, []);
   
   // Initialize filters from URL or defaults
   const [filters, setFiltersState] = useState(() => {