From c1fb92e53ff5b5fc9fc9f97bd9fceb4ac1d6edec Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Wed, 17 Jul 2019 19:48:32 -0300 Subject: [PATCH 01/11] install redux and redux-form --- docs/package.json | 4 +++ yarn.lock | 64 +++++++++++++++++++++++++++++++++++++++++++++-- 2 files changed, 66 insertions(+), 2 deletions(-) diff --git a/docs/package.json b/docs/package.json index 06a1e276a..34a8808c3 100644 --- a/docs/package.json +++ b/docs/package.json @@ -62,6 +62,10 @@ "react-dom": "^16.8.2", "react-jss": "^8.6.1", "react-kawaii": "^0.12.0", + "react-redux": "^7.1.0", + "redux": "^4.0.4", + "redux-form": "^8.2.4", + "redux-thunk": "^2.3.0", "remark-slug": "^5.1.1", "safe-json-stringify": "^1.2.0", "typescript": "^3.4.4", diff --git a/yarn.lock b/yarn.lock index 7f812d6a9..9d664e988 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1037,6 +1037,13 @@ dependencies: regenerator-runtime "^0.13.2" +"@babel/runtime@^7.4.5": + version "7.5.4" + resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.5.4.tgz#cb7d1ad7c6d65676e66b47186577930465b5271b" + integrity sha512-Na84uwyImZZc3FKf4aUF1tysApzwf3p2yuFBIyBfbzT5glzKTdvYI4KVW4kcgjrzoGUjC7w3YyCHcJKaRxsr2Q== + dependencies: + regenerator-runtime "^0.13.2" + "@babel/template@^7.1.0", "@babel/template@^7.4.0", "@babel/template@^7.4.4": version "7.4.4" resolved "https://registry.yarnpkg.com/@babel/template/-/template-7.4.4.tgz#f4b88d1225689a08f5bc3a17483545be9e4ed237" @@ -4859,6 +4866,11 @@ es-to-primitive@^1.2.0: is-date-object "^1.0.1" is-symbol "^1.0.2" +es6-error@^4.1.1: + version "4.1.1" + resolved "https://registry.yarnpkg.com/es6-error/-/es6-error-4.1.1.tgz#9e3af407459deed47e9a91f9b885a84eb05c561d" + integrity sha512-Um/+FxMr9CISWh0bi5Zv0iOD+4cFh5qLeks1qhAopKVAJw3drgKbKySikp7wGhDL0HPeaja0P5ULZrxLkniUVg== + es6-promise-pool@^2.5.0: version "2.5.0" resolved "https://registry.yarnpkg.com/es6-promise-pool/-/es6-promise-pool-2.5.0.tgz#147c612b36b47f105027f9d2bf54a598a99d9ccb" @@ -6209,6 +6221,11 @@ ignore@^4.0.3, ignore@^4.0.6: resolved "https://registry.yarnpkg.com/ignore/-/ignore-4.0.6.tgz#750e3db5862087b4737ebac8207ffd1ef27b25fc" integrity sha512-cyFDKrqc/YdcWFniJhzI42+AzS+gNwmUzOSFcRCQYwySuBBBy/KjuxWLZ/FHEH6Moq1NizMOBWyTcv8O4OZIMg== +immutable@3.8.2: + version "3.8.2" + resolved "https://registry.yarnpkg.com/immutable/-/immutable-3.8.2.tgz#c2439951455bb39913daf281376f1530e104adf3" + integrity sha1-wkOZUUVbs5kT2vKBN28VMOEErfM= + import-cwd@^2.0.0: version "2.1.0" resolved "https://registry.yarnpkg.com/import-cwd/-/import-cwd-2.1.0.tgz#aa6cf36e722761285cb371ec6519f53e2435b0a9" @@ -10061,11 +10078,23 @@ react-kawaii@^0.12.0: dependencies: prop-types "^15.6.2" -react-lifecycles-compat@^3.0.2: +react-lifecycles-compat@^3.0.2, react-lifecycles-compat@^3.0.4: version "3.0.4" resolved "https://registry.yarnpkg.com/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362" integrity sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA== +react-redux@^7.1.0: + version "7.1.0" + resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-7.1.0.tgz#72af7cf490a74acdc516ea9c1dd80e25af9ea0b2" + integrity sha512-hyu/PoFK3vZgdLTg9ozbt7WF3GgX5+Yn3pZm5/96/o4UueXA+zj08aiSC9Mfj2WtD1bvpIb3C5yvskzZySzzaw== + dependencies: + "@babel/runtime" "^7.4.5" + hoist-non-react-statics "^3.3.0" + invariant "^2.2.4" + loose-envify "^1.4.0" + prop-types "^15.7.2" + react-is "^16.8.6" + react-test-renderer@^16.0.0-0: version "16.8.6" resolved "https://registry.yarnpkg.com/react-test-renderer/-/react-test-renderer-16.8.6.tgz#188d8029b8c39c786f998aa3efd3ffe7642d5ba1" @@ -10203,6 +10232,37 @@ redeyed@~2.1.0: dependencies: esprima "~4.0.0" +redux-form@^8.2.4: + version "8.2.4" + resolved "https://registry.yarnpkg.com/redux-form/-/redux-form-8.2.4.tgz#6c21c49e31b473cebe718def03487fc9d4665923" + integrity sha512-+MMD5XWVUgrtgXBuQiIYtHstPT7Lz0Izuc6vqBr1S9+7HbGgvJg4V5qDr2nigE1V5hKgsqnoAmWOWtzXc9ErZA== + dependencies: + "@babel/runtime" "^7.2.0" + es6-error "^4.1.1" + hoist-non-react-statics "^3.2.1" + invariant "^2.2.4" + is-promise "^2.1.0" + lodash "^4.17.11" + lodash-es "^4.17.11" + prop-types "^15.6.1" + react-is "^16.7.0" + react-lifecycles-compat "^3.0.4" + optionalDependencies: + immutable "3.8.2" + +redux-thunk@^2.3.0: + version "2.3.0" + resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622" + integrity sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw== + +redux@^4.0.4: + version "4.0.4" + resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796" + integrity sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q== + dependencies: + loose-envify "^1.4.0" + symbol-observable "^1.2.0" + reflect.ownkeys@^0.2.0: version "0.2.0" resolved "https://registry.yarnpkg.com/reflect.ownkeys/-/reflect.ownkeys-0.2.0.tgz#749aceec7f3fdf8b63f927a04809e90c5c0b3460" @@ -11499,7 +11559,7 @@ symbol-observable@1.0.1: resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.0.1.tgz#8340fc4702c3122df5d22288f88283f513d3fdd4" integrity sha1-g0D8RwLDEi310iKI+IKD9RPT/dQ= -symbol-observable@1.2.0, symbol-observable@^1.0.4, symbol-observable@^1.1.0: +symbol-observable@1.2.0, symbol-observable@^1.0.4, symbol-observable@^1.1.0, symbol-observable@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/symbol-observable/-/symbol-observable-1.2.0.tgz#c22688aed4eab3cdc2dfeacbb561660560a00804" integrity sha512-e900nM8RRtGhlV36KGEU9k65K3mPb1WV70OdjfxlG2EAuM1noi/E/BaW/uMhL7bPEssK8QV57vN3esixjUvcXQ== From 00e5710d647180aab12a7dcbc30ee2fd70a9de0b Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Wed, 17 Jul 2019 19:49:14 -0300 Subject: [PATCH 02/11] configure redux-form --- docs/store.jsx | 13 +++++++++++++ docs/tsconfig.json | 2 +- 2 files changed, 14 insertions(+), 1 deletion(-) create mode 100644 docs/store.jsx diff --git a/docs/store.jsx b/docs/store.jsx new file mode 100644 index 000000000..e32ec6bf7 --- /dev/null +++ b/docs/store.jsx @@ -0,0 +1,13 @@ +import { reducer as formReducer } from 'redux-form'; +import { createStore, combineReducers } from 'redux'; + +const rootReducer = combineReducers({ + form: formReducer, +}); + +const store = createStore( + rootReducer + // window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() +); + +export default store; diff --git a/docs/tsconfig.json b/docs/tsconfig.json index 1b5bc7d93..706847ab7 100644 --- a/docs/tsconfig.json +++ b/docs/tsconfig.json @@ -19,5 +19,5 @@ "target": "esnext", "resolveJsonModule": true }, - "include": ["../docs/**/*.ts*"] + "include": ["../docs/**/*.ts*", "store.jsx"] } From 587d12576e5e2ef750ba6c5e61eb47ada098037d Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Wed, 17 Jul 2019 19:49:59 -0300 Subject: [PATCH 03/11] wrap App with redux provider --- docs/pages/_app.tsx | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/docs/pages/_app.tsx b/docs/pages/_app.tsx index 1b9cbfc67..db9ec2fd2 100644 --- a/docs/pages/_app.tsx +++ b/docs/pages/_app.tsx @@ -1,7 +1,9 @@ import React from 'react'; import App from 'next/app'; +import store from '../store.jsx'; import cookies from 'next-cookies'; import getPageContext from '../utils/getPageContext'; +import { Provider as ReduxProvider } from 'react-redux'; import { PageWithContexts, ThemeType } from '../layout/PageWithContext'; class MyApp extends App<{ theme: ThemeType }> { @@ -30,9 +32,11 @@ class MyApp extends App<{ theme: ThemeType }> { const { Component, pageProps, theme } = this.props; return ( - - - + + + + + ); } } From 2ac013f8aef12fe8c00312d799b5b300b72601fc Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Wed, 17 Jul 2019 19:50:28 -0300 Subject: [PATCH 04/11] create redux form example --- docs/pages/guides/ReduxForm.example.jsx | 64 +++++++++++++++++++++++++ docs/pages/guides/form-integration.mdx | 7 +++ 2 files changed, 71 insertions(+) create mode 100644 docs/pages/guides/ReduxForm.example.jsx diff --git a/docs/pages/guides/ReduxForm.example.jsx b/docs/pages/guides/ReduxForm.example.jsx new file mode 100644 index 000000000..906d2d37e --- /dev/null +++ b/docs/pages/guides/ReduxForm.example.jsx @@ -0,0 +1,64 @@ +import React from 'react'; +import Code from '../../_shared/Code'; +import { connect } from 'react-redux'; +import { Grid } from '@material-ui/core'; +import { KeyboardDatePicker } from '@material-ui/pickers'; +import { reduxForm, Field, formValueSelector } from 'redux-form'; + +const DateField = props => { + const { + meta: { submitting, error, touched }, + input: { onBlur, value, ...inputProps }, + ...others + } = props; + + return ( + onBlur(value ? new Date(value).toISOString() : null)} + error={error && touched} + onChange={date => Date.parse(date) && inputProps.onChange(date.toISOString())} + /> + ); +}; + +class ReduxFormExample extends React.PureComponent { + render() { + return ( +
+ + + + + + + + + + ); + } +} + +const selector = formValueSelector('example'); +const mapStateToProps = state => ({ + date: selector(state, 'date'), + initialValues: { + date: new Date().toISOString(), + }, +}); +const createReduxForm = reduxForm({ form: 'example' }); +export default connect(mapStateToProps)(createReduxForm(ReduxFormExample)); diff --git a/docs/pages/guides/form-integration.mdx b/docs/pages/guides/form-integration.mdx index c1bc8d363..292bd560d 100644 --- a/docs/pages/guides/form-integration.mdx +++ b/docs/pages/guides/form-integration.mdx @@ -2,6 +2,7 @@ import Ad from '_shared/Ad' import Example from '_shared/Example'; import PageMeta from '_shared/PageMeta'; import * as FormikExample from './Formik.example'; +import * as ReduxFormExample from './ReduxForm.example'; @@ -20,3 +21,9 @@ Here are some examples! Here is an example of how to integrate @material-ui/pickers with Formik + +#### Redux Form Integration + +@material-ui/pickers can also be integrate with Redux Form + + \ No newline at end of file From 124faaa670d58087095e9bf82a700b6c800b51c3 Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Wed, 17 Jul 2019 20:04:39 -0300 Subject: [PATCH 05/11] add react-redux types to dev dependencies --- docs/package.json | 1 + yarn.lock | 20 +++++++++++++++++++- 2 files changed, 20 insertions(+), 1 deletion(-) diff --git a/docs/package.json b/docs/package.json index 34a8808c3..b4c558a3c 100644 --- a/docs/package.json +++ b/docs/package.json @@ -72,6 +72,7 @@ "unist-util-visit": "^1.4.0" }, "devDependencies": { + "@types/react-redux": "^7.1.1", "dotenv": "^7.0.0", "fs-extra": "^7.0.1", "patreon": "^0.4.1" diff --git a/yarn.lock b/yarn.lock index 9d664e988..237f2c1ce 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1769,6 +1769,14 @@ "@types/minimatch" "*" "@types/node" "*" +"@types/hoist-non-react-statics@^3.3.0": + version "3.3.1" + resolved "https://registry.yarnpkg.com/@types/hoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f" + integrity sha512-iMIqiko6ooLrTh1joXodJK5X9xeEALT1kM5G3ZLhD3hszxBdIEd5C75U834D9mLcINgD4OyZf5uQXjkuYydWvA== + dependencies: + "@types/react" "*" + hoist-non-react-statics "^3.3.0" + "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0": version "2.0.1" resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.1.tgz#42995b446db9a48a11a07ec083499a860e9138ff" @@ -1926,6 +1934,16 @@ "@types/react" "*" "@types/webpack" "*" +"@types/react-redux@^7.1.1": + version "7.1.1" + resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.1.1.tgz#eb01e89cf71cad77df9f442b819d5db692b997cb" + integrity sha512-owqNahzE8en/jR4NtrUJDJya3tKru7CIEGSRL/pVS84LtSCdSoT7qZTkrbBd3S4Lp11sAp+7LsvxIeONJVKMnw== + dependencies: + "@types/hoist-non-react-statics" "^3.3.0" + "@types/react" "*" + hoist-non-react-statics "^3.3.0" + redux "^4.0.0" + "@types/react-transition-group@^2.0.15", "@types/react-transition-group@^2.0.16": version "2.9.2" resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-2.9.2.tgz#c48cf2a11977c8b4ff539a1c91d259eaa627028d" @@ -10255,7 +10273,7 @@ redux-thunk@^2.3.0: resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622" integrity sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw== -redux@^4.0.4: +redux@^4.0.0, redux@^4.0.4: version "4.0.4" resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796" integrity sha512-vKv4WdiJxOWKxK0yRoaK3Y4pxxB0ilzVx6dszU2W8wLxlb2yikRph4iV/ymtdJ6ZxpBLFbyrxklnT5yBbQSl3Q== From d55e60785c0ca68f4a0d81deba243ce76c0c1f49 Mon Sep 17 00:00:00 2001 From: Igor Neves Faustino Date: Fri, 19 Jul 2019 19:32:56 -0300 Subject: [PATCH 06/11] Update docs/pages/guides/form-integration.mdx Co-Authored-By: Dmitriy Kovalenko --- docs/pages/guides/form-integration.mdx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/docs/pages/guides/form-integration.mdx b/docs/pages/guides/form-integration.mdx index 292bd560d..0659690d5 100644 --- a/docs/pages/guides/form-integration.mdx +++ b/docs/pages/guides/form-integration.mdx @@ -24,6 +24,6 @@ Here is an example of how to integrate @material-ui/pickers with Formik #### Redux Form Integration -@material-ui/pickers can also be integrate with Redux Form +@material-ui/pickers can also be integrated with Redux Form - \ No newline at end of file + From 41c17894782e5963315a2edba91852be822f5ae3 Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Fri, 19 Jul 2019 19:59:49 -0300 Subject: [PATCH 07/11] move redux to example folder --- docs/pages/_app.tsx | 10 +++------- docs/{ => pages/guides}/store.jsx | 0 docs/tsconfig.json | 2 +- 3 files changed, 4 insertions(+), 8 deletions(-) rename docs/{ => pages/guides}/store.jsx (100%) diff --git a/docs/pages/_app.tsx b/docs/pages/_app.tsx index db9ec2fd2..1b9cbfc67 100644 --- a/docs/pages/_app.tsx +++ b/docs/pages/_app.tsx @@ -1,9 +1,7 @@ import React from 'react'; import App from 'next/app'; -import store from '../store.jsx'; import cookies from 'next-cookies'; import getPageContext from '../utils/getPageContext'; -import { Provider as ReduxProvider } from 'react-redux'; import { PageWithContexts, ThemeType } from '../layout/PageWithContext'; class MyApp extends App<{ theme: ThemeType }> { @@ -32,11 +30,9 @@ class MyApp extends App<{ theme: ThemeType }> { const { Component, pageProps, theme } = this.props; return ( - - - - - + + + ); } } diff --git a/docs/store.jsx b/docs/pages/guides/store.jsx similarity index 100% rename from docs/store.jsx rename to docs/pages/guides/store.jsx diff --git a/docs/tsconfig.json b/docs/tsconfig.json index 706847ab7..6b5a3c16d 100644 --- a/docs/tsconfig.json +++ b/docs/tsconfig.json @@ -19,5 +19,5 @@ "target": "esnext", "resolveJsonModule": true }, - "include": ["../docs/**/*.ts*", "store.jsx"] + "include": ["../docs/**/*.ts*", "pages/guides/store.jsx"] } From 372deb466e15d027f44ac69339ced04ab93d8b4e Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Fri, 19 Jul 2019 20:03:23 -0300 Subject: [PATCH 08/11] Wrap example with redux --- docs/pages/guides/ReduxForm.example.jsx | 64 +++++++++++++++---------- 1 file changed, 38 insertions(+), 26 deletions(-) diff --git a/docs/pages/guides/ReduxForm.example.jsx b/docs/pages/guides/ReduxForm.example.jsx index 906d2d37e..bf4df4c36 100644 --- a/docs/pages/guides/ReduxForm.example.jsx +++ b/docs/pages/guides/ReduxForm.example.jsx @@ -1,7 +1,9 @@ import React from 'react'; +import store from './store'; import Code from '../../_shared/Code'; import { connect } from 'react-redux'; import { Grid } from '@material-ui/core'; +import { Provider as ReduxProvider } from 'react-redux'; import { KeyboardDatePicker } from '@material-ui/pickers'; import { reduxForm, Field, formValueSelector } from 'redux-form'; @@ -26,39 +28,49 @@ const DateField = props => { ); }; -class ReduxFormExample extends React.PureComponent { - render() { - return ( -
- - - - - - - +const ReduxFormExample = props => { + const formValues = { + isFormValid: props.valid, + values: { + date: props.date, + }, + }; + + const submit = values => { + alert(JSON.stringify(values)); + }; + + return ( + // only calls the submit if form is valid + + + + - - ); - } -} + + + + + + ); +}; const selector = formValueSelector('example'); + const mapStateToProps = state => ({ date: selector(state, 'date'), initialValues: { date: new Date().toISOString(), }, }); + const createReduxForm = reduxForm({ form: 'example' }); -export default connect(mapStateToProps)(createReduxForm(ReduxFormExample)); +const Form = connect(mapStateToProps)(createReduxForm(ReduxFormExample)); + +const app = () => ( + +
+ +); + +export default app; From bddb8694ff2cbf9ab70022f30b900844b739cc50 Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Sun, 21 Jul 2019 10:41:36 -0300 Subject: [PATCH 09/11] remove redux-thunk --- docs/package.json | 1 - yarn.lock | 5 ----- 2 files changed, 6 deletions(-) diff --git a/docs/package.json b/docs/package.json index b4c558a3c..951075d74 100644 --- a/docs/package.json +++ b/docs/package.json @@ -65,7 +65,6 @@ "react-redux": "^7.1.0", "redux": "^4.0.4", "redux-form": "^8.2.4", - "redux-thunk": "^2.3.0", "remark-slug": "^5.1.1", "safe-json-stringify": "^1.2.0", "typescript": "^3.4.4", diff --git a/yarn.lock b/yarn.lock index 237f2c1ce..9ef51ee1a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -10268,11 +10268,6 @@ redux-form@^8.2.4: optionalDependencies: immutable "3.8.2" -redux-thunk@^2.3.0: - version "2.3.0" - resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.3.0.tgz#51c2c19a185ed5187aaa9a2d08b666d0d6467622" - integrity sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw== - redux@^4.0.0, redux@^4.0.4: version "4.0.4" resolved "https://registry.yarnpkg.com/redux/-/redux-4.0.4.tgz#4ee1aeb164b63d6a1bcc57ae4aa0b6e6fa7a3796" From 7e96ee0af56d7b6a112b620be1cf424a15474904 Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Sun, 21 Jul 2019 10:46:59 -0300 Subject: [PATCH 10/11] modify onChange to allow empty field in the other way, the field always gotten the last valid value, even when explicit deleted. This way, the user can clear the field! --- docs/pages/guides/ReduxForm.example.jsx | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/docs/pages/guides/ReduxForm.example.jsx b/docs/pages/guides/ReduxForm.example.jsx index bf4df4c36..e05b126a0 100644 --- a/docs/pages/guides/ReduxForm.example.jsx +++ b/docs/pages/guides/ReduxForm.example.jsx @@ -14,6 +14,10 @@ const DateField = props => { ...others } = props; + const onChange = date => { + Date.parse(date) ? inputProps.onChange(date.toISOString()) : inputProps.onChange(null); + }; + return ( { disabled={submitting} onBlur={() => onBlur(value ? new Date(value).toISOString() : null)} error={error && touched} - onChange={date => Date.parse(date) && inputProps.onChange(date.toISOString())} + onChange={onChange} /> ); }; From 54d67210ec0a0ab3692da634af63484733da209b Mon Sep 17 00:00:00 2001 From: igornfaustino Date: Sun, 21 Jul 2019 10:55:25 -0300 Subject: [PATCH 11/11] move store to inside Form example --- docs/pages/guides/ReduxForm.example.jsx | 14 +++++++++++--- docs/pages/guides/store.jsx | 13 ------------- docs/tsconfig.json | 2 +- 3 files changed, 12 insertions(+), 17 deletions(-) delete mode 100644 docs/pages/guides/store.jsx diff --git a/docs/pages/guides/ReduxForm.example.jsx b/docs/pages/guides/ReduxForm.example.jsx index e05b126a0..73f27f81b 100644 --- a/docs/pages/guides/ReduxForm.example.jsx +++ b/docs/pages/guides/ReduxForm.example.jsx @@ -1,8 +1,9 @@ import React from 'react'; -import store from './store'; import Code from '../../_shared/Code'; import { connect } from 'react-redux'; import { Grid } from '@material-ui/core'; +import { reducer as formReducer } from 'redux-form'; +import { createStore, combineReducers } from 'redux'; import { Provider as ReduxProvider } from 'react-redux'; import { KeyboardDatePicker } from '@material-ui/pickers'; import { reduxForm, Field, formValueSelector } from 'redux-form'; @@ -71,10 +72,17 @@ const mapStateToProps = state => ({ const createReduxForm = reduxForm({ form: 'example' }); const Form = connect(mapStateToProps)(createReduxForm(ReduxFormExample)); -const app = () => ( +const rootReducer = combineReducers({ + form: formReducer, + // Others reducers +}); + +const store = createStore(rootReducer); + +const App = () => ( ); -export default app; +export default App; diff --git a/docs/pages/guides/store.jsx b/docs/pages/guides/store.jsx deleted file mode 100644 index e32ec6bf7..000000000 --- a/docs/pages/guides/store.jsx +++ /dev/null @@ -1,13 +0,0 @@ -import { reducer as formReducer } from 'redux-form'; -import { createStore, combineReducers } from 'redux'; - -const rootReducer = combineReducers({ - form: formReducer, -}); - -const store = createStore( - rootReducer - // window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__() -); - -export default store; diff --git a/docs/tsconfig.json b/docs/tsconfig.json index 6b5a3c16d..1b5bc7d93 100644 --- a/docs/tsconfig.json +++ b/docs/tsconfig.json @@ -19,5 +19,5 @@ "target": "esnext", "resolveJsonModule": true }, - "include": ["../docs/**/*.ts*", "pages/guides/store.jsx"] + "include": ["../docs/**/*.ts*"] }