format date for date error messages

Author: lukasvice

src/zod/makeZodErrorMap.ts

@@ -1,4 +1,4 @@
-import { IntlShape } from '@formatjs/intl'
+import { FormatDateOptions, IntlShape } from '@formatjs/intl'
 import { z } from 'zod'
 import { errorMessages } from './errorMessages'
 
@@ -7,7 +7,7 @@ export function makeZodErrorMap<T>(
   issue: z.ZodIssueOptionalMessage,
   intl: IntlShape<T>
 ) {
-  const descriptorItem = getDescriptorItem(issue)
+  const descriptorItem = getDescriptorItem<T>(issue, intl)
 
   return descriptorItem.key in errorMessages
     ? {
@@ -19,7 +19,10 @@ export function makeZodErrorMap<T>(
     : { message: intl.formatMessage(errorMessages['default']) }
 }
 
-export function getDescriptorItem(issue: z.ZodIssueOptionalMessage): {
+export function getDescriptorItem<T>(
+  issue: z.ZodIssueOptionalMessage,
+  intl: IntlShape<T>
+): {
   key: string
   values?: Record<string, string | number>
 } {
@@ -44,15 +47,45 @@ export function getDescriptorItem(issue: z.ZodIssueOptionalMessage): {
     issue.code === z.ZodIssueCode.too_big
   ) {
     if (issue.exact) {
+      let value =
+        issue.code === z.ZodIssueCode.too_small
+          ? issue.minimum
+          : issue.code === z.ZodIssueCode.too_big
+          ? issue.maximum
+          : '-'
+
+      if (issue.type === 'date') {
+        const date = new Date(value)
+
+        if (isNaN(date.getTime())) {
+          value = '-'
+        } else {
+          const dateOptions: FormatDateOptions = {
+            day: '2-digit',
+            month: '2-digit',
+            year: 'numeric',
+          }
+
+          const timeOptions: FormatDateOptions | null =
+            date.getUTCHours() === 0 && date.getUTCMinutes() === 0
+              ? null
+              : {
+                  hour: '2-digit',
+                  minute: '2-digit',
+                }
+
+          value = intl.formatDate(value, {
+            timeZone: 'UTC',
+            ...dateOptions,
+            ...timeOptions,
+          })
+        }
+      }
+
       return {
         key: `${issue.type}.exact`,
         values: {
-          value:
-            issue.code === z.ZodIssueCode.too_small
-              ? issue.minimum
-              : issue.code === z.ZodIssueCode.too_big
-              ? issue.maximum
-              : '?',
+          value,
         },
       }
     }