⚡ (dateInput) Add format option and improve parsing

Use date-fns for custom format and make sure dates are timezone independants

Closes #533, closes #592

apps/viewer/package.json

@@ -16,11 +16,12 @@
     "@trpc/server": "10.34.0",
     "@typebot.io/nextjs": "workspace:*",
     "@typebot.io/prisma": "workspace:*",
-    "ai": "2.1.32",
     "@udecode/plate-common": "^21.1.5",
+    "ai": "2.1.32",
     "bot-engine": "workspace:*",
-    "chrono-node": "^2.6.4",
+    "chrono-node": "2.6.6",
     "cors": "2.8.5",
+    "date-fns": "^2.30.0",
     "eventsource-parser": "^1.0.0",
     "google-spreadsheet": "4.0.2",
     "got": "12.6.0",
@@ -54,10 +55,10 @@
     "@types/react": "18.2.15",
     "@types/sanitize-html": "2.9.0",
     "dotenv-cli": "^7.2.1",
-    "next-runtime-env": "^1.6.2",
     "eslint": "8.44.0",
     "eslint-config-custom": "workspace:*",
     "google-auth-library": "8.9.0",
+    "next-runtime-env": "^1.6.2",
     "node-fetch": "3.3.1",
     "papaparse": "5.4.1",
     "superjson": "1.12.4",

apps/viewer/src/features/blocks/inputs/date/parseDateReply.ts

@@ -1,6 +1,7 @@
 import { ParsedReply } from '@/features/chat/types'
 import { DateInputBlock } from '@typebot.io/schemas'
 import { parse as chronoParse } from 'chrono-node'
+import { format } from 'date-fns'
 
 export const parseDateReply = (
   reply: string,
@@ -8,21 +9,29 @@ export const parseDateReply = (
 ): ParsedReply => {
   const parsedDate = chronoParse(reply)
   if (parsedDate.length === 0) return { status: 'fail' }
-  const formatOptions: Intl.DateTimeFormatOptions = {
-    day: '2-digit',
-    month: '2-digit',
-    year: 'numeric',
-    hour: block.options.hasTime ? '2-digit' : undefined,
-    minute: block.options.hasTime ? '2-digit' : undefined,
-  }
-  const startDate = parsedDate[0].start
-    .date()
-    .toLocaleString(undefined, formatOptions)
-  const endDate = parsedDate[0].end
-    ?.date()
-    .toLocaleString(undefined, formatOptions)
+  const formatString =
+    block.options.format ??
+    (block.options.hasTime ? 'dd/MM/yyyy HH:mm' : 'dd/MM/yyyy')
+
+  const detectedStartDate = parseDateWithNeutralTimezone(
+    parsedDate[0].start.date()
+  )
+  const startDate = format(detectedStartDate, formatString)
+
+  const detectedEndDate = parsedDate[0].end?.date()
+    ? parseDateWithNeutralTimezone(parsedDate[0].end?.date())
+    : undefined
+  const endDate = detectedEndDate
+    ? format(detectedEndDate, formatString)
+    : undefined
+
+  if (block.options.isRange && !endDate) return { status: 'fail' }
+
   return {
     status: 'success',
     reply: block.options.isRange ? `${startDate} to ${endDate}` : startDate,
   }
 }
+
+const parseDateWithNeutralTimezone = (date: Date) =>
+  new Date(date.valueOf() + date.getTimezoneOffset() * 60 * 1000)

apps/viewer/src/features/chat/chat.spec.ts

@@ -142,7 +142,6 @@ test('API chat execution should work on published bot', async ({ request }) => {
         data: { message: '8', sessionId: chatSessionId },
       })
     ).json()
-    console.log(messages, input)
     expect(messages[0].content.richText).toStrictEqual([
       {
         children: [{ text: "I'm gonna shoot multiple inputs now..." }],