feat(SW-1255): Added loading state to submit button in enter details

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

@@ -4,10 +4,11 @@ import { useSearchParams } from "next/navigation"
 import { type PropsWithChildren, useEffect, useRef } from "react"
 import { useIntl } from "react-intl"
 
+import { Button } from "@scandic-hotels/design-system/Button"
+
 import { useEnterDetailsStore } from "@/stores/enter-details"
 
 import { formId } from "@/components/HotelReservation/EnterDetails/Payment/PaymentClient"
-import Button from "@/components/TempDesignSystem/Button"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { formatPrice } from "@/utils/numberFormatting"
@@ -20,13 +21,19 @@ export default function SummaryBottomSheet({ children }: PropsWithChildren) {
   const searchParams = useSearchParams()
   const errorCode = searchParams.get("errorCode")
 
-  const { isSummaryOpen, toggleSummaryOpen, totalPrice, isSubmittingDisabled } =
-    useEnterDetailsStore((state) => ({
-      isSummaryOpen: state.isSummaryOpen,
-      toggleSummaryOpen: state.actions.toggleSummaryOpen,
-      totalPrice: state.totalPrice,
-      isSubmittingDisabled: state.isSubmittingDisabled,
-    }))
+  const {
+    isSummaryOpen,
+    toggleSummaryOpen,
+    totalPrice,
+    isSubmittingDisabled,
+    isSubmitting,
+  } = useEnterDetailsStore((state) => ({
+    isSummaryOpen: state.isSummaryOpen,
+    toggleSummaryOpen: state.actions.toggleSummaryOpen,
+    totalPrice: state.totalPrice,
+    isSubmittingDisabled: state.isSubmittingDisabled,
+    isSubmitting: state.isSubmitting,
+  }))
 
   useEffect(() => {
     if (isSummaryOpen) {
@@ -82,11 +89,12 @@ export default function SummaryBottomSheet({ children }: PropsWithChildren) {
           </Caption>
         </button>
         <Button
-          intent="primary"
-          theme="base"
-          size="large"
+          variant="Primary"
+          size="Large"
           type="submit"
-          disabled={isSubmittingDisabled}
+          isDisabled={isSubmittingDisabled}
+          isPending={isSubmitting}
+          typography="Body/Supporting text (caption)/smBold"
           form={formId}
         >
           {intl.formatMessage({