fix(wallets): 🚑 fix deposit iframe loading (#15252)

binary-com · May 20, 2024 · 2b4ecab · 2b4ecab
1 parent ffcafe9
commit 2b4ecab
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 14 deletions.
diff --git a/packages/wallets/src/features/cashier/flows/WalletDeposit/WalletDeposit.tsx b/packages/wallets/src/features/cashier/flows/WalletDeposit/WalletDeposit.tsx
@@ -9,6 +9,7 @@ const WalletDeposit = () => {
     const { data } = useActiveWalletAccount();
     const { isSuccess: isAuthorizeSuccess } = useAuthorize();
     const {
+        data: iframeUrl,
         error: depositFiatError,
         isLoading: isFiatAddressLoading,
         mutate: mutateDepositFiat,
@@ -40,7 +41,7 @@ const WalletDeposit = () => {
         return <DepositErrorScreen currency={currency} error={depositError} />;
     }
 
-    return isCrypto ? <DepositCryptoModule /> : <DepositFiatModule />;
+    return isCrypto ? <DepositCryptoModule /> : <DepositFiatModule iframeUrl={iframeUrl} />;
 };
 
 export default WalletDeposit;
diff --git a/packages/wallets/src/features/cashier/modules/DepositFiat/DepositFiat.tsx b/packages/wallets/src/features/cashier/modules/DepositFiat/DepositFiat.tsx
@@ -1,10 +1,12 @@
 import React, { useState } from 'react';
-import { useCashierFiatAddress } from '@deriv/api-v2';
 import { Loader } from '../../../../components';
 import './DepositFiat.scss';
 
-const DepositFiat = () => {
-    const { data: iframeUrl } = useCashierFiatAddress();
+type TProps = {
+    iframeUrl?: string;
+};
+
+const DepositFiat: React.FC<TProps> = ({ iframeUrl }) => {
     const [isLoading, setIsLoading] = useState(true);
 
     return (

diff --git a/packages/wallets/src/features/cashier/modules/DepositFiat/__tests__/DepositFiat.spec.tsx b/packages/wallets/src/features/cashier/modules/DepositFiat/__tests__/DepositFiat.spec.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import { useCashierFiatAddress } from '@deriv/api-v2';
 import { fireEvent, render, screen } from '@testing-library/react';
 import DepositFiat from '../DepositFiat';
 
@@ -13,21 +12,13 @@ describe('DepositFiat', () => {
     });
 
     it('should render loader initially', () => {
-        (useCashierFiatAddress as jest.Mock).mockReturnValueOnce({
-            data: null,
-        });
-
         render(<DepositFiat />);
         expect(screen.getByTestId('dt_wallets_loader')).toBeInTheDocument();
         expect(screen.queryByTestId('dt_deposit-fiat-iframe')).not.toBeInTheDocument();
     });
 
     it('should display iframe correctly after onLoad event', () => {
-        (useCashierFiatAddress as jest.Mock).mockReturnValue({
-            data: 'https://iframe_url',
-        });
-
-        render(<DepositFiat />);
+        render(<DepositFiat iframeUrl='https://iframe_url' />);
 
         const iframe = screen.getByTestId('dt_deposit-fiat-iframe');
         expect(iframe).toHaveAttribute('src', 'https://iframe_url');