Rename Stake -> Validate, show controller/stash (#853)

* Rename Stake -> Validate, show controller/stash

* Small styling updates

* account -> controller account
This commit is contained in:
Jaco Greeff 2019-03-27 12:10:12 +01:00 committed by GitHub
parent 479924ab52
commit 50092a7b74
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 150 additions and 100 deletions

View File

@ -1,3 +1,8 @@
# 0.27.1
- Bring in new staking & nominating functions
- New faster crypto algorithms
# 0.26.1
- Swap keyring to HDKD derivation, mnemonic keys are now not backwards compatible with those created earlier. (Defaults are still for ed25519)

View File

@ -12,7 +12,7 @@ import translate from '../translate';
type Props = I18nProps & {
accountId: string,
sessionId: string,
bondedId: string,
isOpen: boolean,
onClose: () => void
};
@ -76,7 +76,7 @@ class Bonding extends React.PureComponent<Props, State> {
}
private renderContent () {
const { accountId, sessionId, t } = this.props;
const { accountId, bondedId, t } = this.props;
const { controllerId } = this.state;
return (
@ -93,7 +93,7 @@ class Bonding extends React.PureComponent<Props, State> {
/>
<InputAddress
className='medium'
defaultValue={sessionId}
defaultValue={bondedId}
label={t('controller account')}
onChange={this.onChangeController}
value={controllerId}

View File

@ -93,7 +93,7 @@ class Nominating extends React.PureComponent<Props, State> {
className='medium'
defaultValue={accountId}
isDisabled
label={t('account')}
label={t('controller account')}
/>
<InputAddress
className='medium'

View File

@ -105,7 +105,7 @@ class Staking extends React.PureComponent<Props, State> {
className='medium'
defaultValue={accountId}
isDisabled
label={t('account')}
label={t('controller account')}
/>
<InputAddress
className='medium'

View File

@ -12,9 +12,9 @@ import { AddressMini, AddressSummary, Button, TxButton } from '@polkadot/ui-app'
import { withCalls } from '@polkadot/ui-api';
import Bonding from './Bonding';
import SessionKey from './SessionKey';
import Staking from './Staking';
import Nominating from './Nominating';
import SessionKey from './SessionKey';
import Validating from './Validating';
import translate from '../translate';
type Props = ApiProps & I18nProps & {
@ -35,9 +35,9 @@ type Props = ApiProps & I18nProps & {
type State = {
isBondingOpen: boolean,
isKeyOpen: boolean,
isNominateOpen: boolean,
isStakingOpen: boolean,
isSessionKeyOpen: boolean,
isValidatingOpen: boolean,
isUnbondOpen: boolean,
bondedId: string | null,
sessionId: string | null,
@ -48,9 +48,9 @@ type State = {
class Account extends React.PureComponent<Props, State> {
state: State = {
isBondingOpen: false,
isKeyOpen: false,
isSessionKeyOpen: false,
isNominateOpen: false,
isStakingOpen: false,
isValidatingOpen: false,
isUnbondOpen: false,
bondedId: null,
sessionId: null,
@ -82,8 +82,8 @@ class Account extends React.PureComponent<Props, State> {
<article className='staking--Account'>
{this.renderBonding()}
{this.renderNominating()}
{this.renderKey()}
{this.renderStaking()}
{this.renderSessionKey()}
{this.renderValidating()}
<AddressSummary
balance={balanceArray(accountId)}
name={name}
@ -92,6 +92,8 @@ class Account extends React.PureComponent<Props, State> {
>
<div className='staking--Account-expand'>
{this.renderButtons()}
{this.renderBondedId()}
{this.renderStashId()}
{this.renderNominee()}
{this.renderNominators()}
</div>
@ -102,50 +104,50 @@ class Account extends React.PureComponent<Props, State> {
private renderBonding () {
const { accountId } = this.props;
const { sessionId, isBondingOpen } = this.state;
const { bondedId, isBondingOpen } = this.state;
if (!sessionId) {
if (!bondedId) {
return null;
}
return (
<Bonding
accountId={accountId}
sessionId={sessionId}
bondedId={bondedId}
isOpen={isBondingOpen}
onClose={this.toggleBonding}
/>
);
}
private renderStaking () {
private renderValidating () {
const { accountId, staking_validators } = this.props;
const { isStakingOpen, stashId } = this.state;
const { isValidatingOpen, stashId } = this.state;
if (!staking_validators || !isStakingOpen || !stashId) {
if (!staking_validators || !isValidatingOpen || !stashId) {
return null;
}
return (
<Staking
<Validating
accountId={accountId}
isOpen
onClose={this.toggleStaking}
onClose={this.toggleValidating}
preferences={staking_validators}
stashId={stashId}
/>
);
}
private renderKey () {
private renderSessionKey () {
const { accountId } = this.props;
const { isKeyOpen } = this.state;
const { isSessionKeyOpen } = this.state;
return (
<SessionKey
accountId={accountId}
isOpen={isKeyOpen}
onClose={this.toggleKey}
isOpen={isSessionKeyOpen}
onClose={this.toggleSessionKey}
/>
);
}
@ -177,11 +179,14 @@ class Account extends React.PureComponent<Props, State> {
}
return (
<AddressMini
balance={balanceArray(nomineeId)}
value={nomineeId}
withBalance
/>
<div className='staking--Account-detail'>
<label className='staking--label'>nominating</label>
<AddressMini
balance={balanceArray(nomineeId)}
value={nomineeId}
withBalance
/>
</div>
);
}
@ -193,15 +198,54 @@ class Account extends React.PureComponent<Props, State> {
}
return (
<div className='ui--Nominators'>
{staking_nominatorsFor.map((nominator) => (
<AddressMini
isPadded={false}
key={nominator}
value={nominator}
withBalance
/>
))}
<div className='staking--Account-detail'>
<label className='staking--label'>nominators</label>
<div className='ui--Nominators'>
{staking_nominatorsFor.map((nominator) => (
<AddressMini
isPadded={false}
key={nominator}
value={nominator}
withBalance
/>
))}
</div>
</div>
);
}
private renderBondedId () {
const { bondedId } = this.state;
if (!bondedId) {
return null;
}
return (
<div className='staking--Account-detail'>
<label className='staking--label'>controller account</label>
<AddressMini
value={bondedId}
withBalance
/>
</div>
);
}
private renderStashId () {
const { stashId } = this.state;
if (!stashId) {
return null;
}
return (
<div className='staking--Account-detail'>
<label className='staking--label'>stash account</label>
<AddressMini
value={stashId}
withBalance
/>
</div>
);
}
@ -232,17 +276,7 @@ class Account extends React.PureComponent<Props, State> {
const buttons = [];
if (!stashId) {
buttons.push(
<Button
isPrimary
key='session'
onClick={this.toggleKey}
label={t('Set Session Key')}
/>
);
if (sessionId) {
buttons.push(<Button.Or key='bond.or' />);
buttons.push(
<Button
isPrimary
@ -251,6 +285,15 @@ class Account extends React.PureComponent<Props, State> {
label={t('Bond')}
/>
);
} else {
buttons.push(
<Button
isPrimary
key='session'
onClick={this.toggleSessionKey}
label={t('Set Session Key')}
/>
);
}
} else {
// buttons.push(
@ -261,13 +304,13 @@ class Account extends React.PureComponent<Props, State> {
// onClick={this.toggleUnbond}
// />
// );
// buttons.push(<Button.Or key='stake.or' />);
// buttons.push(<Button.Or key='validate.or' />);
buttons.push(
<Button
isPrimary
key='stake'
onClick={this.toggleStaking}
label={t('Stake')}
key='validate'
onClick={this.toggleValidating}
label={t('Validate')}
/>
);
buttons.push(<Button.Or key='nominate.or' />);
@ -304,21 +347,21 @@ class Account extends React.PureComponent<Props, State> {
}));
}
private toggleKey = () => {
this.setState(({ isKeyOpen }) => ({
isKeyOpen: !isKeyOpen
}));
}
private toggleNominate = () => {
this.setState(({ isNominateOpen }) => ({
isNominateOpen: !isNominateOpen
}));
}
private toggleStaking = () => {
this.setState(({ isStakingOpen }) => ({
isStakingOpen: !isStakingOpen
private toggleSessionKey = () => {
this.setState(({ isSessionKeyOpen }) => ({
isSessionKeyOpen: !isSessionKeyOpen
}));
}
private toggleValidating = () => {
this.setState(({ isValidatingOpen }) => ({
isValidatingOpen: !isValidatingOpen
}));
}

View File

@ -3,8 +3,6 @@
/* of the Apache-2.0 license. See the LICENSE file for details. */
.staking--App {
padding: 1em 2rem;
.rx--updated {
background: transparent !important;
}
@ -18,14 +16,10 @@
.staking--Account {
display: inline-block;
position: relative;
}
.staking--Account .ui--Button-Group {
margin-bottom: 1em;
}
.staking--Account .ui--AddressMini {
display: block;
.ui--AddressMini {
display: block;
}
}
.ui--Nominators {
@ -102,3 +96,11 @@
font-weight: normal;
line-height: 1.2rem;
}
.staking--Account-detail {
margin-top: 0.75rem;
.staking--label {
margin-bottom: -0.25rem;
}
}

View File

@ -14,7 +14,7 @@
"dependencies": {
"@babel/runtime": "^7.4.0",
"@polkadot/ui-app": "^0.27.0-beta.15",
"@polkadot/ui-assets": "^0.33.1",
"@polkadot/ui-assets": "^0.34.0-beta.0",
"@polkadot/ui-signer": "^0.27.0-beta.15",
"@types/react-tooltip": "^3.9.1",
"react-tooltip": "^3.9.2"

View File

@ -32,7 +32,7 @@
"dependencies": {
"@babel/runtime": "^7.4.0",
"@polkadot/api": "^0.52.0-beta.1",
"@polkadot/ui-util": "^0.33.1",
"@polkadot/ui-util": "^0.34.0-beta.0",
"rxjs-compat": "^6.3.2"
}
}

View File

@ -12,11 +12,11 @@
"dependencies": {
"@babel/runtime": "^7.4.0",
"@polkadot/ui-api": "^0.27.0-beta.15",
"@polkadot/ui-identicon": "^0.33.1",
"@polkadot/ui-keyring": "^0.33.1",
"@polkadot/ui-identicon": "^0.34.0-beta.0",
"@polkadot/ui-keyring": "^0.34.0-beta.0",
"@polkadot/ui-reactive": "^0.27.0-beta.15",
"@polkadot/ui-settings": "^0.33.1",
"@polkadot/ui-util": "^0.33.1",
"@polkadot/ui-settings": "^0.34.0-beta.0",
"@polkadot/ui-util": "^0.34.0-beta.0",
"@types/chart.js": "^2.7.45",
"@types/classnames": "^2.2.7",
"@types/i18next": "^12.1.0",

View File

@ -1809,20 +1809,20 @@
"@polkadot/keyring" "^0.42.0-beta.1"
"@polkadot/util" "^0.42.0-beta.1"
"@polkadot/ui-assets@^0.33.1":
version "0.33.1"
resolved "https://registry.yarnpkg.com/@polkadot/ui-assets/-/ui-assets-0.33.1.tgz#bfd242aa98c9b7cffba13d6c542f314487322739"
integrity sha512-7rGxD1O5Q7PxkBnf4CvLrgfPX6OZFSCfcSr0ZewNMP/qCkgGaXuQwGGmPcnbuyjg/pJEVVD7l7Ibj495xnwEkw==
"@polkadot/ui-assets@^0.34.0-beta.0":
version "0.34.0-beta.0"
resolved "https://registry.yarnpkg.com/@polkadot/ui-assets/-/ui-assets-0.34.0-beta.0.tgz#e5ed52c3b306167d97e1af2c4658354bbc73b9bb"
integrity sha512-YlG0X1J+U1QpdMsR5dcwV0hEKwRIvYpTVlx9mBoTzx2ezsscWybBSbU8Dabq0CEiDNsO3OxDFmjNOEMnWS/KCw==
dependencies:
"@babel/runtime" "^7.3.4"
"@polkadot/ui-identicon@^0.33.1":
version "0.33.1"
resolved "https://registry.yarnpkg.com/@polkadot/ui-identicon/-/ui-identicon-0.33.1.tgz#12002ab1106123da4dffdce1598d39e63fa7c91b"
integrity sha512-zRJ363qeZBmQRfTFBaWm068FPVrgIzEgZ6LlY7rYAksGfrDiJPgYNjlRtmdLVGDge1HZ++YvDRtMypqKOF9lWA==
"@polkadot/ui-identicon@^0.34.0-beta.0":
version "0.34.0-beta.0"
resolved "https://registry.yarnpkg.com/@polkadot/ui-identicon/-/ui-identicon-0.34.0-beta.0.tgz#c4ceec38eefd8baaa6d2aa08e8cb2322213dad41"
integrity sha512-afLgmONDSPeyzWCxEks2V3W780af6LfquJThAeGyn4KfD9YUe+nilQ41UW9ChKzgOFuzZ4gKHP9M5uh4gT541Q==
dependencies:
"@babel/runtime" "^7.3.4"
"@polkadot/ui-settings" "^0.33.1"
"@polkadot/ui-settings" "^0.34.0-beta.0"
"@types/color" "^3.0.0"
"@types/react-copy-to-clipboard" "^4.2.6"
color "^3.0.0"
@ -1830,10 +1830,10 @@
react-copy-to-clipboard "^5.0.1"
styled-components "^4.1.3"
"@polkadot/ui-keyring@^0.33.1":
version "0.33.1"
resolved "https://registry.yarnpkg.com/@polkadot/ui-keyring/-/ui-keyring-0.33.1.tgz#5614fcc493bb241435c97d1819a2f383299ee4d3"
integrity sha512-d0Ur1lUsTESkaW8L01vwTwS0NPBiIzm7saIeCqI964hf52hrRKm56BWXcCGPZrEg6JI9MpYsHyoN2nQ+LVbd4g==
"@polkadot/ui-keyring@^0.34.0-beta.0":
version "0.34.0-beta.0"
resolved "https://registry.yarnpkg.com/@polkadot/ui-keyring/-/ui-keyring-0.34.0-beta.0.tgz#7e7932ccbdd49dd92d5f1b8fdcd5cdc23f799a97"
integrity sha512-Oo2s/Naj/d0GwV82Gup8IdGurrDgmzgzZWdrOiyqGqHBTSKG8r4djXn21MM5KDxlz71m8iXLNQrpu9Ju8hkv7w==
dependencies:
"@babel/runtime" "^7.3.4"
"@types/store" "^2.0.1"
@ -1841,20 +1841,20 @@
store "^2.0.12"
styled-components "^4.1.3"
"@polkadot/ui-settings@^0.33.1":
version "0.33.1"
resolved "https://registry.yarnpkg.com/@polkadot/ui-settings/-/ui-settings-0.33.1.tgz#3e483854b1c9ae37d0a6d67c47f81e0b803c5a3d"
integrity sha512-aytL4MOLu2EWFujDVwN60I5RDeqdRULo4zq8yDK3w783LPHNKXaPBrUyVteE4K+CsstNKTjuxWhqDE5Gw6F1pw==
"@polkadot/ui-settings@^0.34.0-beta.0":
version "0.34.0-beta.0"
resolved "https://registry.yarnpkg.com/@polkadot/ui-settings/-/ui-settings-0.34.0-beta.0.tgz#3de4f009bea66e079ede9d40da4257a7b5fbe5be"
integrity sha512-AbW/HXwkIPi979t+S/GRm4GuK0YhHWoUYjmVJK5pGK6HMpCh8E3ACs2v76l22WHSYKz3lCiuPj42yrFsLHLrPQ==
dependencies:
"@babel/runtime" "^7.3.4"
"@polkadot/util" "^0.40.1"
"@polkadot/util" "^0.42.0-beta.1"
"@types/store" "^2.0.1"
store "^2.0.12"
"@polkadot/ui-util@^0.33.1":
version "0.33.1"
resolved "https://registry.yarnpkg.com/@polkadot/ui-util/-/ui-util-0.33.1.tgz#44a9cd32099c93a820c9a62fb2d383800f192220"
integrity sha512-CYvjMF9gTPyqD9/01Qu9xOazjbiqwz9gyVJ3YX/nmuyk1VkEaW3q+7PUQmThbfoCd02s+/epOKO3+l+Pho/5oQ==
"@polkadot/ui-util@^0.34.0-beta.0":
version "0.34.0-beta.0"
resolved "https://registry.yarnpkg.com/@polkadot/ui-util/-/ui-util-0.34.0-beta.0.tgz#f81c2b74ab0b1e586938b6e91112a4292f2a69d7"
integrity sha512-JNLWr5AhOYZ1Gpk7LW9fNrRPlkv31Ced5gL7Zq35p8n+Q8jhRgb+S6Jla0/q4b7+6WQ4dFicRXQ5ej2QxMLB1Q==
dependencies:
"@babel/runtime" "^7.3.4"
@ -1880,7 +1880,7 @@
tweetnacl "^1.0.1"
xxhashjs "^0.2.2"
"@polkadot/util@^0.40.1", "@polkadot/util@^0.42.0-beta.1":
"@polkadot/util@^0.42.0-beta.1":
version "0.42.0-beta.1"
resolved "https://registry.yarnpkg.com/@polkadot/util/-/util-0.42.0-beta.1.tgz#93baa0fc129467237b7eb226e14fafffd160f4e9"
integrity sha512-PZC/yArV5D4J//IkqYwPo1rmlLzwf1SDWE4COOSDZJfU1hGjrwucDre/jwtQFQjZAUv458BXiFUHxgEd5dHX2w==