fix(mobile): fix monthly period on Budget view

get6pm · Sep 24, 2024 · b061fdc · b061fdc
1 parent 692ff00
commit b061fdc
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/apps/mobile/components/budget/period-control.tsx b/apps/mobile/components/budget/period-control.tsx
@@ -1,4 +1,5 @@
 import { formatDateRange } from '@/lib/date'
+import { dayjsExtended } from '@6pm/utilities'
 import type { BudgetPeriodConfig } from '@6pm/validation'
 import { ChevronLeftIcon, ChevronRightIcon } from 'lucide-react-native'
 import { View } from 'react-native'
@@ -18,6 +19,7 @@ export function PeriodControl({
 }: PeriodControlProps) {
   const couldGoBack = index > 0
   const couldGoForward = index < periodConfigs.length - 1
+  const timezoneOffset = new Date().getTimezoneOffset()
 
   return (
     <View className="z-50 h-12 w-full flex-row items-center justify-between gap-2 bg-muted px-4">
@@ -31,8 +33,12 @@ export function PeriodControl({
       </Button>
       <Text className="font-medium">
         {formatDateRange(
-          periodConfigs[index].startDate!,
-          periodConfigs[index].endDate!,
+          dayjsExtended(periodConfigs[index].startDate!)
+            .add(timezoneOffset, 'm')
+            .toDate(),
+          dayjsExtended(periodConfigs[index].endDate!)
+            .add(timezoneOffset, 'm')
+            .toDate(),
         )}
       </Text>
       <Button