chore: fix comments

Consensys · Feb 4, 2025 · 6520e8e · 6520e8e
1 parent a362cf4
commit 6520e8e
Show file tree

Hide file tree

Showing 9 changed files with 41 additions and 110 deletions.
diff --git a/packages/wallet-ui/src/App.tsx b/packages/wallet-ui/src/App.tsx
@@ -97,10 +97,7 @@ function App() {
         >
           <DeployModal address={address} />
         </PopIn>
-        <Home
-          address={address}
-          addressIndex={currentAccount?.addressIndex || 0}
-        />
+        <Home />
         <PopIn isOpen={loading}>
           {loading && (
             <LoadingBackdrop>{loader.loadingMessage}</LoadingBackdrop>

diff --git a/packages/wallet-ui/src/components/pages/Home/Home.view.tsx b/packages/wallet-ui/src/components/pages/Home/Home.view.tsx
@@ -3,21 +3,20 @@ import { Header } from 'components/ui/organism/Header';
 import { SideBar } from 'components/ui/organism/SideBar';
 import { RightPart, Wrapper, NoTransactions } from './Home.style';
 import { useAppSelector } from 'hooks/redux';
-interface Props {
-  address: string;
-  addressIndex: number;
-}
+import { DUMMY_ADDRESS } from 'utils/constants';
 
-export const HomeView = ({ address, addressIndex }: Props) => {
+export const HomeView = () => {
   const { erc20TokenBalanceSelected, transactions } = useAppSelector(
     (state) => state.wallet,
   );
   const loader = useAppSelector((state) => state.UI.loader);
+  const currentAccount = useAppSelector((state) => state.wallet.currentAccount);
+  const address = currentAccount?.address ?? DUMMY_ADDRESS;
   const { upgradeModalVisible } = useAppSelector((state) => state.modals);
 
   return (
     <Wrapper>
-      <SideBar address={address} addressIndex={addressIndex} />
+      <SideBar />
       <RightPart>
         {!upgradeModalVisible &&
           Object.keys(erc20TokenBalanceSelected).length > 0 && (

diff --git a/...es/wallet-ui/src/components/ui/molecule/AccountSwitchModal/AccountSwitchModal.stories.tsx b/...es/wallet-ui/src/components/ui/molecule/AccountSwitchModal/AccountSwitchModal.stories.tsx
@@ -1,14 +1,11 @@
 import { Meta } from '@storybook/react';
 import { AccountSwitchModalView } from './AccountSwitchModal.view';
-import { Account } from 'types';
 
 export default {
   title: 'Molecule/AccountAddress',
   component: AccountSwitchModalView,
 } as Meta;
 
-const address =
-  '0x683ec5da50476f84a5d47e822cd4dd35ae3a63c6c1f0725bf28526290d1ee13';
 const wrapperStyle = {
   backgroundColor: 'white',
   height: '300px',
@@ -17,55 +14,20 @@ const wrapperStyle = {
   justifyContent: 'center',
 };
 
-const accounts = [
-  {
-    address: '0x123...abcd',
-    addressIndex: 0,
-  },
-  {
-    address: '0x456...efgh',
-    addressIndex: 1,
-  },
-  {
-    address: '0x789...ijkl',
-    addressIndex: 2,
-  },
-] as Account[];
-
 export const Default = () => (
   <div style={wrapperStyle}>
-    <AccountSwitchModalView
-      currentAddress={address}
-      accounts={accounts}
-    ></AccountSwitchModalView>
-  </div>
-);
-
-export const TooltipTop = () => (
-  <div style={wrapperStyle}>
-    <AccountSwitchModalView
-      currentAddress={address}
-      accounts={accounts}
-    ></AccountSwitchModalView>
+    <AccountSwitchModalView></AccountSwitchModalView>
   </div>
 );
 
 export const Full = () => (
   <div style={wrapperStyle}>
-    <AccountSwitchModalView
-      currentAddress={address}
-      accounts={accounts}
-      full
-    ></AccountSwitchModalView>
+    <AccountSwitchModalView full></AccountSwitchModalView>
   </div>
 );
 
 export const DarkerBackground = () => (
   <div style={{ ...wrapperStyle, backgroundColor: 'grey' }}>
-    <AccountSwitchModalView
-      currentAddress={address}
-      accounts={accounts}
-      full
-    ></AccountSwitchModalView>
+    <AccountSwitchModalView full></AccountSwitchModalView>
   </div>
 );
diff --git a/packages/wallet-ui/src/components/ui/molecule/AccountSwitchModal/AccountSwitchModal.view.tsx b/packages/wallet-ui/src/components/ui/molecule/AccountSwitchModal/AccountSwitchModal.view.tsx
@@ -17,25 +17,19 @@ import { theme } from 'theme/default';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { useAppSelector } from 'hooks/redux';
 import { useStarkNetSnap } from 'services';
-import { Account } from 'types';
+import { DUMMY_ADDRESS } from 'utils/constants';
 
 interface Props {
-  currentAddress: string;
-  accounts: Account[];
   full?: boolean;
   starkName?: string;
 }
 
-export const AccountSwitchModalView = ({
-  currentAddress,
-  accounts,
-  full,
-  starkName,
-}: Props) => {
+export const AccountSwitchModalView = ({ full, starkName }: Props) => {
   const networks = useAppSelector((state) => state.networks);
+  const { currentAccount, accounts } = useAppSelector((state) => state.wallet);
   const { switchAccount, addNewAccount } = useStarkNetSnap();
   const chainId = networks?.items[networks.activeNetwork]?.chainId;
-
+  const currentAddress = currentAccount?.address ?? DUMMY_ADDRESS;
   return (
     <Menu as="div" style={{ display: 'inline-block', position: 'relative' }}>
       <Menu.Button style={{ background: 'none', border: 'none' }}>

diff --git a/.../wallet-ui/src/components/ui/organism/AccountDetailsModal/AccountDetailsModal.stories.tsx b/.../wallet-ui/src/components/ui/organism/AccountDetailsModal/AccountDetailsModal.stories.tsx
@@ -8,13 +8,7 @@ export default {
   component: AccountDetailsModalView,
 } as Meta;
 
-const address =
-  '0x683ec5da50476f84a5d47e822cd4dd35ae3a63c6c1f0725bf28526290d1ee13';
-const addressIndex = 0;
-
-export const ContentOnly = () => (
-  <AccountDetailsModalView address={address} addressIndex={addressIndex} />
-);
+export const ContentOnly = () => <AccountDetailsModalView />;
 
 export const WithModal = () => {
   let [isOpen, setIsOpen] = useState(false);
@@ -27,10 +21,7 @@ export const WithModal = () => {
         showClose={false}
         style={{ backgroundColor: 'transparent' }}
       >
-        <AccountDetailsModalView
-          address={address}
-          addressIndex={addressIndex}
-        />
+        <AccountDetailsModalView />
       </PopIn>
     </>
   );

diff --git a/...ges/wallet-ui/src/components/ui/organism/AccountDetailsModal/AccountDetailsModal.view.tsx b/...ges/wallet-ui/src/components/ui/organism/AccountDetailsModal/AccountDetailsModal.view.tsx
@@ -12,16 +12,15 @@ import {
 import { openExplorerTab } from 'utils/utils';
 import { useAppSelector } from 'hooks/redux';
 import { useStarkNetSnap } from 'services';
+import { DUMMY_ADDRESS } from 'utils/constants';
 
-interface Props {
-  address: string;
-  addressIndex: number;
-}
-
-export const AccountDetailsModalView = ({ address, addressIndex }: Props) => {
+export const AccountDetailsModalView = () => {
   const networks = useAppSelector((state) => state.networks);
+  const currentAccount = useAppSelector((state) => state.wallet.currentAccount);
   const { getPrivateKeyFromAddress } = useStarkNetSnap();
   const chainId = networks?.items[networks.activeNetwork]?.chainId;
+  const address = currentAccount?.address ?? DUMMY_ADDRESS;
+  const addressIndex = currentAccount?.addressIndex ?? 0;
   return (
     <div>
       <AccountImageDiv>

diff --git a/packages/wallet-ui/src/components/ui/organism/AddTokenModal/AddTokenModal.view.tsx b/packages/wallet-ui/src/components/ui/organism/AddTokenModal/AddTokenModal.view.tsx
@@ -100,19 +100,21 @@ export const AddTokenModalView = ({ closeModal }: Props) => {
           enabled={enabled}
           onClick={async () => {
             try {
-              const newToken = await addErc20Token(
-                fields.address,
-                fields.name,
-                fields.symbol,
-                parseFloat(fields.decimal),
-                chainId,
-                currentAccount?.address || '0x',
-              );
-              if (newToken) {
-                setErc20TokenBalance(newToken);
-                toastr.success('Token added successfully');
+              if (currentAccount) {
+                const newToken = await addErc20Token(
+                  fields.address,
+                  fields.name,
+                  fields.symbol,
+                  parseFloat(fields.decimal),
+                  chainId,
+                  currentAccount.address,
+                );
+                if (newToken) {
+                  setErc20TokenBalance(newToken);
+                  toastr.success('Token added successfully');
+                }
+                closeModal();
               }
-              closeModal();
             } catch (err) {
               toastr.error('Error while adding token');
             }

diff --git a/packages/wallet-ui/src/components/ui/organism/SideBar/SideBar.stories.tsx b/packages/wallet-ui/src/components/ui/organism/SideBar/SideBar.stories.tsx
@@ -6,15 +6,10 @@ export default {
   component: SideBarView,
 } as Meta;
 
-const address =
-  '0x683ec5da50476f84a5d47e822cd4dd35ae3a63c6c1f0725bf28526290d1ee13';
-
-const addressIndex = 0;
-
 export const Default = () => {
   return (
     <div style={{ width: '33%' }}>
-      <SideBarView address={address} addressIndex={addressIndex} />
+      <SideBarView />
     </div>
   );
 };
diff --git a/packages/wallet-ui/src/components/ui/organism/SideBar/SideBar.view.tsx b/packages/wallet-ui/src/components/ui/organism/SideBar/SideBar.view.tsx
@@ -27,14 +27,9 @@ import { useStarkNetSnap } from 'services';
 import { DUMMY_ADDRESS } from 'utils/constants';
 import { PopperTooltip } from 'components/ui/molecule/PopperTooltip';
 
-interface Props {
-  address: string;
-  addressIndex: number;
-}
-
-export const SideBarView = ({ address, addressIndex }: Props) => {
+export const SideBarView = () => {
   const networks = useAppSelector((state) => state.networks);
-  const accounts = useAppSelector((state) => state.wallet.accounts);
+  const currentAccount = useAppSelector((state) => state.wallet.currentAccount);
   const chainId = networks?.items[networks.activeNetwork]?.chainId;
   const [listOverflow, setListOverflow] = useState(false);
   const [infoModalOpen, setInfoModalOpen] = useState(false);
@@ -43,7 +38,8 @@ export const SideBarView = ({ address, addressIndex }: Props) => {
   const [addTokenOpen, setAddTokenOpen] = useState(false);
   const { getStarkName } = useStarkNetSnap();
   const [starkName, setStarkName] = useState<string | undefined>(undefined);
-
+  const address = currentAccount?.address ?? DUMMY_ADDRESS;
+  const addressIndex = currentAccount?.addressIndex ?? 0;
   const ref = useRef<HTMLDivElement>();
 
   useEffect(() => {
@@ -76,7 +72,7 @@ export const SideBarView = ({ address, addressIndex }: Props) => {
         isOpen={accountDetailsOpen}
         setIsOpen={setAccountDetailsOpen}
       >
-        <AccountDetailsModal address={address} addressIndex={addressIndex} />
+        <AccountDetailsModal />
       </PopInStyled>
       <PopIn
         isOpen={infoModalOpen}
@@ -117,11 +113,7 @@ export const SideBarView = ({ address, addressIndex }: Props) => {
       <AccountLabel>Account {addressIndex + 1} </AccountLabel>
       <RowDiv>
         <InfoIcon onClick={() => setInfoModalOpen(true)}>i</InfoIcon>
-        <AccountSwitchModal
-          currentAddress={address}
-          starkName={starkName}
-          accounts={accounts.map((account) => account)}
-        />
+        <AccountSwitchModal starkName={starkName} />
         <PopperTooltip content="Copied!" closeTrigger="click">
           <CopyIcon
             onClick={async () => navigator.clipboard.writeText(address)}