diff --git a/storefront/components/Pages/OrderConfirmation/RegistrationAfterOrder.tsx b/storefront/components/Pages/OrderConfirmation/RegistrationAfterOrder.tsx index 0599515e69..5735383d74 100644 --- a/storefront/components/Pages/OrderConfirmation/RegistrationAfterOrder.tsx +++ b/storefront/components/Pages/OrderConfirmation/RegistrationAfterOrder.tsx @@ -10,7 +10,6 @@ import { useCouldBeCustomerRegisteredQuery } from 'graphql/requests/customer/que import { GtmMessageOriginType } from 'gtm/enums/GtmMessageOriginType'; import Trans from 'next-translate/Trans'; import useTranslation from 'next-translate/useTranslation'; -import { useRouter } from 'next/router'; import { OrderConfirmationUrlQuery } from 'pages/order-confirmation'; import { useRef } from 'react'; import { FormProvider } from 'react-hook-form'; @@ -22,14 +21,17 @@ import { blurInput } from 'utils/forms/blurInput'; import { useErrorPopup } from 'utils/forms/useErrorPopup'; import { showErrorMessage } from 'utils/toasts/showErrorMessage'; -export const RegistrationAfterOrder: FC = () => { +export const RegistrationAfterOrder: FC> = ({ + orderUuid, + companyNumber, + orderEmail, + orderUrlHash, +}) => { const { t } = useTranslation(); const [formProviderMethods] = useRegistrationAfterOrderForm(); const formMeta = useRegistrationAfterOrderFormMeta(formProviderMethods); const { registerByOrder } = useRegistration(); const isInvalidRegistrationRef = useRef(false); - const { query } = useRouter(); - const { orderUuid, companyNumber, orderEmail, orderUrlHash } = query as OrderConfirmationUrlQuery; const isUserLoggedIn = useIsUserLoggedIn(); useErrorPopup(formProviderMethods, formMeta.fields, undefined, GtmMessageOriginType.order_confirmation_page); diff --git a/storefront/pages/order-confirmation.tsx b/storefront/pages/order-confirmation.tsx index fc135ebe7f..3707fe9d09 100644 --- a/storefront/pages/order-confirmation.tsx +++ b/storefront/pages/order-confirmation.tsx @@ -35,7 +35,7 @@ const OrderConfirmationPage: FC = () => { const { t } = useTranslation(); const { query } = useRouter(); const { fetchCart } = useCurrentCart(false); - const { orderUuid, orderPaymentType } = query as OrderConfirmationUrlQuery; + const { orderUuid, orderPaymentType, companyNumber, orderEmail, orderUrlHash } = query as OrderConfirmationUrlQuery; const gtmStaticPageViewEvent = useGtmStaticPageViewEvent(GtmPageType.order_confirmation); useGtmPageViewEvent(gtmStaticPageViewEvent); @@ -68,7 +68,12 @@ const OrderConfirmationPage: FC = () => { ) : undefined} - + diff --git a/storefront/pages/order-payment-confirmation.tsx b/storefront/pages/order-payment-confirmation.tsx index 91fef417e4..10780d48fa 100644 --- a/storefront/pages/order-payment-confirmation.tsx +++ b/storefront/pages/order-payment-confirmation.tsx @@ -7,6 +7,7 @@ import { getPaymentSessionExpiredErrorMessage, useUpdatePaymentStatus, } from 'components/Pages/Order/PaymentConfirmation/paymentConfirmationUtils'; +import { RegistrationAfterOrder } from 'components/Pages/OrderConfirmation/RegistrationAfterOrder'; import { useOrderPaymentFailedContentQuery } from 'graphql/requests/orders/queries/OrderPaymentFailedContentQuery.generated'; import { useOrderPaymentSuccessfulContentQuery } from 'graphql/requests/orders/queries/OrderPaymentSuccessfulContentQuery.generated'; import useTranslation from 'next-translate/useTranslation'; @@ -18,7 +19,7 @@ import { initServerSideProps, ServerSidePropsType } from 'utils/serverSide/initS const OrderPaymentConfirmationPage: FC = () => { const { t } = useTranslation(); - const { orderIdentifier, orderPaymentStatusPageValidityHash } = useRouter().query; + const { orderIdentifier, orderPaymentStatusPageValidityHash, orderEmail, orderUrlHash } = useRouter().query; const orderUuid = getStringFromUrlQuery(orderIdentifier); const orderPaymentStatusPageValidityHashParam = getStringFromUrlQuery(orderPaymentStatusPageValidityHash); const paymentStatusData = useUpdatePaymentStatus(orderUuid, orderPaymentStatusPageValidityHashParam); @@ -70,6 +71,13 @@ const OrderPaymentConfirmationPage: FC = () => { paymentStatusData={paymentStatusData} successContentData={successContentData} /> + {paymentStatusData?.UpdatePaymentStatus.isPaid && successContentData && ( + + )}