refactor: code clean up

Signed-off-by: Sebastian Krupinski <krupinski01@gmail.com>

src/components/editors/EventEditorDates.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { ref, computed, watch } from 'vue'
 import { parseCalendarDate } from '@/utils/date'
+import { formatDisplayDate, formatDisplayTime, formatLocalIsoDate, formatLocalIsoTime } from '@/utils/format'
 
 interface Props {
   mode: 'edit' | 'view'
@@ -29,18 +30,6 @@ const timeZoneValue = computed({
   set: (value) => emit('update:timeZone', value || null)
 })
 
-// Format helpers
-const formatDate = (date: Date): string => {
-  const year = date.getFullYear()
-  const month = String(date.getMonth() + 1).padStart(2, '0')
-  const day = String(date.getDate()).padStart(2, '0')
-  return `${year}-${month}-${day}`
-}
-
-const formatTime = (date: Date): string => {
-  return date.toTimeString().slice(0, 5)
-}
-
 const formatDateTime = (isoString: string | null | undefined): string => {
   if (!isoString) return 'Not set'
   if (timelessValue.value) {
@@ -64,24 +53,7 @@ const serializeDateTime = (date: string, time: string): string => {
 }
 
 const inputDate = (value: string, timeless: boolean): string => {
-  return timeless ? value.slice(0, 10) : formatDate(new Date(value))
-}
-
-const formatDisplayDate = (value: string): string => {
-  if (!value) return ''
-  return new Date(`${value}T00:00:00`).toLocaleDateString(undefined, {
-    year: 'numeric',
-    month: 'short',
-    day: 'numeric',
-  })
-}
-
-const formatDisplayTime = (value: string): string => {
-  if (!value) return ''
-  const [hour, minute] = value.split(':').map(Number)
-  const date = new Date()
-  date.setHours(hour, minute, 0, 0)
-  return date.toLocaleTimeString(undefined, { hour: 'numeric', minute: '2-digit' })
+  return timeless ? value.slice(0, 10) : formatLocalIsoDate(new Date(value))
 }
 
 const pickerDate = (value: string): Date | null => value ? new Date(`${value}T00:00:00`) : null
@@ -89,7 +61,7 @@ const pickerDate = (value: string): Date | null => value ? new Date(`${value}T00
 const normalizePickerDate = (value: unknown): string => {
   const selected = Array.isArray(value) ? value[0] : value
   const date = selected instanceof Date ? selected : new Date(String(selected))
-  return Number.isNaN(date.getTime()) ? '' : formatDate(date)
+  return Number.isNaN(date.getTime()) ? '' : formatLocalIsoDate(date)
 }
 
 // Date/time fields
@@ -119,11 +91,11 @@ watch([() => props.startsOn, () => props.timeless], ([newValue, timeless]) => {
   if (newValue) {
     const start = new Date(newValue)
     startDate.value = inputDate(newValue, timeless === true)
-    startTime.value = formatTime(start)
+    startTime.value = formatLocalIsoTime(start)
   } else {
     const now = new Date()
-    startDate.value = formatDate(now)
-    startTime.value = formatTime(now)
+    startDate.value = formatLocalIsoDate(now)
+    startTime.value = formatLocalIsoTime(now)
   }
 }, { immediate: true })
 
@@ -131,11 +103,11 @@ watch([() => props.endsOn, () => props.timeless], ([newValue, timeless]) => {
   if (newValue) {
     const end = new Date(newValue)
     endDate.value = inputDate(newValue, timeless === true)
-    endTime.value = formatTime(end)
+    endTime.value = formatLocalIsoTime(end)
   } else {
     const later = new Date(Date.now() + 60 * 60 * 1000)
-    endDate.value = formatDate(later)
-    endTime.value = formatTime(later)
+    endDate.value = formatLocalIsoDate(later)
+    endTime.value = formatLocalIsoTime(later)
   }
 }, { immediate: true })
 
@@ -151,8 +123,8 @@ const ensureValidRange = (): boolean => {
   const correctedEnd = new Date(start)
   if (timelessValue.value) correctedEnd.setDate(correctedEnd.getDate() + 1)
   else correctedEnd.setHours(correctedEnd.getHours() + 1)
-  endDate.value = formatDate(correctedEnd)
-  endTime.value = formatTime(correctedEnd)
+  endDate.value = formatLocalIsoDate(correctedEnd)
+  endTime.value = formatLocalIsoTime(correctedEnd)
   return true
 }
 

src/components/editors/EventEditorOccurrence.vue

@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import { computed, ref } from 'vue'
 import type { EventOccurrence } from '@ChronoManager/types/event'
+import { formatDisplayDate, formatLocalIsoDate } from '@/utils/format'
 
 type Frequency = 'daily' | 'weekly' | 'monthly' | 'yearly'
 type EndMode = 'never' | 'date' | 'count'
@@ -170,19 +171,11 @@ const pickerDate = (value: string | null | undefined): Date | null => {
   return value ? new Date(`${value.slice(0, 10)}T00:00:00`) : null
 }
 
-const formatDisplayDate = (value: string | null | undefined): string => {
-  const date = pickerDate(value)
-  return date ? date.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' }) : ''
-}
-
 const selectConclusionDate = (value: unknown) => {
   const selected = Array.isArray(value) ? value[0] : value
   const date = selected instanceof Date ? selected : new Date(String(selected))
   if (!Number.isNaN(date.getTime())) {
-    const year = date.getFullYear()
-    const month = String(date.getMonth() + 1).padStart(2, '0')
-    const day = String(date.getDate()).padStart(2, '0')
-    updatePattern({ concludes: `${year}-${month}-${day}`, iterations: null })
+    updatePattern({ concludes: formatLocalIsoDate(date), iterations: null })
   }
   endDateMenu.value = false
 }