77ad10ced1
DateRangePicker grows a "Custom range" mode (From/To inputs capped at today, mutually-bounded so From <= To). dashboard-shell threads the range through to /api/v1/analytics, which validates calendar dates via ISO round-trip and enforces a 365-day cap as a backstop against the occupancy timeline N+1. KpiCards now gates its query on currentPortId so the early unhydrated-store fetch can't cache a zeroed/error response and display "-" until staleTime expires. MyRemindersRail drops xl:h-full so the rail no longer stretches past its grid row and overlaps ActivityFeed below. useRealtimeInvalidation switches to partial-prefix queryKeys so a realtime mutation invalidates every cached range bucket at once instead of just the one currently visible. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
58 lines
1.8 KiB
TypeScript
58 lines
1.8 KiB
TypeScript
'use client';
|
|
|
|
import { useQuery } from '@tanstack/react-query';
|
|
|
|
import { apiFetch } from '@/lib/api/client';
|
|
import { isCustomRange, type DateRange } from '@/lib/analytics/range';
|
|
import type {
|
|
LeadSourceAttributionData,
|
|
MetricBase,
|
|
OccupancyTimelineData,
|
|
PipelineFunnelData,
|
|
RevenueBreakdownData,
|
|
} from '@/lib/services/analytics.service';
|
|
|
|
interface MetricResponse<T> {
|
|
metric: MetricBase;
|
|
range: DateRange;
|
|
data: T;
|
|
}
|
|
|
|
/**
|
|
* Serialize a DateRange (preset or custom) into the URL query params the
|
|
* /api/v1/analytics route expects: `range=30d` for presets, or
|
|
* `range=custom&from=YYYY-MM-DD&to=YYYY-MM-DD` for custom.
|
|
*/
|
|
function rangeToQuery(range: DateRange): string {
|
|
if (isCustomRange(range)) {
|
|
return `range=custom&from=${range.from}&to=${range.to}`;
|
|
}
|
|
return `range=${range}`;
|
|
}
|
|
|
|
export function useAnalyticsMetric<T>(metric: MetricBase, range: DateRange) {
|
|
return useQuery<T>({
|
|
// Stringify custom ranges into the cache key so React Query treats
|
|
// each {from,to} pair as its own query - otherwise switching dates
|
|
// would never refetch.
|
|
queryKey: ['analytics', metric, range],
|
|
queryFn: async () => {
|
|
const res = await apiFetch<MetricResponse<T>>(
|
|
`/api/v1/analytics?metric=${metric}&${rangeToQuery(range)}`,
|
|
);
|
|
return res.data;
|
|
},
|
|
staleTime: 60_000,
|
|
retry: 2,
|
|
});
|
|
}
|
|
|
|
export const useFunnel = (range: DateRange) =>
|
|
useAnalyticsMetric<PipelineFunnelData>('pipeline_funnel', range);
|
|
export const useOccupancy = (range: DateRange) =>
|
|
useAnalyticsMetric<OccupancyTimelineData>('occupancy_timeline', range);
|
|
export const useRevenue = (range: DateRange) =>
|
|
useAnalyticsMetric<RevenueBreakdownData>('revenue_breakdown', range);
|
|
export const useLeadSource = (range: DateRange) =>
|
|
useAnalyticsMetric<LeadSourceAttributionData>('lead_source_attribution', range);
|