Refactor settings sections

src/components/SettingsPage/AboutRowItem.js

@@ -9,7 +9,6 @@ export default class AboutRowItem extends PureComponent<{
   url: string,
   title: string,
   desc: string,
-  url: string,
 }> {
   onClick = () => shell.openExternal(this.props.url)
 

src/components/SettingsPage/ResetButton.js

@@ -70,12 +70,12 @@ class ResetButton extends PureComponent<Props, State> {
   }
 }
 
-export const IconWrapperCircle = styled(Box).attrs({})`
+export const IconWrapperCircle = styled(Box)`
   width: 50px;
   height: 50px;
   border-radius: 50%;
   background: #ea2e4919;
-  text-align: -webkit-center;
+  text-align: center;
   justify-content: center;
 `
 

src/components/SettingsPage/index.js

@@ -13,7 +13,6 @@ import Pills from 'components/base/Pills'
 import Box from 'components/base/Box'
 import SectionDisplay from './sections/Display'
 import SectionCurrencies from './sections/Currencies'
-import SectionProfile from './sections/Profile'
 import SectionAbout from './sections/About'
 import SectionTools from './sections/Tools'
 
@@ -48,11 +47,6 @@ class SettingsPage extends PureComponent<Props, State> {
         label: props.t('app:settings.tabs.currencies'),
         value: SectionCurrencies,
       },
-      {
-        key: 'profile',
-        label: props.t('app:settings.tabs.profile'),
-        value: SectionProfile,
-      },
       {
         key: 'about',
         label: props.t('app:settings.tabs.about'),

src/components/SettingsPage/sections/About.js

@@ -5,6 +5,10 @@ import { translate } from 'react-i18next'
 import type { T } from 'types/common'
 import TrackPage from 'analytics/TrackPage'
 import IconHelp from 'icons/Help'
+
+import ExportLogsBtn from 'components/ExportLogsBtn'
+import CleanButton from '../CleanButton'
+import ResetButton from '../ResetButton'
 import ReleaseNotesButton from '../ReleaseNotesButton'
 import AboutRowItem from '../AboutRowItem'
 
@@ -39,6 +43,22 @@ class SectionAbout extends PureComponent<Props> {
             <ReleaseNotesButton />
           </Row>
 
+          <Row
+            title={t('app:settings.profile.softResetTitle')}
+            desc={t('app:settings.profile.softResetDesc')}
+          >
+            <CleanButton />
+          </Row>
+          <Row
+            title={t('app:settings.profile.hardResetTitle')}
+            desc={t('app:settings.profile.hardResetDesc')}
+          >
+            <ResetButton />
+          </Row>
+          <Row title={t('app:settings.exportLogs.title')} desc={t('app:settings.exportLogs.desc')}>
+            <ExportLogsBtn />
+          </Row>
+
           <AboutRowItem
             title={t('app:settings.about.faq')}
             desc={t('app:settings.about.faqDesc')}

src/components/SettingsPage/sections/Display.js

@@ -7,6 +7,7 @@ import { createSelector } from 'reselect'
 import { langAndRegionSelector, counterValueCurrencySelector } from 'reducers/settings'
 import type { Currency } from '@ledgerhq/live-common/lib/types'
 import type { T } from 'types/common'
+import { EXPERIMENTAL_MARKET_INDICATOR_SETTINGS } from 'config/constants'
 
 import IconDisplay from 'icons/Display'
 import TrackPage from 'analytics/TrackPage'
@@ -15,6 +16,10 @@ import LanguageSelect from '../LanguageSelect'
 import CounterValueSelect from '../CounterValueSelect'
 import CounterValueExchangeSelect from '../CounterValueExchangeSelect'
 import RegionSelect from '../RegionSelect'
+import DisablePasswordButton from '../DisablePasswordButton'
+import DevModeButton from '../DevModeButton'
+import SentryLogsButton from '../SentryLogsButton'
+import ShareAnalyticsButton from '../ShareAnalyticsButton'
 
 import {
   SettingsSection as Section,
@@ -74,9 +79,37 @@ class TabGeneral extends PureComponent<Props> {
               <RegionSelect />
             </Row>
           )}
+
+          {EXPERIMENTAL_MARKET_INDICATOR_SETTINGS ? (
             <Row title={t('app:settings.display.stock')} desc={t('app:settings.display.stockDesc')}>
               <MarketIndicatorRadio />
             </Row>
+          ) : null}
+
+          <Row
+            title={t('app:settings.profile.password')}
+            desc={t('app:settings.profile.passwordDesc')}
+          >
+            <DisablePasswordButton />
+          </Row>
+          <Row
+            title={t('app:settings.profile.reportErrors')}
+            desc={t('app:settings.profile.reportErrorsDesc')}
+          >
+            <SentryLogsButton />
+          </Row>
+          <Row
+            title={t('app:settings.profile.analytics')}
+            desc={t('app:settings.profile.analyticsDesc')}
+          >
+            <ShareAnalyticsButton />
+          </Row>
+          <Row
+            title={t('app:settings.profile.developerMode')}
+            desc={t('app:settings.profile.developerModeDesc')}
+          >
+            <DevModeButton />
+          </Row>
         </Body>
       </Section>
     )

src/components/SettingsPage/sections/Profile.js

@@ -1,84 +0,0 @@
-// @flow
-import React, { Component } from 'react'
-import { translate } from 'react-i18next'
-import type { T } from 'types/common'
-
-import TrackPage from 'analytics/TrackPage'
-import ExportLogsBtn from 'components/ExportLogsBtn'
-import IconUser from 'icons/User'
-import DisablePasswordButton from '../DisablePasswordButton'
-import DevModeButton from '../DevModeButton'
-import SentryLogsButton from '../SentryLogsButton'
-import ShareAnalyticsButton from '../ShareAnalyticsButton'
-import CleanButton from '../CleanButton'
-import ResetButton from '../ResetButton'
-
-import {
-  SettingsSection as Section,
-  SettingsSectionHeader as Header,
-  SettingsSectionBody as Body,
-  SettingsSectionRow as Row,
-} from '../SettingsSection'
-
-type Props = {
-  t: T,
-}
-
-class TabProfile extends Component<Props> {
-  render() {
-    const { t } = this.props
-    return (
-      <Section>
-        <TrackPage category="Settings" name="Profile" />
-        <Header
-          icon={<IconUser size={16} />}
-          title={t('app:settings.tabs.profile')}
-          desc={t('app:settings.display.desc')}
-        />
-        <Body>
-          <Row
-            title={t('app:settings.profile.password')}
-            desc={t('app:settings.profile.passwordDesc')}
-          >
-            <DisablePasswordButton />
-          </Row>
-          <Row
-            title={t('app:settings.profile.reportErrors')}
-            desc={t('app:settings.profile.reportErrorsDesc')}
-          >
-            <SentryLogsButton />
-          </Row>
-          <Row
-            title={t('app:settings.profile.analytics')}
-            desc={t('app:settings.profile.analyticsDesc')}
-          >
-            <ShareAnalyticsButton />
-          </Row>
-          <Row
-            title={t('app:settings.profile.developerMode')}
-            desc={t('app:settings.profile.developerModeDesc')}
-          >
-            <DevModeButton />
-          </Row>
-          <Row
-            title={t('app:settings.profile.softResetTitle')}
-            desc={t('app:settings.profile.softResetDesc')}
-          >
-            <CleanButton />
-          </Row>
-          <Row title={t('app:settings.exportLogs.title')} desc={t('app:settings.exportLogs.desc')}>
-            <ExportLogsBtn />
-          </Row>
-          <Row
-            title={t('app:settings.profile.hardResetTitle')}
-            desc={t('app:settings.profile.hardResetDesc')}
-          >
-            <ResetButton />
-          </Row>
-        </Body>
-      </Section>
-    )
-  }
-}
-
-export default translate()(TabProfile)

src/config/constants.js

@@ -81,6 +81,9 @@ export const EXPERIMENTAL_CENTER_MODAL = boolFromEnv('EXPERIMENTAL_CENTER_MODAL'
 export const EXPERIMENTAL_FIRMWARE_UPDATE = boolFromEnv('EXPERIMENTAL_FIRMWARE_UPDATE')
 export const EXPERIMENTAL_HTTP_ON_RENDERER = boolFromEnv('EXPERIMENTAL_HTTP_ON_RENDERER')
 export const EXPERIMENTAL_TOOLS_SETTINGS = boolFromEnv('EXPERIMENTAL_TOOLS_SETTINGS')
+export const EXPERIMENTAL_MARKET_INDICATOR_SETTINGS = boolFromEnv(
+  'EXPERIMENTAL_MARKET_INDICATOR_SETTINGS',
+)
 
 // Other constants