m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

Clean up network form form generation, autofocus the network name (#10473)

Browse Source
This commit is contained in:
David Walsh 2021-02-18 10:25:13 -06:00 committed by GitHub
parent 21aec63f41
commit 59a9d4dc5c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 41 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
ui/app/pages/settings/networks-tab/network-form/network-form.component.js
View File

@ -250,14 +250,15 @@ export default class NetworkForm extends PureComponent {
); );
} }
renderFormTextField( renderFormTextField({
fieldKey, fieldKey,
textFieldId, textFieldId,
onChange, onChange,
value, value,
optionalTextFieldKey, optionalTextFieldKey,
tooltipText, tooltipText,
) { autoFocus = false,
}) {
const { errors } = this.state; const { errors } = this.state;
const { viewOnly } = this.props; const { viewOnly } = this.props;
@ -286,6 +287,7 @@ export default class NetworkForm extends PureComponent {
value={value} value={value}
disabled={viewOnly} disabled={viewOnly}
error={errors[fieldKey]} error={errors[fieldKey]}
autoFocus={autoFocus}
/> />
</div> </div>
); );
@ -456,43 +458,46 @@ export default class NetworkForm extends PureComponent {
return ( return (
<div className="networks-tab__network-form"> <div className="networks-tab__network-form">
{viewOnly ? null : this.renderWarning()} {viewOnly ? null : this.renderWarning()}
{this.renderFormTextField( {this.renderFormTextField({
'networkName', fieldKey: 'networkName',
'network-name', textFieldId: 'network-name',
this.setStateWithValue('networkName'), onChange: this.setStateWithValue('networkName'),
networkName, value: networkName,
)} autoFocus: networksTabIsInAddMode,
{this.renderFormTextField( })}
'rpcUrl', {this.renderFormTextField({
'rpc-url', fieldKey: 'rpcUrl',
this.setStateWithValue('rpcUrl', this.validateUrlRpcUrl), textFieldId: 'rpc-url',
rpcUrl, onChange: this.setStateWithValue('rpcUrl', this.validateUrlRpcUrl),
)} value: rpcUrl,
{this.renderFormTextField( })}
{this.renderFormTextField({
fieldKey: 'chainId',
textFieldId: 'chainId',
onChange: this.setStateWithValue(
'chainId', 'chainId',
'chainId', this.validateChainIdOnChange,
this.setStateWithValue('chainId', this.validateChainIdOnChange), ),
chainId, value: chainId,
null, tooltipText: viewOnly ? null : t('networkSettingsChainIdDescription'),
viewOnly ? null : t('networkSettingsChainIdDescription'), })}
)} {this.renderFormTextField({
{this.renderFormTextField( fieldKey: 'symbol',
'symbol', textFieldId: 'network-ticker',
'network-ticker', onChange: this.setStateWithValue('ticker'),
this.setStateWithValue('ticker'), value: ticker,
ticker, optionalTextFieldKey: 'optionalCurrencySymbol',
'optionalCurrencySymbol', })}
)} {this.renderFormTextField({
{this.renderFormTextField( fieldKey: 'blockExplorerUrl',
'blockExplorerUrl', textFieldId: 'block-explorer-url',
'block-explorer-url', onChange: this.setStateWithValue(
this.setStateWithValue(
'blockExplorerUrl', 'blockExplorerUrl',
this.validateBlockExplorerURL, this.validateBlockExplorerURL,
), ),
blockExplorerUrl, value: blockExplorerUrl,
'optionalBlockExplorerUrl', optionalTextFieldKey: 'optionalBlockExplorerUrl',
)} })}
<div className="network-form__footer"> <div className="network-form__footer">
{!viewOnly && ( {!viewOnly && (
<> <>