feat: add This week / This month period options and fix comparison labels

components/dashboard/Chart.tsx

@@ -64,6 +64,7 @@ interface ChartProps {
   prevStats?: Stats
   interval: 'minute' | 'hour' | 'day' | 'month'
   dateRange: { start: string, end: string }
+  period?: string
   todayInterval: 'minute' | 'hour'
   setTodayInterval: (interval: 'minute' | 'hour') => void
   multiDayInterval: 'hour' | 'day'
@@ -145,6 +146,7 @@ export default function Chart({
   prevStats,
   interval,
   dateRange,
+  period,
   todayInterval,
   setTodayInterval,
   multiDayInterval,
@@ -358,10 +360,17 @@ export default function Chart({
                     </span>
                   )}
                 </div>
-                <div className="text-xs text-neutral-400 dark:text-neutral-500 mt-1">{(() => {
-                  const days = Math.round((new Date(dateRange.end).getTime() - new Date(dateRange.start).getTime()) / 86400000)
-                  return days === 0 ? 'vs yesterday' : `vs previous ${days} days`
-                })()}</div>
+                <div className="text-xs text-neutral-400 dark:text-neutral-500 mt-1">{
+                  period === 'today' ? 'vs yesterday'
+                  : period === 'week' ? 'vs last week'
+                  : period === 'month' ? 'vs last month'
+                  : period === '7' ? 'vs previous 7 days'
+                  : period === '30' ? 'vs previous 30 days'
+                  : (() => {
+                      const days = Math.round((new Date(dateRange.end).getTime() - new Date(dateRange.start).getTime()) / 86400000)
+                      return days === 0 ? 'vs yesterday' : `vs previous ${days} days`
+                    })()
+                }</div>
                 {metric === m.key && (
                   <div className="absolute bottom-0 left-0 right-0 h-0.5 bg-brand-orange" />
                 )}