TheDude
/
ciphermask
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Reorder Account Selector and Account Options

Browse Source
feature/default_network_editable
sdtsui 7 years ago
parent f329c232a2
commit 9e8e445695
2 changed files with 128 additions and 115 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 5
      ui/responsive/app/app.js
  2. 238
      ui/responsive/app/components/account-dropdowns.js

5
ui/responsive/app/app.js
Unescape View File

@ -210,6 +210,7 @@ App.prototype.renderNetworkDropdown = function () {
}, },
innerStyle: {}, innerStyle: {},
}, [ }, [
h( h(
DropdownMenuItem, DropdownMenuItem,
{ {
@ -233,7 +234,8 @@ App.prototype.renderNetworkDropdown = function () {
h('.menu-icon.red-dot'), h('.menu-icon.red-dot'),
'Ropsten Test Network', 'Ropsten Test Network',
providerType === 'ropsten' ? h('.check', '✓') : null, providerType === 'ropsten' ? h('.check', '✓') : null,
]), ]
),
h( h(
DropdownMenuItem, DropdownMenuItem,
@ -289,6 +291,7 @@ App.prototype.renderNetworkDropdown = function () {
activeNetwork === 'custom' ? h('.check', '✓') : null, activeNetwork === 'custom' ? h('.check', '✓') : null,
] ]
), ),
]) ])
} }

238
ui/responsive/app/components/account-dropdowns.js
Unescape View File

@ -14,12 +14,12 @@ class AccountDropdowns extends Component {
constructor (props) { constructor (props) {
super(props) super(props)
this.state = { this.state = {
overflowMenuActive: false, accountSelectorActive: false,
switchingMenuActive: false, optionsMenuActive: false,
} }
} }
getAccounts () { renderAccounts () {
const { identities, selected } = this.props const { identities, selected } = this.props
return Object.keys(identities).map((key) => { return Object.keys(identities).map((key) => {
@ -49,9 +49,122 @@ class AccountDropdowns extends Component {
}) })
} }
renderAccountSelector () {
const { actions } = this.props
const { accountSelectorActive } = this.state
return h(
Dropdown,
{
style: {
marginLeft: '-125px',
minWidth: '180px',
},
isOpen: accountSelectorActive,
onClickOutside: () => { this.setState({ accountSelectorActive: false }) },
},
[
...this.renderAccounts(),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => actions.addNewAccount(),
},
[
h(
Identicon,
{
diameter: 16,
},
),
h('span', { style: { marginLeft: '10px' } }, 'Create Account'),
],
),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => actions.showImportPage(),
},
[
h(
Identicon,
{
diameter: 16,
},
),
h('span', { style: { marginLeft: '10px' } }, 'Import Account'),
]
),
]
)
}
renderAccountOptions () {
const { actions } = this.props
const { optionsMenuActive } = this.state
return h(
Dropdown,
{
style: {
marginLeft: '-162px',
minWidth: '180px',
},
isOpen: optionsMenuActive,
onClickOutside: () => { this.setState({ optionsMenuActive: false }) },
},
[
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => actions.showConfigPage(),
},
'Account Settings',
),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => {
const { selected, network } = this.props
const url = genAccountLink(selected, network)
global.platform.openWindow({ url })
},
},
'View account on Etherscan',
),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => {
const { selected } = this.props
const checkSumAddress = selected && ethUtil.toChecksumAddress(selected)
copyToClipboard(checkSumAddress)
},
},
'Copy Address to clipboard',
),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => {
actions.requestAccountExport()
},
},
'Export Private Key',
),
]
)
}
render () { render () {
const { style, actions } = this.props const { style } = this.props
const { switchingMenuActive, overflowMenuActive } = this.state const { optionsMenuActive, accountSelectorActive } = this.state
return h( return h(
'span', 'span',
@ -66,68 +179,12 @@ class AccountDropdowns extends Component {
onClick: (event) => { onClick: (event) => {
event.stopPropagation() event.stopPropagation()
this.setState({ this.setState({
switchingMenuActive: !switchingMenuActive, accountSelectorActive: !accountSelectorActive,
overflowMenuActive: false, optionsMenuActive: false,
}) })
}, },
}, },
[ this.renderAccountSelector(),
h(
Dropdown,
{
style: {
marginLeft: '-140px',
minWidth: '180px',
},
isOpen: switchingMenuActive,
onClickOutside: () => { this.setState({ switchingMenuActive: false}) },
},
[
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => actions.showConfigPage(),
},
'Account Settings',
),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => {
const { selected, network } = this.props
const url = genAccountLink(selected, network)
global.platform.openWindow({ url })
},
},
'View account on Etherscan',
),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => {
const { selected } = this.props
const checkSumAddress = selected && ethUtil.toChecksumAddress(selected)
copyToClipboard(checkSumAddress)
},
},
'Copy Address to clipboard',
),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => {
actions.requestAccountExport()
},
},
'Export Private Key',
),
]
),
],
), ),
h( h(
'i.fa.fa-ellipsis-h', 'i.fa.fa-ellipsis-h',
@ -136,59 +193,12 @@ class AccountDropdowns extends Component {
onClick: (event) => { onClick: (event) => {
event.stopPropagation() event.stopPropagation()
this.setState({ this.setState({
overflowMenuActive: !overflowMenuActive, accountSelectorActive: false,
switchingMenuActive: false, optionsMenuActive: !optionsMenuActive,
}) })
}, },
}, },
[ this.renderAccountOptions()
h(
Dropdown,
{
style: {
marginLeft: '-155px',
minWidth: '180px',
},
isOpen: overflowMenuActive,
onClickOutside: () => { this.setState({ overflowMenuActive: false}) },
},
[
...this.getAccounts(),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => actions.addNewAccount(),
},
[
h(
Identicon,
{
diameter: 16,
},
),
h('span', { style: { marginLeft: '10px' } }, 'Create Account'),
],
),
h(
DropdownMenuItem,
{
closeMenu: () => {},
onClick: () => actions.showImportPage(),
},
[
h(
Identicon,
{
diameter: 16,
},
),
h('span', { style: { marginLeft: '10px' } }, 'Import Account'),
]
),
]
),
]
), ),
] ]
) )

Write Preview
Loading…
Cancel
Save