From c8d1a374488eb66e7bf505ebd78a623ea5912248 Mon Sep 17 00:00:00 2001
From: iris salcedo <iris.salcedo@lightcurve.io>
Date: Mon, 25 Oct 2021 16:41:51 +0200
Subject: [PATCH 1/4] Add condition to register delegate link

---
 .../wallet/overview/balanceInfo/index.js      | 131 ++++++++++--------
 src/store/selectors.js                        |   6 +-
 2 files changed, 78 insertions(+), 59 deletions(-)

diff --git a/src/components/screens/wallet/overview/balanceInfo/index.js b/src/components/screens/wallet/overview/balanceInfo/index.js
index 441bca1cb2..b6292c9697 100644
--- a/src/components/screens/wallet/overview/balanceInfo/index.js
+++ b/src/components/screens/wallet/overview/balanceInfo/index.js
@@ -2,6 +2,7 @@ import React from 'react';
 import { withTranslation } from 'react-i18next';
 import { useSelector } from 'react-redux';
 
+import { selectLSKAddress } from '@store/selectors';
 import { tokenMap } from '@constants';
 import { fromRawLsk } from '@utils/lsk';
 import { PrimaryButton, SecondaryButton } from '@toolbox/buttons';
@@ -15,10 +16,11 @@ import SignInTooltipWrapper from '@shared/signInTooltipWrapper';
 import LockedBalanceLink from './unlocking';
 import styles from './balanceInfo.css';
 
-const BalanceInfo = ({
-  t, activeToken, balance, isWalletRoute, address, username,
+const ButtonsWrapper = ({
+  username, address, t, isWalletRoute, activeToken,
 }) => {
   const vote = useSelector(state => state.voting[address]);
+  const lskAddress = useSelector(selectLSKAddress);
   const initialValue = isWalletRoute
     ? {}
     : { recipient: address };
@@ -30,62 +32,77 @@ const BalanceInfo = ({
     : t('Send {{token}} here', { token: activeToken });
 
   return (
-    <Box className={`${styles.wrapper}`}>
-      <BoxContent className={styles.content}>
-        <h2 className={styles.title}>{t('Balance')}</h2>
-        <div className={styles.valuesRow}>
-          <DiscreetMode shouldEvaluateForOtherAccounts>
-            <div className={`${styles.cryptoValue} balance-value`}>
-              <LiskAmount val={balance} token={activeToken} />
-              <Converter
-                className={styles.fiatValue}
-                value={fromRawLsk(balance)}
-                error=""
-              />
-
-            </div>
-            {
-              activeToken === tokenMap.LSK.key && isWalletRoute ? (
-                <LockedBalanceLink activeToken={activeToken} isWalletRoute={isWalletRoute} />
-              ) : null
-            }
-          </DiscreetMode>
-        </div>
-        <SignInTooltipWrapper position="bottom">
-          <div className={styles.actionRow}>
-            {
-              username ? (
-                <DialogLink component="editVote" className={`${styles.button} add-vote`}>
-                  <SecondaryButton
-                    className={`${styles.voteButton} open-add-vote-dialog`}
-                    size="m"
-                  >
-                    {voteButtonTitle}
-                  </SecondaryButton>
-                </DialogLink>
-              ) : (
-                <DialogLink
-                  className={`${styles.registerDelegate} register-delegate`}
-                  component="registerDelegate"
-                >
-                  {t('Register delegate')}
-                </DialogLink>
-              )
-            }
-            <DialogLink component="send" className={`${styles.button} tx-send-bt`} data={initialValue}>
-              <PrimaryButton
-                className={`${styles.sendButton} ${styles[activeToken]} open-send-dialog`}
-                size="m"
-              >
-                {sendTitle}
-              </PrimaryButton>
-            </DialogLink>
-          </div>
-        </SignInTooltipWrapper>
-
-      </BoxContent>
-    </Box>
+    <>
+      {
+        username && (
+          <DialogLink component="editVote" className={`${styles.button} add-vote`}>
+            <SecondaryButton
+              className={`${styles.voteButton} open-add-vote-dialog`}
+              size="m"
+            >
+              {voteButtonTitle}
+            </SecondaryButton>
+          </DialogLink>
+        )
+      }
+      {
+        (!username && lskAddress === address) && (
+          <DialogLink
+            className={`${styles.registerDelegate} register-delegate`}
+            component="registerDelegate"
+          >
+            {t('Register delegate')}
+          </DialogLink>
+        )
+      }
+      <DialogLink component="send" className={`${styles.button} tx-send-bt`} data={initialValue}>
+        <PrimaryButton
+          className={`${styles.sendButton} ${styles[activeToken]} open-send-dialog`}
+          size="m"
+        >
+          {sendTitle}
+        </PrimaryButton>
+      </DialogLink>
+    </>
   );
 };
 
+const BalanceInfo = ({
+  t, activeToken, balance, isWalletRoute, address, username,
+}) => (
+  <Box className={`${styles.wrapper}`}>
+    <BoxContent className={styles.content}>
+      <h2 className={styles.title}>{t('Balance')}</h2>
+      <div className={styles.valuesRow}>
+        <DiscreetMode shouldEvaluateForOtherAccounts>
+          <div className={`${styles.cryptoValue} balance-value`}>
+            <LiskAmount val={balance} token={activeToken} />
+            <Converter
+              className={styles.fiatValue}
+              value={fromRawLsk(balance)}
+              error=""
+            />
+          </div>
+          {
+            activeToken === tokenMap.LSK.key && isWalletRoute ? (
+              <LockedBalanceLink activeToken={activeToken} isWalletRoute={isWalletRoute} />
+            ) : null
+          }
+        </DiscreetMode>
+      </div>
+      <SignInTooltipWrapper position="bottom">
+        <div className={styles.actionRow}>
+          <ButtonsWrapper
+            address={address}
+            username={username}
+            t={t}
+            isWalletRoute={isWalletRoute}
+            activeToken={activeToken}
+          />
+        </div>
+      </SignInTooltipWrapper>
+    </BoxContent>
+  </Box>
+);
+
 export default withTranslation()(BalanceInfo);
diff --git a/src/store/selectors.js b/src/store/selectors.js
index f5d53f991c..72853f7061 100644
--- a/src/store/selectors.js
+++ b/src/store/selectors.js
@@ -1,8 +1,10 @@
 const selectAccount = state => state.account;
 const selectActiveToken = state => state.settings.token.active;
 const selectAddress = state => state.account.info[state.settings.token.active].address;
-const selectLSKAddress = state => state.account.info.LSK.address;
-const selectBTCAddress = state => state.account.info.BTC.address;
+const selectLSKAddress = state =>
+  (state.account.info ? state.account.info.LSK.summary.address : undefined);
+const selectBTCAddress = state =>
+  (state.account.info ? state.account.info.BTC.summary.address : undefined);
 const selectPublicKey = state => state.account.info[state.settings.token.active].publicKey;
 const selectTransactions = state => state.transactions;
 const selectActiveTokenAccount = state => state.account.info[state.settings.token.active];

From 882c433e743159bfa066a6ddb9c1ddaf9a417294 Mon Sep 17 00:00:00 2001
From: iris salcedo <iris.salcedo@lightcurve.io>
Date: Tue, 26 Oct 2021 14:37:40 +0200
Subject: [PATCH 2/4] Add unit test

---
 .../overview/balanceInfo/buttonsWrapper.js    |  76 +++++++++++
 .../balanceInfo/buttonsWrapper.test.js        | 126 ++++++++++++++++++
 .../balanceInfo/emptyBalanceTooltipWrapper.js |   2 +-
 .../wallet/overview/balanceInfo/index.js      |  73 +---------
 4 files changed, 204 insertions(+), 73 deletions(-)
 create mode 100644 src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.js
 create mode 100644 src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js

diff --git a/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.js b/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.js
new file mode 100644
index 0000000000..5827564148
--- /dev/null
+++ b/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.js
@@ -0,0 +1,76 @@
+import React from 'react';
+import { withTranslation } from 'react-i18next';
+import { useSelector } from 'react-redux';
+import { PrimaryButton, SecondaryButton, TertiaryButton } from '@toolbox/buttons';
+import DialogLink from '@toolbox/dialog/link';
+import SignInTooltipWrapper from '@shared/signInTooltipWrapper';
+import { selectAccountBalance, selectLSKAddress } from '@store/selectors';
+import EmptyBalanceTooltipWrapper from './emptyBalanceTooltipWrapper';
+import styles from './balanceInfo.css';
+
+const ButtonsWrapper = ({
+  username, address, t, isWalletRoute, activeToken,
+}) => {
+  const hostBalance = useSelector(selectAccountBalance);
+  const disableButtons = hostBalance === 0;
+  const vote = useSelector(state => state.voting[address]);
+  const lskAddress = useSelector(selectLSKAddress);
+  const initialValue = isWalletRoute
+    ? {}
+    : { recipient: address };
+
+  const voteButtonTitle = vote ? t('Edit vote') : t('Add to votes');
+
+  const sendTitle = isWalletRoute
+    ? t('Send {{token}}', { token: activeToken })
+    : t('Send {{token}} here', { token: activeToken });
+
+  return (
+    <SignInTooltipWrapper position="bottom">
+      <EmptyBalanceTooltipWrapper hostBalance={hostBalance}>
+        <div className={styles.actionRow}>
+          {
+            username && (
+              <DialogLink component="editVote" className={`${styles.button} add-vote`}>
+                <SecondaryButton
+                  className={`${styles.voteButton} open-add-vote-dialog`}
+                  size="m"
+                  disabled={disableButtons}
+                >
+                  {voteButtonTitle}
+                </SecondaryButton>
+              </DialogLink>
+            )
+          }
+          {
+            (!username && lskAddress === address) && (
+              <DialogLink
+                className={styles.registerDelegate}
+                component="registerDelegate"
+              >
+                <TertiaryButton
+                  className="register-delegate"
+                  size="m"
+                  disabled={disableButtons}
+                >
+                  {t('Register delegate')}
+                </TertiaryButton>
+              </DialogLink>
+            )
+          }
+          <DialogLink component="send" className={`${styles.button} tx-send-bt`} data={initialValue}>
+            <PrimaryButton
+              className={`${styles.sendButton} ${styles[activeToken]} open-send-dialog`}
+              size="m"
+              disabled={disableButtons}
+            >
+              {sendTitle}
+            </PrimaryButton>
+          </DialogLink>
+        </div>
+      </EmptyBalanceTooltipWrapper>
+    </SignInTooltipWrapper>
+  );
+};
+
+export default withTranslation()(ButtonsWrapper);
diff --git a/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js b/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js
new file mode 100644
index 0000000000..a3f5421d26
--- /dev/null
+++ b/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js
@@ -0,0 +1,126 @@
+import { mountWithRouterAndStore } from '@utils/testHelpers';
+import { tokenMap } from '@constants';
+import ButtonsWrapper from './buttonsWrapper';
+import styles from './index.css';
+
+describe('Reclaim balance screen', () => {
+  const hostAddress = 'lskmjr8hrnhzc6j653eto5fbh2p3kwdpa9ccdnhk6';
+  const explorerAddress = 'lskc7ofju4nvnshg6349otmcssme9q87wrpf8umws';
+  let wrapper;
+  const props = {
+    username: undefined,
+    address: hostAddress,
+    t: t => t,
+    isWalletRoute: true,
+    activeToken: tokenMap.LSK.key,
+  };
+  const noBalanceAccount = {
+    summary: {
+      address: hostAddress,
+      balance: 0,
+    },
+  };
+  const balanceAccount = {
+    summary: {
+      address: hostAddress,
+      balance: 100000,
+    },
+  };
+  const state = {
+    account: {
+      passphrase: 'test',
+      info: {
+        LSK: { },
+      },
+    },
+    settings: { token: { active: tokenMap.LSK.key } },
+  };
+
+  it('Should display register delegate button and send', () => {
+    wrapper = mountWithRouterAndStore(
+      ButtonsWrapper,
+      props,
+      {},
+      { ...state, account: { info: { LSK: balanceAccount } } },
+    );
+    const html = wrapper.html();
+
+    expect(html).toContain('open-send-dialog');
+    expect(html).toContain('register-delegate');
+    expect(html).not.toContain('open-add-vote-dialog');
+  });
+
+  it('Should not display register delegate button', () => {
+    wrapper = mountWithRouterAndStore(
+      ButtonsWrapper,
+      { ...props, activeToken: tokenMap.BTC.key, address: 'mnrutC4CgQhMos4f8HWYRy8rKQ3UisGwYJ' },
+      {},
+      { ...state, account: { info: { LSK: balanceAccount } } },
+    );
+    let html = wrapper.html();
+
+    expect(html).toContain('open-send-dialog');
+    expect(html).not.toContain('register-delegate');
+    expect(html).not.toContain('open-add-vote-dialog');
+
+    wrapper = mountWithRouterAndStore(
+      ButtonsWrapper,
+      { ...props, address: explorerAddress },
+      {},
+      { ...state, account: { info: { LSK: balanceAccount } } },
+    );
+    html = wrapper.html();
+
+    expect(html).toContain('open-send-dialog');
+    expect(html).not.toContain('register-delegate');
+    expect(html).not.toContain('open-add-vote-dialog');
+  });
+
+  it('Should display add/edit vote correctly', () => {
+    wrapper = mountWithRouterAndStore(
+      ButtonsWrapper,
+      { ...props, username: 'delegate' },
+      {},
+      { ...state, account: { info: { LSK: balanceAccount } } },
+    );
+    let html = wrapper.html();
+
+    expect(html).toContain('open-send-dialog');
+    expect(html).not.toContain('register-delegate');
+    expect(html).toContain('open-add-vote-dialog');
+    expect(html).toContain('Add to votes');
+    expect(html).not.toContain('Edit vote');
+
+    wrapper = mountWithRouterAndStore(
+      ButtonsWrapper,
+      { ...props, username: 'delegate' },
+      {},
+      {
+        ...state,
+        account: { info: { LSK: balanceAccount } },
+        voting: {
+          [balanceAccount.summary.address]: {},
+        },
+      },
+    );
+    html = wrapper.html();
+
+    expect(html).toContain('Edit vote');
+    expect(html).not.toContain('Add to votes');
+  });
+
+  it('Should disable buttons', () => {
+    wrapper = mountWithRouterAndStore(
+      ButtonsWrapper,
+      props,
+      {},
+      { ...state, account: { info: { LSK: noBalanceAccount } } },
+    );
+    const html = wrapper.html();
+
+    expect(html).toContain('empty-balance-tooltip-wrapper');
+    expect(html).toContain('emptyBalanceTooltipChild disabled');
+    expect(wrapper.find('button.open-send-dialog')).toBeDisabled();
+    expect(wrapper.find('button.register-delegate')).toBeDisabled();
+  });
+});
diff --git a/src/components/screens/wallet/overview/balanceInfo/emptyBalanceTooltipWrapper.js b/src/components/screens/wallet/overview/balanceInfo/emptyBalanceTooltipWrapper.js
index 319d00a563..6121df67fd 100644
--- a/src/components/screens/wallet/overview/balanceInfo/emptyBalanceTooltipWrapper.js
+++ b/src/components/screens/wallet/overview/balanceInfo/emptyBalanceTooltipWrapper.js
@@ -27,7 +27,7 @@ const EmptyBalanceTooltipWrapper = ({
   return (hostBalance === 0
     ? (
       <Tooltip
-        className={styles.emptyBalanceTooltipWrapper}
+        className={`${styles.emptyBalanceTooltipWrapper} empty-balance-tooltip-wrapper`}
         position="bottom left"
         content={React.cloneElement(children, { className: `${children.props.className} ${styles.emptyBalanceTooltipChild} disabled` })}
       >
diff --git a/src/components/screens/wallet/overview/balanceInfo/index.js b/src/components/screens/wallet/overview/balanceInfo/index.js
index 8b7db0e51f..d319d44b06 100644
--- a/src/components/screens/wallet/overview/balanceInfo/index.js
+++ b/src/components/screens/wallet/overview/balanceInfo/index.js
@@ -1,86 +1,16 @@
 import React from 'react';
 import { withTranslation } from 'react-i18next';
-import { useSelector } from 'react-redux';
-
 import { tokenMap } from '@constants';
 import { fromRawLsk } from '@utils/lsk';
-import { PrimaryButton, SecondaryButton, TertiaryButton } from '@toolbox/buttons';
 import Box from '@toolbox/box';
 import BoxContent from '@toolbox/box/content';
-import DialogLink from '@toolbox/dialog/link';
 import LiskAmount from '@shared/liskAmount';
 import DiscreetMode from '@shared/discreetMode';
 import Converter from '@shared/converter';
-import SignInTooltipWrapper from '@shared/signInTooltipWrapper';
-import { selectAccountBalance, selectLSKAddress } from '@store/selectors';
 import LockedBalanceLink from './unlocking';
-import EmptyBalanceTooltipWrapper from './emptyBalanceTooltipWrapper';
+import ButtonsWrapper from './buttonsWrapper';
 import styles from './balanceInfo.css';
 
-const ButtonsWrapper = ({
-  username, address, t, isWalletRoute, activeToken,
-}) => {
-  const hostBalance = useSelector(selectAccountBalance);
-  const disableButtons = hostBalance === 0;
-  const vote = useSelector(state => state.voting[address]);
-  const lskAddress = useSelector(selectLSKAddress);
-  const initialValue = isWalletRoute
-    ? {}
-    : { recipient: address };
-
-  const voteButtonTitle = vote ? t('Edit vote') : t('Add to votes');
-
-  const sendTitle = isWalletRoute
-    ? t('Send {{token}}', { token: activeToken })
-    : t('Send {{token}} here', { token: activeToken });
-
-  return (
-    <SignInTooltipWrapper position="bottom">
-      <EmptyBalanceTooltipWrapper hostBalance={hostBalance}>
-        <div className={styles.actionRow}>
-          {
-            username && (
-              <DialogLink component="editVote" className={`${styles.button} add-vote`}>
-                <SecondaryButton
-                  className={`${styles.voteButton} open-add-vote-dialog`}
-                  size="m"
-                  disabled={disableButtons}
-                >
-                  {voteButtonTitle}
-                </SecondaryButton>
-              </DialogLink>
-            )
-          }
-          {
-            (!username && lskAddress === address) && (
-              <DialogLink
-                className={`${styles.registerDelegate} register-delegate`}
-                component="registerDelegate"
-              >
-                <TertiaryButton
-                  size="m"
-                  disabled={disableButtons}
-                >
-                  {t('Register delegate')}
-                </TertiaryButton>
-              </DialogLink>
-            )
-          }
-          <DialogLink component="send" className={`${styles.button} tx-send-bt`} data={initialValue}>
-            <PrimaryButton
-              className={`${styles.sendButton} ${styles[activeToken]} open-send-dialog`}
-              size="m"
-              disabled={disableButtons}
-            >
-              {sendTitle}
-            </PrimaryButton>
-          </DialogLink>
-        </div>
-      </EmptyBalanceTooltipWrapper>
-    </SignInTooltipWrapper>
-  );
-};
-
 const BalanceInfo = ({
   t, activeToken, balance, isWalletRoute, address, username,
 }) => (
@@ -107,7 +37,6 @@ const BalanceInfo = ({
       <ButtonsWrapper
         address={address}
         username={username}
-        t={t}
         isWalletRoute={isWalletRoute}
         activeToken={activeToken}
       />

From 794581b9b2061b8ac919a2f3929f672bcc5e86c8 Mon Sep 17 00:00:00 2001
From: iris salcedo <iris.salcedo@lightcurve.io>
Date: Tue, 26 Oct 2021 14:39:08 +0200
Subject: [PATCH 3/4] Remove import

---
 .../screens/wallet/overview/balanceInfo/buttonsWrapper.test.js   | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js b/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js
index a3f5421d26..78cc4aa20c 100644
--- a/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js
+++ b/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js
@@ -1,7 +1,6 @@
 import { mountWithRouterAndStore } from '@utils/testHelpers';
 import { tokenMap } from '@constants';
 import ButtonsWrapper from './buttonsWrapper';
-import styles from './index.css';
 
 describe('Reclaim balance screen', () => {
   const hostAddress = 'lskmjr8hrnhzc6j653eto5fbh2p3kwdpa9ccdnhk6';

From 8b7be7c7ac3f65e31da4c1e1ac0720ef24d4295b Mon Sep 17 00:00:00 2001
From: iris salcedo <iris.salcedo@lightcurve.io>
Date: Tue, 26 Oct 2021 15:30:39 +0200
Subject: [PATCH 4/4] Rename ButtonWrapper to ActionBar

---
 .../{buttonsWrapper.js => actionBar.js}            |  4 ++--
 .../{buttonsWrapper.test.js => actionBar.test.js}  | 14 +++++++-------
 .../screens/wallet/overview/balanceInfo/index.js   |  4 ++--
 3 files changed, 11 insertions(+), 11 deletions(-)
 rename src/components/screens/wallet/overview/balanceInfo/{buttonsWrapper.js => actionBar.js} (97%)
 rename src/components/screens/wallet/overview/balanceInfo/{buttonsWrapper.test.js => actionBar.test.js} (94%)

diff --git a/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.js b/src/components/screens/wallet/overview/balanceInfo/actionBar.js
similarity index 97%
rename from src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.js
rename to src/components/screens/wallet/overview/balanceInfo/actionBar.js
index 5827564148..36630dacb1 100644
--- a/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.js
+++ b/src/components/screens/wallet/overview/balanceInfo/actionBar.js
@@ -8,7 +8,7 @@ import { selectAccountBalance, selectLSKAddress } from '@store/selectors';
 import EmptyBalanceTooltipWrapper from './emptyBalanceTooltipWrapper';
 import styles from './balanceInfo.css';
 
-const ButtonsWrapper = ({
+const ActionBar = ({
   username, address, t, isWalletRoute, activeToken,
 }) => {
   const hostBalance = useSelector(selectAccountBalance);
@@ -73,4 +73,4 @@ const ButtonsWrapper = ({
   );
 };
 
-export default withTranslation()(ButtonsWrapper);
+export default withTranslation()(ActionBar);
diff --git a/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js b/src/components/screens/wallet/overview/balanceInfo/actionBar.test.js
similarity index 94%
rename from src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js
rename to src/components/screens/wallet/overview/balanceInfo/actionBar.test.js
index 78cc4aa20c..18642288cb 100644
--- a/src/components/screens/wallet/overview/balanceInfo/buttonsWrapper.test.js
+++ b/src/components/screens/wallet/overview/balanceInfo/actionBar.test.js
@@ -1,6 +1,6 @@
 import { mountWithRouterAndStore } from '@utils/testHelpers';
 import { tokenMap } from '@constants';
-import ButtonsWrapper from './buttonsWrapper';
+import ActionBar from './actionBar';
 
 describe('Reclaim balance screen', () => {
   const hostAddress = 'lskmjr8hrnhzc6j653eto5fbh2p3kwdpa9ccdnhk6';
@@ -37,7 +37,7 @@ describe('Reclaim balance screen', () => {
 
   it('Should display register delegate button and send', () => {
     wrapper = mountWithRouterAndStore(
-      ButtonsWrapper,
+      ActionBar,
       props,
       {},
       { ...state, account: { info: { LSK: balanceAccount } } },
@@ -51,7 +51,7 @@ describe('Reclaim balance screen', () => {
 
   it('Should not display register delegate button', () => {
     wrapper = mountWithRouterAndStore(
-      ButtonsWrapper,
+      ActionBar,
       { ...props, activeToken: tokenMap.BTC.key, address: 'mnrutC4CgQhMos4f8HWYRy8rKQ3UisGwYJ' },
       {},
       { ...state, account: { info: { LSK: balanceAccount } } },
@@ -63,7 +63,7 @@ describe('Reclaim balance screen', () => {
     expect(html).not.toContain('open-add-vote-dialog');
 
     wrapper = mountWithRouterAndStore(
-      ButtonsWrapper,
+      ActionBar,
       { ...props, address: explorerAddress },
       {},
       { ...state, account: { info: { LSK: balanceAccount } } },
@@ -77,7 +77,7 @@ describe('Reclaim balance screen', () => {
 
   it('Should display add/edit vote correctly', () => {
     wrapper = mountWithRouterAndStore(
-      ButtonsWrapper,
+      ActionBar,
       { ...props, username: 'delegate' },
       {},
       { ...state, account: { info: { LSK: balanceAccount } } },
@@ -91,7 +91,7 @@ describe('Reclaim balance screen', () => {
     expect(html).not.toContain('Edit vote');
 
     wrapper = mountWithRouterAndStore(
-      ButtonsWrapper,
+      ActionBar,
       { ...props, username: 'delegate' },
       {},
       {
@@ -110,7 +110,7 @@ describe('Reclaim balance screen', () => {
 
   it('Should disable buttons', () => {
     wrapper = mountWithRouterAndStore(
-      ButtonsWrapper,
+      ActionBar,
       props,
       {},
       { ...state, account: { info: { LSK: noBalanceAccount } } },
diff --git a/src/components/screens/wallet/overview/balanceInfo/index.js b/src/components/screens/wallet/overview/balanceInfo/index.js
index d319d44b06..734505aa41 100644
--- a/src/components/screens/wallet/overview/balanceInfo/index.js
+++ b/src/components/screens/wallet/overview/balanceInfo/index.js
@@ -8,7 +8,7 @@ import LiskAmount from '@shared/liskAmount';
 import DiscreetMode from '@shared/discreetMode';
 import Converter from '@shared/converter';
 import LockedBalanceLink from './unlocking';
-import ButtonsWrapper from './buttonsWrapper';
+import ActionBar from './actionBar';
 import styles from './balanceInfo.css';
 
 const BalanceInfo = ({
@@ -34,7 +34,7 @@ const BalanceInfo = ({
           }
         </DiscreetMode>
       </div>
-      <ButtonsWrapper
+      <ActionBar
         address={address}
         username={username}
         isWalletRoute={isWalletRoute}