From cf4e7a5d2c61c1aa728487e9adcabcc188b07ea1 Mon Sep 17 00:00:00 2001 From: Eunjae Lee Date: Mon, 4 Aug 2025 14:51:23 +0200 Subject: [PATCH] refactor: add useInsightsRoutingParameters() for InsightsRoutingService (#22792) Co-authored-by: Devanshu Sharma --- .../components/routing/RoutingFunnel.tsx | 16 ++----- .../hooks/useInsightsRoutingParameters.ts | 43 +++++++++++++++++++ .../features/insights/server/trpc-router.ts | 34 +++++++++------ 3 files changed, 67 insertions(+), 26 deletions(-) create mode 100644 packages/features/insights/hooks/useInsightsRoutingParameters.ts diff --git a/packages/features/insights/components/routing/RoutingFunnel.tsx b/packages/features/insights/components/routing/RoutingFunnel.tsx index a6258be0a0..706c784bfb 100644 --- a/packages/features/insights/components/routing/RoutingFunnel.tsx +++ b/packages/features/insights/components/routing/RoutingFunnel.tsx @@ -1,7 +1,6 @@ "use client"; -import { useColumnFilters } from "@calcom/features/data-table"; -import { useInsightsParameters } from "@calcom/features/insights/hooks/useInsightsParameters"; +import { useInsightsRoutingParameters } from "@calcom/features/insights/hooks/useInsightsRoutingParameters"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { trpc } from "@calcom/trpc"; @@ -11,18 +10,9 @@ import { RoutingFunnelSkeleton } from "./RoutingFunnelSkeleton"; export function RoutingFunnel() { const { t } = useLocale(); - const { scope, selectedTeamId, startDate, endDate } = useInsightsParameters(); - const columnFilters = useColumnFilters({ - exclude: ["createdAt"], - }); + const insightsRoutingParams = useInsightsRoutingParameters(); const { data, isSuccess, isLoading } = trpc.viewer.insights.getRoutingFunnelData.useQuery( - { - scope, - selectedTeamId, - startDate, - endDate, - columnFilters, - }, + insightsRoutingParams, { staleTime: 30000, trpc: { diff --git a/packages/features/insights/hooks/useInsightsRoutingParameters.ts b/packages/features/insights/hooks/useInsightsRoutingParameters.ts new file mode 100644 index 0000000000..69b98d3d57 --- /dev/null +++ b/packages/features/insights/hooks/useInsightsRoutingParameters.ts @@ -0,0 +1,43 @@ +import { useMemo } from "react"; + +import dayjs from "@calcom/dayjs"; +import { useFilterValue, useColumnFilters, ZDateRangeFilterValue } from "@calcom/features/data-table"; +import { useChangeTimeZoneWithPreservedLocalTime } from "@calcom/features/data-table/hooks/useChangeTimeZoneWithPreservedLocalTime"; +import { getDefaultStartDate, getDefaultEndDate } from "@calcom/features/data-table/lib/dateRange"; + +import { useInsightsOrgTeams } from "./useInsightsOrgTeams"; + +export function useInsightsRoutingParameters() { + const { scope, selectedTeamId } = useInsightsOrgTeams(); + + const createdAtRange = useFilterValue("createdAt", ZDateRangeFilterValue)?.data; + // TODO for future: this preserving local time & startOf & endOf should be handled + // from DateRangeFilter out of the box. + // When we do it, we also need to remove those timezone handling logic from the backend side at the same time. + const startDate = useChangeTimeZoneWithPreservedLocalTime( + useMemo(() => { + return dayjs(createdAtRange?.startDate ?? getDefaultStartDate().toISOString()) + .startOf("day") + .toISOString(); + }, [createdAtRange?.startDate]) + ); + const endDate = useChangeTimeZoneWithPreservedLocalTime( + useMemo(() => { + return dayjs(createdAtRange?.endDate ?? getDefaultEndDate().toISOString()) + .endOf("day") + .toISOString(); + }, [createdAtRange?.endDate]) + ); + + const columnFilters = useColumnFilters({ + exclude: ["createdAt"], + }); + + return { + scope, + selectedTeamId, + startDate, + endDate, + columnFilters, + }; +} diff --git a/packages/features/insights/server/trpc-router.ts b/packages/features/insights/server/trpc-router.ts index cd980ec852..22c707c58d 100644 --- a/packages/features/insights/server/trpc-router.ts +++ b/packages/features/insights/server/trpc-router.ts @@ -341,6 +341,26 @@ function createInsightsBookingService( }, }); } + +function createInsightsRoutingService( + ctx: { insightsDb: typeof readonlyPrisma; user: { id: number; organizationId: number | null } }, + input: z.infer +) { + return getInsightsRoutingService({ + options: { + scope: input.scope, + teamId: input.selectedTeamId, + userId: ctx.user.id, + orgId: ctx.user.organizationId, + }, + filters: { + startDate: input.startDate, + endDate: input.endDate, + columnFilters: input.columnFilters, + }, + }); +} + export const insightsRouter = router({ bookingKPIStats: userBelongsToTeamProcedure .input(bookingRepositoryBaseInputSchema) @@ -1002,19 +1022,7 @@ export const insightsRouter = router({ timeView, weekStart: ctx.user.weekStart, }); - const insightsRoutingService = getInsightsRoutingService({ - options: { - scope: input.scope, - teamId: input.selectedTeamId, - userId: ctx.user.id, - orgId: ctx.user.organizationId, - }, - filters: { - startDate: input.startDate, - endDate: input.endDate, - columnFilters: input.columnFilters, - }, - }); + const insightsRoutingService = createInsightsRoutingService(ctx, input); try { return await insightsRoutingService.getRoutingFunnelData(dateRanges); } catch (e) {