diff --git a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/[dashboardId]/list-reports.tsx b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/[dashboardId]/list-reports.tsx
index 63404d52..0abb8019 100644
--- a/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/[dashboardId]/list-reports.tsx
+++ b/apps/dashboard/src/app/(app)/[organizationSlug]/[projectId]/dashboards/[dashboardId]/list-reports.tsx
@@ -89,7 +89,8 @@ export function ListReports({ reports, dashboard }: ListReportsProps) {
Custom dates
) : (
- range !== null && {range}
+ range !== null &&
+ chartRange !== range && (
+ {timeWindows[range].label}
+ )
)}
)}
diff --git a/apps/dashboard/src/components/overview/useOverviewOptions.ts b/apps/dashboard/src/components/overview/useOverviewOptions.ts
index a04ff364..cabd5be3 100644
--- a/apps/dashboard/src/components/overview/useOverviewOptions.ts
+++ b/apps/dashboard/src/components/overview/useOverviewOptions.ts
@@ -6,6 +6,7 @@ import {
useQueryState,
} from 'nuqs';
+import { getStorageItem, setStorageItem } from '@/utils/storage';
import {
getDefaultIntervalByDates,
getDefaultIntervalByRange,
@@ -13,6 +14,7 @@ import {
} from '@openpanel/constants';
import type { IChartRange } from '@openpanel/validation';
import { mapKeys } from '@openpanel/validation';
+import { useEffect } from 'react';
const nuqsOptions = { history: 'push' } as const;
@@ -29,9 +31,19 @@ export function useOverviewOptions() {
'range',
parseAsStringEnum(mapKeys(timeWindows))
.withDefault('7d')
- .withOptions(nuqsOptions),
+ .withOptions({
+ ...nuqsOptions,
+ clearOnDefault: false,
+ }),
);
+ useEffect(() => {
+ const range = getStorageItem('range', '7d');
+ if (range !== '7d') {
+ setRange(range);
+ }
+ }, []);
+
const interval =
getDefaultIntervalByDates(startDate, endDate) ||
getDefaultIntervalByRange(range);
@@ -56,6 +68,7 @@ export function useOverviewOptions() {
if (value !== 'custom') {
setStartDate(null);
setEndDate(null);
+ setStorageItem('range', value);
}
setRange(value);
},
diff --git a/apps/dashboard/src/utils/storage.ts b/apps/dashboard/src/utils/storage.ts
new file mode 100644
index 00000000..9eed2ff5
--- /dev/null
+++ b/apps/dashboard/src/utils/storage.ts
@@ -0,0 +1,23 @@
+const prefix = '@op';
+
+export function getStorageItem(key: string): T | null;
+export function getStorageItem(key: string, defaultValue: T): T;
+export function getStorageItem(key: string, defaultValue?: T): T | null {
+ if (typeof window === 'undefined') return defaultValue ?? null;
+ const item = localStorage.getItem(`${prefix}:${key}`);
+ if (item === null) {
+ return defaultValue ?? null;
+ }
+
+ return item as T;
+}
+
+export function setStorageItem(key: string, value: unknown) {
+ if (typeof window === 'undefined') return;
+ localStorage.setItem(`${prefix}:${key}`, value as string);
+}
+
+export function removeStorageItem(key: string) {
+ if (typeof window === 'undefined') return;
+ localStorage.removeItem(`${prefix}:${key}`);
+}