konnosDashboard
useProjectUsageStats.tsx118 lines · main
1import { useQuery } from '@tanstack/react-query'
2import { useMemo } from 'react'
3
4import { useFillTimeseriesSorted } from './useFillTimeseriesSorted'
5import useTimeseriesUnixToIso from './useTimeseriesUnixToIso'
6import { LogsTableName } from '@/components/interfaces/Settings/Logs/Logs.constants'
7import type {
8 EventChart,
9 EventChartData,
10 Filters,
11 LogsEndpointParams,
12} from '@/components/interfaces/Settings/Logs/Logs.types'
13import { genChartQuery } from '@/components/interfaces/Settings/Logs/Logs.utils'
14import { get } from '@/data/fetchers'
15
16interface ProjectUsageStatsHookResult {
17 error: string | Object | null
18 isLoading: boolean
19 filters: Filters
20 params: LogsEndpointParams
21 eventChartData: EventChartData[]
22 refresh: () => void
23}
24
25function useProjectUsageStats({
26 projectRef,
27 table,
28 timestampStart,
29 timestampEnd,
30 filterOverride,
31}: {
32 projectRef: string
33 table: LogsTableName
34 timestampStart: string
35 timestampEnd: string
36 filterOverride?: Filters
37}): ProjectUsageStatsHookResult {
38 const filterOverrideString = JSON.stringify(filterOverride)
39 const mergedFilters = useMemo(
40 () => ({
41 ...filterOverride,
42 }),
43 [filterOverrideString]
44 )
45
46 const params: LogsEndpointParams = useMemo(() => {
47 return { iso_timestamp_start: timestampStart, iso_timestamp_end: timestampEnd }
48 }, [timestampStart, timestampEnd])
49
50 const chartQuery = useMemo(
51 () => genChartQuery(table, params, mergedFilters),
52 [table, params, mergedFilters]
53 )
54
55 const chartQueryKey = useMemo(
56 () => [
57 'projects',
58 projectRef,
59 'logs-chart',
60 table,
61 {
62 projectRef,
63 sql: chartQuery,
64 iso_timestamp_start: timestampStart,
65 iso_timestamp_end: timestampEnd,
66 },
67 ],
68 [projectRef, chartQuery, timestampStart, timestampEnd, table]
69 )
70
71 const { data: eventChartResponse, refetch: refreshEventChart } = useQuery({
72 queryKey: chartQueryKey,
73 queryFn: async ({ signal }) => {
74 const { data, error } = await get(`/platform/projects/{ref}/analytics/endpoints/logs.all`, {
75 params: {
76 path: { ref: projectRef },
77 query: {
78 iso_timestamp_start: timestampStart,
79 iso_timestamp_end: timestampEnd,
80 sql: chartQuery,
81 },
82 },
83 signal,
84 })
85 if (error) {
86 throw error
87 }
88
89 return data as unknown as EventChart
90 },
91 refetchOnWindowFocus: false,
92 enabled: typeof projectRef !== 'undefined',
93 })
94
95 const normalizedEventChartData = useTimeseriesUnixToIso(
96 eventChartResponse?.result ?? [],
97 'timestamp'
98 )
99
100 const { data: eventChartData, error: eventChartError } = useFillTimeseriesSorted({
101 data: normalizedEventChartData,
102 timestampKey: 'timestamp',
103 valueKey: 'count',
104 defaultValue: 0,
105 startDate: timestampStart,
106 endDate: timestampEnd ?? new Date().toISOString(),
107 })
108
109 return {
110 isLoading: !eventChartResponse,
111 error: eventChartError,
112 filters: mergedFilters,
113 params,
114 eventChartData,
115 refresh: refreshEventChart,
116 }
117}
118export default useProjectUsageStats