diff --git a/package.json b/package.json index 0432705..f87e968 100644 --- a/package.json +++ b/package.json @@ -28,7 +28,7 @@ "prod": "npm run prod:build && npm run start", "---------- TESTING -----------------------------------------------------------------------------": "", "test": "npm run lint && npm run unit", - "lint": "tslint 'src/**/*.ts{,x}' --exclude 'src/typings.d.ts'", + "lint": "tslint \"src/**/*.ts{,x}\" --exclude \"src/typings.d.ts\"", "unit": "jest", "------------------------------------------------------------------------------------------------": "" }, @@ -37,9 +37,10 @@ "babel-polyfill": "6.26.0", "bootstrap": "4.1.3", "classnames": "2.2.6", - "connected-react-router": "5.0.1", + "connected-react-router": "6.0.0", "fetch-everywhere": "1.0.5", "form2js": "1.0.0", + "formik": "1.4.1", "hapi": "17.8.1", "hapi-webpack-plugin": "3.0.0", "history": "4.7.2", @@ -47,64 +48,60 @@ "module-alias": "2.1.0", "node-notifier": "5.3.0", "prop-types": "15.6.2", - "react": "16.6.3", + "react": "16.7.0", "react-async-bootstrapper": "2.1.1", "react-async-component": "2.0.0", - "react-dom": "16.6.3", - "react-hot-loader": "4.3.12", - "react-redux": "5.1.1", + "react-dom": "16.7.0", + "react-hot-loader": "4.6.3", + "react-redux": "6.0.0", "react-router-dom": "4.3.1", "redux": "4.0.1", "redux-devtools-extension": "2.13.7", - "redux-form": "7.4.2", "redux-saga": "0.16.2", "serialize-javascript": "1.5.0", - "sjs-base-model": "1.5.1", - "webpack": "4.26.1" + "sjs-base-model": "1.5.2", + "webpack": "4.28.1" }, "devDependencies": { - "@babel/cli": "7.1.5", - "@babel/core": "7.1.6", - "@babel/plugin-proposal-class-properties": "7.1.0", - "@babel/plugin-proposal-object-rest-spread": "7.0.0", - "@babel/plugin-syntax-dynamic-import": "7.0.0", - "@babel/plugin-transform-runtime": "7.1.0", - "@babel/polyfill": "7.0.0", - "@babel/preset-env": "7.1.6", + "@babel/cli": "7.2.3", + "@babel/core": "7.2.2", + "@babel/plugin-proposal-class-properties": "7.2.3", + "@babel/plugin-proposal-object-rest-spread": "7.2.0", + "@babel/plugin-syntax-dynamic-import": "7.2.0", + "@babel/plugin-transform-runtime": "7.2.0", + "@babel/polyfill": "7.2.3", + "@babel/preset-env": "7.2.3", "@babel/preset-react": "7.0.0", "@babel/preset-typescript": "7.1.0", - "@types/axios": "0.14.0", "@types/classnames": "2.2.6", - "@types/hapi": "17.8.0", + "@types/hapi": "17.8.2", "@types/inert": "5.1.2", "@types/jest": "23.3.10", "@types/module-alias": "2.0.0", - "@types/node": "10.12.11", + "@types/node": "10.12.18", "@types/node-notifier": "0.0.28", - "@types/prop-types": "15.5.6", - "@types/react": "16.7.11", + "@types/prop-types": "15.5.8", + "@types/react": "16.7.17", "@types/react-dom": "16.0.11", - "@types/react-redux": "6.0.10", + "@types/react-redux": "6.0.11", "@types/react-router-dom": "4.3.1", - "@types/redux": "3.6.0", - "@types/redux-form": "7.4.12", "@types/serialize-javascript": "1.5.0", - "@types/webpack": "4.4.20", + "@types/webpack": "4.4.21", "@types/webpack-env": "1.13.6", - "autoprefixer": "9.3.1", + "autoprefixer": "9.4.3", "babel-loader": "8.0.4", - "babel-plugin-transform-react-remove-prop-types": "0.4.20", + "babel-plugin-transform-react-remove-prop-types": "0.4.21", "concurrently": "4.1.0", "copy-webpack-plugin": "4.6.0", "cross-env": "5.2.0", - "css-hot-loader": "1.4.2", - "css-loader": "1.0.1", - "fork-ts-checker-webpack-plugin": "0.5.0", + "css-hot-loader": "1.4.3", + "css-loader": "2.0.1", + "fork-ts-checker-webpack-plugin": "0.5.2", "html-webpack-harddisk-plugin": "1.0.1", "html-webpack-plugin": "3.2.0", - "mini-css-extract-plugin": "0.4.5", - "node-sass": "4.10.0", - "nodemon": "1.18.7", + "mini-css-extract-plugin": "0.5.0", + "node-sass": "4.11.0", + "nodemon": "1.18.9", "postcss-loader": "3.0.0", "redux-freeze": "0.1.7", "rimraf": "2.6.2", @@ -115,9 +112,9 @@ "stylelint-config-standard": "18.2.0", "stylelint-order": "2.0.0", "tslib": "1.9.3", - "tslint": "5.11.0", + "tslint": "5.12.0", "tslint-react": "3.6.0", - "typescript": "3.2.1", + "typescript": "3.2.2", "webpack-bundle-analyzer": "3.0.3", "webpack-cli": "3.1.2", "webpack-dev-server": "3.1.10", diff --git a/src/stores/IStore.ts b/src/stores/IStore.ts index 90306c3..0d0a9fa 100755 --- a/src/stores/IStore.ts +++ b/src/stores/IStore.ts @@ -1,13 +1,11 @@ import {RouterState} from 'connected-react-router'; import {Store} from 'redux'; -import {FormReducer} from 'redux-form'; import IMetaReducerState from './meta/IMetaReducerState'; import IUserReducerState from './user/IUserReducerState'; import IRenderReducerState from './render/IRenderReducerState'; import IModalReducerState from './modal/IModalReducerState'; export default interface IStore extends Store { - readonly form: FormReducer; readonly metaReducer: IMetaReducerState; readonly modalReducer: IModalReducerState; readonly renderReducer: IRenderReducerState; diff --git a/src/stores/rootReducer.ts b/src/stores/rootReducer.ts index bb9a62c..28e9c8a 100755 --- a/src/stores/rootReducer.ts +++ b/src/stores/rootReducer.ts @@ -2,7 +2,6 @@ import {combineReducers, Reducer, ReducersMapObject} from 'redux'; import {connectRouter} from 'connected-react-router'; import UserReducer from './user/UserReducer'; import MetaReducer from './meta/MetaReducer'; -import {reducer as formReducer} from 'redux-form'; import RenderReducer from './render/RenderReducer'; import IStore from './IStore'; import ModalReducer from './modal/ModalReducer'; @@ -10,7 +9,6 @@ import {History} from 'history'; export default (history: History): Reducer => { const reducerMap: ReducersMapObject = { - form: formReducer, metaReducer: MetaReducer.reducer, modalReducer: ModalReducer.reducer, renderReducer: RenderReducer.reducer, diff --git a/src/views/contact/Contact.tsx b/src/views/contact/Contact.tsx index 1bbe2de..8d5ab42 100644 --- a/src/views/contact/Contact.tsx +++ b/src/views/contact/Contact.tsx @@ -3,7 +3,6 @@ import {connect} from 'react-redux'; import MetaAction from '../../stores/meta/MetaAction'; import {Dispatch} from 'redux'; import IStore from '../../stores/IStore'; -import ContactForm from './ContactForm'; import IAction from '../../stores/IAction'; interface IState {} @@ -29,9 +28,9 @@ class Contact extends React.Component

{'Contact'}

-

{'This contact form uses redux-form to do client-side validation.'}

+

{'This contact form uses Formik to do client-side validation.'}

- +
TODO: add Formik
); } diff --git a/src/views/contact/ContactForm.tsx b/src/views/contact/ContactForm.tsx deleted file mode 100644 index 9fe1dcd..0000000 --- a/src/views/contact/ContactForm.tsx +++ /dev/null @@ -1,231 +0,0 @@ -import * as React from 'react'; -import {FormErrors, InjectedFormProps, reduxForm} from 'redux-form'; -import IContactForm from './IContactForm'; -import CustomField from './CustomField'; - -interface IProps extends InjectedFormProps {} - -class ContactForm extends React.Component { - - public render(): JSX.Element { - const {handleSubmit, reset} = this.props; - - return ( -
-
- -
-
- - - {'We\'ll never share your email with anyone else.'} - -
-
- -
-
- -
-
- {'Code Quality'} - - - - -
-
- -
- - -
- ); - } - - private _onSubmit = (formData: IContactForm): void => { - console.info(formData); - - window.alert(JSON.stringify(formData, null, 2)); - } - - private _renderInputField(field: any): JSX.Element { - const {meta: {touched, error}} = field; - const className: string = `small text-danger ${touched && error ? '' : 'd-none'}`; - - return ( -
- - -
- ); - } - - private _renderCheckbox(field: any): JSX.Element { - return ( - - ); - } - - private _renderRadio(field: any): JSX.Element { - return ( -
- -
- ); - } - - private _renderTextArea(field: any): JSX.Element { - const {meta: {touched, error}} = field; - const className: string = `small text-danger ${touched && error ? '' : 'd-none'}`; - - return ( -
- -