updates on the riders page and updated the count on the substitution page

src/pages/nearle/riders/riders.js

@@ -235,6 +235,7 @@ const Riders = () => {
         OpenToast(err.response?.data?.message || err.message || 'Failed to delete substitution.', 'error', 2000);
       } finally {
         queryClient.invalidateQueries({ queryKey: ['substitutionsHistory'] });
+        queryClient.invalidateQueries({ queryKey: ['activeSubstitutionsToday'] });
       }
     }
   };
@@ -265,6 +266,7 @@ const Riders = () => {
       setEditingSub(null);
       setNewSubRider(null);
       queryClient.invalidateQueries({ queryKey: ['substitutionsHistory'] });
+      queryClient.invalidateQueries({ queryKey: ['activeSubstitutionsToday'] });
     }
   };
 
@@ -296,6 +298,7 @@ const Riders = () => {
     localStorage.removeItem('rider_substitutions');
     queryClient.invalidateQueries({ queryKey: ['substitutionsHistory'] });
     queryClient.invalidateQueries({ queryKey: ['subRidersLogs'] });
+    queryClient.invalidateQueries({ queryKey: ['activeSubstitutionsToday'] });
   };
 
   const { data: substituteRidersList } = useQuery({
@@ -395,6 +398,51 @@ const Riders = () => {
     }
   });
 
+  const { data: activeSubsToday, isLoading: activeSubsTodayLoading } = useQuery({
+    queryKey: ['activeSubstitutionsToday', appId, selectedDate.format('YYYY-MM-DD')],
+    queryFn: async () => {
+      try {
+        let partnerId = '';
+        try {
+          const rawLocs = localStorage.getItem('applocations');
+          if (rawLocs) {
+            const locs = JSON.parse(rawLocs);
+            const currentLoc = locs.find((l) => l.applocationid === appId);
+            if (currentLoc && currentLoc.partnerid) {
+              partnerId = currentLoc.partnerid;
+            } else {
+              const firstValidLoc = locs.find((l) => l.partnerid);
+              if (firstValidLoc && firstValidLoc.partnerid) {
+                partnerId = firstValidLoc.partnerid;
+              }
+            }
+          }
+        } catch (e) {
+          console.error('Error parsing applocations', e);
+        }
+
+        if (!partnerId) {
+          const savedPartnerId = localStorage.getItem('partnerid');
+          if (savedPartnerId && savedPartnerId !== 'undefined' && savedPartnerId !== 'null') {
+            partnerId = savedPartnerId;
+          }
+        }
+
+        if (!partnerId || partnerId === '0' || partnerId === 0) {
+          partnerId = 44;
+        }
+
+        const dateStr = selectedDate.format('YYYY-MM-DD');
+        const url = `${process.env.REACT_APP_URL}/substitutions?tenant_id=${partnerId}&from_date=${dateStr}&to_date=${dateStr}`;
+        const res = await axios.get(url);
+        return res.data.details || [];
+      } catch (err) {
+        console.error(err);
+        return [];
+      }
+    }
+  });
+
   const { data: subHistoryData, isLoading: subHistoryLoading } = useQuery({
     queryKey: ['substitutionsHistory', appId, historyDate, historyStatus],
     queryFn: async () => {
@@ -440,8 +488,7 @@ const Riders = () => {
         console.error(err);
         return [];
       }
-    },
+    }
-    enabled: tabvalue === 3
   });
 
   Geocode.setApiKey(process.env.REACT_APP_GOOGLE_MAPS_API_KEY);
@@ -632,10 +679,15 @@ const Riders = () => {
               const Icon = t.icon;
               const active = tabvalue === t.key;
               const count = t.key === 2
-                ? Object.keys(substituteAssignments).filter(k => substituteAssignments[k]).length
+                ? (subRidersLogsData?.length || 0)
                 : t.key === 3
-                  ? 0
+                  ? (subHistoryData?.length || 0)
                   : (allRidersSummary?.[t.countKey] ?? 0);
+              const countLoading = t.key === 2
+                ? subRidersLogsLoading
+                : t.key === 3
+                  ? subHistoryLoading
+                  : riderSummarysLoading;
               return (
                 <Box
                   key={t.key}
@@ -673,28 +725,26 @@ const Riders = () => {
                     <Icon size={13} />
                   </Avatar>
                   <Typography variant="caption" sx={{ fontWeight: 600, fontSize: { xs: 11.5, md: 13 }, lineHeight: 1 }}>
-                    {t.label}
+                     {t.label}
                   </Typography>
-                  {t.key !== 3 && (
+                  <Box
-                    <Box
+                    sx={{
-                      sx={{
+                      minWidth: { xs: 22, md: 26 },
-                        minWidth: { xs: 22, md: 26 },
+                      height: { xs: 18, md: 22 },
-                        height: { xs: 18, md: 22 },
+                      px: 0.625,
-                        px: 0.625,
+                      display: 'inline-flex',
-                        display: 'inline-flex',
+                      alignItems: 'center',
-                        alignItems: 'center',
+                      justifyContent: 'center',
-                        justifyContent: 'center',
+                      borderRadius: 999,
-                        borderRadius: 999,
+                      fontSize: { xs: 10, md: 11 },
-                        fontSize: { xs: 10, md: 11 },
+                      fontWeight: 700,
-                        fontWeight: 700,
+                      bgcolor: active ? 'rgba(255,255,255,0.22)' : '#f8fafc',
-                        bgcolor: active ? 'rgba(255,255,255,0.22)' : '#f8fafc',
+                      color: active ? '#fff' : '#64748b',
-                        color: active ? '#fff' : '#64748b',
+                      border: 'none'
-                        border: 'none'
+                    }}
-                      }}
+                  >
-                    >
+                    {countLoading ? <Skeleton variant="text" width={14} height={10} /> : count}
-                      {riderSummarysLoading ? <Skeleton variant="text" width={14} height={10} /> : count}
+                  </Box>
-                    </Box>
-                  )}
                 </Box>
               );
             })}