diff --git a/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/__tests__/my-profile-balance-modal.spec.tsx b/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/__tests__/my-profile-balance-modal.spec.tsx
index 53ce90a30bb7..b1a46d79c0e1 100755
--- a/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/__tests__/my-profile-balance-modal.spec.tsx
+++ b/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/__tests__/my-profile-balance-modal.spec.tsx
@@ -29,7 +29,15 @@ describe('', () => {
it('should render MyProfileBalanceModal', () => {
render();
- expect(screen.getByText('Deriv P2P Balance')).toBeInTheDocument();
+ expect(screen.getByText('Available Deriv P2P Balance')).toBeInTheDocument();
+ expect(
+ screen.getByText('Your Deriv P2P balance only includes deposits that can’t be reversed.')
+ ).toBeInTheDocument();
+ expect(
+ screen.getByText(
+ 'Deposits via cards and the following payment methods aren’t included: Maestro, Diners Club, ZingPay, Skrill, Neteller, Ozow, and UPI QR.'
+ )
+ ).toBeInTheDocument();
});
it('should call hideModal when clicking on the OK button', () => {
diff --git a/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/my-profile-balance-modal.scss b/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/my-profile-balance-modal.scss
index 08cd21191441..3c098638f5f9 100755
--- a/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/my-profile-balance-modal.scss
+++ b/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/my-profile-balance-modal.scss
@@ -5,5 +5,9 @@
@include mobile {
padding: 0 1.6rem;
}
+
+ &-text {
+ margin-bottom: 1.6rem;
+ }
}
}
diff --git a/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/my-profile-balance-modal.tsx b/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/my-profile-balance-modal.tsx
index eeca53d94813..754b0f42688a 100755
--- a/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/my-profile-balance-modal.tsx
+++ b/packages/p2p/src/components/modal-manager/modals/my-profile-balance-modal/my-profile-balance-modal.tsx
@@ -1,5 +1,5 @@
import React from 'react';
-import { Button, Modal } from '@deriv/components';
+import { Button, Modal, Text } from '@deriv/components';
import { useModalManagerContext } from 'Components/modal-manager/modal-manager-context';
import { Localize, localize } from 'Components/i18next';
@@ -12,10 +12,15 @@ const MyProfileBalanceModal = () => {
has_close_icon={false}
is_open={is_modal_open}
small
- title={localize('Deriv P2P Balance')}
+ title={localize('Available Deriv P2P Balance')}
>
-
+
+
+
+
+
+