long date format

src/modules/record/components/TaskRecord.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { useTaskStore } from '@/modules/task/stores/useTask.store'
-import { formatDate, formatDiffInMinutes } from '@/shared/format-date'
+import { formatDiffInMinutes, formatLongDate } from '@/shared/format-date'
 import { toISODate } from '@/shared/types/date'
 import { useMagicKeys, whenever } from '@vueuse/core'
 import { computed } from 'vue'
@@ -101,7 +101,7 @@ const isSuperiorToEstimation = computed(() => {
         {{ task.title }}
       </router-link>
     </h1>
-    <h2>start time: {{ formatDate(record.start) }}</h2>
+    <h2>{{ formatLongDate(record.start) }}</h2>
     <template v-if="!record.end">
       <button
         v-if="!recordStore.currentStepId && !record.hasStepRecords"

src/shared/format-date.ts

@@ -3,6 +3,16 @@ import type { ISODate } from './types/date'
 export const formatDate = (date: Date | string) =>
   new Date(date).toLocaleString()
 
+export const formatLongDate = (date: Date | ISODate) =>
+  new Date(date).toLocaleString(undefined, {
+    weekday: 'long',
+    day: '2-digit',
+    month: 'long',
+    year: 'numeric',
+    hour: 'numeric',
+    minute: 'numeric'
+  })
+
 export const formatDiffInMinutes = (date1: ISODate, date2: ISODate) => {
   const diffInMs = new Date(date2).getTime() - new Date(date1).getTime()
   // TODO: diff in minutes not in seconds