farrah/80906/feat: automate daily limit increase

packages/cashier/src/pages/p2p-cashier/p2p-cashier.tsx

@@ -22,13 +22,23 @@ const P2PCashier = observer(({ history, location }: TP2PCashierProps) => {
     const { notifications, client, ui, common } = useStore();
     const {
         addNotificationMessage,
+        client_notifications,
         filterNotificationMessages,
         refreshNotifications,
         removeNotificationByKey,
         removeNotificationMessage,
         setP2POrderProps,
     } = notifications;
-    const { balance, currency, local_currency_config, loginid, is_logging_in, is_virtual, residence } = client;
+    const {
+        balance,
+        currency,
+        local_currency_config,
+        loginid,
+        is_logging_in,
+        is_virtual,
+        residence,
+        setP2pAdvertiserInfo,
+    } = client;
     const { notification_messages_ui: Notifications, is_dark_mode_on, is_mobile, setCurrentFocus, current_focus } = ui;
     const { platform } = common;
     const { general_store } = useCashierStore();
@@ -122,7 +132,8 @@ const P2PCashier = observer(({ history, location }: TP2PCashierProps) => {
         <P2P
             addNotificationMessage={addNotificationMessage}
             balance={balance}
-            client={{ currency, local_currency_config, is_virtual, residence, loginid }}
+            client={{ currency, local_currency_config, is_virtual, residence, loginid, setP2pAdvertiserInfo }}
+            client_notifications={client_notifications}
             current_focus={current_focus}
             filterNotificationMessages={filterNotificationMessages}
             history={history}

packages/core/src/App/Constants/routes-config.js

@@ -287,6 +287,13 @@ const getModules = () => {
                     getTitle: () => localize('Deriv P2P'),
                     icon_component: 'IcDp2p',
                 },
+                {
+                    path: routes.cashier_p2p_profile,
+                    component: Cashier,
+                    getTitle: () => localize('Deriv P2P'),
+                    icon_component: 'IcDp2p',
+                    is_invisible: true,
+                },
                 {
                     path: routes.cashier_p2p_verification,
                     component: Cashier,

packages/core/src/App/Containers/NotificationsDialog/notifications-dialog.jsx

@@ -15,7 +15,7 @@ import {
 import { BinaryLink } from 'App/Components/Routes';
 import { connect } from 'Stores/connect';
 import { localize, Localize } from '@deriv/translations';
-import { isEmptyObject, isMobile, toTitleCase } from '@deriv/shared';
+import { isEmptyObject, isMobile, LocalStore, toTitleCase } from '@deriv/shared';
 import { EmptyNotification } from 'App/Components/Elements/Notifications/empty-notification.jsx';
 
 const NotificationsList = ({ notifications, toggleDialog }) => {
@@ -166,6 +166,7 @@ NotificationListWrapper.displayName = 'NotificationListWrapper';
 const NotificationsDialog = ({
     is_pre_appstore,
     is_visible,
+    loginid,
     notifications,
     toggleDialog,
     removeNotificationMessage,
@@ -182,6 +183,11 @@ const NotificationsDialog = ({
     };
 
     const clearNotifications = () => {
+        const p2p_settings = LocalStore.getObject('p2p_settings');
+
+        p2p_settings[loginid].is_notifications_visible = false;
+        LocalStore.setObject('p2p_settings', p2p_settings);
+
         return notifications.map(item => {
             removeNotificationMessageByKey(item.key);
             removeNotificationMessage({
@@ -243,6 +249,7 @@ const NotificationsDialog = ({
 NotificationsDialog.propTypes = {
     is_pre_appstore: PropTypes.bool,
     is_visible: PropTypes.bool,
+    loginid: PropTypes.string,
     notifications: PropTypes.array,
     toggleDialog: PropTypes.func,
     removeNotificationMessage: PropTypes.func,
@@ -254,6 +261,7 @@ NotificationsDialog.propTypes = {
 export default connect(({ common, client, notifications }) => ({
     app_routing_history: common.app_routing_history,
     is_pre_appstore: client.is_pre_appstore,
+    loginid: client.loginid,
     notifications: notifications.notifications,
     removeNotificationByKey: notifications.removeNotificationByKey,
     removeNotificationMessage: notifications.removeNotificationMessage,

packages/core/src/App/Containers/app-notification-messages.jsx

@@ -117,6 +117,7 @@ const AppNotificationMessages = ({
                   'close_mx_mlt_account',
                   'trustpilot',
                   'close_uk_account',
+                  'p2p_daily_limit_increase',
                   'document_needs_action',
                   'identity',
                   'poi_name_mismatch',
@@ -147,7 +148,9 @@ const AppNotificationMessages = ({
     const notifications_limit = isMobile() ? max_display_notifications_mobile : max_display_notifications;
     //TODO (yauheni-kryzhyk): showing pop-up only for specific messages. the rest of notifications are hidden. this logic should be changed in the upcoming new pop-up notifications implementation
     const filtered_excluded_notifications = notifications.filter(message =>
-        message.key.includes('svg') ? message : excluded_notifications.includes(message.key)
+        message.key.includes('svg') || message.key.includes('p2p_daily_limit_increase')
+            ? message
+            : excluded_notifications.includes(message.key)
     );
     const notifications_sublist = filtered_excluded_notifications.slice(0, notifications_limit);
 

packages/core/src/Stores/client-store.js

@@ -147,6 +147,7 @@ export default class ClientStore extends BaseStore {
     is_mt5_account_list_updated = false;
 
     prev_real_account_loginid = '';
+    p2p_advertiser_info = {};
     prev_account_type = 'demo';
 
     constructor(root_store) {
@@ -210,6 +211,7 @@ export default class ClientStore extends BaseStore {
             dxtrade_trading_servers: observable,
             is_cfd_poi_completed: observable,
             prev_real_account_loginid: observable,
+            p2p_advertiser_info: observable,
             prev_account_type: observable,
             balance: computed,
             account_open_date: computed,
@@ -387,6 +389,7 @@ export default class ClientStore extends BaseStore {
             isEuropeCountry: action.bound,
             setPrevRealAccountLoginid: action.bound,
             setIsPreAppStore: action.bound,
+            setP2pAdvertiserInfo: action.bound,
             setPrevAccountType: action.bound,
         });
 
@@ -1653,6 +1656,8 @@ export default class ClientStore extends BaseStore {
 
             await WS.authorized.cache.landingCompany(this.residence).then(this.responseLandingCompany);
             if (!this.is_virtual) await this.getLimits();
+
+            await WS.p2pAdvertiserInfo().then(this.setP2pAdvertiserInfo);
         } else {
             this.resetMt5AccountListPopulation();
         }
@@ -1709,6 +1714,10 @@ export default class ClientStore extends BaseStore {
         this.setRealityCheck();
     }
 
+    setP2pAdvertiserInfo(response) {
+        this.p2p_advertiser_info = response.p2p_advertiser_info;
+    }
+
     setStandpoint(landing_companies) {
         if (!landing_companies) return;
         const { gaming_company, financial_company } = landing_companies;

packages/core/src/Stores/notification-store.js

@@ -3,6 +3,7 @@ import { StaticUrl } from '@deriv/components';
 import {
     daysSince,
     formatDate,
+    formatMoney,
     getPathname,
     getPlatformSettings,
     getStaticUrl,
@@ -97,6 +98,7 @@ export default class NotificationStore extends BaseStore {
                 root_store.client.is_eu,
                 root_store.client.has_enabled_two_fa,
                 this.p2p_order_props.order_id,
+                root_store.client.p2p_advertiser_info,
             ],
             async () => {
                 if (
@@ -175,7 +177,11 @@ export default class NotificationStore extends BaseStore {
                 const sortFn = isMobile() ? sortNotificationsMobile : sortNotifications;
                 this.notification_messages = [...this.notification_messages, notification].sort(sortFn);
 
-                if (notification.key.includes('svg') || !excluded_notifications.includes(notification.key)) {
+                if (
+                    notification.key.includes('svg') ||
+                    notification.key === 'p2p_daily_limit_increase' ||
+                    !excluded_notifications.includes(notification.key)
+                ) {
                     this.updateNotifications(this.notification_messages);
                 }
             }
@@ -242,15 +248,19 @@ export default class NotificationStore extends BaseStore {
     checkNotificationMessages() {
         const notifications_list = LocalStore.getObject('notification_messages');
         const { loginid } = this.root_store.client;
-        const refined_list = Object.values(notifications_list)
-            ? Object.values(notifications_list)
-            : Object.values(notifications_list?.[loginid]);
-
-        if (refined_list?.length) {
-            refined_list?.map(refined => {
-                refined.map(r => {
-                    this.removeNotificationByKey({ key: r });
-                });
+        const refined_list = notifications_list[loginid] ? Object.values(notifications_list[loginid]) : [];
+        const p2p_settings = LocalStore.getObject('p2p_settings');
+        const is_p2p_notifications_visible = p2p_settings[loginid].is_notifications_visible;
+
+        if (refined_list.length) {
+            refined_list.map(refined => {
+                if (refined === 'p2p_daily_limit_increase') {
+                    if (is_p2p_notifications_visible === false) {
+                        this.removeNotificationByKey({ key: refined });
+                    }
+                } else {
+                    this.removeNotificationByKey({ key: refined });
+                }
             });
         }
     }
@@ -279,8 +289,11 @@ export default class NotificationStore extends BaseStore {
             is_financial_information_incomplete,
             has_restricted_mt5_account,
             has_mt5_account_with_rejected_poa,
+            p2p_advertiser_info,
         } = this.root_store.client;
         const { is_p2p_visible } = this.root_store.modules.cashier.general_store;
+        const { upgradable_daily_limits } = p2p_advertiser_info || {};
+        const { max_daily_buy, max_daily_sell } = upgradable_daily_limits || {};
         const { is_10k_withdrawal_limit_reached } = this.root_store.modules.cashier.withdraw;
         const { current_language, selected_contract_type } = this.root_store.common;
         const malta_account = landing_company_shortcode === 'maltainvest';
@@ -511,6 +524,15 @@ export default class NotificationStore extends BaseStore {
                                 this.showCompletedOrderNotification(client_details.name, id);
                         }
                     });
+
+                    if (upgradable_daily_limits)
+                        this.addNotificationMessage(
+                            this.client_notifications.p2p_daily_limit_increase(
+                                client.currency,
+                                max_daily_buy,
+                                max_daily_sell
+                            )
+                        );
                 } else {
                     this.removeNotificationMessageByKey({ key: this.client_notifications.dp2p.key });
                 }
@@ -847,6 +869,43 @@ export default class NotificationStore extends BaseStore {
                 },
                 type: 'danger',
             },
+            p2p_daily_limit_increase: (currency, max_daily_buy, max_daily_sell) => {
+                return {
+                    action:
+                        routes.cashier_p2p === window.location.pathname
+                            ? {
+                                  onClick: () => {
+                                      this.p2p_order_props.redirectTo('my_profile');
+                                      if (this.is_notifications_visible) this.toggleNotificationsModal();
+
+                                      this.removeNotificationMessage({
+                                          key: 'p2p_daily_limit_increase',
+                                          should_show_again: false,
+                                      });
+                                  },
+                                  text: localize('Yes, increase my limits'),
+                              }
+                            : {
+                                  route: routes.cashier_p2p_profile,
+                                  text: localize('Yes, increase my limits'),
+                              },
+                    header: <Localize i18n_default_text='Enjoy higher daily limits' />,
+                    key: 'p2p_daily_limit_increase',
+                    message: (
+                        <Localize
+                            i18n_default_text='Would you like to increase your daily limits to {{max_daily_buy}} {{currency}} (buy) and {{max_daily_sell}} {{currency}} (sell)?'
+                            values={{
+                                currency,
+                                max_daily_buy: formatMoney(client_data.currency, max_daily_buy, true),
+                                max_daily_sell: formatMoney(client_data.currency, max_daily_sell, true),
+                            }}
+                        />
+                    ),
+                    platform: 'P2P',
+                    should_show_again: false,
+                    type: 'announce',
+                };
+            },
             deriv_go: {
                 key: 'deriv_go',
                 message: (
@@ -1431,7 +1490,9 @@ export default class NotificationStore extends BaseStore {
 
     updateNotifications(notifications_array) {
         this.notifications = notifications_array.filter(message =>
-            message.key.includes('svg') ? message : !excluded_notifications.includes(message.key)
+            message.key.includes('svg') || message.key === 'p2p_daily_limit_increase'
+                ? message
+                : !excluded_notifications.includes(message.key)
         );
     }
 

packages/p2p/src/components/app.jsx

@@ -13,6 +13,7 @@ import './app.scss';
 
 const App = props => {
     const { general_store, order_store } = useStores();
+    const [should_show_profile, setShouldShowProfile] = React.useState(false);
     const {
         balance,
         className,
@@ -38,6 +39,11 @@ const App = props => {
             history.push(routes.cashier_p2p);
         }
 
+        if (/\/profile$/.test(history?.location.pathname)) {
+            history.push(routes.cashier_p2p);
+            setShouldShowProfile(true);
+        }
+
         ServerTime.init(server_time);
 
         // force safari refresh on back/forward
@@ -63,12 +69,15 @@ const App = props => {
         setLanguage(lang);
     }, [lang]);
 
+    React.useEffect(() => {
+        if (should_show_profile) general_store.redirectTo('my_profile');
+    }, [should_show_profile]);
+
     React.useEffect(() => {
         if (order_id) {
             general_store.redirectTo('orders');
             order_store.setOrderId(order_id);
         }
-
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, [order_id]);