diff --git a/packages/p2p/src/components/modal-manager/modals/ad-error-tooltip-modal/ad-error-tooltip-modal.jsx b/packages/p2p/src/components/modal-manager/modals/ad-error-tooltip-modal/ad-error-tooltip-modal.jsx
new file mode 100644
index 000000000000..48389602f2af
--- /dev/null
+++ b/packages/p2p/src/components/modal-manager/modals/ad-error-tooltip-modal/ad-error-tooltip-modal.jsx
@@ -0,0 +1,32 @@
+import React from 'react';
+import { Button, Modal, Text } from '@deriv/components';
+import { observer } from 'mobx-react-lite';
+import { localize, Localize } from 'Components/i18next';
+import { useStores } from 'Stores';
+import { useModalManagerContext } from 'Components/modal-manager/modal-manager-context';
+
+const AdErrorTooltipModal = () => {
+ const { my_ads_store, general_store } = useStores();
+ const { hideModal, is_modal_open } = useModalManagerContext();
+
+ return (
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default observer(AdErrorTooltipModal);
diff --git a/packages/p2p/src/components/modal-manager/modals/ad-error-tooltip-modal/index.js b/packages/p2p/src/components/modal-manager/modals/ad-error-tooltip-modal/index.js
new file mode 100644
index 000000000000..57574a78e567
--- /dev/null
+++ b/packages/p2p/src/components/modal-manager/modals/ad-error-tooltip-modal/index.js
@@ -0,0 +1,3 @@
+import AdErrorTooltipModal from './ad-error-tooltip-modal';
+
+export default AdErrorTooltipModal;
diff --git a/packages/p2p/src/components/modal-manager/modals/ad-exceeds-daily-limit-modal/ad-exceeds-daily-limit-modal.jsx b/packages/p2p/src/components/modal-manager/modals/ad-exceeds-daily-limit-modal/ad-exceeds-daily-limit-modal.jsx
deleted file mode 100644
index 31b3e5763961..000000000000
--- a/packages/p2p/src/components/modal-manager/modals/ad-exceeds-daily-limit-modal/ad-exceeds-daily-limit-modal.jsx
+++ /dev/null
@@ -1,48 +0,0 @@
-import React from 'react';
-import { Button, Modal, Text } from '@deriv/components';
-import { observer } from 'mobx-react-lite';
-import { localize, Localize } from 'Components/i18next';
-import { useStores } from 'Stores';
-import { useModalManagerContext } from 'Components/modal-manager/modal-manager-context';
-
-const AdExceedsDailyLimitModal = () => {
- const { my_ads_store } = useStores();
- const { hideModal, is_modal_open } = useModalManagerContext();
-
- return (
-
-
-
- ,
-
,
- window.LC_API.open_chat_window()}
- />,
- ]}
- />
-
-
-
-
-
- );
-};
-
-export default observer(AdExceedsDailyLimitModal);
diff --git a/packages/p2p/src/components/modal-manager/modals/ad-exceeds-daily-limit-modal/index.js b/packages/p2p/src/components/modal-manager/modals/ad-exceeds-daily-limit-modal/index.js
deleted file mode 100644
index 45fdfea59f51..000000000000
--- a/packages/p2p/src/components/modal-manager/modals/ad-exceeds-daily-limit-modal/index.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import AdExceedsDailyLimitModal from './ad-exceeds-daily-limit-modal.jsx';
-
-export default AdExceedsDailyLimitModal;
diff --git a/packages/p2p/src/components/modal-manager/modals/ad-visibility-error-modal/ad-visibility-error-modal.jsx b/packages/p2p/src/components/modal-manager/modals/ad-visibility-error-modal/ad-visibility-error-modal.jsx
new file mode 100644
index 000000000000..ba8fb2d85168
--- /dev/null
+++ b/packages/p2p/src/components/modal-manager/modals/ad-visibility-error-modal/ad-visibility-error-modal.jsx
@@ -0,0 +1,91 @@
+import React from 'react';
+import { Button, Modal, Text } from '@deriv/components';
+import { observer } from 'mobx-react-lite';
+import { localize, Localize } from 'Components/i18next';
+import { useStores } from 'Stores';
+import { useModalManagerContext } from 'Components/modal-manager/modal-manager-context';
+import { api_error_codes } from '../../../../constants/api-error-codes';
+
+const AdVisibilityErrorModal = ({ error_code }) => {
+ const { my_ads_store } = useStores();
+ const { hideModal, is_modal_open } = useModalManagerContext();
+
+ if (error_code === api_error_codes.AD_EXCEEDS_BALANCE) {
+ return (
+
+
+
+ ]}
+ />
+
+
+
+
+
+ );
+ } else if (error_code === api_error_codes.AD_EXCEEDS_DAILY_LIMIT) {
+ return (
+
+
+
+ ,
+
,
+ window.LC_API.open_chat_window()}
+ />,
+ ]}
+ />
+
+
+
+
+
+ );
+ }
+ return (
+
+
+
+
+
+
+
+
+
+ );
+};
+
+export default observer(AdVisibilityErrorModal);
diff --git a/packages/p2p/src/components/modal-manager/modals/ad-visibility-error-modal/index.js b/packages/p2p/src/components/modal-manager/modals/ad-visibility-error-modal/index.js
new file mode 100644
index 000000000000..7c7ac451d8aa
--- /dev/null
+++ b/packages/p2p/src/components/modal-manager/modals/ad-visibility-error-modal/index.js
@@ -0,0 +1,3 @@
+import AdVisibilityErrorModal from './ad-visibility-error-modal';
+
+export default AdVisibilityErrorModal;
diff --git a/packages/p2p/src/components/my-ads/create-ad-form.jsx b/packages/p2p/src/components/my-ads/create-ad-form.jsx
index 6cb2621f14ca..75faaa039769 100644
--- a/packages/p2p/src/components/my-ads/create-ad-form.jsx
+++ b/packages/p2p/src/components/my-ads/create-ad-form.jsx
@@ -21,6 +21,7 @@ import { useStores } from 'Stores';
import CreateAdSummary from './create-ad-summary.jsx';
import CreateAdFormPaymentMethods from './create-ad-form-payment-methods.jsx';
import { useModalManagerContext } from 'Components/modal-manager/modal-manager-context';
+import { api_error_codes } from '../../constants/api-error-codes.js';
const CreateAdFormWrapper = ({ children }) => {
if (isMobile()) {
@@ -51,8 +52,17 @@ const CreateAdForm = () => {
JSON.stringify(should_not_show_auto_archive_message_again.current)
);
my_ads_store.setIsAdCreatedModalVisible(false);
- if (my_ads_store.advert_details?.visibility_status?.includes('advertiser_daily_limit'))
- general_store.showModal({ key: 'AdExceedsDailyLimitModal', props: {} });
+ if (my_ads_store.advert_details?.visibility_status?.includes(api_error_codes.AD_EXCEEDS_BALANCE)) {
+ general_store.showModal({
+ key: 'AdVisibilityErrorModal',
+ props: { error_code: api_error_codes.AD_EXCEEDS_BALANCE },
+ });
+ } else if (my_ads_store.advert_details?.visibility_status?.includes(api_error_codes.AD_EXCEEDS_DAILY_LIMIT)) {
+ general_store.showModal({
+ key: 'AdVisibilityErrorModal',
+ props: { error_code: api_error_codes.AD_EXCEEDS_DAILY_LIMIT },
+ });
+ }
my_ads_store.setShowAdForm(false);
};
diff --git a/packages/p2p/src/constants/api-error-codes.js b/packages/p2p/src/constants/api-error-codes.js
index 1ce48e565c79..37560c743416 100644
--- a/packages/p2p/src/constants/api-error-codes.js
+++ b/packages/p2p/src/constants/api-error-codes.js
@@ -10,4 +10,6 @@ export const api_error_codes = Object.freeze({
ORDER_CREATE_FAIL_RATE_CHANGED: 'OrderCreateFailRateChanged',
PERMISSION_DENIED: 'PermissionDenied',
RESTRICTED_COUNTRY: 'RestrictedCountry',
+ AD_EXCEEDS_DAILY_LIMIT: 'advertiser_daily_limit',
+ AD_EXCEEDS_BALANCE: 'advertiser_balance',
});
diff --git a/packages/p2p/src/constants/modals.js b/packages/p2p/src/constants/modals.js
index 5a4ccf5ba215..daba5e0fc8c6 100644
--- a/packages/p2p/src/constants/modals.js
+++ b/packages/p2p/src/constants/modals.js
@@ -1,9 +1,9 @@
import React from 'react';
export const modals = {
- AdExceedsDailyLimitModal: React.lazy(() =>
+ AdErrorTooltipModal: React.lazy(() =>
import(
- /* webpackChunkName: "ad-exceeds-daily-limit-modal" */ 'Components/modal-manager/modals/ad-exceeds-daily-limit-modal'
+ /* webpackChunkName: "ad-error-tooltip-modal" */ 'Components/modal-manager/modals/ad-error-tooltip-modal'
)
),
AddPaymentMethodErrorModal: React.lazy(() =>
@@ -11,6 +11,11 @@ export const modals = {
/* webpackChunkName: "add-payment-method-error-modal" */ 'Components/modal-manager/modals/add-payment-method-error-modal'
)
),
+ AdVisibilityErrorModal: React.lazy(() =>
+ import(
+ /* webpackChunkName: "ad-visibility-error-modal" */ 'Components/modal-manager/modals/ad-visibility-error-modal'
+ )
+ ),
BuySellModal: React.lazy(() =>
import(/* webpackChunkName: "buy-sell-modal" */ 'Components/modal-manager/modals/buy-sell-modal')
),
diff --git a/packages/p2p/src/stores/my-ads-store.js b/packages/p2p/src/stores/my-ads-store.js
index 573abcfe6c04..5cb2448f2824 100644
--- a/packages/p2p/src/stores/my-ads-store.js
+++ b/packages/p2p/src/stores/my-ads-store.js
@@ -234,8 +234,18 @@ export default class MyAdsStore extends BaseStore {
if (!response.p2p_advert_create.is_visible) {
this.setAdvertDetails(response.p2p_advert_create);
}
- if (this.advert_details?.visibility_status?.includes('advertiser_daily_limit')) {
- this.root_store.general_store.showModal({ key: 'AdExceedsDailyLimitModal', props: {} });
+ if (this.advert_details?.visibility_status?.includes(api_error_codes.AD_EXCEEDS_BALANCE)) {
+ this.root_store.general_store.showModal({
+ key: 'AdVisibilityErrorModal',
+ props: { error_code: api_error_codes.AD_EXCEEDS_BALANCE },
+ });
+ } else if (
+ this.advert_details?.visibility_status?.includes(api_error_codes.AD_EXCEEDS_DAILY_LIMIT)
+ ) {
+ this.root_store.general_store.showModal({
+ key: 'AdVisibilityErrorModal',
+ props: { error_code: api_error_codes.AD_EXCEEDS_DAILY_LIMIT },
+ });
}
this.setShowAdForm(false);
}
@@ -633,7 +643,6 @@ export default class MyAdsStore extends BaseStore {
offer_amount: [
v => !!v,
v => !isNaN(v),
- v => (values.type === buy_sell.SELL ? v <= general_store.advertiser_info.balance_available : !!v),
v =>
v > 0 &&
decimalValidator(v) &&
@@ -694,7 +703,6 @@ export default class MyAdsStore extends BaseStore {
const getOfferAmountMessages = field_name => [
localize('{{field_name}} is required', { field_name }),
localize('Enter a valid amount'),
- localize('Max available amount is {{value}}', { value: general_store.advertiser_info.balance_available }),
localize('Enter a valid amount'),
localize('{{field_name}} should not be below Min limit', { field_name }),
localize('{{field_name}} should not be below Max limit', { field_name }),