Add relevant icons to top-level buttons (#1618)

* Add relevant icons to top-level buttons

* Add some missing icons

* Add some missing icons

* Add missing icons
This commit is contained in:
Bhanu Teja P 2019-09-19 16:27:10 +05:30 committed by Jaco Greeff
parent 6a38d24348
commit 01271da389
48 changed files with 100 additions and 0 deletions

View File

@ -43,6 +43,7 @@ export default class Transfer extends TxComponent<Props, State> {
<TxButton
accountId={accountId}
label='make transfer'
labelIcon='send'
params={[recipientId, amount]}
tx='balances.transfer'
ref={this.button}

View File

@ -54,18 +54,21 @@ function Overview ({ accounts = [], onStatusChange, t }: Props): React.ReactElem
<Button
isPrimary
label={t('Add account')}
labelIcon='add'
onClick={_toggleCreate}
/>
<Button.Or />
<Button
isPrimary
label={t('Restore JSON')}
labelIcon='sync'
onClick={_toggleImport}
/>
<Button.Or />
<Button
isPrimary
label={t('Add via Qr')}
labelIcon='qrcode'
onClick={_toggleQr}
/>
{isLedger() && (
@ -74,6 +77,7 @@ function Overview ({ accounts = [], onStatusChange, t }: Props): React.ReactElem
<Button
isPrimary
label={t('Query Ledger')}
labelIcon='question'
onClick={queryLedger}
/>
</>

View File

@ -103,6 +103,11 @@ class VanityApp extends TxComponent<Props, State> {
? t('Stop generation')
: t('Start generation')
}
labelIcon={
isRunning
? 'stop'
: 'sign-in'
}
ref={this.button}
/>
</Button.Group>

View File

@ -54,6 +54,7 @@ class Backup extends TxComponent<Props, State> {
<Button
isNegative
label={t('Cancel')}
labelIcon='cancel'
onClick={onClose}
/>
<Button.Or />
@ -61,6 +62,7 @@ class Backup extends TxComponent<Props, State> {
isDisabled={!isPassValid}
isPrimary
label={t('Download')}
labelIcon='download'
onClick={this.doBackup}
ref={this.button}
/>

View File

@ -57,6 +57,7 @@ class ChangePass extends TxComponent<Props, State> {
<Button
isNegative
label={t('Cancel')}
labelIcon='cancel'
onClick={onClose}
/>
<Button.Or />
@ -64,6 +65,7 @@ class ChangePass extends TxComponent<Props, State> {
isDisabled={!isNewValid || !isOldValid}
isPrimary
label={t('Change')}
labelIcon='sign-in'
onClick={this.doChange}
ref={this.button}
/>

View File

@ -135,6 +135,7 @@ class Create extends React.PureComponent<Props, State> {
<Button.Group>
<Button
label={t('Cancel')}
labelIcon='cancel'
onClick={this.onDiscard}
/>
<Button.Or />
@ -142,6 +143,7 @@ class Create extends React.PureComponent<Props, State> {
isDisabled={!isValid}
isPrimary
label={t('Save')}
labelIcon='save'
onClick={this.onShowWarning}
/>
</Button.Group>
@ -266,12 +268,14 @@ class Create extends React.PureComponent<Props, State> {
<Button
isNegative
label={t('Cancel')}
labelIcon='cancel'
onClick={this.onHideWarning}
/>
<Button.Or />
<Button
isPrimary
label={t('Create and backup account')}
labelIcon='sign-in'
onClick={this.onCommit}
/>
</Button.Group>

View File

@ -49,6 +49,7 @@ class Import extends TxComponent<Props, State> {
<Button.Group>
<Button
label={t('Cancel')}
labelIcon='cancel'
onClick={onClose}
/>
<Button.Or />
@ -57,6 +58,7 @@ class Import extends TxComponent<Props, State> {
isPrimary
onClick={this.onSave}
label={t('Restore')}
labelIcon='sync'
ref={this.button}
/>
</Button.Group>

View File

@ -87,6 +87,7 @@ function QrModal ({ className, onClose, onStatusChange, t }: Props): React.React
<Button.Group>
<Button
label={t('Cancel')}
labelIcon='cancel'
onClick={onClose}
/>
<Button.Or />
@ -95,6 +96,7 @@ function QrModal ({ className, onClose, onStatusChange, t }: Props): React.React
isPrimary
onClick={_onSave}
label={t('Create')}
labelIcon='sign-in'
/>
</Button.Group>
</Modal.Actions>

View File

@ -115,6 +115,7 @@ class Transfer extends React.PureComponent<Props, State> {
<Button
isNegative
label={t('Cancel')}
labelIcon='cancel'
onClick={onClose}
/>
<Button.Or />
@ -124,6 +125,7 @@ class Transfer extends React.PureComponent<Props, State> {
isDisabled={!hasAvailable}
isPrimary
label={t('Make Transfer')}
labelIcon='send'
onStart={onClose}
withSpinner={false}
/>

View File

@ -40,6 +40,7 @@ class Overview extends React.PureComponent<Props, State> {
<Button
isPrimary
label={t('Add contact')}
labelIcon='add'
onClick={this.toggleCreate}
/>
</Button.Group>

View File

@ -61,6 +61,7 @@ class Create extends React.PureComponent<Props, State> {
isNegative
onClick={this.onDiscard}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<Button
@ -68,6 +69,7 @@ class Create extends React.PureComponent<Props, State> {
isPrimary
onClick={this.onCommit}
label={t('Save')}
labelIcon='save'
/>
</Button.Group>
</Modal.Actions>

View File

@ -137,6 +137,7 @@ class App extends TxModal<Props, State> {
isPrimary
onClick={this.setStep(Step.Sign)}
label={t('Continue')}
labelIcon='sign-in'
/>
</Button.Group>
)}
@ -176,6 +177,7 @@ class App extends TxModal<Props, State> {
isPrimary
onClick={this.setStep(Step.Claim)}
label={t('Confirm claim')}
labelIcon='sign-in'
/>
</Button.Group>
)}

View File

@ -68,6 +68,7 @@ class Add extends ContractModal<Props, State> {
isDisabled={!isValid}
isPrimary
label={t('Save')}
labelIcon='save'
onClick={this.onSave}
ref={this.button}
/>

View File

@ -76,6 +76,7 @@ class Upload extends ContractModal<Props, State> {
isDisabled={!isValid}
isPrimary
label={t('Upload')}
labelIcon='upload'
onClick={this.toggleBusy(true)}
onSuccess={this.onSuccess}
onFailed={this.toggleBusy(false)}

View File

@ -81,6 +81,7 @@ class Add extends ContractModal<Props, State> {
isDisabled={!isValid}
isPrimary
label={t('Save')}
labelIcon='save'
onClick={this.onAdd}
ref={this.button}
/>

View File

@ -192,6 +192,7 @@ class Call extends TxComponent<Props, State> {
isNegative
onClick={this.onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -199,6 +200,7 @@ class Call extends TxComponent<Props, State> {
isDisabled={!isValid}
isPrimary
label={t('Call')}
labelIcon='sign-in'
onClick={this.toggleBusy}
onFailed={this.toggleBusy}
onSuccess={this.toggleBusy}

View File

@ -205,6 +205,7 @@ class Deploy extends ContractModal<Props, State> {
isDisabled={!isValid}
isPrimary
label={t('Deploy')}
labelIcon='cloud upload'
onClick={this.toggleBusy(true)}
onFailed={this.toggleBusy(false)}
onSuccess={this.onSuccess}

View File

@ -172,6 +172,7 @@ class ContractModal<P extends ContractModalProps, S extends ContractModalState>
isNegative
onClick={this.onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
</>

View File

@ -46,12 +46,14 @@ function RemoveABI ({ code, onClose, onRemove, t }: Props): React.ReactElement<P
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<Button
isPrimary
onClick={_onRemove}
label={t('Remove')}
labelIcon='trash'
/>
</Button.Group>
</Modal.Actions>

View File

@ -45,6 +45,7 @@ class Seconding extends React.PureComponent<Props, State> {
<Button
isPrimary
label={t('Second proposal')}
labelIcon='toggle off'
onClick={this.toggleSeconding}
/>
</div>
@ -84,6 +85,7 @@ class Seconding extends React.PureComponent<Props, State> {
isNegative
onClick={this.toggleSeconding}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -91,6 +93,7 @@ class Seconding extends React.PureComponent<Props, State> {
isDisabled={!accountId || isDepositor}
isPrimary
label={t('Second')}
labelIcon='sign-in'
onClick={this.toggleSeconding}
params={[proposalId]}
tx='democracy.second'

View File

@ -58,6 +58,7 @@ class Voting extends React.PureComponent<Props, State> {
<Button
isPrimary
label={t('Vote')}
labelIcon='check'
onClick={this.toggleVoting}
/>
</div>
@ -102,6 +103,7 @@ class Voting extends React.PureComponent<Props, State> {
isNegative
onClick={this.toggleVoting}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -109,6 +111,7 @@ class Voting extends React.PureComponent<Props, State> {
isDisabled={!accountId}
isPrimary
label={t('Vote')}
labelIcon='check'
onClick={this.toggleVoting}
params={[referendumId, voteValue]}
tx='democracy.vote'

View File

@ -66,6 +66,7 @@ class Propose extends TxComponent<Props, State> {
<TxButton
accountId={accountId}
label={t('Submit Proposal')}
labelIcon='sign-in'
tx='democracy.propose'
isDisabled={!isValid}
params={[

View File

@ -79,6 +79,7 @@ class Selection extends TxComponent<Props, State> {
isDisabled={!isValidUnsigned}
isUnsigned
label={t('Submit Unsigned')}
labelIcon='sign-in'
extrinsic={extrinsic}
/>
<Button.Or />
@ -87,6 +88,7 @@ class Selection extends TxComponent<Props, State> {
isDisabled={!isValid}
isPrimary
label={t('Submit Transaction')}
labelIcon='sign-in'
extrinsic={extrinsic}
ref={this.button}
/>

View File

@ -39,6 +39,7 @@ class Assets extends React.PureComponent<Props, State> {
<Button
isPrimary
label={t('Register Asset')}
labelIcon='registered'
onClick={this.toggleCreate}
/>
</Button.Group>

View File

@ -98,6 +98,7 @@ class Transfer extends React.PureComponent<Props> {
isDisabled={!hasAvailable}
isPrimary
label={t('Make Transfer')}
labelIcon='send'
onStart={onClose}
withSpinner={false}
/>

View File

@ -57,6 +57,7 @@ class Create extends React.PureComponent<Props, State> {
isNegative
onClick={this.onDiscard}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<Button
@ -64,6 +65,7 @@ class Create extends React.PureComponent<Props, State> {
isPrimary
onClick={this.onCommit}
label={t('Register')}
labelIcon='registered'
/>
</Button.Group>
</Modal.Actions>

View File

@ -78,6 +78,7 @@ class Developer extends React.PureComponent<Props, State> {
isNegative
onClick={this.clearTypes}
label={t('Reset')}
labelIcon='sync'
/>
<Button.Or />
<Button
@ -85,6 +86,7 @@ class Developer extends React.PureComponent<Props, State> {
isPrimary
onClick={this.saveDeveloper}
label={t('Save')}
labelIcon='save'
/>
</Button.Group>
</div>

View File

@ -121,6 +121,7 @@ function General ({ className, t }: Props): React.ReactElement<Props> {
? t('Save & Reload')
: t('Save')
}
labelIcon='save'
/>
</Button.Group>
</div>

View File

@ -76,6 +76,7 @@ class BondExtra extends TxComponent<Props, State> {
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -83,6 +84,7 @@ class BondExtra extends TxComponent<Props, State> {
isDisabled={!canSubmit}
isPrimary
label={t('Bond more')}
labelIcon='sign-in'
onClick={onClose}
extrinsic={extrinsic}
ref={this.button}

View File

@ -59,6 +59,7 @@ class Nominate extends React.PureComponent<Props, State> {
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -68,6 +69,7 @@ class Nominate extends React.PureComponent<Props, State> {
onClick={onClose}
params={[nominees]}
label={t('Nominate')}
labelIcon='hand paper outline'
tx='staking.nominate'
/>
</Button.Group>

View File

@ -54,6 +54,7 @@ class SetControllerAccount extends TxComponent<Props, State> {
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -61,6 +62,7 @@ class SetControllerAccount extends TxComponent<Props, State> {
isDisabled={!canSubmit}
isPrimary
label={t('Set controller')}
labelIcon='sign-in'
onClick={onClose}
params={[controllerId]}
tx='staking.setController'

View File

@ -49,6 +49,7 @@ class SetRewardDestination extends TxComponent<Props, State> {
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -56,6 +57,7 @@ class SetRewardDestination extends TxComponent<Props, State> {
isDisabled={!canSubmit}
isPrimary
label={t('Set reward destination')}
labelIcon='sign-in'
onClick={onClose}
params={[destination]}
tx={'staking.setPayee'}

View File

@ -66,6 +66,7 @@ class SetSessionKey extends React.PureComponent<Props, State> {
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -73,6 +74,7 @@ class SetSessionKey extends React.PureComponent<Props, State> {
isDisabled={hasError}
isPrimary
label={t('Set Session Key')}
labelIcon='sign-in'
onClick={onClose}
params={
isSubstrateV2

View File

@ -73,6 +73,7 @@ class Unbond extends TxComponent<Props, State> {
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -80,6 +81,7 @@ class Unbond extends TxComponent<Props, State> {
isDisabled={!canSubmit}
isPrimary
label={t('Unbond')}
labelIcon='sign-out'
onClick={onClose}
params={[maxUnbond]}
tx='staking.unbond'

View File

@ -94,6 +94,7 @@ class Validate extends TxComponent<Props, State> {
<Button
isNegative
label={t('Cancel')}
labelIcon='cancel'
onClick={onClose}
/>
<Button.Or />
@ -102,6 +103,7 @@ class Validate extends TxComponent<Props, State> {
isDisabled={!!unstakeThresholdError}
isPrimary
label={t('Validate')}
labelIcon='check circle outline'
onClick={onClose}
params={[
isSubstrateV2

View File

@ -365,6 +365,7 @@ class Account extends React.PureComponent<Props, State> {
? t('Stop Nominating')
: t('Stop Validating')
}
labelIcon='stop'
key='stop'
tx='staking.chill'
/>
@ -377,6 +378,7 @@ class Account extends React.PureComponent<Props, State> {
key='set'
onClick={this.toggleSetSessionAccount}
label={t('Set Session Key')}
labelIcon='sign-in'
/>
);
} else {
@ -386,6 +388,7 @@ class Account extends React.PureComponent<Props, State> {
key='validate'
onClick={this.toggleValidate}
label={t('Validate')}
labelIcon='check circle outline'
/>
);
}
@ -397,6 +400,7 @@ class Account extends React.PureComponent<Props, State> {
key='nominate'
onClick={this.toggleNominate}
label={t('Nominate')}
labelIcon='hand paper outline'
/>
);
}

View File

@ -66,6 +66,7 @@ class NewStake extends TxComponent<Props, State> {
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<TxButton
@ -73,6 +74,7 @@ class NewStake extends TxComponent<Props, State> {
isDisabled={!canSubmit}
isPrimary
label={t('Bond')}
labelIcon='sign-in'
onClick={onClose}
extrinsic={extrinsic}
ref={this.button}

View File

@ -65,6 +65,7 @@ class SetKey extends React.PureComponent<Props, State> {
isDisabled={!isMine || sudoKey === selected}
isPrimary
label={t('Reassign')}
labelIcon='sign-in'
params={[selected]}
tx='sudo.setKey'
/>

View File

@ -47,6 +47,7 @@ class Propose extends TxComponent<Props, State> {
<TxButton
accountId={sudoKey}
label={t('Submit Sudo')}
labelIcon='sign-in'
tx='sudo.sudo'
isDisabled={!method || !isValid}
params={method ? [createType('Proposal', method)] : []}

View File

@ -64,7 +64,9 @@ class Selection extends TxComponent<Props, State> {
isDisabled={!isValid}
isPrimary
onClick={this.onSubmit}
label={t('Submit RPC call')}
labelIcon='sign-in'
ref={this.button}
/>
</Button.Group>

View File

@ -102,6 +102,7 @@ class Sign extends React.PureComponent<Props, State> {
isPrimary
onClick={this.toggleUnlock}
label={t('Unlock account')}
labelIcon='unlock'
/>
</Button.Group>
</div>

View File

@ -66,12 +66,14 @@ class Unlock extends TxComponent<Props, State> {
isNegative
onClick={this.onCancel}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<Button
isPrimary
onClick={this.onUnlock}
label={t('Unlock')}
labelIcon='unlock'
ref={this.button}
/>
</Button.Group>

View File

@ -117,6 +117,7 @@ class Settings extends TxComponent<Props, State> {
<TxButton
accountId={accountId}
label={t('Submit')}
labelIcon='sign-in'
tx='treasury.configure'
params={[
proposalBond.toString(),
@ -144,6 +145,7 @@ class Settings extends TxComponent<Props, State> {
<TxButton
accountId={accountId}
label={t('Submit')}
labelIcon='sign-in'
tx='treasury.setPot'
params={[pot]}
/>

View File

@ -114,12 +114,14 @@ function Forget (props: Props): React.ReactElement<Props> {
isNegative
onClick={onClose}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
<Button
isPrimary
onClick={onForget}
label={t('Forget')}
labelIcon='trash'
/>
</Button.Group>
</Modal.Actions>

View File

@ -52,6 +52,7 @@ function renderMessage (props: Props, index: number): React.ReactNode {
isDisabled={!onSelectProp}
onClick={onSelect(props, index)}
isPrimary={!!onSelectProp}
labelIcon='info'
>
{name}
(

View File

@ -157,6 +157,7 @@ export default class TxModal<P extends TxModalProps, S extends TxModalState> ext
isDisabled={this.isDisabled()}
isPrimary
label={this.submitLabel()}
labelIcon='sign-in'
onClick={this.onSubmit}
onFailed={this.onFailed}
onSuccess={this.onSuccess}
@ -176,6 +177,7 @@ export default class TxModal<P extends TxModalProps, S extends TxModalState> ext
isNegative
onClick={this.hideModal}
label={t('Cancel')}
labelIcon='cancel'
/>
<Button.Or />
</>

View File

@ -102,12 +102,14 @@ class Vector extends React.PureComponent<Props, State> {
isPrimary
onClick={this.rowAdd}
label={t('Add item')}
labelIcon='add'
/>
<Button
isDisabled={values.length === 1}
isNegative
onClick={this.rowRemove}
label={t('Remove item')}
labelIcon='minus'
/>
</div>
);

View File

@ -156,6 +156,7 @@ class Signer extends React.PureComponent<Props, State> {
}
tabIndex={3}
label={t('Cancel')}
labelIcon='cancel'
/>
{(!isQrVisible || !isQrScanning) && (
<>
@ -181,6 +182,15 @@ class Signer extends React.PureComponent<Props, State> {
? t('Sign via Qr')
: t('Sign and Submit')
}
labelIcon={
isQrVisible
? 'qrcode'
: currentItem.isUnsigned
? 'sign-in'
: isExternal
? 'qrcode'
: 'sign-in'
}
/>
</>
)}