diff --git a/packages/core/src/App/Containers/Redirect/redirect.jsx b/packages/core/src/App/Containers/Redirect/redirect.jsx index 6d0f14bd39cf..aadb65a01f37 100644 --- a/packages/core/src/App/Containers/Redirect/redirect.jsx +++ b/packages/core/src/App/Containers/Redirect/redirect.jsx @@ -26,7 +26,9 @@ const Redirect = ({ let redirected_to_route = false; const action_param = url_params.get('action'); const code_param = url_params.get('code') || verification_code[action_param]; + sessionStorage.verification_code = code_param; const ext_platform_url = url_params.get('ext_platform_url'); + const is_next_wallet = localStorage.getObject('FeatureFlagsStore')?.data.next_wallet; const { is_appstore } = React.useContext(PlatformContext); const redirectToExternalPlatform = url => { @@ -122,7 +124,7 @@ const Redirect = ({ break; } case 'payment_withdraw': { - history.push(routes.cashier_withdrawal); + is_next_wallet ? history.push(routes.wallets_withdrawal) : history.push(routes.cashier_withdrawal); redirected_to_route = true; break; } diff --git a/packages/shared/src/utils/routes/routes.ts b/packages/shared/src/utils/routes/routes.ts index fa170f37afff..0a77837026ae 100644 --- a/packages/shared/src/utils/routes/routes.ts +++ b/packages/shared/src/utils/routes/routes.ts @@ -75,4 +75,5 @@ export const routes = { // Wallets wallets: '/wallets', + wallets_withdrawal: '/wallets/cashier/withdraw', }; diff --git a/packages/wallets/src/features/cashier/flows/WalletWithdrawal/WalletWithdrawal.tsx b/packages/wallets/src/features/cashier/flows/WalletWithdrawal/WalletWithdrawal.tsx index 9a4dcdda46fa..50be987f2b18 100644 --- a/packages/wallets/src/features/cashier/flows/WalletWithdrawal/WalletWithdrawal.tsx +++ b/packages/wallets/src/features/cashier/flows/WalletWithdrawal/WalletWithdrawal.tsx @@ -1,8 +1,9 @@ import React from 'react'; -import { WithdrawalVerificationModule } from '../../modules'; +import { WithdrawalFiatModule } from '../../modules'; const WalletWithdrawal = () => { - return ; + //TODO: add withdrawal crypto module + return ; }; export default WalletWithdrawal; diff --git a/packages/wallets/src/features/cashier/modules/WithdrawalFiat/WithdrawalFiat.scss b/packages/wallets/src/features/cashier/modules/WithdrawalFiat/WithdrawalFiat.scss new file mode 100644 index 000000000000..7b9de826a4e8 --- /dev/null +++ b/packages/wallets/src/features/cashier/modules/WithdrawalFiat/WithdrawalFiat.scss @@ -0,0 +1,11 @@ +.wallets-withdrawal-fiat { + &__iframe { + width: 50%; + max-width: 58.8rem; + border: none; + + @include mobile { + width: 100%; + } + } +} diff --git a/packages/wallets/src/features/cashier/modules/WithdrawalFiat/WithdrawalFiat.tsx b/packages/wallets/src/features/cashier/modules/WithdrawalFiat/WithdrawalFiat.tsx new file mode 100644 index 000000000000..cb754106def6 --- /dev/null +++ b/packages/wallets/src/features/cashier/modules/WithdrawalFiat/WithdrawalFiat.tsx @@ -0,0 +1,40 @@ +import React, { useEffect } from 'react'; +import { useCashierFiatAddress } from '@deriv/api'; +import { Loader } from '../../../../components'; +import { WithdrawalVerificationModule } from '../WithdrawalVerification'; +import './WithdrawalFiat.scss'; + +const WithdrawalFiat = () => { + const verificationCode = sessionStorage.getItem('verification_code'); + const { data: iframeUrl, isLoading, mutate } = useCashierFiatAddress(); + + useEffect(() => { + if (iframeUrl) sessionStorage.removeItem('verification_code'); + }, [iframeUrl, isLoading]); + + useEffect(() => { + if (verificationCode) + mutate('withdraw', { + verification_code: verificationCode, + }); + }, [mutate]); + + if (verificationCode || iframeUrl) { + return ( + + {isLoading && } + {iframeUrl && ( +