From 232c538be2417f0ccfd5d5bf91cd2a42186493e3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ga=C3=ABtan=20Renaudeau?= Date: Sat, 30 Jun 2018 10:29:17 +0200 Subject: [PATCH 1/2] Modularize settings --- src/actions/settings.js | 13 +- src/components/RenderError.js | 4 +- src/components/SettingsPage/AboutRowItem.js | 26 ++ src/components/SettingsPage/CleanButton.js | 72 ++++++ .../CounterValueExchangeSelect.js | 53 ++++ .../SettingsPage/CounterValueSelect.js | 58 +++++ src/components/SettingsPage/DevModeButton.js | 39 +++ .../SettingsPage/DisablePasswordButton.js | 133 ++++++++++ src/components/SettingsPage/LanguageSelect.js | 61 +++++ .../SettingsPage/MarketIndicatorRadio.js | 48 ++++ src/components/SettingsPage/RegionSelect.js | 67 +++++ .../SettingsPage/ReleaseNotesButton.js | 45 ++++ src/components/SettingsPage/ResetButton.js | 82 ++++++ .../SettingsPage/SentryLogsButton.js | 39 +++ .../SettingsPage/ShareAnalyticsButton.js | 38 +++ src/components/SettingsPage/index.js | 56 ++--- src/components/SettingsPage/sections/About.js | 97 ++------ .../SettingsPage/sections/Currencies.js | 96 +------ .../SettingsPage/sections/CurrencyRows.js | 114 +++++++++ .../SettingsPage/sections/Display.js | 224 ++++------------- .../SettingsPage/sections/Profile.js | 234 ++---------------- src/components/SettingsPage/sections/Tools.js | 5 +- src/config/constants.js | 1 + src/middlewares/sentry.js | 4 +- src/reducers/settings.js | 12 +- src/renderer/init.js | 4 +- 26 files changed, 1012 insertions(+), 613 deletions(-) create mode 100644 src/components/SettingsPage/AboutRowItem.js create mode 100644 src/components/SettingsPage/CleanButton.js create mode 100644 src/components/SettingsPage/CounterValueExchangeSelect.js create mode 100644 src/components/SettingsPage/CounterValueSelect.js create mode 100644 src/components/SettingsPage/DevModeButton.js create mode 100644 src/components/SettingsPage/DisablePasswordButton.js create mode 100644 src/components/SettingsPage/LanguageSelect.js create mode 100644 src/components/SettingsPage/MarketIndicatorRadio.js create mode 100644 src/components/SettingsPage/RegionSelect.js create mode 100644 src/components/SettingsPage/ReleaseNotesButton.js create mode 100644 src/components/SettingsPage/ResetButton.js create mode 100644 src/components/SettingsPage/SentryLogsButton.js create mode 100644 src/components/SettingsPage/ShareAnalyticsButton.js create mode 100644 src/components/SettingsPage/sections/CurrencyRows.js diff --git a/src/actions/settings.js b/src/actions/settings.js index 381000a8..db6b9833 100644 --- a/src/actions/settings.js +++ b/src/actions/settings.js @@ -4,12 +4,23 @@ import type { Dispatch } from 'redux' import type { SettingsState as Settings } from 'reducers/settings' import type { Currency } from '@ledgerhq/live-common/lib/types' -export type SaveSettings = Settings => { type: string, payload: $Shape } +export type SaveSettings = ($Shape) => { type: string, payload: $Shape } + export const saveSettings: SaveSettings = payload => ({ type: 'DB:SAVE_SETTINGS', payload, }) +export const setDeveloperMode = (developerMode: boolean) => saveSettings({ developerMode }) +export const setSentryLogs = (sentryLogs: boolean) => saveSettings({ sentryLogs }) +export const setShareAnalytics = (shareAnalytics: boolean) => saveSettings({ shareAnalytics }) +export const setMarketIndicator = (marketIndicator: *) => saveSettings({ marketIndicator }) +export const setCounterValue = (counterValue: string) => saveSettings({ counterValue }) +export const setLanguage = (language: ?string) => saveSettings({ language }) +export const setRegion = (region: ?string) => saveSettings({ region }) +export const setCounterValueExchange = (counterValueExchange: ?string) => + saveSettings({ counterValueExchange }) + type FetchSettings = (*) => (Dispatch<*>) => void export const fetchSettings: FetchSettings = (settings: *) => dispatch => { dispatch({ diff --git a/src/components/RenderError.js b/src/components/RenderError.js index 7956a473..4de77099 100644 --- a/src/components/RenderError.js +++ b/src/components/RenderError.js @@ -17,7 +17,9 @@ import Space from 'components/base/Space' import Button from 'components/base/Button' import ConfirmModal from 'components/base/Modal/ConfirmModal' import IconTriangleWarning from 'icons/TriangleWarning' -import { IconWrapperCircle } from './SettingsPage/sections/Profile' + +// SERIOUSLY plz refactor to use +import { IconWrapperCircle } from './SettingsPage/ResetButton' type Props = { error: Error, diff --git a/src/components/SettingsPage/AboutRowItem.js b/src/components/SettingsPage/AboutRowItem.js new file mode 100644 index 00000000..012c809e --- /dev/null +++ b/src/components/SettingsPage/AboutRowItem.js @@ -0,0 +1,26 @@ +// @flow +import React, { PureComponent } from 'react' +import { shell } from 'electron' +import IconExternalLink from 'icons/ExternalLink' +import { Tabbable } from 'components/base/Box' +import { SettingsSectionRow } from './SettingsSection' + +export default class AboutRowItem extends PureComponent<{ + url: string, + title: string, + desc: string, + url: string, +}> { + onClick = () => shell.openExternal(this.props.url) + + render() { + const { title, desc } = this.props + return ( + + + + + + ) + } +} diff --git a/src/components/SettingsPage/CleanButton.js b/src/components/SettingsPage/CleanButton.js new file mode 100644 index 00000000..51690e90 --- /dev/null +++ b/src/components/SettingsPage/CleanButton.js @@ -0,0 +1,72 @@ +// @flow + +import React, { Fragment, PureComponent } from 'react' +import { connect } from 'react-redux' +import { translate } from 'react-i18next' +import type { T } from 'types/common' +import { remote } from 'electron' +import { cleanAccountsCache } from 'actions/accounts' +import db from 'helpers/db' +import { delay } from 'helpers/promise' +import Button from 'components/base/Button' +import { ConfirmModal } from 'components/base/Modal' + +const mapDispatchToProps = { + cleanAccountsCache, +} + +type Props = { + t: T, + cleanAccountsCache: () => *, +} + +type State = { + opened: boolean, +} + +class CleanButton extends PureComponent { + state = { + opened: false, + } + + open = () => this.setState({ opened: true }) + + close = () => this.setState({ opened: false }) + + action = async () => { + this.props.cleanAccountsCache() + await delay(500) + db.cleanCache() + remote.getCurrentWindow().webContents.reload() + } + + render() { + const { t } = this.props + const { opened } = this.state + return ( + + + + + + ) + } +} + +export default translate()( + connect( + null, + mapDispatchToProps, + )(CleanButton), +) diff --git a/src/components/SettingsPage/CounterValueExchangeSelect.js b/src/components/SettingsPage/CounterValueExchangeSelect.js new file mode 100644 index 00000000..5de9faac --- /dev/null +++ b/src/components/SettingsPage/CounterValueExchangeSelect.js @@ -0,0 +1,53 @@ +// @flow + +import React, { Fragment, PureComponent } from 'react' +import { connect } from 'react-redux' +import { createStructuredSelector } from 'reselect' +import { + counterValueCurrencySelector, + counterValueExchangeSelector, + intermediaryCurrency, +} from 'reducers/settings' +import { setCounterValueExchange } from 'actions/settings' +import type { Currency } from '@ledgerhq/live-common/lib/types' +import SelectExchange from 'components/SelectExchange' + +type Props = { + counterValueCurrency: Currency, + counterValueExchange: ?string, + setCounterValueExchange: (?string) => void, +} + +class CounterValueExchangeSelect extends PureComponent { + handleChangeExchange = (exchange: *) => + this.props.setCounterValueExchange(exchange ? exchange.id : null) + + render() { + const { counterValueCurrency, counterValueExchange } = this.props + + return ( + + {counterValueCurrency ? ( + + ) : null} + + ) + } +} + +export default connect( + createStructuredSelector({ + counterValueCurrency: counterValueCurrencySelector, + counterValueExchange: counterValueExchangeSelector, + }), + { + setCounterValueExchange, + }, +)(CounterValueExchangeSelect) diff --git a/src/components/SettingsPage/CounterValueSelect.js b/src/components/SettingsPage/CounterValueSelect.js new file mode 100644 index 00000000..abfd82a7 --- /dev/null +++ b/src/components/SettingsPage/CounterValueSelect.js @@ -0,0 +1,58 @@ +// @flow + +import React, { Fragment, PureComponent } from 'react' +import { connect } from 'react-redux' +import { createStructuredSelector } from 'reselect' +import { listFiatCurrencies } from '@ledgerhq/live-common/lib/helpers/currencies' +import type { Currency } from '@ledgerhq/live-common/lib/types' +import { setCounterValue } from 'actions/settings' +import { counterValueCurrencySelector } from 'reducers/settings' +import Select from 'components/base/Select' + +const fiats = listFiatCurrencies() + .map(f => f.units[0]) + // For now we take first unit, in the future we'll need to figure out something else + .map(fiat => ({ + value: fiat.code, + label: `${fiat.name} - ${fiat.code}${fiat.symbol ? ` (${fiat.symbol})` : ''}`, + fiat, + })) + +type Props = { + counterValueCurrency: Currency, + setCounterValue: string => void, +} + +class CounterValueSelect extends PureComponent { + handleChangeCounterValue = (item: Object) => { + const { setCounterValue } = this.props + setCounterValue(item.fiat.code) + } + + render() { + const { counterValueCurrency } = this.props + const cvOption = fiats.find(f => f.value === counterValueCurrency.ticker) + + return ( + + {/* TODO Track */} + item && item.name} + value={currentLanguage} + options={this.languages} + /> + + ) + } +} + +export default translate()( + connect( + langAndRegionSelector, + { + setLanguage, + }, + )(LanguageSelect), +) diff --git a/src/components/SettingsPage/MarketIndicatorRadio.js b/src/components/SettingsPage/MarketIndicatorRadio.js new file mode 100644 index 00000000..3f822e70 --- /dev/null +++ b/src/components/SettingsPage/MarketIndicatorRadio.js @@ -0,0 +1,48 @@ +// @flow + +import React, { PureComponent } from 'react' +import { translate } from 'react-i18next' +import type { T } from 'types/common' +import { connect } from 'react-redux' +import { createStructuredSelector } from 'reselect' +import { setMarketIndicator } from 'actions/settings' +import { marketIndicatorSelector } from 'reducers/settings' +import RadioGroup from 'components/base/RadioGroup' + +type Props = { + t: T, + setMarketIndicator: (*) => *, + marketIndicator: *, +} + +class MarketIndicatorRadio extends PureComponent { + indicators = [ + { + label: this.props.t('app:common.eastern'), + key: 'eastern', + }, + { + label: this.props.t('app:common.western'), + key: 'western', + }, + ] + + onChange = (item: Object) => { + const { setMarketIndicator } = this.props + setMarketIndicator(item.key) + } + + render() { + const { marketIndicator } = this.props + return ( + + ) + } +} + +export default translate()( + connect( + createStructuredSelector({ marketIndicator: marketIndicatorSelector }), + { setMarketIndicator }, + )(MarketIndicatorRadio), +) diff --git a/src/components/SettingsPage/RegionSelect.js b/src/components/SettingsPage/RegionSelect.js new file mode 100644 index 00000000..2327b204 --- /dev/null +++ b/src/components/SettingsPage/RegionSelect.js @@ -0,0 +1,67 @@ +// @flow + +import React, { Fragment, PureComponent } from 'react' +import { connect } from 'react-redux' +import { createSelector } from 'reselect' +import { setRegion } from 'actions/settings' +import { langAndRegionSelector, counterValueCurrencySelector } from 'reducers/settings' +import type { Currency } from '@ledgerhq/live-common/lib/types' +import type { T } from 'types/common' + +import regionsByKey from 'helpers/regions.json' +import Select from 'components/base/Select' + +const regions = Object.keys(regionsByKey).map(key => { + const [language, region] = key.split('-') + return { value: key, language, region, label: regionsByKey[key] } +}) + +type Props = { + t: T, + counterValueCurrency: Currency, + useSystem: boolean, + language: string, + region: ?string, + setRegion: (?string) => void, +} + +class RegionSelect extends PureComponent { + handleChangeRegion = ({ region }: *) => { + const { setRegion } = this.props + setRegion(region) + } + + render() { + const { language, region } = this.props + + const regionsFiltered = regions.filter(item => language === item.language) + const currentRegion = regionsFiltered.find(item => item.region === region) || regionsFiltered[0] + + return ( + + (item ? item.name : '')} - renderSelected={item => item && item.name} - options={fiats} - value={cvOption} - /> + + + + - {counterValueCurrency ? ( - - - - ) : null} - item && item.name} - value={currentRegion} - options={regionsFiltered} - /> + )} - + @@ -230,4 +83,15 @@ class TabProfile extends PureComponent { } } -export default TabProfile +export default translate()( + connect( + createSelector( + langAndRegionSelector, + counterValueCurrencySelector, + ({ useSystem }, counterValueCurrency) => ({ + useSystem, + counterValueCurrency, + }), + ), + )(TabGeneral), +) diff --git a/src/components/SettingsPage/sections/Profile.js b/src/components/SettingsPage/sections/Profile.js index 3baafcff..801e9835 100644 --- a/src/components/SettingsPage/sections/Profile.js +++ b/src/components/SettingsPage/sections/Profile.js @@ -1,31 +1,17 @@ // @flow - -import React, { PureComponent } from 'react' -import { connect } from 'react-redux' -import styled from 'styled-components' -import { remote } from 'electron' -import bcrypt from 'bcryptjs' - -import { cleanAccountsCache } from 'actions/accounts' -import { unlock } from 'reducers/application' // FIXME should be in actions -import db, { setEncryptionKey } from 'helpers/db' -import { delay } from 'helpers/promise' -import hardReset from 'helpers/hardReset' - -import type { SettingsState } from 'reducers/settings' +import React, { Component } from 'react' +import { translate } from 'react-i18next' import type { T } from 'types/common' -import Track from 'analytics/Track' import TrackPage from 'analytics/TrackPage' import ExportLogsBtn from 'components/ExportLogsBtn' -import CheckBox from 'components/base/CheckBox' -import Box from 'components/base/Box' -import Button from 'components/base/Button' -import { ConfirmModal } from 'components/base/Modal' -import IconTriangleWarning from 'icons/TriangleWarning' import IconUser from 'icons/User' -import PasswordModal from '../PasswordModal' -import DisablePasswordModal from '../DisablePasswordModal' +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, @@ -34,117 +20,13 @@ import { SettingsSectionRow as Row, } from '../SettingsSection' -const mapDispatchToProps = { - unlock, - cleanAccountsCache, -} - type Props = { t: T, - settings: SettingsState, - unlock: Function, - saveSettings: Function, - cleanAccountsCache: () => *, -} - -type State = { - isHardResetModalOpened: boolean, - isSoftResetModalOpened: boolean, - isPasswordModalOpened: boolean, - isDisablePasswordModalOpened: boolean, - isHardResetting: boolean, } -class TabProfile extends PureComponent { - state = { - isHardResetModalOpened: false, - isSoftResetModalOpened: false, - isPasswordModalOpened: false, - isDisablePasswordModalOpened: false, - isHardResetting: false, - } - - setPassword = password => { - const { saveSettings, unlock } = this.props - window.requestIdleCallback(() => { - setEncryptionKey('accounts', password) - const hash = password ? bcrypt.hashSync(password, 8) : undefined - saveSettings({ - password: { - isEnabled: hash !== undefined, - value: hash, - }, - }) - unlock() - }) - } - - handleOpenSoftResetModal = () => this.setState({ isSoftResetModalOpened: true }) - handleCloseSoftResetModal = () => this.setState({ isSoftResetModalOpened: false }) - handleOpenHardResetModal = () => this.setState({ isHardResetModalOpened: true }) - handleCloseHardResetModal = () => this.setState({ isHardResetModalOpened: false }) - handleOpenPasswordModal = () => this.setState({ isPasswordModalOpened: true }) - handleClosePasswordModal = () => this.setState({ isPasswordModalOpened: false }) - handleDisablePassowrd = () => this.setState({ isDisablePasswordModalOpened: true }) - handleCloseDisablePasswordModal = () => this.setState({ isDisablePasswordModalOpened: false }) - - handleSoftReset = async () => { - this.props.cleanAccountsCache() - await delay(500) - db.cleanCache() - remote.getCurrentWindow().webContents.reload() - } - - handleHardReset = async () => { - this.setState({ isHardResetting: true }) - try { - await hardReset() - remote.getCurrentWindow().webContents.reloadIgnoringCache() - } catch (err) { - this.setState({ isHardResetting: false }) - } - } - - handleChangePasswordCheck = isChecked => { - if (isChecked) { - this.handleOpenPasswordModal() - } else { - this.handleDisablePassowrd() - } - } - - handleChangePassword = (password: ?string) => { - if (password) { - this.setPassword(password) - this.handleClosePasswordModal() - } else { - this.setPassword(undefined) - this.handleCloseDisablePasswordModal() - } - } - - handleDeveloperMode = developerMode => { - this.props.saveSettings({ - developerMode, - }) - } - - hardResetIconRender = () => ( - - - - ) - +class TabProfile extends Component { render() { - const { t, settings, saveSettings } = this.props - const { - isSoftResetModalOpened, - isHardResetModalOpened, - isPasswordModalOpened, - isDisablePasswordModalOpened, - isHardResetting, - } = this.state - const isPasswordEnabled = settings.password.isEnabled === true + const { t } = this.props return (
@@ -158,56 +40,31 @@ class TabProfile extends PureComponent { title={t('app:settings.profile.password')} desc={t('app:settings.profile.passwordDesc')} > - - - {isPasswordEnabled && ( - - )} - - + - - saveSettings({ sentryLogs })} - /> + - - saveSettings({ shareAnalytics })} - /> + - - saveSettings({ developerMode })} - /> + - + @@ -216,69 +73,12 @@ class TabProfile extends PureComponent { title={t('app:settings.profile.hardResetTitle')} desc={t('app:settings.profile.hardResetDesc')} > - + - - - - - - - -
) } } -export default connect( - null, - mapDispatchToProps, -)(TabProfile) - -// TODO: need a helper file for common styles across the app -export const IconWrapperCircle = styled(Box).attrs({})` - width: 50px; - height: 50px; - border-radius: 50%; - background: #ea2e4919; - text-align: -webkit-center; - justify-content: center; -` +export default translate()(TabProfile) diff --git a/src/components/SettingsPage/sections/Tools.js b/src/components/SettingsPage/sections/Tools.js index 6641db8e..b895ec28 100644 --- a/src/components/SettingsPage/sections/Tools.js +++ b/src/components/SettingsPage/sections/Tools.js @@ -1,8 +1,7 @@ // @flow -/* eslint-disable react/jsx-no-literals */ // FIXME import React, { PureComponent } from 'react' - +import { translate } from 'react-i18next' import Box, { Card } from 'components/base/Box' import Modal, { ModalBody, ModalContent, ModalTitle } from 'components/base/Modal' import Button from 'components/base/Button' @@ -53,4 +52,4 @@ class TabProfile extends PureComponent<*, *> { } } -export default TabProfile +export default translate()(TabProfile) diff --git a/src/config/constants.js b/src/config/constants.js index 101731e4..cf58d14b 100644 --- a/src/config/constants.js +++ b/src/config/constants.js @@ -80,6 +80,7 @@ export const DISABLE_ACTIVITY_INDICATORS = boolFromEnv('DISABLE_ACTIVITY_INDICAT 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') // Other constants diff --git a/src/middlewares/sentry.js b/src/middlewares/sentry.js index 212764c6..984b369f 100644 --- a/src/middlewares/sentry.js +++ b/src/middlewares/sentry.js @@ -1,12 +1,12 @@ import { ipcRenderer } from 'electron' -import { sentryLogsBooleanSelector } from 'reducers/settings' +import { sentryLogsSelector } from 'reducers/settings' let isSentryInstalled = false export default store => next => action => { next(action) const state = store.getState() - const sentryLogs = sentryLogsBooleanSelector(state) + const sentryLogs = sentryLogsSelector(state) if (sentryLogs !== isSentryInstalled) { isSentryInstalled = sentryLogs ipcRenderer.send('sentryLogsChanged', { value: sentryLogs }) diff --git a/src/reducers/settings.js b/src/reducers/settings.js index 6a5d20e1..e78334f2 100644 --- a/src/reducers/settings.js +++ b/src/reducers/settings.js @@ -27,6 +27,8 @@ export const timeRangeDaysByKey = { export type TimeRange = $Keys +export type { CurrencySettings } + export type SettingsState = { loaded: boolean, // is the settings loaded from db (it not we don't save them) hasCompletedOnboarding: boolean, @@ -163,10 +165,12 @@ export const lastUsedVersionSelector = (state: State): string => state.settings. export const availableCurrencies = createSelector(developerModeSelector, listCryptoCurrencies) -export const langAndRegionSelector = (state: State): { language: string, region: ?string } => { +export const langAndRegionSelector = ( + state: State, +): { language: string, region: ?string, useSystem: boolean } => { let { language, region } = state.settings if (language && languages.includes(language)) { - return { language, region } + return { language, region, useSystem: false } } const locale = getSystemLocale() language = locale.language @@ -175,7 +179,7 @@ export const langAndRegionSelector = (state: State): { language: string, region: language = 'en' region = 'US' } - return { language, region } + return { language, region, useSystem: true } } export const languageSelector = createSelector(langAndRegionSelector, o => o.language) @@ -220,7 +224,7 @@ export const exchangeSettingsForAccountSelector: ESFAS = createSelector( ) export const marketIndicatorSelector = (state: State) => state.settings.marketIndicator -export const sentryLogsBooleanSelector = (state: State) => state.settings.sentryLogs +export const sentryLogsSelector = (state: State) => state.settings.sentryLogs export const shareAnalyticsSelector = (state: State) => state.settings.shareAnalytics export const selectedTimeRangeSelector = (state: State) => state.settings.selectedTimeRange diff --git a/src/renderer/init.js b/src/renderer/init.js index dffb2d1f..951590c7 100644 --- a/src/renderer/init.js +++ b/src/renderer/init.js @@ -17,7 +17,7 @@ import { enableGlobalTab, disableGlobalTab, isGlobalTabEnabled } from 'config/gl import { fetchAccounts } from 'actions/accounts' import { fetchSettings } from 'actions/settings' import { isLocked } from 'reducers/application' -import { languageSelector, sentryLogsBooleanSelector } from 'reducers/settings' +import { languageSelector, sentryLogsSelector } from 'reducers/settings' import libcoreGetVersion from 'commands/libcoreGetVersion' import db from 'helpers/db' @@ -58,7 +58,7 @@ async function init() { const language = languageSelector(state) moment.locale(language) - sentry(() => sentryLogsBooleanSelector(store.getState())) + sentry(() => sentryLogsSelector(store.getState())) // FIXME IMO init() really should only be for window. any other case is a hack! const isMainWindow = remote.getCurrentWindow().name === 'MainWindow' From f2489c8f27dc7565f0803ac4b7e979060a2a0fad Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ga=C3=ABtan=20Renaudeau?= Date: Sat, 30 Jun 2018 10:36:09 +0200 Subject: [PATCH 2/2] Refactor settings sections --- src/components/SettingsPage/AboutRowItem.js | 1 - src/components/SettingsPage/ResetButton.js | 4 +- src/components/SettingsPage/index.js | 6 -- src/components/SettingsPage/sections/About.js | 20 +++++ .../SettingsPage/sections/Display.js | 37 +++++++- .../SettingsPage/sections/Profile.js | 84 ------------------- src/config/constants.js | 3 + 7 files changed, 60 insertions(+), 95 deletions(-) delete mode 100644 src/components/SettingsPage/sections/Profile.js diff --git a/src/components/SettingsPage/AboutRowItem.js b/src/components/SettingsPage/AboutRowItem.js index 012c809e..096f2c3a 100644 --- a/src/components/SettingsPage/AboutRowItem.js +++ b/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) diff --git a/src/components/SettingsPage/ResetButton.js b/src/components/SettingsPage/ResetButton.js index e86d0f38..25943e73 100644 --- a/src/components/SettingsPage/ResetButton.js +++ b/src/components/SettingsPage/ResetButton.js @@ -70,12 +70,12 @@ class ResetButton extends PureComponent { } } -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; ` diff --git a/src/components/SettingsPage/index.js b/src/components/SettingsPage/index.js index 9686884a..51faedbf 100644 --- a/src/components/SettingsPage/index.js +++ b/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 { 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'), diff --git a/src/components/SettingsPage/sections/About.js b/src/components/SettingsPage/sections/About.js index 382fd1e0..53042723 100644 --- a/src/components/SettingsPage/sections/About.js +++ b/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 { + + + + + + + + + + { )} - - + + {EXPERIMENTAL_MARKET_INDICATOR_SETTINGS ? ( + + + + ) : null} + + + + + + + + + + + + diff --git a/src/components/SettingsPage/sections/Profile.js b/src/components/SettingsPage/sections/Profile.js deleted file mode 100644 index 801e9835..00000000 --- a/src/components/SettingsPage/sections/Profile.js +++ /dev/null @@ -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 { - render() { - const { t } = this.props - return ( -
- -
} - title={t('app:settings.tabs.profile')} - desc={t('app:settings.display.desc')} - /> - - - - - - - - - - - - - - - - - - - - - - - -
- ) - } -} - -export default translate()(TabProfile) diff --git a/src/config/constants.js b/src/config/constants.js index cf58d14b..43007d85 100644 --- a/src/config/constants.js +++ b/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