watson/umami
1
0
Fork 0
mirror of https://github.com/umami-software/umami.git synced 2026-02-07 22:27:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Refactored useDateRange to always use query string. Fixed all time filter.

Browse source
This commit is contained in:
Mike Cao 2025-10-03 17:55:39 -07:00
parent 4d06b0ca5b
commit 92ee44756c
28 changed files with 106 additions and 112 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/components/hooks/index.ts
View file

@ -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';

13
src/components/hooks/queries/useDateRangeQuery.ts
View file

@ -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<any>({
const { data } = useQuery<DateRange>({
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,
};
}

4
src/components/hooks/useDateParameters.ts
View file

@ -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 {

49
src/components/hooks/useDateRange.ts
View file

@ -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 };
}

24
src/components/hooks/useQueryStringDate.ts
View file

@ -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 };
}