From 5a569bca22f4943695ae9c7dd673a246c318413a Mon Sep 17 00:00:00 2001 From: meriadec Date: Mon, 16 Apr 2018 10:25:56 +0200 Subject: [PATCH] Ability to change the username --- src/components/SettingsPage/index.js | 2 +- .../SettingsPage/sections/Profile.js | 34 +++++++++++++++---- src/components/TopBar.js | 6 ++-- src/reducers/settings.js | 1 + 4 files changed, 33 insertions(+), 10 deletions(-) diff --git a/src/components/SettingsPage/index.js b/src/components/SettingsPage/index.js index 3c8bd4b6..a4f45b67 100644 --- a/src/components/SettingsPage/index.js +++ b/src/components/SettingsPage/index.js @@ -43,7 +43,7 @@ type State = { class SettingsPage extends PureComponent { state = { - tab: 0, + tab: 2, } _items = [] diff --git a/src/components/SettingsPage/sections/Profile.js b/src/components/SettingsPage/sections/Profile.js index 57b7b5f9..8af6b884 100644 --- a/src/components/SettingsPage/sections/Profile.js +++ b/src/components/SettingsPage/sections/Profile.js @@ -3,11 +3,11 @@ import React, { PureComponent } from 'react' import { connect } from 'react-redux' -// import type { Settings, T } from 'types/common' -import type { T } from 'types/common' +import type { Settings, T } from 'types/common' import { unlock } from 'reducers/application' +import Input from 'components/base/Input' import IconUser from 'icons/User' import { @@ -19,22 +19,37 @@ import { type Props = { t: T, - // settings: Settings, - // onSaveSettings: Function, + settings: Settings, + saveSettings: Function, // unlock: Function, } type State = {} +const mapStateToProps = state => ({ + username: state.settings, +}) + const mapDispatchToProps = { unlock, } class TabProfile extends PureComponent { - state = {} + state = { + username: this.props.settings.username, + } + + handleChangeUsername = username => { + const { saveSettings } = this.props + this.setState({ username }) + window.requestIdleCallback(() => { + saveSettings({ username: username.trim() || 'Anonymous' }) + }) + } render() { const { t } = this.props + const { username } = this.state return (
@@ -45,7 +60,12 @@ class TabProfile extends PureComponent { /> - {'-'} + {'-'} @@ -65,4 +85,4 @@ class TabProfile extends PureComponent { } } -export default connect(null, mapDispatchToProps)(TabProfile) +export default connect(mapStateToProps, mapDispatchToProps)(TabProfile) diff --git a/src/components/TopBar.js b/src/components/TopBar.js index 990c8a91..5193475c 100644 --- a/src/components/TopBar.js +++ b/src/components/TopBar.js @@ -75,6 +75,7 @@ const DropDownItem = styled(DDItem).attrs({ ` const mapStateToProps = state => ({ + username: state.settings.username, hasAccounts: getAccounts(state).length > 0, hasPassword: hasPassword(state), }) @@ -88,6 +89,7 @@ type Props = { hasAccounts: boolean, hasPassword: boolean, lock: Function, + username: string, } type State = { @@ -145,7 +147,7 @@ class TopBar extends PureComponent { handleLock = () => this.props.lock() render() { - const { hasPassword, hasAccounts, t } = this.props + const { hasPassword, hasAccounts, username, t } = this.props const { sync } = this.state return ( @@ -197,7 +199,7 @@ class TopBar extends PureComponent { justifyContent="center" offsetTop={-2} > - {'Khalil Benihoud'} + {username} diff --git a/src/reducers/settings.js b/src/reducers/settings.js index 0ab84c52..9775eb56 100644 --- a/src/reducers/settings.js +++ b/src/reducers/settings.js @@ -10,6 +10,7 @@ import type { Settings } from 'types/common' export type SettingsState = Object const defaultState: SettingsState = { + username: 'Anonymous', counterValue: 'USD', language: 'en', orderAccounts: 'balance|asc',