diff --git a/src/common/utils/sendPostMessage.ts b/src/common/utils/sendPostMessage.ts index 1f2b2110..0871ec6f 100644 --- a/src/common/utils/sendPostMessage.ts +++ b/src/common/utils/sendPostMessage.ts @@ -1,4 +1,4 @@ -export const sendPostMessage = (message: 'onSuccess' | 'onError' | 'onBack') => { - window.top.postMessage(message); +export const sendPostMessage = (message: 'onSuccess' | 'onError' | 'onBack' | 'onProgress') => { + window.top.postMessage(message, '*'); console.info(`${message} message sent`); }; diff --git a/src/components/GlobalContainer/usePostMessage.ts b/src/components/GlobalContainer/usePostMessage.ts index 93463df7..82810a56 100644 --- a/src/components/GlobalContainer/usePostMessage.ts +++ b/src/components/GlobalContainer/usePostMessage.ts @@ -12,6 +12,9 @@ const handlePaymentStatusChanged = (condition: PaymentStatusChanged) => { case 'failed': sendPostMessage('onError'); break; + case 'pending': + sendPostMessage('onProgress'); + break; } }; @@ -36,6 +39,11 @@ export function usePostMessage(conditions: PaymentCondition[]) { case 'invoiceStatusChanged': handleInvoiceStatusChanged(lastCondition); break; + case 'paymentStatusUnknown': + case 'interactionCompleted': + case 'paymentStarted': + sendPostMessage('onProgress'); + break; } }, [conditions]); } diff --git a/src/components/ViewContainer/PaymentResultView/PaymentResultView.tsx b/src/components/ViewContainer/PaymentResultView/PaymentResultView.tsx index afa9a4d1..a621c1cc 100644 --- a/src/components/ViewContainer/PaymentResultView/PaymentResultView.tsx +++ b/src/components/ViewContainer/PaymentResultView/PaymentResultView.tsx @@ -8,7 +8,7 @@ import { PaymentModelContext, ViewModelContext, } from 'checkout/contexts'; -import { isNil, last } from 'checkout/utils'; +import { isNil, last, sendPostMessage } from 'checkout/utils'; import { ResultIcon } from './ResultIcon'; import { getPaymentFormViewId, getResultInfo, isExternalIdEmpty, isInstantPayment } from './utils'; @@ -79,7 +79,10 @@ export function PaymentResultView() { colorScheme="brand" size="lg" variant="link" - onClick={() => window.open(initContext.redirectUrl, '_self')} + onClick={() => { + sendPostMessage('onBack'); + window.open(initContext.redirectUrl, '_self'); + }} > {l['form.button.back.to.website']}