refactor(instances): better disabled/isValid handling
This commit is contained in:
parent
d591d93547
commit
429ad17262
@ -74,7 +74,6 @@ const PopoverDivider = styled(BasePopoverDivider)`
|
||||
width: 100%;
|
||||
`;
|
||||
|
||||
|
||||
export const Image = ({
|
||||
name,
|
||||
id,
|
||||
|
@ -11,7 +11,6 @@ import { set } from 'react-redux-values';
|
||||
import Fuse from 'fuse.js';
|
||||
|
||||
import {
|
||||
H3,
|
||||
ViewContainer,
|
||||
Divider,
|
||||
StatusLoader,
|
||||
|
@ -35,7 +35,7 @@ const names = {
|
||||
name: 'IC_NAME',
|
||||
image: 'IC_IMAGE',
|
||||
package: 'IC_PACKAGE',
|
||||
network: 'IC_NETWORK',
|
||||
networks: 'IC_NETWORKS',
|
||||
tags: 'IC_TAGS',
|
||||
metadata: 'IC_METADATA',
|
||||
userScript: 'IC_USERSCRIPT',
|
||||
@ -69,9 +69,9 @@ class CreateInstance extends Component {
|
||||
isFormValid = () => {
|
||||
const { steps } = this.props;
|
||||
|
||||
return Object.keys(this.isValids).filter(
|
||||
name => !this.isValids[name](steps[name] || {})
|
||||
).length;
|
||||
return Object.keys(this.isValids).every(name =>
|
||||
this.isValids[name](steps[name] || {})
|
||||
);
|
||||
};
|
||||
|
||||
isStepValid = step => {
|
||||
@ -95,7 +95,7 @@ class CreateInstance extends Component {
|
||||
name,
|
||||
image,
|
||||
package: packageResult,
|
||||
network,
|
||||
networks,
|
||||
tags,
|
||||
metadata,
|
||||
userScript,
|
||||
@ -136,7 +136,7 @@ class CreateInstance extends Component {
|
||||
<Package
|
||||
ref={this.setIsValid('package')}
|
||||
expanded={step === 'package'}
|
||||
next="network"
|
||||
next="networks"
|
||||
saved={steps.package}
|
||||
onDefocus={handleDefocus('package')}
|
||||
preview={packageResult}
|
||||
@ -144,12 +144,12 @@ class CreateInstance extends Component {
|
||||
</Margin>
|
||||
<Margin bottom="5">
|
||||
<Network
|
||||
ref={this.setIsValid('network')}
|
||||
expanded={step === 'network'}
|
||||
ref={this.setIsValid('networks')}
|
||||
expanded={step === 'networks'}
|
||||
next="tags"
|
||||
saved={steps.network}
|
||||
onDefocus={handleDefocus('network')}
|
||||
preview={network}
|
||||
onDefocus={handleDefocus('networks')}
|
||||
preview={networks}
|
||||
/>
|
||||
</Margin>
|
||||
<Margin bottom="5">
|
||||
@ -223,7 +223,11 @@ class CreateInstance extends Component {
|
||||
<ReduxForm form={IC_F} onSubmit={handleSubmit}>
|
||||
{({ handleSubmit, submitting }) => (
|
||||
<form onSubmit={handleSubmit}>
|
||||
<Button disabled={disabled} loading={submitting}>
|
||||
{console.log({ isFormValid: this.isFormValid() })}
|
||||
<Button
|
||||
disabled={disabled || !this.isFormValid()}
|
||||
loading={submitting}
|
||||
>
|
||||
Deploy
|
||||
</Button>
|
||||
</form>
|
||||
@ -243,7 +247,7 @@ export default compose(
|
||||
name: values[names.name],
|
||||
image: values[names.image],
|
||||
package: values[names.package],
|
||||
network: values[names.network],
|
||||
networks: values[names.networks],
|
||||
tags: values[names.tags],
|
||||
metadata: values[names.metadata],
|
||||
userScript: values[names.userScript],
|
||||
@ -255,17 +259,20 @@ export default compose(
|
||||
const error = get(form, `${IC_F}.error`, null);
|
||||
|
||||
// Maybe re-use saved to only write the rule once
|
||||
const disabled = Boolean(
|
||||
!this.isFormValid &&
|
||||
steps.name &&
|
||||
steps.image &&
|
||||
steps.image.id &&
|
||||
steps.package &&
|
||||
steps.network
|
||||
const disabled = !(
|
||||
!error &&
|
||||
steps.name &&
|
||||
steps.name.name &&
|
||||
steps.image &&
|
||||
steps.image.id &&
|
||||
steps.package &&
|
||||
steps.package.id &&
|
||||
steps.networks &&
|
||||
Array.isArray(steps.networks)
|
||||
);
|
||||
|
||||
return {
|
||||
disabled: !disabled,
|
||||
disabled,
|
||||
forms: Object.keys(form), // improve this
|
||||
error,
|
||||
steps
|
||||
|
12
package.json
12
package.json
@ -47,17 +47,15 @@
|
||||
"resolutions": {
|
||||
"axios": "0.16.2",
|
||||
"follow-redirects": "1.4.1",
|
||||
"node-fetch": "2.1.1",
|
||||
"node-fetch": "2.1.2",
|
||||
"core-js": "2.5.4",
|
||||
"regenerator-runtime": "0.11.1",
|
||||
"pify": "3.0.0",
|
||||
"has-flag": "2.0.0",
|
||||
"lodash": "4.17.10",
|
||||
"parse-json": "4.0.0",
|
||||
"whatwg-fetch": "2.0.4",
|
||||
"react": "16.3.1",
|
||||
"breeze-nexttick": "0.2.1",
|
||||
"isarray": "1.0.0",
|
||||
"uuid": "3.0.1"
|
||||
"react": "16.3.1",
|
||||
"styled-is": "1.1.3",
|
||||
"breeze-nexttick": "0.2.1"
|
||||
},
|
||||
"workspaces": ["packages/*", "consoles/*", "bundle"]
|
||||
}
|
||||
|
58
yarn.lock
58
yarn.lock
@ -5285,10 +5285,18 @@ has-ansi@^2.0.0:
|
||||
dependencies:
|
||||
ansi-regex "^2.0.0"
|
||||
|
||||
has-flag@2.0.0, has-flag@^1.0.0, has-flag@^2.0.0, has-flag@^3.0.0:
|
||||
has-flag@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-1.0.0.tgz#9d9e793165ce017a00f00418c43f942a7b1d11fa"
|
||||
|
||||
has-flag@^2.0.0:
|
||||
version "2.0.0"
|
||||
resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-2.0.0.tgz#e8207af1cc7b30d446cc70b734b5e8be18f88d51"
|
||||
|
||||
has-flag@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
|
||||
|
||||
has-unicode@^2.0.0:
|
||||
version "2.0.1"
|
||||
resolved "https://registry.yarnpkg.com/has-unicode/-/has-unicode-2.0.1.tgz#e0e6fe6a28cf51138855e086d1691e771de2a8b9"
|
||||
@ -7066,18 +7074,10 @@ lodash.values@^4.3.0:
|
||||
version "4.3.0"
|
||||
resolved "https://registry.yarnpkg.com/lodash.values/-/lodash.values-4.3.0.tgz#a3a6c2b0ebecc5c2cba1c17e6e620fe81b53d347"
|
||||
|
||||
lodash@4.17.5:
|
||||
version "4.17.5"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
|
||||
|
||||
"lodash@>=3.5 <5", lodash@^4.13.1, lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.5.1:
|
||||
lodash@4.17.10, lodash@4.17.5, "lodash@>=3.5 <5", lodash@^3.3.1, lodash@^4.13.1, lodash@^4.14.0, lodash@^4.15.0, lodash@^4.17.0, lodash@^4.17.2, lodash@^4.17.3, lodash@^4.17.4, lodash@^4.17.5, lodash@^4.2.0, lodash@^4.2.1, lodash@^4.3.0, lodash@^4.5.1:
|
||||
version "4.17.10"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.10.tgz#1b7793cf7259ea38fb3661d4d38b3260af8ae4e7"
|
||||
|
||||
lodash@^3.3.1:
|
||||
version "3.10.1"
|
||||
resolved "https://registry.yarnpkg.com/lodash/-/lodash-3.10.1.tgz#5bf45e8e49ba4189e17d482789dfd15bd140b7b6"
|
||||
|
||||
log-symbols@^2.2.0:
|
||||
version "2.2.0"
|
||||
resolved "https://registry.yarnpkg.com/log-symbols/-/log-symbols-2.2.0.tgz#5740e1c5d6f0dfda4ad9323b5332107ef6b4c40a"
|
||||
@ -7588,9 +7588,9 @@ node-dir@^0.1.10:
|
||||
dependencies:
|
||||
minimatch "^3.0.2"
|
||||
|
||||
node-fetch@1.6.3, node-fetch@2.1.1, node-fetch@2.1.2, node-fetch@^1.0.1:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.1.1.tgz#369ca70b82f50c86496104a6c776d274f4e4a2d4"
|
||||
node-fetch@1.6.3, node-fetch@2.1.2, node-fetch@^1.0.1:
|
||||
version "2.1.2"
|
||||
resolved "https://registry.yarnpkg.com/node-fetch/-/node-fetch-2.1.2.tgz#ab884e8e7e57e38a944753cec706f788d1768bb5"
|
||||
|
||||
node-forge@0.7.5:
|
||||
version "0.7.5"
|
||||
@ -8149,7 +8149,11 @@ pez@4.x.x:
|
||||
hoek "5.x.x"
|
||||
nigel "3.x.x"
|
||||
|
||||
pify@3.0.0, pify@^2.0.0, pify@^2.3.0, pify@^3.0.0:
|
||||
pify@^2.0.0, pify@^2.3.0:
|
||||
version "2.3.0"
|
||||
resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
|
||||
|
||||
pify@^3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/pify/-/pify-3.0.0.tgz#e5a4acd2c101fdf3d9a4d07f0dbc4db49dd28176"
|
||||
|
||||
@ -10449,11 +10453,7 @@ styled-flex-component@^2.2.2:
|
||||
dependencies:
|
||||
styled-is "1.1.2"
|
||||
|
||||
styled-is@1.1.2:
|
||||
version "1.1.2"
|
||||
resolved "https://registry.yarnpkg.com/styled-is/-/styled-is-1.1.2.tgz#f23a43249ba52ac9136c166aac1da30a5711593e"
|
||||
|
||||
styled-is@^1.1.2:
|
||||
styled-is@1.1.2, styled-is@1.1.3, styled-is@^1.1.2:
|
||||
version "1.1.3"
|
||||
resolved "https://registry.yarnpkg.com/styled-is/-/styled-is-1.1.3.tgz#09df6cb5aff33c91080cdb3bf4f687eac96b5839"
|
||||
|
||||
@ -11191,10 +11191,22 @@ utils-merge@1.0.1:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/utils-merge/-/utils-merge-1.0.1.tgz#9f95710f50a267947b2ccc124741c1028427e713"
|
||||
|
||||
uuid@3.0.0, uuid@3.0.1, uuid@3.0.x, uuid@^2.0.1, uuid@^2.0.2, uuid@^3.0.1, uuid@^3.1.0:
|
||||
uuid@3.0.0:
|
||||
version "3.0.0"
|
||||
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.0.0.tgz#6728fc0459c450d796a99c31837569bdf672d728"
|
||||
|
||||
uuid@3.0.x:
|
||||
version "3.0.1"
|
||||
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.0.1.tgz#6544bba2dfda8c1cf17e629a3a305e2bb1fee6c1"
|
||||
|
||||
uuid@^2.0.1, uuid@^2.0.2:
|
||||
version "2.0.3"
|
||||
resolved "https://registry.yarnpkg.com/uuid/-/uuid-2.0.3.tgz#67e2e863797215530dff318e5bf9dcebfd47b21a"
|
||||
|
||||
uuid@^3.0.1, uuid@^3.1.0:
|
||||
version "3.2.1"
|
||||
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.2.1.tgz#12c528bb9d58d0b9265d9a2f6f0fe8be17ff1f14"
|
||||
|
||||
v8flags@^2.1.1:
|
||||
version "2.1.1"
|
||||
resolved "https://registry.yarnpkg.com/v8flags/-/v8flags-2.1.1.tgz#aab1a1fa30d45f88dd321148875ac02c0b55e5b4"
|
||||
@ -11531,7 +11543,11 @@ whatwg-encoding@^1.0.1:
|
||||
dependencies:
|
||||
iconv-lite "0.4.19"
|
||||
|
||||
whatwg-fetch@2.0.3, whatwg-fetch@2.0.4, whatwg-fetch@>=0.10.0:
|
||||
whatwg-fetch@2.0.3:
|
||||
version "2.0.3"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.3.tgz#9c84ec2dcf68187ff00bc64e1274b442176e1c84"
|
||||
|
||||
whatwg-fetch@2.0.4, whatwg-fetch@>=0.10.0:
|
||||
version "2.0.4"
|
||||
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-2.0.4.tgz#dde6a5df315f9d39991aa17621853d720b85566f"
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user