From 184ff0976e8ef33d70ec7213b78ebc49d58bd405 Mon Sep 17 00:00:00 2001
From: Mateo <carciu98@gmail.com>
Date: Sat, 11 Jul 2026 22:43:05 +0200
Subject: [PATCH] fix: add local date support instead of UTC

---
 .../js/components/tasks/TaskActivityDiscussionPanel.vue   | 7 +------
 resources/js/components/tasks/TaskFilters.vue             | 7 ++-----
 resources/js/components/tasks/TaskItem.vue                | 8 ++------
 resources/js/composables/useDateFormatter.ts              | 3 +--
 4 files changed, 6 insertions(+), 19 deletions(-)

diff --git a/resources/js/components/tasks/TaskActivityDiscussionPanel.vue b/resources/js/components/tasks/TaskActivityDiscussionPanel.vue
index 80264bf..81148b4 100644
--- a/resources/js/components/tasks/TaskActivityDiscussionPanel.vue
+++ b/resources/js/components/tasks/TaskActivityDiscussionPanel.vue
@@ -48,12 +48,7 @@ const cleanedCommentBody = computed(() => {
 const dueDateLabel = computed(() => {
     if (!props.activeTask?.due_date) return null;
 
-    return new Date(props.activeTask.due_date).toLocaleDateString('en-US', {
-        year: 'numeric',
-        month: 'short',
-        day: 'numeric',
-        timeZone: 'UTC',
-    });
+    return props.formatDate(props.activeTask.due_date);
 });
 
 const daysInColumnLabel = computed(() => {
diff --git a/resources/js/components/tasks/TaskFilters.vue b/resources/js/components/tasks/TaskFilters.vue
index 7624f46..927df17 100644
--- a/resources/js/components/tasks/TaskFilters.vue
+++ b/resources/js/components/tasks/TaskFilters.vue
@@ -22,6 +22,7 @@ import {
     X,
 } from 'lucide-vue-next';
 import { computed, reactive, watch } from 'vue';
+import { formatDate } from '@/composables/useDateFormatter';
 
 interface FilterState {
     search: string;
@@ -157,11 +158,7 @@ const dueDateLabel = computed(() => {
             return 'Any due date';
         default:
             try {
-                return new Date(localFilters.due_date).toLocaleDateString('en-US', {
-                    day: 'numeric',
-                    month: 'short',
-                    year: 'numeric',
-                });
+                return formatDate(localFilters.due_date);
             } catch {
                 return localFilters.due_date;
             }
diff --git a/resources/js/components/tasks/TaskItem.vue b/resources/js/components/tasks/TaskItem.vue
index 7554ee4..ecc2714 100644
--- a/resources/js/components/tasks/TaskItem.vue
+++ b/resources/js/components/tasks/TaskItem.vue
@@ -17,6 +17,7 @@ import { router } from '@inertiajs/vue3';
 import { AlertTriangle, Calendar, Check, ClockAlert, MoreHorizontal, Pencil, Trash2 } from 'lucide-vue-next';
 import { ref } from 'vue';
 import { toast } from 'vue-sonner';
+import { formatDate } from '@/composables/useDateFormatter';
 
 const props = withDefaults(
     defineProps<{
@@ -149,12 +150,7 @@ const deleteTask = () => {
                     >
                         <AlertTriangle v-if="!isDone && isOverdue(task)" class="size-3.5" />
                         <Calendar v-else class="size-3.5" />
-                        <span>{{
-                            new Date(task.due_date).toLocaleDateString(
-                                'en-US',
-                                { year: 'numeric', month: 'short', day: 'numeric', timeZone: 'UTC' },
-                            )
-                        }}</span>
+                        <span>{{ formatDate(task.due_date) }}</span>
                     </div>
 
                     <div
diff --git a/resources/js/composables/useDateFormatter.ts b/resources/js/composables/useDateFormatter.ts
index 861f16a..9a36097 100644
--- a/resources/js/composables/useDateFormatter.ts
+++ b/resources/js/composables/useDateFormatter.ts
@@ -7,7 +7,7 @@ export const formatDate = (value: string | null): string => {
     const date = new Date(value);
     if (Number.isNaN(date.getTime())) return 'No due date';
 
-    return dateTimeFormatter({ year: 'numeric', month: 'short', day: 'numeric', timeZone: 'UTC' }).format(date);
+    return dateTimeFormatter({ year: 'numeric', month: 'short', day: 'numeric' }).format(date);
 };
 
 export const formatDateTime = (value: string | null): string => {
@@ -22,6 +22,5 @@ export const formatDateTime = (value: string | null): string => {
         day: 'numeric',
         hour: '2-digit',
         minute: '2-digit',
-        timeZone: 'UTC',
     }).format(date);
 };