feat(SW-791): make confirmation page dynamic

components/HotelReservation/EnterDetails/Details/index.tsx

@@ -1,6 +1,5 @@
 "use client"
 import { zodResolver } from "@hookform/resolvers/zod"
-import { useCallback } from "react"
 import { FormProvider, useForm } from "react-hook-form"
 import { useIntl } from "react-intl"
 
@@ -44,7 +43,6 @@ export default function Details({ user }: DetailsProps) {
       firstName: user?.firstName ?? initialData.firstName,
       lastName: user?.lastName ?? initialData.lastName,
       phoneNumber: user?.phoneNumber ?? initialData.phoneNumber,
-      //@ts-expect-error: We use a literal for join to be true or false, which does not convert to a boolean
       join: initialData.join,
       dateOfBirth: initialData.dateOfBirth,
       zipCode: initialData.zipCode,
@@ -58,14 +56,6 @@ export default function Details({ user }: DetailsProps) {
 
   const completeStep = useEnterDetailsStore((state) => state.completeStep)
 
-  const onSubmit = useCallback(
-    async function (values: DetailsSchema) {
-      completeStep(values)
-    },
-
-    [completeStep]
-  )
-
   return (
     <FormProvider {...methods}>
       <section className={styles.container}>
@@ -77,7 +67,7 @@ export default function Details({ user }: DetailsProps) {
         <form
           className={styles.form}
           id={formID}
-          onSubmit={methods.handleSubmit(onSubmit)}
+          onSubmit={methods.handleSubmit(completeStep)}
         >
           <Input
             label={intl.formatMessage({ id: "First name" })}

components/HotelReservation/EnterDetails/Details/schema.ts

@@ -12,7 +12,7 @@ export const baseDetailsSchema = z.object({
 
 export const notJoinDetailsSchema = baseDetailsSchema.merge(
   z.object({
-    join: z.literal(false),
+    join: z.literal<boolean>(false),
     zipCode: z.string().optional(),
     dateOfBirth: z.string().optional(),
     termsAccepted: z.boolean().default(false),
@@ -21,10 +21,10 @@ export const notJoinDetailsSchema = baseDetailsSchema.merge(
 
 export const joinDetailsSchema = baseDetailsSchema.merge(
   z.object({
-    join: z.literal(true),
+    join: z.literal<boolean>(true),
     zipCode: z.string().min(1, { message: "Zip code is required" }),
     dateOfBirth: z.string().min(1, { message: "Date of birth is required" }),
-    termsAccepted: z.literal(true, {
+    termsAccepted: z.literal<boolean>(true, {
       errorMap: (err, ctx) => {
         switch (err.code) {
           case "invalid_literal":