Merged in fix/SW-2887-complete-booking-button-always-enabled (pull request #2227)

fix(SW-2887): don't disable the booking button
The complete button shouldn’t be disabled based on validation. This was already correct in desktop, but now it’s also correct in mobile.

* fix(SW-2887): don't disable the booking button


Approved-by: Tobias Johansson
Approved-by: Christian Andolf

apps/scandic-web/components/HotelReservation/EnterDetails/Payment/PaymentClient.tsx

@@ -106,10 +106,6 @@ export default function PaymentClient({
     return room.mustBeGuaranteed
   })
 
-  const setIsSubmittingDisabled = useEnterDetailsStore(
-    (state) => state.actions.setIsSubmittingDisabled
-  )
-
   const [refId, setRefId] = useState("")
   const [isPollingForBookingStatus, setIsPollingForBookingStatus] =
     useState(false)
@@ -284,16 +280,6 @@ export default function PaymentClient({
     handlePaymentError,
   ])
 
-  useEffect(() => {
-    setIsSubmittingDisabled(
-      !methods.formState.isValid || methods.formState.isSubmitting
-    )
-  }, [
-    methods.formState.isValid,
-    methods.formState.isSubmitting,
-    setIsSubmittingDisabled,
-  ])
-
   const getPaymentMethod = useCallback(
     (paymentMethod: string | null | undefined): PaymentMethodEnum => {
       if (hasFlexRates) {
@@ -626,7 +612,7 @@ export default function PaymentClient({
           <div className={styles.submitButton}>
             <Button
               type="submit"
-              isDisabled={methods.formState.isSubmitting}
+              isDisabled={isSubmitting}
               isPending={isSubmitting}
               typography="Body/Supporting text (caption)/smBold"
             >

apps/scandic-web/components/HotelReservation/EnterDetails/Summary/Mobile/BottomSheet/index.tsx

@@ -21,19 +21,13 @@ export default function SummaryBottomSheet({ children }: PropsWithChildren) {
   const searchParams = useSearchParams()
   const errorCode = searchParams.get("errorCode")
 
-  const {
-    isSummaryOpen,
-    toggleSummaryOpen,
-    totalPrice,
-    isSubmittingDisabled,
-    isSubmitting,
-  } = useEnterDetailsStore((state) => ({
-    isSummaryOpen: state.isSummaryOpen,
-    toggleSummaryOpen: state.actions.toggleSummaryOpen,
-    totalPrice: state.totalPrice,
-    isSubmittingDisabled: state.isSubmittingDisabled,
-    isSubmitting: state.isSubmitting,
-  }))
+  const { isSummaryOpen, toggleSummaryOpen, totalPrice, isSubmitting } =
+    useEnterDetailsStore((state) => ({
+      isSummaryOpen: state.isSummaryOpen,
+      toggleSummaryOpen: state.actions.toggleSummaryOpen,
+      totalPrice: state.totalPrice,
+      isSubmitting: state.isSubmitting,
+    }))
 
   useEffect(() => {
     if (isSummaryOpen) {
@@ -92,7 +86,7 @@ export default function SummaryBottomSheet({ children }: PropsWithChildren) {
           variant="Primary"
           size="Large"
           type="submit"
-          isDisabled={isSubmittingDisabled}
+          isDisabled={isSubmitting}
           isPending={isSubmitting}
           typography="Body/Supporting text (caption)/smBold"
           form={formId}

apps/scandic-web/stores/enter-details/index.ts

@@ -155,7 +155,6 @@ export function createDetailsStore(
     booking: initialState.booking,
     breakfastPackages,
     canProceedToPayment: false,
-    isSubmittingDisabled: false,
     isSubmitting: false,
     isSummaryOpen: false,
     lastRoom: initialState.booking.rooms.length - 1,
@@ -415,13 +414,6 @@ export function createDetailsStore(
     preSubmitCallbacks: {},
 
     actions: {
-      setIsSubmittingDisabled(isSubmittingDisabled) {
-        return set(
-          produce((state: DetailsState) => {
-            state.isSubmittingDisabled = isSubmittingDisabled
-          })
-        )
-      },
       setIsSubmitting(isSubmitting) {
         return set(
           produce((state: DetailsState) => {

apps/scandic-web/types/stores/enter-details.ts

@@ -85,7 +85,6 @@ export type InitialState = {
 
 export interface DetailsState {
   actions: {
-    setIsSubmittingDisabled: (isSubmittingDisabled: boolean) => void
     setIsSubmitting: (isSubmitting: boolean) => void
     setTotalPrice: (totalPrice: Price) => void
     toggleSummaryOpen: () => void
@@ -96,7 +95,6 @@ export interface DetailsState {
   booking: SelectRateSearchParams
   breakfastPackages: BreakfastPackages
   canProceedToPayment: boolean
-  isSubmittingDisabled: boolean
   isSubmitting: boolean
   isSummaryOpen: boolean
   lastRoom: number