Ameerul /Bug 77339 When userA trying to block an advertiser is barred…

…, once userA is unbarred on trying to block advertiser temporary barred error model is displayed (#6591) * fixed issue when user is banneed and tries to block advertiser, and changed width for error modal * fixed checking if user is barred and changed error modal styling
binary-com · Sep 28, 2022 · af13c3a · af13c3a
1 parent 9f4bcc1
commit af13c3a
Show file tree

Hide file tree

Showing 5 changed files with 41 additions and 8 deletions.
diff --git a/packages/p2p/src/components/advertiser-page/advertiser-page.jsx b/packages/p2p/src/components/advertiser-page/advertiser-page.jsx
@@ -18,7 +18,7 @@ import AdvertiserPageDropdownMenu from './advertiser-page-dropdown-menu.jsx';
 import TradeBadge from '../trade-badge/trade-badge.jsx';
 import BlockUserOverlay from './block-user/block-user-overlay';
 import BlockUserModal from 'Components/block-user/block-user-modal';
-import ErrorModal from '../error-modal/error-modal.jsx';
+import ErrorModal from 'Components/error-modal/error-modal';
 import classNames from 'classnames';
 import './advertiser-page.scss';
 
@@ -80,12 +80,15 @@ const AdvertiserPage = () => {
             <RateChangeModal onMount={advertiser_page_store.setShowAdPopup} />
             <ErrorModal
                 error_message={general_store.block_unblock_user_error}
-                error_modal_title='Unable to block advertiser.'
+                error_modal_title='Unable to block advertiser'
                 has_close_icon={false}
                 is_error_modal_open={is_error_modal_open}
                 setIsErrorModalOpen={is_open => {
                     if (!is_open) buy_sell_store.hideAdvertiserPage();
+                    advertiser_page_store.onCancel();
+                    general_store.setBlockUnblockUserError('');
                 }}
+                small
             />
             <BlockUserModal
                 advertiser_name={name}

diff --git a/packages/p2p/src/components/error-modal/error-modal.jsx b/packages/p2p/src/components/error-modal/error-modal.jsx
@@ -3,11 +3,25 @@ import PropTypes from 'prop-types';
 import { observer } from 'mobx-react-lite';
 import { Button, Modal } from '@deriv/components';
 import { Localize } from 'Components/i18next';
+import './error-modal.scss';
 
-const ErrorModal = ({ error_message, error_modal_title, has_close_icon, is_error_modal_open, setIsErrorModalOpen }) => {
+const ErrorModal = ({
+    error_message,
+    error_modal_title,
+    has_close_icon,
+    is_error_modal_open,
+    setIsErrorModalOpen,
+    small,
+}) => {
     return (
-        <Modal has_close_icon={has_close_icon} is_open={is_error_modal_open} title={error_modal_title}>
-            <Modal.Body>{error_message}</Modal.Body>
+        <Modal
+            className='error-modal'
+            has_close_icon={has_close_icon}
+            is_open={is_error_modal_open}
+            small={small}
+            title={error_modal_title}
+        >
+            <Modal.Body className='error-modal__body'>{error_message}</Modal.Body>
             <Modal.Footer>
                 <Button large primary onClick={() => setIsErrorModalOpen(false)}>
                     <Localize i18n_default_text='Ok' />
@@ -23,6 +37,7 @@ ErrorModal.propTypes = {
     has_close_icon: PropTypes.bool,
     is_error_modal_open: PropTypes.bool,
     setIsErrorModalOpen: PropTypes.func,
+    small: PropTypes.bool,
 };
 
 export default observer(ErrorModal);
diff --git a/packages/p2p/src/components/error-modal/error-modal.scss b/packages/p2p/src/components/error-modal/error-modal.scss
@@ -0,0 +1,5 @@
+.error-modal {
+    &__body {
+        padding: 0 2.4rem;
+    }
+}
diff --git a/packages/p2p/src/components/my-profile/block-user/block-user-table/block-user-table.jsx b/packages/p2p/src/components/my-profile/block-user/block-user-table/block-user-table.jsx
@@ -1,4 +1,5 @@
 import React from 'react';
+import { reaction } from 'mobx';
 import { observer } from 'mobx-react-lite';
 import { InfiniteDataList, Loading, Table, Text } from '@deriv/components';
 import { localize } from 'Components/i18next';
@@ -16,14 +17,23 @@ const BlockUserTable = () => {
         my_profile_store.getBlockedAdvertisersList();
         my_profile_store.setSearchTerm('');
 
+        reaction(
+            () => general_store.is_barred,
+            () => {
+                if (!general_store.is_barred) general_store.setBlockUnblockUserError('');
+                my_profile_store.getBlockedAdvertisersList();
+                my_profile_store.setSearchTerm('');
+            }
+        );
+
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
 
     if (my_profile_store.is_loading) {
         return <Loading is_fullscreen={isMobile()} />;
     }
 
-    if (general_store.block_unblock_user_error) {
+    if (general_store.block_unblock_user_error && general_store.is_barred) {
         return <BlockUserTableError error_message={general_store.block_unblock_user_error} />;
     }
 

diff --git a/packages/p2p/src/components/my-profile/block-user/block-user.jsx b/packages/p2p/src/components/my-profile/block-user/block-user.jsx
@@ -10,7 +10,7 @@ import debounce from 'lodash.debounce';
 import { localize } from 'Components/i18next';
 
 const BlockUserList = observer(() => {
-    const { my_profile_store } = useStores();
+    const { general_store, my_profile_store } = useStores();
 
     const loadBlockedAdvertisers = debounce(search => {
         my_profile_store.setSearchTerm(search.trim());
@@ -32,7 +32,7 @@ const BlockUserList = observer(() => {
 
     return (
         <div className='block-user__list'>
-            {my_profile_store.blocked_advertisers_list.length > 0 && (
+            {my_profile_store.blocked_advertisers_list.length > 0 && !general_store.is_barred && (
                 <SearchBox onClear={onClear} onSearch={onSearch} placeholder={localize('Search')} />
             )}
             <BlockUserTable />