Ui 2 updates subscribe (#6027)

* Add account & vault APIs

* Additional status methods

* Move permission modals into Dapp

* Adjust display position

* Don't publish invalid events

* Cleanup Wallet display

* Update package-lock

* Align icon buttons center

* Adjust account selectors

* Adjust wallet white

* Allow display of boolean/false values

* Pass value through correctly for disabled inputs

* Split requests into sections

* onClict -> onClick

* Update label

* Update skip step

* Connect provider interfaces
This commit is contained in:
Jaco Greeff 2017-07-10 11:04:29 +02:00 committed by GitHub
parent 76f0247f5d
commit cbcda140ec
14 changed files with 126 additions and 105 deletions

39
js/package-lock.json generated
View File

@ -1559,9 +1559,9 @@
"integrity": "sha1-k4NwpXtKUd6ix3wV1cX9+JUWQAk="
},
"commander": {
"version": "2.10.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.10.0.tgz",
"integrity": "sha512-q/r9trjmuikWDRJNTBHAVnWhuU6w+z80KgBq7j9YDclik5E7X4xi0KnlZBNFA1zOQ+SH/vHMWd2mC9QTOz7GpA=="
"version": "2.11.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-2.11.0.tgz",
"integrity": "sha512-b0553uYA5YAEGgyYIGYROzKQ7X5RAqedkfjiZxwi0kL1g3bOaBNNZfYkzt/CL0umgD5wc9Jec2FbB98CjkMRvQ=="
},
"commondir": {
"version": "1.0.1",
@ -4120,7 +4120,8 @@
"graceful-readlink": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/graceful-readlink/-/graceful-readlink-1.0.1.tgz",
"integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU="
"integrity": "sha1-TK+tdrxi8C+gObL5Tpo906ORpyU=",
"dev": true
},
"growl": {
"version": "1.9.2",
@ -4729,9 +4730,9 @@
"dev": true
},
"irregular-plurals": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.2.0.tgz",
"integrity": "sha1-OPKZg0uowAwwvpxVThNyaXUv86w=",
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/irregular-plurals/-/irregular-plurals-1.3.0.tgz",
"integrity": "sha512-njf5A+Mxb3kojuHd1DzISjjIl+XhyzovXEOyPPSzdQozq/Lf2tN27mOrAAsxEPZxpn6I4MGzs1oo9TxXxPFpaA==",
"dev": true
},
"is-absolute": {
@ -6793,9 +6794,9 @@
"dev": true
},
"postcss": {
"version": "6.0.4",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.4.tgz",
"integrity": "sha1-VzrN33P0LsskqmGNQO49WnwEplQ=",
"version": "6.0.5",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.5.tgz",
"integrity": "sha1-76NPdFyiW9Ozy9FapOAxErgjfzw=",
"dev": true
},
"supports-color": {
@ -6831,9 +6832,9 @@
"dev": true
},
"postcss": {
"version": "6.0.4",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.4.tgz",
"integrity": "sha1-VzrN33P0LsskqmGNQO49WnwEplQ=",
"version": "6.0.5",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.5.tgz",
"integrity": "sha1-76NPdFyiW9Ozy9FapOAxErgjfzw=",
"dev": true
},
"supports-color": {
@ -6869,9 +6870,9 @@
"dev": true
},
"postcss": {
"version": "6.0.4",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.4.tgz",
"integrity": "sha1-VzrN33P0LsskqmGNQO49WnwEplQ=",
"version": "6.0.5",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.5.tgz",
"integrity": "sha1-76NPdFyiW9Ozy9FapOAxErgjfzw=",
"dev": true
},
"supports-color": {
@ -6907,9 +6908,9 @@
"dev": true
},
"postcss": {
"version": "6.0.4",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.4.tgz",
"integrity": "sha1-VzrN33P0LsskqmGNQO49WnwEplQ=",
"version": "6.0.5",
"resolved": "https://registry.npmjs.org/postcss/-/postcss-6.0.5.tgz",
"integrity": "sha1-76NPdFyiW9Ozy9FapOAxErgjfzw=",
"dev": true
},
"supports-color": {

View File

@ -43,11 +43,6 @@ export default class Eth {
}, timeout);
};
if (!this._api.transport.isConnected) {
nextTimeout(500);
return;
}
return this._api.eth
.blockNumber()
.then((blockNumber) => {

View File

@ -53,11 +53,6 @@ export default class Personal {
}
};
if (!this._api.transport.isConnected) {
nextTimeout(500);
return;
}
return this._api.parity
.defaultAccount()
.then((defaultAccount) => {

View File

@ -15,31 +15,55 @@
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
export default {
'parity_accountsInfo': {},
'parity_allAccountsInfo': {},
'parity_changeVault': {},
'parity_changeVaultPassword': {},
'parity_consensusCapability': {},
'parity_checkRequest': {},
'parity_closeVault': {},
'parity_executeUpgrade': {},
'parity_generateSecretPhrase': {},
'parity_getVaultMeta': {},
'parity_hashContent': {},
'parity_importGethAccounts': {},
'parity_localTransactions': {},
'parity_listGethAccounts': {},
'parity_listVaults': {},
'parity_listOpenedVaults': {},
'parity_newAccountFromPhrase': {},
'parity_newAccountFromSecret': {},
'parity_newAccountFromWallet': {},
'parity_newVault': {},
'parity_openVault': {},
'parity_phraseToAddress': {},
'parity_setAccountMeta': {},
'parity_setAccountName': {},
'parity_setVaultMeta': {},
'parity_upgradeReady': {},
'parity_versionInfo': {}
accountsView: {
methods: [
'parity_accountsInfo',
'parity_allAccountsInfo'
]
},
accountsCreate: {
methods: [
'parity_generateSecretPhrase',
'parity_importGethAccounts',
'parity_listGethAccounts',
'parity_newAccountFromPhrase',
'parity_newAccountFromSecret',
'parity_newAccountFromWallet',
'parity_phraseToAddress'
]
},
accountsEdit: {
methods: [
'parity_setAccountName',
'parity_setAccountMeta'
]
},
upgrade: {
methods: [
'parity_consensusCapability',
'parity_executeUpgrade',
'parity_upgradeReady',
'parity_versionInfo'
]
},
vaults: {
methods: [
'parity_changeVault',
'parity_changeVaultPassword',
'parity_closeVault',
'parity_getVaultMeta',
'parity_listVaults',
'parity_listOpenedVaults',
'parity_newVault',
'parity_openVault',
'parity_setVaultMeta'
]
},
other: {
methods: [
'parity_checkRequest',
'parity_hashContent',
'parity_localTransactions'
]
}
};

View File

@ -39,7 +39,8 @@ export default class Store {
const duplicates = {};
return this.requests.filter(({ request: { data: { method, token } } }) => {
const id = `${token}:${method}`;
const section = this.getFilteredSectionName(method);
const id = `${token}:${section}`;
if (!duplicates[id]) {
duplicates[id] = true;
@ -71,10 +72,11 @@ export default class Store {
if (approveAll) {
const { request: { data: { method, token } } } = queued;
const requests = this.findMatchingRequests(method, token);
this.methodsStore.addTokenPermission(method, token);
requests.forEach(this.approveSingleRequest);
this.getFilteredSection(method).methods.forEach((m) => {
this.methodsStore.addTokenPermission(m, token);
this.findMatchingRequests(m, token).forEach(this.approveSingleRequest);
});
} else {
this.approveSingleRequest(queued);
}
@ -115,6 +117,16 @@ export default class Store {
});
}
getFilteredSectionName = (method) => {
return Object.keys(filteredRequests).find((key) => {
return filteredRequests[key].methods.includes(method);
});
}
getFilteredSection = (method) => {
return filteredRequests[this.getFilteredSectionName(method)];
}
receiveMessage = ({ data, origin, source }) => {
if (!data) {
return;
@ -126,7 +138,7 @@ export default class Store {
return;
}
if (filteredRequests[method] && !this.methodsStore.hasTokenPermission(method, token)) {
if (this.getFilteredSection(method) && !this.methodsStore.hasTokenPermission(method, token)) {
this.queueRequest({ data, origin, source });
return;
}

View File

@ -14,6 +14,7 @@
// You should have received a copy of the GNU General Public License
// along with Parity. If not, see <http://www.gnu.org/licenses/>.
import { flatten } from 'lodash';
import { action, observable } from 'mobx';
import store from 'store';
@ -24,7 +25,9 @@ import filteredRequests from '../../DappRequests/filteredRequests';
const LS_PERMISSIONS = '_parity::dapps::methods';
export default class Store {
@observable filteredRequests = Object.keys(filteredRequests);
@observable filteredRequests = flatten(
Object.keys(filteredRequests).map((key) => filteredRequests[key].methods)
);
@observable modalOpen = false;
@observable permissions = {};
@observable tokens = {};

View File

@ -166,7 +166,7 @@ export default function TnC ({ hasAccepted, onAccept }) {
/>
}
checked={ hasAccepted }
onClict={ onAccept }
onClick={ onAccept }
/>
</div>
);

View File

@ -314,7 +314,7 @@ class FirstRun extends Component {
}
skipAccountCreation = () => {
this.setState({ stage: this.state.stage + 2 });
this.setState({ stage: this.state.stage + 3 });
}
printPhrase = () => {

View File

@ -19,7 +19,7 @@ import { Checkbox as SemanticCheckbox } from 'semantic-ui-react';
import { nodeOrStringProptype } from '@parity/shared/util/proptypes';
import LabelWrapper from '../LabelWrapper';
import Label from '../Label';
export default function Checkbox ({ checked = false, className, label, onClick, style }) {
return (
@ -27,7 +27,7 @@ export default function Checkbox ({ checked = false, className, label, onClick,
checked={ checked }
className={ className }
label={
<LabelWrapper label={ label } />
<Label label={ label } />
}
onClick={ onClick }
style={ style }

View File

@ -113,6 +113,11 @@ export default class Input extends Component {
render () {
const { children, className, defaultValue, disabled, error, hint, label, max, min, onClick, readOnly, step, style, tabIndex, type } = this.props;
const { value } = this.state;
const displayValue = typeof value !== 'undefined'
? value
: defaultValue;
console.log('Input', displayValue, parseI18NString(this.context, `${displayValue}`));
return (
<LabelWrapper
@ -141,11 +146,11 @@ export default class Input extends Component {
step={ step }
style={ style }
tabIndex={ tabIndex }
value={ parseI18NString(this.context, value || defaultValue) }
>
{ this.renderCopyButton() }
<input
type={ type }
value={ parseI18NString(this.context, `${displayValue}`) }
/>
{ children }
</SemanticInput>

View File

@ -66,7 +66,16 @@ class InputAddress extends Component {
classes.push(!icon ? styles.inputEmpty : styles.input);
const containerClasses = [ styles.container ];
const nullName = (disabled || readOnly) && isNullAddress(value) ? 'null' : null;
const nullName = (disabled || readOnly) && isNullAddress(value)
? 'null'
: null;
// FIXME: The is not advisable, fixes the display issue, however the name should come from
// a common component.
// account.name || (value ? 'UNNAMED' : value)
const displayValue = text && account
? (account.name || (value ? 'UNNAMED' : value))
: (nullName || value);
if (small) {
containerClasses.push(styles.small);
@ -78,9 +87,6 @@ class InputAddress extends Component {
props.focused = focused;
}
// FIXME: The is not advisable, fixes the display issue, however the name should come from
// a common component.
// account.name || (value ? 'UNNAMED' : value)
return (
<div className={ containerClasses.join(' ') }>
<Input
@ -98,11 +104,7 @@ class InputAddress extends Component {
onSubmit={ this.onSubmit }
readOnly={ readOnly }
tabIndex={ tabIndex }
value={
text && account
? (account.name || (value ? 'UNNAMED' : value))
: (nullName || value)
}
value={ displayValue }
{ ...props }
/>
{ icon }

View File

@ -80,23 +80,31 @@
}
.identities {
align-items: center;
display: flex;
.identity {
border: 1px solid transparent;
cursor: pointer;
flex: 0 1 12.5%;
padding: 0.75em 0;
text-align: center;
width: 12.5% !important;
> img {
border: 2px solid transparent;
box-sizing: content-box;
padding: 1em;
}
&.selected {
> img {
background: white;
border-color: #2185D0;
border-radius: 8px;
background: rgba(200, 200, 225, 0.5);
}
}
&.unselected {
opacity: 0.75;
}
}
}

View File

@ -70,7 +70,6 @@
.detail {
font-size: 1.125em;
color: white;
margin: 0 0.375em;
line-height: 1.5em;

View File

@ -39,29 +39,6 @@ import styles from './wallet.css';
const accountsHistory = HistoryStore.get('accounts');
class WalletContainer extends Component {
static propTypes = {
netVersion: PropTypes.string.isRequired
};
render () {
const { netVersion, ...others } = this.props;
if (netVersion === '0') {
return (
<Loading size='large' />
);
}
return (
<Wallet
netVersion={ netVersion }
{ ...others }
/>
);
}
}
class Wallet extends Component {
static contextTypes = {
api: PropTypes.object.isRequired
@ -422,4 +399,4 @@ function mapDispatchToProps (dispatch) {
export default connect(
mapStateToProps,
mapDispatchToProps
)(WalletContainer);
)(Wallet);