Merge pull request #2670 from nestordominguez/issue-2133

Hide balance

src/ui/component/header/index.js

@@ -12,6 +12,7 @@ const select = state => ({
   roundedBalance: formatCredits(selectBalance(state) || 0, 2),
   currentTheme: makeSelectClientSetting(SETTINGS.THEME)(state),
   automaticDarkModeEnabled: makeSelectClientSetting(SETTINGS.AUTOMATIC_DARK_MODE_ENABLED)(state),
+  hideBalance: makeSelectClientSetting(SETTINGS.HIDE_BALANCE)(state),
 });
 
 const perform = dispatch => ({

src/ui/component/header/view.jsx

@@ -19,10 +19,11 @@ type Props = {
   currentTheme: string,
   automaticDarkModeEnabled: boolean,
   setClientSetting: (string, boolean | string) => void,
+  hideBalance: boolean,
 };
 
 const Header = (props: Props) => {
-  const { roundedBalance, history, setClientSetting, currentTheme, automaticDarkModeEnabled } = props;
+  const { roundedBalance, history, setClientSetting, currentTheme, automaticDarkModeEnabled, hideBalance } = props;
 
   function handleThemeToggle() {
     if (automaticDarkModeEnabled) {
@@ -36,6 +37,18 @@ const Header = (props: Props) => {
     }
   }
 
+  function getAccountTitle() {
+    if (roundedBalance > 0 && !hideBalance) {
+      return (
+        <React.Fragment>
+          {roundedBalance} <LbcSymbol />
+        </React.Fragment>
+      );
+    }
+
+    return __('Account');
+  }
+
   return (
     <header className="header">
       <div className="header__contents">
@@ -73,13 +86,7 @@ const Header = (props: Props) => {
           <Menu>
             <MenuButton className="header__navigation-item menu__title">
               <Icon icon={ICONS.ACCOUNT} />
-              {roundedBalance > 0 ? (
-                <React.Fragment>
-                  {roundedBalance} <LbcSymbol />
-                </React.Fragment>
-              ) : (
-                __('Account')
-              )}
+              {getAccountTitle()}
             </MenuButton>
             <MenuList>
               <MenuItem className="menu__link" onSelect={() => history.push(`/$/account`)}>

src/ui/constants/settings.js

@@ -17,3 +17,4 @@ export const RESULT_COUNT = 'resultCount';
 export const OS_NOTIFICATIONS_ENABLED = 'osNotificationsEnabled';
 export const AUTO_DOWNLOAD = 'autoDownload';
 export const SUPPORT_OPTION = 'supportOption';
+export const HIDE_BALANCE = 'hideBalance';

src/ui/page/settings/index.js

@@ -26,6 +26,7 @@ const select = state => ({
   osNotificationsEnabled: selectosNotificationsEnabled(state),
   autoDownload: makeSelectClientSetting(settings.AUTO_DOWNLOAD)(state),
   supportOption: makeSelectClientSetting(settings.SUPPORT_OPTION)(state),
+  hideBalance: makeSelectClientSetting(settings.HIDE_BALANCE)(state),
 });
 
 const perform = dispatch => ({

src/ui/page/settings/view.jsx

@@ -44,6 +44,7 @@ type Props = {
   walletEncrypted: boolean,
   osNotificationsEnabled: boolean,
   supportOption: boolean,
+  hideBalance: boolean,
 };
 
 type State = {
@@ -151,6 +152,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
       setDaemonSetting,
       setClientSetting,
       supportOption,
+      hideBalance,
     } = this.props;
 
     const noDaemonSettings = !daemonSettings || Object.keys(daemonSettings).length === 0;
@@ -360,6 +362,14 @@ class SettingsPage extends React.PureComponent<Props, State> {
                     </React.Fragment>
                   }
                 />
+
+                <FormField
+                  type="checkbox"
+                  name="hide_balance"
+                  onChange={() => setClientSetting(SETTINGS.HIDE_BALANCE, !hideBalance)}
+                  checked={hideBalance}
+                  label={__('Hide wallet balance in header')}
+                />
               </Form>
             </section>
 

src/ui/redux/reducers/settings.js

@@ -29,6 +29,7 @@ const defaultState = {
     [SETTINGS.RESULT_COUNT]: Number(getLocalStorageSetting(SETTINGS.RESULT_COUNT, 50)),
     [SETTINGS.AUTO_DOWNLOAD]: getLocalStorageSetting(SETTINGS.AUTO_DOWNLOAD, true),
     [SETTINGS.OS_NOTIFICATIONS_ENABLED]: Boolean(getLocalStorageSetting(SETTINGS.OS_NOTIFICATIONS_ENABLED, true)),
+    [SETTINGS.HIDE_BALANCE]: Boolean(getLocalStorageSetting(SETTINGS.HIDE_BALANCE, false)),
   },
   isNight: false,
   languages: { en: 'English', pl: 'Polish', id: 'Bahasa Indonesia' }, // temporarily hard code these so we can advance i18n testing