From 75699f08a1c055cff3150e7674154770282c0df8 Mon Sep 17 00:00:00 2001 From: Ratik Jindal Date: Tue, 18 Jun 2024 02:34:31 +0530 Subject: [PATCH] remove wallet select modal (#2019) --- .../container.test.tsx | 10 ---- .../account-management-panel/container.tsx | 26 +--------- .../account-management-panel/index.test.tsx | 48 ++----------------- .../account-management-panel/index.tsx | 27 +---------- 4 files changed, 5 insertions(+), 106 deletions(-) diff --git a/src/components/messenger/user-profile/account-management-panel/container.test.tsx b/src/components/messenger/user-profile/account-management-panel/container.test.tsx index 71646a456..bfb942326 100644 --- a/src/components/messenger/user-profile/account-management-panel/container.test.tsx +++ b/src/components/messenger/user-profile/account-management-panel/container.test.tsx @@ -40,16 +40,6 @@ describe('Container', () => { }); }); - describe('isModalOpen', () => { - it('is true when wallet select modal is open', () => { - const props = subject({ - accountManagement: { isWalletSelectModalOpen: true } as AccountManagementState, - }); - - expect(props.isModalOpen).toEqual(true); - }); - }); - describe('currentUser', () => { test('currentUser', () => { const props = subject({ diff --git a/src/components/messenger/user-profile/account-management-panel/container.tsx b/src/components/messenger/user-profile/account-management-panel/container.tsx index 684dafc3f..82a1a812a 100644 --- a/src/components/messenger/user-profile/account-management-panel/container.tsx +++ b/src/components/messenger/user-profile/account-management-panel/container.tsx @@ -4,15 +4,7 @@ import { RootState } from '../../../../store/reducer'; import { connectContainer } from '../../../../store/redux-container'; import { AccountManagementPanel } from './index'; -import { Connectors } from '../../../../lib/web3'; -import { - addNewWallet, - openWalletSelectModal, - closeWalletSelectModal, - openAddEmailAccountModal, - closeAddEmailAccountModal, - Errors, -} from '../../../../store/account-management'; +import { openAddEmailAccountModal, closeAddEmailAccountModal, Errors } from '../../../../store/account-management'; import { currentUserSelector } from '../../../../store/authentication/selectors'; export interface PublicProperties { @@ -20,15 +12,11 @@ export interface PublicProperties { } export interface Properties extends PublicProperties { - isModalOpen: boolean; isAddEmailModalOpen: boolean; error: string; currentUser: any; canAddEmail: boolean; - addNewWallet: (payload: { connector: Connectors }) => void; - openWalletSelectModal: () => void; - closeWalletSelectModal: () => void; openAddEmailAccountModal: () => void; closeAddEmailAccountModal: () => void; } @@ -42,7 +30,6 @@ export class Container extends React.Component { return { error: Container.mapErrors(accountManagement.errors), - isModalOpen: accountManagement.isWalletSelectModalOpen, isAddEmailModalOpen: accountManagement.isAddEmailAccountModalOpen, currentUser: { userId: currentUser?.id, @@ -58,9 +45,6 @@ export class Container extends React.Component { static mapActions(_props: Properties): Partial { return { - addNewWallet, - openWalletSelectModal, - closeWalletSelectModal, openAddEmailAccountModal, closeAddEmailAccountModal, }; @@ -77,21 +61,13 @@ export class Container extends React.Component { return error; } - connectorSelected = async (connector) => { - this.props.addNewWallet({ connector }); - }; - render() { return ( this.props.openWalletSelectModal()} - onCloseModal={() => this.props.closeWalletSelectModal()} onOpenAddEmailModal={() => this.props.openAddEmailAccountModal()} onCloseAddEmailModal={() => this.props.closeAddEmailAccountModal()} onBack={this.props.onClose} diff --git a/src/components/messenger/user-profile/account-management-panel/index.test.tsx b/src/components/messenger/user-profile/account-management-panel/index.test.tsx index b0b1715fb..c1b5b1b9a 100644 --- a/src/components/messenger/user-profile/account-management-panel/index.test.tsx +++ b/src/components/messenger/user-profile/account-management-panel/index.test.tsx @@ -11,15 +11,11 @@ describe(AccountManagementPanel, () => { const subject = (props: Partial = {}) => { const allProps: Properties = { error: '', - isModalOpen: false, isAddEmailModalOpen: false, currentUser: {}, canAddEmail: false, onBack: () => {}, - onSelect: () => {}, - onOpenModal: () => {}, - onCloseModal: () => {}, onOpenAddEmailModal: () => {}, onCloseAddEmailModal: () => {}, ...props, @@ -37,44 +33,6 @@ describe(AccountManagementPanel, () => { expect(onBack).toHaveBeenCalled(); }); - it('renders wallet select modal if isModalOpen is true', () => { - const wrapper = subject({ isModalOpen: true }); - - expect(wrapper.find('Modal').at(0).prop('open')).toEqual(true); - }); - - it('does not render wallet select modal if isModalOpen is false', () => { - const wrapper = subject({ isModalOpen: false }); - - expect(wrapper.find('Modal').at(0).prop('open')).toEqual(false); - }); - - it('publishes onOpenModal event when modal is opened', () => { - const onOpenModal = jest.fn(); - const wrapper = subject({ onOpenModal, isModalOpen: false }); - - wrapper.find('Modal').at(0).simulate('openChange', true); - - expect(onOpenModal).toHaveBeenCalled(); - }); - - it('publishes onCloseModal event when modal is closed', () => { - const onCloseModal = jest.fn(); - const wrapper = subject({ onCloseModal, isModalOpen: true }); - - wrapper.find('Modal').at(0).simulate('openChange', false); - - expect(onCloseModal).toHaveBeenCalled(); - }); - - it('publishes onSelect event when wallet is selected', () => { - const onSelect = jest.fn(); - const wrapper = subject({ onSelect }); - - wrapper.find('WalletSelect').simulate('select', 'MetaMask'); - expect(onSelect).toHaveBeenCalledWith('MetaMask'); - }); - it('renders error alert if error is present', () => { const wrapper = subject({ error: 'An error occurred' }); @@ -176,14 +134,14 @@ describe(AccountManagementPanel, () => { it('renders add email modal if isAddEmailModalOpen is true', () => { const wrapper = subject({ isAddEmailModalOpen: true }); - expect(wrapper.find('Modal').at(1).prop('open')).toEqual(true); + expect(wrapper.find('Modal').prop('open')).toEqual(true); expect(wrapper.find(c('add-email-title')).text()).toEqual('Add Email'); }); it('does not render add email modal if isAddEmailModalOpen is false', () => { const wrapper = subject({ isAddEmailModalOpen: false }); - expect(wrapper.find('Modal').at(1).prop('open')).toEqual(false); + expect(wrapper.find('Modal').prop('open')).toEqual(false); }); it('publishes onOpenAddEmailModal when add email is clicked', () => { @@ -199,7 +157,7 @@ describe(AccountManagementPanel, () => { const onCloseAddEmailModal = jest.fn(); const wrapper = subject({ onCloseAddEmailModal, isAddEmailModalOpen: true }); - wrapper.find('Modal').at(1).simulate('openChange', false); + wrapper.find('Modal').simulate('openChange', false); expect(onCloseAddEmailModal).toHaveBeenCalled(); }); diff --git a/src/components/messenger/user-profile/account-management-panel/index.tsx b/src/components/messenger/user-profile/account-management-panel/index.tsx index f5b0ec574..38c33757f 100644 --- a/src/components/messenger/user-profile/account-management-panel/index.tsx +++ b/src/components/messenger/user-profile/account-management-panel/index.tsx @@ -7,7 +7,6 @@ import { Alert, Modal, IconButton } from '@zero-tech/zui/components'; import { IconPlus } from '@zero-tech/zui/icons'; import './styles.scss'; -import { WalletSelect } from '../../../wallet-select'; import { WalletListItem } from '../../../wallet-list-item'; import { CitizenListItem } from '../../../citizen-list-item'; import { IconXClose } from '@zero-tech/zui/icons'; @@ -16,18 +15,14 @@ import { CreateEmailAccountContainer } from '../../../../authentication/create-e const cn = bemClassName('account-management-panel'); export interface Properties { - isModalOpen: boolean; isAddEmailModalOpen: boolean; error: string; currentUser: any; canAddEmail: boolean; onBack: () => void; - onOpenModal: () => void; - onCloseModal: () => void; onOpenAddEmailModal: () => void; onCloseAddEmailModal: () => void; - onSelect: (connector: any) => void; } export class AccountManagementPanel extends React.Component { @@ -35,30 +30,11 @@ export class AccountManagementPanel extends React.Component { this.props.onBack(); }; - renderWalletSelectModal = () => { - return ( - { - isOpen ? this.props.onOpenModal() : this.props.onCloseModal(); - }} - > -
- -
-
- ); - }; - // note: hiding this for now renderAddNewWalletButton = () => { return (
-
@@ -169,7 +145,6 @@ export class AccountManagementPanel extends React.Component { )} - {this.renderWalletSelectModal()} {this.renderAddEmailAccountModal()} );