mirror of
https://github.com/supabase/supabase.git
synced 2026-10-19 16:19:10 +03:00
Drew McLellan
f5288eb1e2
## Problem The time-range dropdown above the request charts on the project home page resets on every visit, so users who prefer a different range have to re-select it each time. Resolves FE-2828. <img width="819" height="353" alt="Screenshot 2026-10-16 at 10 42 05" src="https://github.com/user-attachments/assets/cb8d467b-e709-43b0-9ae4-b02ebccf5faf" /> ## Solution Persist the selection in localStorage, keyed per project (`home-chart-interval-${ref}`), in both usage section variants (`ProjectUsageSection` and `ProjectUsageSectionDeltas`, chosen by the `newHomepageUsageDeltas` flag). - New `resolveChartInterval` helper validates the stored value against the known keys and the plan's log retention, falling back to the plan default for corrupt values or after a plan downgrade. Unit tested. - Removed the `useEffect` in `ProjectUsageSection` that reset the interval on retention change, since it would overwrite the saved value. - Moved `getDaysRequired` into `logs.utils.ts` so the dropdown and the helper share the retention check. Manually verified with the flag on and off: reload keeps the selection, and each project keeps its own.
56 lines
1.8 KiB
TypeScript
56 lines
1.8 KiB
TypeScript
import { describe, expect, it } from 'vitest'
|
|
|
|
import {
|
|
getDefaultChartInterval,
|
|
isChartIntervalKey,
|
|
resolveChartInterval,
|
|
} from './ChartInterval.utils'
|
|
|
|
describe('isChartIntervalKey', () => {
|
|
it('accepts known keys only', () => {
|
|
expect(isChartIntervalKey('1hr')).toBe(true)
|
|
expect(isChartIntervalKey('1day')).toBe(true)
|
|
expect(isChartIntervalKey('7day')).toBe(true)
|
|
expect(isChartIntervalKey('30day')).toBe(false)
|
|
expect(isChartIntervalKey(undefined)).toBe(false)
|
|
expect(isChartIntervalKey(1)).toBe(false)
|
|
})
|
|
})
|
|
|
|
describe('getDefaultChartInterval', () => {
|
|
it('uses 1hr when retention is under 7 days', () => {
|
|
expect(getDefaultChartInterval(1)).toBe('1hr')
|
|
})
|
|
|
|
it('uses 1day when retention is 7+ days or unknown', () => {
|
|
expect(getDefaultChartInterval(7)).toBe('1day')
|
|
expect(getDefaultChartInterval(undefined)).toBe('1day')
|
|
})
|
|
})
|
|
|
|
describe('resolveChartInterval', () => {
|
|
it('returns the stored interval when allowed by retention', () => {
|
|
expect(resolveChartInterval('7day', 7)).toBe('7day')
|
|
expect(resolveChartInterval('1hr', 7)).toBe('1hr')
|
|
})
|
|
|
|
it('returns the stored interval while retention is still loading', () => {
|
|
expect(resolveChartInterval('7day', undefined)).toBe('7day')
|
|
})
|
|
|
|
it('falls back to the default when nothing is stored', () => {
|
|
expect(resolveChartInterval(undefined, 7)).toBe('1day')
|
|
expect(resolveChartInterval(undefined, 1)).toBe('1hr')
|
|
})
|
|
|
|
it('falls back to the default when the stored value is invalid', () => {
|
|
expect(resolveChartInterval('bogus', 7)).toBe('1day')
|
|
expect(resolveChartInterval(42, 1)).toBe('1hr')
|
|
})
|
|
|
|
it('falls back to the default when the plan no longer allows the stored interval', () => {
|
|
expect(resolveChartInterval('7day', 1)).toBe('1hr')
|
|
expect(resolveChartInterval('1day', 0.5)).toBe('1hr')
|
|
})
|
|
})
|