feat(ui): improve table controls and analytics filters

web/default/src/features/dashboard/lib/charts.ts

@@ -910,8 +910,18 @@ export function processUserChartData(
           },
         },
       },
-      area: { style: { fillOpacity: 0.15 } },
-      line: { style: { lineWidth: 2 } },
+      area: {
+        style: {
+          fillOpacity: 0.15,
+          curveType: 'monotone',
+        },
+      },
+      line: {
+        style: {
+          lineWidth: 2,
+          curveType: 'monotone',
+        },
+      },
       point: { visible: false },
       color: { specified: userColorMap },
       background: { fill: 'transparent' },

web/default/src/features/dashboard/lib/filters.ts

@@ -1,9 +1,46 @@
 import type { TimeGranularity } from '@/lib/time'
+import { getNormalizedDateRange } from '@/lib/time'
 import {
+  DASHBOARD_CHART_PREFERENCES_STORAGE_KEY,
+  DEFAULT_DASHBOARD_CHART_PREFERENCES,
   DEFAULT_TIME_GRANULARITY,
+  EMPTY_DASHBOARD_FILTERS,
   TIME_GRANULARITY_STORAGE_KEY,
+  TIME_RANGE_PRESETS,
   TIME_RANGE_BY_GRANULARITY,
 } from '@/features/dashboard/constants'
+import type {
+  ConsumptionDistributionChartType,
+  DashboardChartPreferences,
+  DashboardFilters,
+  ModelAnalyticsChartTab,
+} from '@/features/dashboard/types'
+
+function isTimeGranularity(value: unknown): value is TimeGranularity {
+  return value === 'hour' || value === 'day' || value === 'week'
+}
+
+function getLegacySavedGranularity(): TimeGranularity {
+  if (typeof window === 'undefined') return DEFAULT_TIME_GRANULARITY
+  const saved = localStorage.getItem(TIME_GRANULARITY_STORAGE_KEY)
+  return isTimeGranularity(saved) ? saved : DEFAULT_TIME_GRANULARITY
+}
+
+function isConsumptionDistributionChartType(
+  value: unknown
+): value is ConsumptionDistributionChartType {
+  return value === 'bar' || value === 'area'
+}
+
+function isModelAnalyticsChartTab(
+  value: unknown
+): value is ModelAnalyticsChartTab {
+  return value === 'trend' || value === 'proportion' || value === 'top'
+}
+
+function isTimeRangePresetDays(value: unknown): value is number {
+  return TIME_RANGE_PRESETS.some((preset) => preset.days === value)
+}
 
 export function cleanFilters<T extends Record<string, unknown>>(
   filters: T
@@ -25,20 +62,81 @@ export function getSavedGranularity(
   override?: TimeGranularity
 ): TimeGranularity {
   if (override) return override
-  if (typeof window === 'undefined') return DEFAULT_TIME_GRANULARITY
-  const saved = localStorage.getItem(TIME_GRANULARITY_STORAGE_KEY)
-  if (saved === 'hour' || saved === 'day' || saved === 'week') return saved
-  return DEFAULT_TIME_GRANULARITY
+  return getSavedChartPreferences().defaultTimeGranularity
 }
 
 export function saveGranularity(granularity: TimeGranularity): void {
+  if (typeof window === 'undefined') return
+  saveChartPreferences({
+    ...getSavedChartPreferences(),
+    defaultTimeGranularity: granularity,
+  })
   localStorage.setItem(TIME_GRANULARITY_STORAGE_KEY, granularity)
 }
 
+export function getSavedChartPreferences(): DashboardChartPreferences {
+  if (typeof window === 'undefined') return DEFAULT_DASHBOARD_CHART_PREFERENCES
+
+  const fallbackPreferences = {
+    ...DEFAULT_DASHBOARD_CHART_PREFERENCES,
+    defaultTimeGranularity: getLegacySavedGranularity(),
+  }
+
+  try {
+    const raw = localStorage.getItem(DASHBOARD_CHART_PREFERENCES_STORAGE_KEY)
+    if (!raw) return fallbackPreferences
+
+    const parsed = JSON.parse(raw) as Partial<DashboardChartPreferences>
+    return {
+      consumptionDistributionChart: isConsumptionDistributionChartType(
+        parsed.consumptionDistributionChart
+      )
+        ? parsed.consumptionDistributionChart
+        : fallbackPreferences.consumptionDistributionChart,
+      modelAnalyticsChart: isModelAnalyticsChartTab(parsed.modelAnalyticsChart)
+        ? parsed.modelAnalyticsChart
+        : fallbackPreferences.modelAnalyticsChart,
+      defaultTimeRangeDays: isTimeRangePresetDays(parsed.defaultTimeRangeDays)
+        ? parsed.defaultTimeRangeDays
+        : fallbackPreferences.defaultTimeRangeDays,
+      defaultTimeGranularity: isTimeGranularity(
+        parsed.defaultTimeGranularity
+      )
+        ? parsed.defaultTimeGranularity
+        : fallbackPreferences.defaultTimeGranularity,
+    }
+  } catch {
+    return fallbackPreferences
+  }
+}
+
+export function saveChartPreferences(
+  preferences: DashboardChartPreferences
+): void {
+  if (typeof window === 'undefined') return
+  localStorage.setItem(
+    DASHBOARD_CHART_PREFERENCES_STORAGE_KEY,
+    JSON.stringify(preferences)
+  )
+}
+
 export function getDefaultDays(granularity?: TimeGranularity): number {
+  if (!granularity) return getSavedChartPreferences().defaultTimeRangeDays
   return TIME_RANGE_BY_GRANULARITY[getSavedGranularity(granularity)]
 }
 
+export function buildDefaultDashboardFilters(
+  preferences: DashboardChartPreferences = getSavedChartPreferences()
+): DashboardFilters {
+  const { start, end } = getNormalizedDateRange(preferences.defaultTimeRangeDays)
+  return {
+    ...EMPTY_DASHBOARD_FILTERS,
+    start_timestamp: start,
+    end_timestamp: end,
+    time_granularity: preferences.defaultTimeGranularity,
+  }
+}
+
 export function buildQueryParams(
   timeRange: { start_timestamp: number; end_timestamp: number },
   filters?: { time_granularity?: TimeGranularity; username?: string }

web/default/src/features/dashboard/lib/index.ts

@@ -4,6 +4,9 @@ export {
   getSavedGranularity,
   saveGranularity,
   getDefaultDays,
+  getSavedChartPreferences,
+  saveChartPreferences,
+  buildDefaultDashboardFilters,
 } from './filters'
 export {
   getLatencyColorClass,