lukechilds
/
ledger-live-desktop
mirror of https://github.com/lukechilds/ledger-live-desktop.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Integrate the new settings design

master
meriadec 7 years ago
committed by Loëck Vézien
parent
3c8bbfffad
commit
01313f5065
No known key found for this signature in database GPG Key ID: CBCDCE384E853AC4
16 changed files with 452 additions and 377 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 98
      src/components/SettingsPage/Display.js
  2. 88
      src/components/SettingsPage/Money.js
  3. 124
      src/components/SettingsPage/Profile.js
  4. 95
      src/components/SettingsPage/SettingsSection.js
  5. 62
      src/components/SettingsPage/index.js
  6. 62
      src/components/SettingsPage/sections/About.js
  7. 53
      src/components/SettingsPage/sections/Currencies.js
  8. 93
      src/components/SettingsPage/sections/Display.js
  9. 56
      src/components/SettingsPage/sections/Profile.js
  10. 0
      src/components/SettingsPage/sections/Tools.js
  11. 12
      src/components/base/Select/index.js
  12. 12
      src/icons/Currencies.js
  13. 12
      src/icons/Display.js
  14. 12
      src/icons/Help.js
  15. 16
      src/types/common.js
  16. 34
      static/i18n/en/settings.yml

98
src/components/SettingsPage/Display.js
View File

@ -1,98 +0,0 @@
// @flow
import React, { PureComponent } from 'react'
import type { SettingsDisplay, T } from 'types/common'
import Box, { Card } from 'components/base/Box'
import Button from 'components/base/Button'
import Label from 'components/base/Label'
import Select from 'components/base/Select'
type InputValue = SettingsDisplay
type Props = {
t: T,
settings: SettingsDisplay,
onSaveSettings: Function,
}
type State = {
inputValue: InputValue,
}
class TabProfile extends PureComponent<Props, State> {
state = {
inputValue: {
language: this.props.settings.language,
},
}
getDatas() {
const { t } = this.props
return {
languages: [
{
key: 'en',
name: t('language:en'),
},
{
key: 'fr',
name: t('language:fr'),
},
],
}
}
handleChangeInput = (key: $Keys<InputValue>) => (value: $Values<InputValue>) =>
this.setState(prev => ({
inputValue: {
...prev.inputValue,
[key]: value,
},
}))
handleSubmit = (e: SyntheticEvent<HTMLFormElement>) => {
e.preventDefault()
const { onSaveSettings } = this.props
const { inputValue } = this.state
onSaveSettings({
...inputValue,
})
}
render() {
const { t } = this.props
const { inputValue } = this.state
const { languages } = this.getDatas()
const currentLanguage = languages.find(l => l.key === inputValue.language)
return (
<form onSubmit={this.handleSubmit}>
<Card flow={3}>
<Box flow={1}>
<Label>{t('settings:display.language')}</Label>
<Select
onChange={item => this.handleChangeInput('language')(item.key)}
renderSelected={item => item && item.name}
value={currentLanguage}
items={languages}
/>
</Box>
<Box horizontal justifyContent="flex-end">
<Button primary type="submit">
{t('common:save')}
</Button>
</Box>
</Card>
</form>
)
}
}
export default TabProfile

88
src/components/SettingsPage/Money.js
View File

@ -1,88 +0,0 @@
// @flow
import React, { PureComponent } from 'react'
import { getFiatUnit } from '@ledgerhq/currencies'
import type { SettingsMoney, T } from 'types/common'
import Box, { Card } from 'components/base/Box'
import Button from 'components/base/Button'
import Label from 'components/base/Label'
import Select from 'components/base/Select'
const counterValues = ['USD', 'EUR', 'JPY', 'GBP'].sort().map(c => {
const { name } = getFiatUnit(c)
return {
key: c,
name,
}
})
type InputValue = SettingsMoney
type Props = {
t: T,
settings: SettingsMoney,
onSaveSettings: Function,
}
type State = {
inputValue: InputValue,
}
class TabProfile extends PureComponent<Props, State> {
state = {
inputValue: {
counterValue: this.props.settings.counterValue,
},
}
handleChangeInput = (key: $Keys<InputValue>) => (value: $Values<InputValue>) =>
this.setState(prev => ({
inputValue: {
...prev.inputValue,
[key]: value,
},
}))
handleSubmit = (e: SyntheticEvent<HTMLFormElement>) => {
e.preventDefault()
const { onSaveSettings } = this.props
const { inputValue } = this.state
onSaveSettings({
...inputValue,
})
}
render() {
const { t } = this.props
const { inputValue } = this.state
const currentCounterValues = counterValues.find(l => l.key === inputValue.counterValue)
return (
<form onSubmit={this.handleSubmit}>
<Card flow={3}>
<Box flow={1}>
<Label>{t('settings:display.counterValue')}</Label>
<Select
onChange={item => this.handleChangeInput('counterValue')(item.key)}
renderSelected={item => item && item.name}
value={currentCounterValues}
items={counterValues}
/>
</Box>
<Box horizontal justifyContent="flex-end">
<Button primary type="submit">
{t('common:save')}
</Button>
</Box>
</Card>
</form>
)
}
}
export default TabProfile

124
src/components/SettingsPage/Profile.js
View File

@ -1,124 +0,0 @@
// @flow
import React, { PureComponent } from 'react'
import { connect } from 'react-redux'
import bcrypt from 'bcryptjs'
import get from 'lodash/get'
import set from 'lodash/set'
import { setEncryptionKey } from 'helpers/db'
import type { SettingsProfile, T } from 'types/common'
import { unlock } from 'reducers/application'
import Box, { Card } from 'components/base/Box'
import Input from 'components/base/Input'
import CheckBox from 'components/base/CheckBox'
import Button from 'components/base/Button'
import Label from 'components/base/Label'
type InputValue = SettingsProfile
type Props = {
t: T,
settings: SettingsProfile,
onSaveSettings: Function,
unlock: Function,
}
type State = {
inputValue: InputValue,
}
const mapDispatchToProps = {
unlock,
}
class TabProfile extends PureComponent<Props, State> {
state = {
inputValue: {
password: {
...this.props.settings.password,
value: undefined,
},
},
}
handleChangeInput = (key: string) => (value: $Values<InputValue>) =>
this.setState(prev => ({
inputValue: {
...set(prev.inputValue, key, value),
},
}))
handleSubmit = (e: SyntheticEvent<HTMLFormElement>) => {
e.preventDefault()
const { onSaveSettings, unlock } = this.props
const { inputValue } = this.state
const settings = {
...inputValue,
password: {
...inputValue.password,
value: '',
},
}
const password = get(inputValue, 'password', {})
if (password.state === true && password.value.trim() !== '') {
settings.password.value = bcrypt.hashSync(password.value, 8)
setEncryptionKey('accounts', password.value)
} else {
setEncryptionKey('accounts', undefined)
}
unlock()
onSaveSettings(settings)
}
render() {
const { t } = this.props
const { inputValue } = this.state
const isPasswordChecked = get(inputValue, 'password.state', false)
return (
<form onSubmit={this.handleSubmit}>
<Card flow={3}>
<label>
<Box
horizontal
alignItems="center"
flow={2}
style={{ cursor: 'pointer' }}
onClick={() => this.handleChangeInput('password.state')(!isPasswordChecked)}
>
<CheckBox isChecked={isPasswordChecked} />
<div>{t('settings:profile.protectWithPassword')}</div>
</Box>
</label>
{get(inputValue, 'password.state') === true && (
<Box flow={1}>
<Label>{t('settings:profile.password')}</Label>
<Input
value={get(inputValue, 'password.value', '')}
onChange={this.handleChangeInput('password.value')}
type="password"
/>
</Box>
)}
<Box horizontal justifyContent="flex-end">
<Button primary type="submit">
{t('common:save')}
</Button>
</Box>
</Card>
</form>
)
}
}
export default connect(null, mapDispatchToProps)(TabProfile)

95
src/components/SettingsPage/SettingsSection.js
View File

@ -0,0 +1,95 @@
// @flow
import React from 'react'
import styled from 'styled-components'
import { rgba } from 'styles/helpers'
import Box, { Card } from 'components/base/Box'
export const SettingsSection = styled(Card).attrs({ p: 0 })``
const SettingsSectionHeaderContainer = styled(Box).attrs({
p: 4,
horizontal: true,
align: 'center',
})`
border-bottom: 1px solid ${p => p.theme.colors.lightFog};
line-height: normal;
`
const RoundIconContainer = styled(Box).attrs({
align: 'center',
justify: 'center',
bg: p => rgba(p.theme.colors.wallet, 0.2),
color: 'wallet',
})`
height: 30px;
width: 30px;
border-radius: 50%;
`
export const SettingsSectionBody = styled(Box)`
> * + * {
border-top: 1px solid ${p => p.theme.colors.lightFog};
}
`
export function SettingsSectionHeader({
title,
desc,
icon,
}: {
title: string,
desc: string,
icon: any,
}) {
return (
<SettingsSectionHeaderContainer>
<RoundIconContainer mr={3}>{icon}</RoundIconContainer>
<Box>
<Box ff="Museo Sans|Regular" color="dark">
{title}
</Box>
<Box ff="Open Sans" fontSize={3}>
{desc}
</Box>
</Box>
</SettingsSectionHeaderContainer>
)
}
const SettingsSectionRowContainer = styled(Box).attrs({ p: 4, horizontal: true, align: 'center' })`
cursor: ${p => (p.onClick ? 'pointer' : '')};
`
export function SettingsSectionRow({
title,
desc,
children,
onClick,
}: {
title: string,
desc: string,
children?: any,
onClick?: ?Function,
}) {
return (
<SettingsSectionRowContainer onClick={onClick}>
<Box grow>
<Box ff="Open Sans|SemiBold" color="dark" fontSize={4}>
{title}
</Box>
<Box ff="Open Sans" fontSize={3} color="grey">
{desc}
</Box>
</Box>
<Box>{children}</Box>
</SettingsSectionRowContainer>
)
}
SettingsSectionRow.defaultProps = {
children: null,
onClick: null,
}

62
src/components/SettingsPage/index.js
View File

@ -4,7 +4,6 @@ import React, { PureComponent } from 'react'
import { compose } from 'redux'
import { connect } from 'react-redux'
import { translate } from 'react-i18next'
import moment from 'moment'
import type { Settings, T } from 'types/common'
import type { SaveSettings } from 'actions/settings'
@ -16,10 +15,10 @@ import { fetchCounterValues } from 'actions/counterValues'
import Pills from 'components/base/Pills'
import Box from 'components/base/Box'
import TabDisplay from './Display'
import TabProfile from './Profile'
import TabTools from './Tools'
import TabMoney from './Money'
import SectionDisplay from './sections/Display'
import SectionCurrencies from './sections/Currencies'
import SectionProfile from './sections/Profile'
import SectionAbout from './sections/About'
const mapStateToProps = state => ({
settings: state.settings,
@ -55,68 +54,45 @@ class SettingsPage extends PureComponent<Props, State> {
}
handleSaveSettings = newSettings => {
const { fetchCounterValues, saveSettings, i18n, settings } = this.props
const { fetchCounterValues, saveSettings, settings } = this.props
saveSettings(newSettings)
if (newSettings.language !== settings.language) {
i18n.changeLanguage(newSettings.language)
moment.locale(newSettings.language)
}
if (newSettings.counterValue !== settings.counterValue) {
fetchCounterValues()
}
}
render() {
const { settings, t } = this.props
const { settings, t, i18n, saveSettings } = this.props
const { tab } = this.state
const props = {
t,
settings,
onSaveSettings: this.handleSaveSettings,
saveSettings,
}
this._items = [
{
key: 'display',
label: t('settings:tabs.display'),
value: () => <TabDisplay {...props} />,
},
{
key: 'money',
label: t('settings:tabs.money'),
value: () => <TabMoney {...props} />,
},
{
key: 'material',
isDisabled: true,
label: t('settings:tabs.material'),
value: () => <div>{'Matériel'}</div>,
value: () => <SectionDisplay {...props} i18n={i18n} />,
},
{
key: 'app',
isDisabled: true,
label: t('settings:tabs.app'),
value: () => <div>{'App (beta)'}</div>,
},
{
key: 'tools',
label: t('settings:tabs.tools'),
value: () => <TabTools {...props} />,
},
{
key: 'blockchain',
isDisabled: true,
label: t('settings:tabs.blockchain'),
value: () => <div>{'Blockchain'}</div>,
key: 'currencies',
label: t('settings:tabs.currencies'),
value: () => <SectionCurrencies {...props} />,
},
{
key: 'profile',
label: t('settings:tabs.profile'),
value: () => <TabProfile {...props} />,
value: () => <SectionProfile {...props} />,
},
{
key: 'about',
label: t('settings:tabs.about'),
value: () => <SectionAbout {...props} />,
},
]
@ -124,10 +100,10 @@ class SettingsPage extends PureComponent<Props, State> {
return (
<Box>
<Box fontSize={7} mb={4}>
<Box ff="Museo Sans|Regular" color="dark" fontSize={7} mb={5}>
{t('settings:title')}
</Box>
<Pills mb={6} items={this._items} activeKey={item.key} onChange={this.handleChangeTab} />
<Pills mb={4} items={this._items} activeKey={item.key} onChange={this.handleChangeTab} />
{item.value && item.value()}
</Box>
)

62
src/components/SettingsPage/sections/About.js
View File

@ -0,0 +1,62 @@
// @flow
import React, { PureComponent } from 'react'
import { shell } from 'electron'
import type { T } from 'types/common'
import IconHelp from 'icons/Help'
import IconChevronRight from 'icons/ChevronRight'
import {
SettingsSection as Section,
SettingsSectionHeader as Header,
SettingsSectionBody as Body,
SettingsSectionRow as Row,
} from '../SettingsSection'
type Props = {
t: T,
}
class SectionAbout extends PureComponent<Props> {
handleOpenLink = (url: string) => () => shell.openExternal(url)
render() {
const { t } = this.props
return (
<Section>
<Header
icon={<IconHelp size={16} />}
title={t('settings:tabs.about')}
desc="Lorem ipsum dolor sit amet"
/>
<Body>
<Row
onClick={this.handleOpenLink('http://google.com')}
title={t('settings:about.faq')}
desc={t('settings:about.faqDesc')}
>
<IconChevronRight size={16} />
</Row>
<Row
onClick={this.handleOpenLink('http://google.com')}
title={t('settings:about.contactUs')}
desc={t('settings:about.contactUsDesc')}
>
<IconChevronRight size={16} />
</Row>
<Row
onClick={this.handleOpenLink('http://google.com')}
title={t('settings:about.terms')}
desc={t('settings:about.termsDesc')}
>
<IconChevronRight size={16} />
</Row>
</Body>
</Section>
)
}
}
export default SectionAbout

53
src/components/SettingsPage/sections/Currencies.js
View File

@ -0,0 +1,53 @@
// @flow
import React, { PureComponent } from 'react'
import type { T } from 'types/common'
import IconCurrencies from 'icons/Currencies'
import {
SettingsSection as Section,
SettingsSectionHeader as Header,
SettingsSectionBody as Body,
SettingsSectionRow as Row,
} from '../SettingsSection'
type Props = {
t: T,
}
class TabCurrencies extends PureComponent<Props> {
render() {
const { t } = this.props
return (
<Section>
<Header
icon={<IconCurrencies size={16} />}
title={t('settings:tabs.currencies')}
desc="Lorem ipsum dolor sit amet"
/>
<Body>
<Row
title={t('settings:currencies.confirmationsToSpend')}
desc={t('settings:currencies.confirmationsToSpendDesc')}
/>
<Row
title={t('settings:currencies.confirmationsNb')}
desc={t('settings:currencies.confirmationsNbDesc')}
/>
<Row
title={t('settings:currencies.transactionsFees')}
desc={t('settings:currencies.transactionsFeesDesc')}
/>
<Row
title={t('settings:currencies.explorer')}
desc={t('settings:currencies.explorerDesc')}
/>
</Body>
</Section>
)
}
}
export default TabCurrencies

93
src/components/SettingsPage/sections/Display.js
View File

@ -0,0 +1,93 @@
// @flow
import React, { PureComponent } from 'react'
import moment from 'moment'
import type { Settings, T } from 'types/common'
import Select from 'components/base/Select'
import IconDisplay from 'icons/Display'
import {
SettingsSection as Section,
SettingsSectionHeader as Header,
SettingsSectionBody as Body,
SettingsSectionRow as Row,
} from '../SettingsSection'
type Props = {
t: T,
settings: Settings,
saveSettings: Function,
i18n: Object,
}
type State = {
cachedLanguageKey: string,
}
class TabProfile extends PureComponent<Props, State> {
state = {
cachedLanguageKey: this.props.settings.language,
}
getDatas() {
const { t } = this.props
return {
languages: [{ key: 'en', name: t('language:en') }, { key: 'fr', name: t('language:fr') }],
}
}
handleChangeLanguage = (languageKey: string) => {
const { i18n, saveSettings } = this.props
this.setState({ cachedLanguageKey: languageKey })
window.requestIdleCallback(() => {
i18n.changeLanguage(languageKey)
moment.locale(languageKey)
saveSettings({ language: languageKey })
})
}
render() {
const { t } = this.props
const { cachedLanguageKey } = this.state
const { languages } = this.getDatas()
const currentLanguage = languages.find(l => l.key === cachedLanguageKey)
return (
<Section>
<Header
icon={<IconDisplay size={16} />}
title={t('settings:tabs.display')}
desc="Lorem ipsum dolor sit amet"
/>
<Body>
<Row
title={t('settings:display.counterValue')}
desc={t('settings:display.counterValueDesc')}
>
{'-'}
</Row>
<Row title={t('settings:display.language')} desc={t('settings:display.languageDesc')}>
<Select
style={{ minWidth: 130 }}
small
onChange={item => this.handleChangeLanguage(item.key)}
renderSelected={item => item && item.name}
value={currentLanguage}
items={languages}
/>
</Row>
<Row title={t('settings:display.region')} desc={t('settings:display.regionDesc')}>
{'-'}
</Row>
<Row title={t('settings:display.stock')} desc={t('settings:display.stockDesc')}>
{'-'}
</Row>
</Body>
</Section>
)
}
}
export default TabProfile

56
src/components/SettingsPage/sections/Profile.js
View File

@ -0,0 +1,56 @@
// @flow
import React, { PureComponent } from 'react'
import { connect } from 'react-redux'
// import type { Settings, T } from 'types/common'
import type { T } from 'types/common'
import { unlock } from 'reducers/application'
import IconUser from 'icons/User'
import {
SettingsSection as Section,
SettingsSectionHeader as Header,
SettingsSectionBody as Body,
SettingsSectionRow as Row,
} from '../SettingsSection'
type Props = {
t: T,
// settings: Settings,
// onSaveSettings: Function,
// unlock: Function,
}
type State = {}
const mapDispatchToProps = {
unlock,
}
class TabProfile extends PureComponent<Props, State> {
state = {}
render() {
const { t } = this.props
return (
<Section>
<Header
icon={<IconUser size={16} />}
title={t('settings:tabs.profile')}
desc="Lorem ipsum dolor sit amet"
/>
<Body>
<Row title={t('settings:display.language')} desc={t('settings:display.languageDesc')}>
noetuhnoeth
</Row>
</Body>
</Section>
)
}
}
export default connect(null, mapDispatchToProps)(TabProfile)

0
src/components/SettingsPage/Tools.js → src/components/SettingsPage/sections/Tools.js
View File

12
src/components/base/Select/index.js
View File

@ -34,20 +34,21 @@ type Props = {
searchable?: boolean,
value?: Object | null,
disabled: boolean,
small?: boolean,
}
const Container = styled(Box).attrs({ relative: true, color: 'graphite' })``
const TriggerBtn = styled(Box).attrs({
alignItems: 'center',
ff: 'Open Sans|SemiBold',
ff: p => (p.small ? 'Open Sans' : 'Open Sans|SemiBold'),
flow: 2,
fontSize: 4,
fontSize: p => (p.small ? 3 : 4),
horizontal: true,
px: 3,
})`
${space};
height: 40px;
height: ${p => (p.small ? '34' : '40')}px;
background: ${p => (p.disabled ? p.theme.colors.lightGrey : p.bg || p.theme.colors.white)};
border-bottom-left-radius: ${p => (p.flatLeft ? 0 : p.theme.radii[1])}px;
border-bottom-right-radius: ${p => (p.flatRight ? 0 : p.theme.radii[1])}px;
@ -149,6 +150,7 @@ class Select extends PureComponent<Props> {
static defaultProps = {
bg: undefined,
disabled: false,
small: false,
fakeFocusRight: false,
flatLeft: false,
flatRight: false,
@ -251,6 +253,7 @@ class Select extends PureComponent<Props> {
renderSelected,
searchable,
value,
small,
...props
} = this.props
@ -276,7 +279,7 @@ class Select extends PureComponent<Props> {
if (disabled) {
return (
<Container {...getRootProps({ refKey: 'innerRef' })}>
<TriggerBtn disabled bg={props.bg} tabIndex={0}>
<TriggerBtn disabled bg={props.bg} tabIndex={0} small={small}>
{renderSelectedItem({ selectedItem, renderSelected, placeholder })}
</TriggerBtn>
</Container>
@ -308,6 +311,7 @@ class Select extends PureComponent<Props> {
flatLeft={flatLeft}
flatRight={flatRight}
tabIndex={0}
small={small}
>
<Box grow>
{renderSelectedItem({ selectedItem, renderSelected, placeholder })}

12
src/icons/Currencies.js
View File

@ -0,0 +1,12 @@
// @flow
import React from 'react'
export default ({ size, ...p }: { size: number }) => (
<svg viewBox="0 0 16 16" height={size} width={size} {...p}>
<path
fill="currentColor"
d="M8 5.581c-3.865 0-7-1.083-7-2.79C1 1.083 4.135 0 8 0s7 1.083 7 2.79c0 1.708-3.135 2.791-7 2.791zm-7-2.79c0-.309.241-.558.538-.558.298 0 .539.25.539.558v10.418c0 .28.516.704 1.517 1.05 1.142.396 2.714.625 4.406.625 1.692 0 3.264-.23 4.406-.625 1.001-.346 1.517-.77 1.517-1.05V2.791c0-.309.241-.558.539-.558.297 0 .538.25.538.558v10.418C15 14.921 11.88 16 8 16s-7-1.08-7-2.79V2.79zM13.923 8c0-.308.241-.558.539-.558.297 0 .538.25.538.558 0 1.711-3.12 2.79-7 2.79S1 9.712 1 8c0-.308.241-.558.538-.558.298 0 .539.25.539.558 0 .28.516.704 1.517 1.05 1.142.395 2.714.624 4.406.624 1.692 0 3.264-.229 4.406-.624 1.001-.346 1.517-.77 1.517-1.05zM8 4.465c1.682 0 3.254-.23 4.399-.625 1.004-.347 1.524-.772 1.524-1.05 0-.277-.52-.702-1.524-1.048-1.145-.396-2.717-.626-4.399-.626s-3.254.23-4.399.626c-1.004.346-1.524.771-1.524 1.049 0 .277.52.702 1.524 1.049 1.145.395 2.717.625 4.399.625z"
/>
</svg>
)

12
src/icons/Display.js
View File

@ -0,0 +1,12 @@
// @flow
import React from 'react'
export default ({ size, ...p }: { size: number }) => (
<svg viewBox="0 0 16 16" width={size} height={size} {...p}>
<path
fill="currentColor"
d="M3.2 2.26c-.552 0-1 .471-1 1.051v6.547c0 .58.448 1.05 1 1.05h9.6c.552 0 1-.47 1-1.05V3.31c0-.58-.448-1.05-1-1.05H3.2zm5.4 9.909v1.57h1.96c.331 0 .6.283.6.63 0 .349-.269.631-.6.631H5.44c-.331 0-.6-.282-.6-.63 0-.348.269-.63.6-.63H7.4v-1.571H3.2c-1.215 0-2.2-1.035-2.2-2.311V3.31C1 2.035 1.985 1 3.2 1h9.6C14.015 1 15 2.035 15 3.311v6.547c0 1.276-.985 2.311-2.2 2.311H8.6z"
/>
</svg>
)

12
src/icons/Help.js
View File

@ -0,0 +1,12 @@
// @flow
import React from 'react'
export default ({ size, ...p }: { size: number }) => (
<svg viewBox="0 0 16 16" height={size} width={size} {...p}>
<path
fill="currentColor"
d="M3.3 4.007a6.167 6.167 0 1 0 .707-.707l2.135 2.135a3.167 3.167 0 1 1-.707.707L3.3 4.007zM8 15.167A7.167 7.167 0 1 1 8 .833a7.167 7.167 0 0 1 0 14.334zm0-5a2.167 2.167 0 1 0 0-4.334 2.167 2.167 0 0 0 0 4.334zm1.387-4.054c0-.128.048-.256.146-.353l2.353-2.354a.5.5 0 0 1 .708.708L10.24 6.467a.5.5 0 0 1-.707-.707l2.827-2.827a.5.5 0 0 1 .707.707L10.24 6.467a.5.5 0 0 1-.853-.354zm.146 4.127a.5.5 0 0 1 .707-.707l2.827 2.827a.5.5 0 1 1-.707.707L9.533 10.24zM3.64 13.067a.5.5 0 1 1-.707-.707L5.76 9.533a.5.5 0 1 1 .707.707L3.64 13.067z"
/>
</svg>
)

16
src/types/common.js
View File

@ -12,23 +12,15 @@ export type Devices = Array<Device>
// -------------------- Settings
export type SettingsProfile = {
export type Settings = {
language: string,
counterValue: string,
password: {
state: boolean,
isEnabled: boolean,
value: string,
},
}
export type SettingsDisplay = {
language: string,
}
export type SettingsMoney = {
counterValue: string,
}
export type Settings = SettingsProfile & SettingsDisplay & SettingsMoney
export type T = (?string, ?Object) => string
// -------------------- Manager

34
static/i18n/en/settings.yml
View File

@ -1,16 +1,34 @@
title: Settings
tabs:
display: Display
money: Money
material: Material
app: App (beta)
tools: Tools
blockchain: Blockchain
currencies: Currencies
profile: Profile
about: About
display:
language: Language
counterValue: Counter Value
orderAccounts: Order accounts
language: Interface language
languageDesc: Lorem ipsum dolor sit amet
counterValue: Countervalue
counterValueDesc: Lorem ipsum dolor sit amet
region: Region
regionDesc: Lorem ipsum dolor sit amet
stock: Stock market indicators
stockDesc: Lorem ipsum dolor sit amet
currencies:
confirmationsToSpend: Confirmations to spend
confirmationsToSpendDesc: Lorem ipsum dolor sit amet
confirmationsNb: Number of confirmations
confirmationsNbDesc: Lorem ipsum dolor sit amet
transactionsFees: Transactions fees
transactionsFeesDesc: Lorem ipsum dolor sit amet
explorer: Blockchain explorer
explorerDesc: Lorem ipsum dolor sit amet
profile:
protectWithPassword: Protect local data with a password
password: Password
about:
faq: FAQ
faqDesc: Lorem ipsum dolor sit amet
contactUs: Contact us
contactUsDesc: Lorem ipsum dolor sit amet
terms: Terms and Privacy policy
termsDesc: Lorem ipsum dolor sit amet

Write Preview
Loading…
Cancel
Save