Date formatting cleanup, added utility functions to avoid repetition.

src/components/EventDialog.vue

@@ -4,7 +4,7 @@ import { ref, computed, watch, onUnmounted, nextTick } from 'vue'
 import BaseDialog from './BaseDialog.vue'
 import WeekdaySelector from './WeekdaySelector.vue'
 import Numeric from './Numeric.vue'
-import { addDaysStr, getMondayOfISOWeek, fromLocalString, DEFAULT_TZ } from '@/utils/date'
+import { addDaysStr, getMondayOfISOWeek, fromLocalString, formatDateShort, formatDateLong, DEFAULT_TZ } from '@/utils/date'
 import { addDays, addMonths } from 'date-fns'
 
 const props = defineProps({
@@ -440,24 +440,12 @@ const isLastOccurrence = computed(() => {
 })
 const formattedOccurrenceShort = computed(() => {
   if (occurrenceContext.value?.occurrenceDate) {
-    try {
-      return occurrenceContext.value.occurrenceDate
-        .toLocaleDateString(undefined, { month: 'short', day: 'numeric' })
-        .replace(/, /, ' ')
-    } catch {
-      /* noop */
-    }
+    return formatDateShort(occurrenceContext.value.occurrenceDate)
   }
   if (isRepeatingBaseEdit.value && editingEventId.value) {
     const ev = calendarStore.getEventById(editingEventId.value)
     if (ev?.startDate) {
-      try {
-        return fromLocalString(ev.startDate, DEFAULT_TZ)
-          .toLocaleDateString(undefined, { month: 'short', day: 'numeric' })
-          .replace(/, /, ' ')
-      } catch {
-        /* noop */
-      }
+      return formatDateShort(fromLocalString(ev.startDate, DEFAULT_TZ))
     }
   }
   return ''
@@ -465,24 +453,12 @@ const formattedOccurrenceShort = computed(() => {
 
 const headerDateShort = computed(() => {
   if (occurrenceContext.value?.occurrenceDate) {
-    try {
-      return occurrenceContext.value.occurrenceDate
-        .toLocaleDateString(undefined, { month: 'short', day: 'numeric' })
-        .replace(/, /, ' ')
-    } catch {
-      return ''
-    }
+    return formatDateShort(occurrenceContext.value.occurrenceDate)
   }
   if (editingEventId.value) {
     const ev = calendarStore.getEventById(editingEventId.value)
     if (ev?.startDate) {
-      try {
-        return fromLocalString(ev.startDate, DEFAULT_TZ)
-          .toLocaleDateString(undefined, { month: 'short', day: 'numeric' })
-          .replace(/, /, ' ')
-      } catch {
-        return ''
-      }
+      return formatDateShort(fromLocalString(ev.startDate, DEFAULT_TZ))
     }
   }
   return ''
@@ -533,17 +509,7 @@ const formattedFinalOccurrence = computed(() => {
   const includeYear =
     d.getFullYear() !== now.getFullYear() ||
     d.getTime() - now.getTime() >= 1000 * 60 * 60 * 24 * 365
-  const opts = {
-    weekday: 'short',
-    month: 'short',
-    day: 'numeric',
-    ...(includeYear ? { year: 'numeric' } : {}),
-  }
-  try {
-    return d.toLocaleDateString(undefined, opts)
-  } catch {
-    return d.toDateString()
-  }
+  return formatDateLong(d, includeYear)
 })
 
 const recurrenceSummary = computed(() => {