From 92ee44756c0b1d08404196cb6eec1b25a45035d4 Mon Sep 17 00:00:00 2001 From: Mike Cao Date: Fri, 3 Oct 2025 17:55:39 -0700 Subject: [PATCH] Refactored useDateRange to always use query string. Fixed all time filter. --- .../(main)/links/[linkId]/LinkControls.tsx | 2 +- .../(main)/links/[linkId]/LinkMetricsBar.tsx | 3 +- .../(main)/pixels/[pixelId]/PixelControls.tsx | 2 +- .../pixels/[pixelId]/PixelMetricsBar.tsx | 3 +- .../(reports)/attribution/AttributionPage.tsx | 2 +- .../(reports)/breakdown/BreakdownPage.tsx | 2 +- .../(reports)/funnels/FunnelsPage.tsx | 2 +- .../[websiteId]/(reports)/goals/GoalsPage.tsx | 2 +- .../(reports)/journeys/JourneysPage.tsx | 2 +- .../(reports)/revenue/RevenuePage.tsx | 2 +- .../[websiteId]/(reports)/utm/UTMPage.tsx | 2 +- .../websites/[websiteId]/WebsiteChart.tsx | 2 +- .../websites/[websiteId]/WebsiteControls.tsx | 2 +- .../[websiteId]/WebsiteMetricsBar.tsx | 3 +- .../[websiteId]/compare/CompareTables.tsx | 2 +- src/components/hooks/index.ts | 1 - .../hooks/queries/useDateRangeQuery.ts | 13 ++++- src/components/hooks/useDateParameters.ts | 4 +- src/components/hooks/useDateRange.ts | 49 +++++++++---------- src/components/hooks/useQueryStringDate.ts | 24 --------- src/components/input/RefreshButton.tsx | 2 +- src/components/input/SegmentFilters.tsx | 7 ++- src/components/input/WebsiteDateFilter.tsx | 39 +++++++++------ .../input}/WebsiteFilterButton.tsx | 0 src/components/input/WebsiteMonthSelect.tsx | 15 +++--- src/components/metrics/EventsChart.tsx | 2 +- src/lib/date.ts | 21 ++++---- src/queries/sql/getWebsiteDateRange.ts | 8 +-- 28 files changed, 106 insertions(+), 112 deletions(-) delete mode 100644 src/components/hooks/useQueryStringDate.ts rename src/{app/(main)/websites/[websiteId] => components/input}/WebsiteFilterButton.tsx (100%) diff --git a/src/app/(main)/links/[linkId]/LinkControls.tsx b/src/app/(main)/links/[linkId]/LinkControls.tsx index 3e59043c..01c8e2e9 100644 --- a/src/app/(main)/links/[linkId]/LinkControls.tsx +++ b/src/app/(main)/links/[linkId]/LinkControls.tsx @@ -1,5 +1,5 @@ import { Column, Row } from '@umami/react-zen'; -import { WebsiteFilterButton } from '@/app/(main)/websites/[websiteId]/WebsiteFilterButton'; +import { WebsiteFilterButton } from '@/components/input/WebsiteFilterButton'; import { WebsiteDateFilter } from '@/components/input/WebsiteDateFilter'; import { FilterBar } from '@/components/input/FilterBar'; import { WebsiteMonthSelect } from '@/components/input/WebsiteMonthSelect'; diff --git a/src/app/(main)/links/[linkId]/LinkMetricsBar.tsx b/src/app/(main)/links/[linkId]/LinkMetricsBar.tsx index 5e9d6cbf..43c14050 100644 --- a/src/app/(main)/links/[linkId]/LinkMetricsBar.tsx +++ b/src/app/(main)/links/[linkId]/LinkMetricsBar.tsx @@ -12,10 +12,9 @@ export function LinkMetricsBar({ showChange?: boolean; compareMode?: boolean; }) { - const { dateRange } = useDateRange(linkId); + const { isAllTime } = useDateRange(); const { formatMessage, labels } = useMessages(); const { data, isLoading, isFetching, error } = useWebsiteStatsQuery(linkId); - const isAllTime = dateRange.value === 'all'; const { pageviews, visitors, visits, comparison } = data || {}; diff --git a/src/app/(main)/pixels/[pixelId]/PixelControls.tsx b/src/app/(main)/pixels/[pixelId]/PixelControls.tsx index c5fee534..165b23b9 100644 --- a/src/app/(main)/pixels/[pixelId]/PixelControls.tsx +++ b/src/app/(main)/pixels/[pixelId]/PixelControls.tsx @@ -1,5 +1,5 @@ import { Column, Row } from '@umami/react-zen'; -import { WebsiteFilterButton } from '@/app/(main)/websites/[websiteId]/WebsiteFilterButton'; +import { WebsiteFilterButton } from '@/components/input/WebsiteFilterButton'; import { WebsiteDateFilter } from '@/components/input/WebsiteDateFilter'; import { FilterBar } from '@/components/input/FilterBar'; import { WebsiteMonthSelect } from '@/components/input/WebsiteMonthSelect'; diff --git a/src/app/(main)/pixels/[pixelId]/PixelMetricsBar.tsx b/src/app/(main)/pixels/[pixelId]/PixelMetricsBar.tsx index 5b01ef84..0305df7f 100644 --- a/src/app/(main)/pixels/[pixelId]/PixelMetricsBar.tsx +++ b/src/app/(main)/pixels/[pixelId]/PixelMetricsBar.tsx @@ -12,10 +12,9 @@ export function PixelMetricsBar({ showChange?: boolean; compareMode?: boolean; }) { - const { dateRange } = useDateRange(pixelId); + const { isAllTime } = useDateRange(); const { formatMessage, labels } = useMessages(); const { data, isLoading, isFetching, error } = useWebsiteStatsQuery(pixelId); - const isAllTime = dateRange.value === 'all'; const { pageviews, visitors, visits, comparison } = data || {}; diff --git a/src/app/(main)/websites/[websiteId]/(reports)/attribution/AttributionPage.tsx b/src/app/(main)/websites/[websiteId]/(reports)/attribution/AttributionPage.tsx index 5b375bde..497913b7 100644 --- a/src/app/(main)/websites/[websiteId]/(reports)/attribution/AttributionPage.tsx +++ b/src/app/(main)/websites/[websiteId]/(reports)/attribution/AttributionPage.tsx @@ -12,7 +12,7 @@ export function AttributionPage({ websiteId }: { websiteId: string }) { const { formatMessage, labels } = useMessages(); const { dateRange: { startDate, endDate }, - } = useDateRange(websiteId); + } = useDateRange(); return ( diff --git a/src/app/(main)/websites/[websiteId]/(reports)/breakdown/BreakdownPage.tsx b/src/app/(main)/websites/[websiteId]/(reports)/breakdown/BreakdownPage.tsx index d5479741..33355d70 100644 --- a/src/app/(main)/websites/[websiteId]/(reports)/breakdown/BreakdownPage.tsx +++ b/src/app/(main)/websites/[websiteId]/(reports)/breakdown/BreakdownPage.tsx @@ -12,7 +12,7 @@ import { SectionHeader } from '@/components/common/SectionHeader'; export function BreakdownPage({ websiteId }: { websiteId: string }) { const { dateRange: { startDate, endDate }, - } = useDateRange(websiteId); + } = useDateRange(); const [fields, setFields] = useState(['path']); return ( diff --git a/src/app/(main)/websites/[websiteId]/(reports)/funnels/FunnelsPage.tsx b/src/app/(main)/websites/[websiteId]/(reports)/funnels/FunnelsPage.tsx index 1918aadf..c155662f 100644 --- a/src/app/(main)/websites/[websiteId]/(reports)/funnels/FunnelsPage.tsx +++ b/src/app/(main)/websites/[websiteId]/(reports)/funnels/FunnelsPage.tsx @@ -12,7 +12,7 @@ export function FunnelsPage({ websiteId }: { websiteId: string }) { const { data, isLoading, error } = useReportsQuery({ websiteId, type: 'funnel' }); const { dateRange: { startDate, endDate }, - } = useDateRange(websiteId); + } = useDateRange(); return ( diff --git a/src/app/(main)/websites/[websiteId]/(reports)/goals/GoalsPage.tsx b/src/app/(main)/websites/[websiteId]/(reports)/goals/GoalsPage.tsx index 30f92325..6cd41728 100644 --- a/src/app/(main)/websites/[websiteId]/(reports)/goals/GoalsPage.tsx +++ b/src/app/(main)/websites/[websiteId]/(reports)/goals/GoalsPage.tsx @@ -12,7 +12,7 @@ export function GoalsPage({ websiteId }: { websiteId: string }) { const { data, isLoading, error } = useReportsQuery({ websiteId, type: 'goal' }); const { dateRange: { startDate, endDate }, - } = useDateRange(websiteId); + } = useDateRange(); return ( diff --git a/src/app/(main)/websites/[websiteId]/(reports)/journeys/JourneysPage.tsx b/src/app/(main)/websites/[websiteId]/(reports)/journeys/JourneysPage.tsx index d7582822..26927962 100644 --- a/src/app/(main)/websites/[websiteId]/(reports)/journeys/JourneysPage.tsx +++ b/src/app/(main)/websites/[websiteId]/(reports)/journeys/JourneysPage.tsx @@ -13,7 +13,7 @@ export function JourneysPage({ websiteId }: { websiteId: string }) { const { formatMessage, labels } = useMessages(); const { dateRange: { startDate, endDate }, - } = useDateRange(websiteId); + } = useDateRange(); const [steps, setSteps] = useState(DEFAULT_STEP); const [startStep, setStartStep] = useState(''); const [endStep, setEndStep] = useState(''); diff --git a/src/app/(main)/websites/[websiteId]/(reports)/revenue/RevenuePage.tsx b/src/app/(main)/websites/[websiteId]/(reports)/revenue/RevenuePage.tsx index 0d74c38e..ed512062 100644 --- a/src/app/(main)/websites/[websiteId]/(reports)/revenue/RevenuePage.tsx +++ b/src/app/(main)/websites/[websiteId]/(reports)/revenue/RevenuePage.tsx @@ -7,7 +7,7 @@ import { useDateRange } from '@/components/hooks'; export function RevenuePage({ websiteId }: { websiteId: string }) { const { dateRange: { startDate, endDate, unit }, - } = useDateRange(websiteId); + } = useDateRange(); return ( diff --git a/src/app/(main)/websites/[websiteId]/(reports)/utm/UTMPage.tsx b/src/app/(main)/websites/[websiteId]/(reports)/utm/UTMPage.tsx index a5999a7c..30b9bff2 100644 --- a/src/app/(main)/websites/[websiteId]/(reports)/utm/UTMPage.tsx +++ b/src/app/(main)/websites/[websiteId]/(reports)/utm/UTMPage.tsx @@ -7,7 +7,7 @@ import { WebsiteControls } from '@/app/(main)/websites/[websiteId]/WebsiteContro export function UTMPage({ websiteId }: { websiteId: string }) { const { dateRange: { startDate, endDate }, - } = useDateRange(websiteId); + } = useDateRange(); return ( diff --git a/src/app/(main)/websites/[websiteId]/WebsiteChart.tsx b/src/app/(main)/websites/[websiteId]/WebsiteChart.tsx index 08e0c1c8..2406cde2 100644 --- a/src/app/(main)/websites/[websiteId]/WebsiteChart.tsx +++ b/src/app/(main)/websites/[websiteId]/WebsiteChart.tsx @@ -11,7 +11,7 @@ export function WebsiteChart({ websiteId: string; compareMode?: boolean; }) { - const { dateRange, dateCompare } = useDateRange(websiteId); + const { dateRange, dateCompare } = useDateRange(); const { startDate, endDate, unit, value } = dateRange; const { data, isLoading, isFetching, error } = useWebsitePageviewsQuery({ websiteId, diff --git a/src/app/(main)/websites/[websiteId]/WebsiteControls.tsx b/src/app/(main)/websites/[websiteId]/WebsiteControls.tsx index 97be1821..38f86e3a 100644 --- a/src/app/(main)/websites/[websiteId]/WebsiteControls.tsx +++ b/src/app/(main)/websites/[websiteId]/WebsiteControls.tsx @@ -1,5 +1,5 @@ import { Column, Row } from '@umami/react-zen'; -import { WebsiteFilterButton } from '@/app/(main)/websites/[websiteId]/WebsiteFilterButton'; +import { WebsiteFilterButton } from '@/components/input/WebsiteFilterButton'; import { WebsiteDateFilter } from '@/components/input/WebsiteDateFilter'; import { FilterBar } from '@/components/input/FilterBar'; import { WebsiteMonthSelect } from '@/components/input/WebsiteMonthSelect'; diff --git a/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx b/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx index d217b94f..7522c8ec 100644 --- a/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx +++ b/src/app/(main)/websites/[websiteId]/WebsiteMetricsBar.tsx @@ -12,10 +12,9 @@ export function WebsiteMetricsBar({ showChange?: boolean; compareMode?: boolean; }) { - const { dateRange } = useDateRange(websiteId); + const { isAllTime } = useDateRange(); const { formatMessage, labels, getErrorMessage } = useMessages(); const { data, isLoading, isFetching, error } = useWebsiteStatsQuery(websiteId); - const isAllTime = dateRange.value === 'all'; const { pageviews, visitors, visits, bounces, totaltime, comparison } = data || {}; diff --git a/src/app/(main)/websites/[websiteId]/compare/CompareTables.tsx b/src/app/(main)/websites/[websiteId]/compare/CompareTables.tsx index 8ed32841..2c67b76a 100644 --- a/src/app/(main)/websites/[websiteId]/compare/CompareTables.tsx +++ b/src/app/(main)/websites/[websiteId]/compare/CompareTables.tsx @@ -9,7 +9,7 @@ import { useState } from 'react'; export function CompareTables({ websiteId }: { websiteId: string }) { const [data, setData] = useState([]); - const { dateRange, dateCompare } = useDateRange(websiteId); + const { dateRange, dateCompare } = useDateRange(); const { formatMessage, labels } = useMessages(); const { router, diff --git a/src/components/hooks/index.ts b/src/components/hooks/index.ts index 2731e268..da0b9074 100644 --- a/src/components/hooks/index.ts +++ b/src/components/hooks/index.ts @@ -77,7 +77,6 @@ export * from './useModified'; export * from './useNavigation'; export * from './usePagedQuery'; export * from './usePageParameters'; -export * from './useQueryStringDate'; export * from './useRegionNames'; export * from './useSlug'; export * from './useSticky'; diff --git a/src/components/hooks/queries/useDateRangeQuery.ts b/src/components/hooks/queries/useDateRangeQuery.ts index 4af2011c..32b5cd46 100644 --- a/src/components/hooks/queries/useDateRangeQuery.ts +++ b/src/components/hooks/queries/useDateRangeQuery.ts @@ -1,12 +1,23 @@ import { useApi } from '../useApi'; import { ReactQueryOptions } from '@/lib/types'; +type DateRange = { + startDate?: string; + endDate?: string; +}; + export function useDateRangeQuery(websiteId: string, options?: ReactQueryOptions) { const { get, useQuery } = useApi(); - return useQuery({ + + const { data } = useQuery({ queryKey: ['date-range', websiteId], queryFn: () => get(`/websites/${websiteId}/daterange`), enabled: !!websiteId, ...options, }); + + return { + startDate: data?.startDate ? new Date(data.startDate) : null, + endDate: data?.endDate ? new Date(data.endDate) : null, + }; } diff --git a/src/components/hooks/useDateParameters.ts b/src/components/hooks/useDateParameters.ts index ed4a3e40..359bbc1f 100644 --- a/src/components/hooks/useDateParameters.ts +++ b/src/components/hooks/useDateParameters.ts @@ -1,10 +1,10 @@ import { useDateRange } from './useDateRange'; import { useTimezone } from './useTimezone'; -export function useDateParameters(websiteId: string) { +export function useDateParameters() { const { dateRange: { startDate, endDate, unit }, - } = useDateRange(websiteId); + } = useDateRange(); const { timezone, toUtc } = useTimezone(); return { diff --git a/src/components/hooks/useDateRange.ts b/src/components/hooks/useDateRange.ts index dc81cfd7..0b8db7ce 100644 --- a/src/components/hooks/useDateRange.ts +++ b/src/components/hooks/useDateRange.ts @@ -1,35 +1,32 @@ -import { getMinimumUnit, parseDateRange } from '@/lib/date'; +import { useNavigation } from '@/components/hooks/useNavigation'; +import { useMemo } from 'react'; +import { getCompareDate, getOffsetDateRange, parseDateRange } from '@/lib/date'; import { useLocale } from '@/components/hooks/useLocale'; -import { useApi } from '@/components/hooks//useApi'; -import { useQueryStringDate } from '@/components/hooks/useQueryStringDate'; -import { useGlobalState } from '@/components/hooks/useGlobalState'; +import { DEFAULT_DATE_RANGE_VALUE } from '@/lib/constants'; -export function useDateRange(websiteId: string) { - const { get } = useApi(); +export function useDateRange(options: { ignoreOffset?: boolean } = {}) { + const { + query: { date = DEFAULT_DATE_RANGE_VALUE, offset = 0, compare = 'prev', all }, + } = useNavigation(); const { locale } = useLocale(); - const { dateRange: defaultDateRange, dateCompare } = useQueryStringDate(); - const [dateRange, setDateRange] = useGlobalState(`date-range:${websiteId}`, defaultDateRange); + const dateRange = useMemo(() => { + const dateRangeObject = parseDateRange(date, locale); - const setDateRangeValue = async (value: string) => { - if (value === 'all') { - const result = await get(`/websites/${websiteId}/daterange`); - const { mindate, maxdate } = result; + return !options.ignoreOffset && offset + ? getOffsetDateRange(dateRangeObject, +offset) + : dateRangeObject; + }, [date, offset, options]); - const startDate = new Date(mindate); - const endDate = new Date(maxdate); - const unit = getMinimumUnit(startDate, endDate); + const dateCompare = getCompareDate(compare, dateRange.startDate, dateRange.endDate); - setDateRange({ - startDate, - endDate, - unit, - value, - }); - } else { - setDateRange(parseDateRange(value, locale)); - } + return { + date, + offset, + compare, + isAllTime: !!all, + isCustomRange: date.startsWith('range:'), + dateRange, + dateCompare, }; - - return { dateRange, dateCompare, setDateRange, setDateRangeValue }; } diff --git a/src/components/hooks/useQueryStringDate.ts b/src/components/hooks/useQueryStringDate.ts deleted file mode 100644 index 3b6431a1..00000000 --- a/src/components/hooks/useQueryStringDate.ts +++ /dev/null @@ -1,24 +0,0 @@ -import { useNavigation } from '@/components/hooks/useNavigation'; -import { useMemo } from 'react'; -import { getCompareDate, getOffsetDateRange, parseDateRange } from '@/lib/date'; -import { useLocale } from '@/components/hooks/useLocale'; -import { DEFAULT_DATE_RANGE_VALUE } from '@/lib/constants'; - -export function useQueryStringDate(options: { ignoreOffset?: boolean } = {}) { - const { - query: { date = DEFAULT_DATE_RANGE_VALUE, offset = 0, compare = 'prev' }, - } = useNavigation(); - const { locale } = useLocale(); - - const dateRange = useMemo(() => { - const dateRangeObject = parseDateRange(date, locale); - - return !options.ignoreOffset && offset - ? getOffsetDateRange(dateRangeObject, +offset) - : dateRangeObject; - }, [date, offset, options]); - - const dateCompare = getCompareDate(compare, dateRange.startDate, dateRange.endDate); - - return { date, offset, dateRange, dateCompare }; -} diff --git a/src/components/input/RefreshButton.tsx b/src/components/input/RefreshButton.tsx index 77096dc0..94c8714c 100644 --- a/src/components/input/RefreshButton.tsx +++ b/src/components/input/RefreshButton.tsx @@ -12,7 +12,7 @@ export function RefreshButton({ isLoading?: boolean; }) { const { formatMessage, labels } = useMessages(); - const { dateRange } = useDateRange(websiteId); + const { dateRange } = useDateRange(); function handleClick() { if (!isLoading && dateRange) { diff --git a/src/components/input/SegmentFilters.tsx b/src/components/input/SegmentFilters.tsx index 6324d7c4..d0906d67 100644 --- a/src/components/input/SegmentFilters.tsx +++ b/src/components/input/SegmentFilters.tsx @@ -1,7 +1,8 @@ -import { List, ListItem } from '@umami/react-zen'; +import { IconLabel, List, ListItem } from '@umami/react-zen'; import { useWebsiteSegmentsQuery } from '@/components/hooks'; import { LoadingPanel } from '@/components/common/LoadingPanel'; import { Empty } from '@/components/common/Empty'; +import { ChartPie, UserPlus } from '@/components/icons'; export interface SegmentFiltersProps { websiteId: string; @@ -29,7 +30,9 @@ export function SegmentFilters({ {data?.data?.map(item => { return ( - {item.name} + : }> + {item.name} + ); })} diff --git a/src/components/input/WebsiteDateFilter.tsx b/src/components/input/WebsiteDateFilter.tsx index 469da419..6b051059 100644 --- a/src/components/input/WebsiteDateFilter.tsx +++ b/src/components/input/WebsiteDateFilter.tsx @@ -1,10 +1,10 @@ +import { useCallback, useMemo } from 'react'; import { Button, Icon, Row, Text, Select, ListItem } from '@umami/react-zen'; import { isAfter } from 'date-fns'; import { ChevronRight } from '@/components/icons'; -import { useDateRange, useMessages, useNavigation } from '@/components/hooks'; +import { useDateRange, useDateRangeQuery, useMessages, useNavigation } from '@/components/hooks'; +import { getDateRangeValue } from '@/lib/date'; import { DateFilter } from './DateFilter'; -import { getOffsetDateRange } from '@/lib/date'; -import { useCallback } from 'react'; export interface WebsiteDateFilterProps { websiteId: string; @@ -20,30 +20,33 @@ export function WebsiteDateFilter({ showButtons = true, allowCompare, }: WebsiteDateFilterProps) { - const { dateRange, setDateRange, setDateRangeValue } = useDateRange(websiteId); - const { value, endDate } = dateRange; + const { dateRange, isAllTime, isCustomRange } = useDateRange(); const { formatMessage, labels } = useMessages(); const { router, updateParams, query: { compare = 'prev', offset = 0 }, } = useNavigation(); - const isAllTime = value === 'all'; + const disableForward = isAllTime || isAfter(dateRange.endDate, new Date()); - const isCustomRange = value.startsWith('range'); - - const disableForward = value === 'all' || isAfter(endDate, new Date()); + const websiteDateRange = useDateRangeQuery(websiteId); const handleChange = (date: string) => { - setDateRangeValue(date); - router.push(updateParams({ date, offset: undefined })); + if (date === 'all') { + router.push( + updateParams({ + date: getDateRangeValue(websiteDateRange.startDate, websiteDateRange.endDate), + offset: undefined, + all: 1, + }), + ); + } else { + router.push(updateParams({ date, offset: undefined })); + } }; const handleIncrement = useCallback( (increment: number) => { - const offsetDate = getOffsetDateRange(dateRange, +offset + increment); - - setDateRange(offsetDate); router.push(updateParams({ offset: +offset + increment })); }, [offset], @@ -53,6 +56,12 @@ export function WebsiteDateFilter({ router.push(updateParams({ compare })); }; + const dateValue = useMemo(() => { + return offset !== 0 + ? getDateRangeValue(dateRange.startDate, dateRange.endDate) + : dateRange.value; + }, [dateRange]); + return ( {showButtons && !isAllTime && !isCustomRange && ( @@ -71,7 +80,7 @@ export function WebsiteDateFilter({ )} { - const range = dateToRangeValue(date); - saveDateRange(range); + const range = getMonthDateRangeValue(date); + + router.push(updateParams({ date: range, offset: undefined })); }; return ; diff --git a/src/components/metrics/EventsChart.tsx b/src/components/metrics/EventsChart.tsx index f2f02eda..7301faf4 100644 --- a/src/components/metrics/EventsChart.tsx +++ b/src/components/metrics/EventsChart.tsx @@ -14,7 +14,7 @@ export interface EventsChartProps extends BarChartProps { export function EventsChart({ websiteId, focusLabel }: EventsChartProps) { const { dateRange: { startDate, endDate, unit }, - } = useDateRange(websiteId); + } = useDateRange(); const { locale } = useLocale(); const { data, isLoading, error } = useWebsiteEventsSeriesQuery(websiteId); const [label, setLabel] = useState(focusLabel); diff --git a/src/lib/date.ts b/src/lib/date.ts index 2289e4fe..fa87277f 100644 --- a/src/lib/date.ts +++ b/src/lib/date.ts @@ -131,14 +131,6 @@ export function parseDateRange(value: string, locale = 'en-US'): DateRange { return null; } - if (value === 'all') { - return { - startDate: new Date(0), - endDate: new Date(1), - value, - }; - } - if (value.startsWith('range')) { const [, startTime, endTime] = value.split(':'); @@ -225,24 +217,28 @@ export function getOffsetDateRange(dateRange: DateRange, offset: number) { case 'day': return { ...dateRange, + offset, startDate: addDays(startDate, change), endDate: addDays(endDate, change), }; case 'week': return { ...dateRange, + offset, startDate: addWeeks(startDate, change), endDate: addWeeks(endDate, change), }; case 'month': return { ...dateRange, + offset, startDate: addMonths(startDate, change), endDate: addMonths(endDate, change), }; case 'year': return { ...dateRange, + offset, startDate: addYears(startDate, change), endDate: addYears(endDate, change), }; @@ -250,6 +246,7 @@ export function getOffsetDateRange(dateRange: DateRange, offset: number) { return { startDate: add(startDate, change), endDate: add(endDate, change), + offset, value, unit, num, @@ -354,6 +351,10 @@ export function generateTimeSeries( }); } -export function dateToRangeValue(date: Date) { - return `range:${startOfMonth(date).getTime()}:${endOfMonth(date).getTime()}`; +export function getDateRangeValue(startDate: Date, endDate: Date) { + return `range:${startDate.getTime()}:${endDate.getTime()}`; +} + +export function getMonthDateRangeValue(date: Date) { + return getDateRangeValue(startOfMonth(date), endOfMonth(date)); } diff --git a/src/queries/sql/getWebsiteDateRange.ts b/src/queries/sql/getWebsiteDateRange.ts index 4c0d21f0..2f7f9f19 100644 --- a/src/queries/sql/getWebsiteDateRange.ts +++ b/src/queries/sql/getWebsiteDateRange.ts @@ -20,8 +20,8 @@ async function relationalQuery(websiteId: string) { const result = await rawQuery( ` select - min(created_at) as mindate, - max(created_at) as maxdate + min(created_at) as startDate, + max(created_at) as endDate from website_event where website_id = {{websiteId::uuid}} and created_at >= {{startDate}} @@ -42,8 +42,8 @@ async function clickhouseQuery(websiteId: string) { const result = await rawQuery( ` select - min(created_at) as mindate, - max(created_at) as maxdate + min(created_at) as startDate, + max(created_at) as endDate from website_event_stats_hourly where website_id = {websiteId:UUID} and created_at >= {startDate:DateTime64}