From 76f4d68787cfed0528312964137b54ca48d6ee67 Mon Sep 17 00:00:00 2001 From: codeBelt Date: Thu, 20 Dec 2018 20:36:13 -0600 Subject: [PATCH 1/3] remove redux-form --- src/stores/IStore.ts | 2 - src/stores/rootReducer.ts | 2 - src/views/contact/Contact.tsx | 5 +- src/views/contact/ContactForm.tsx | 231 ------------------------------ src/views/contact/CustomField.ts | 12 -- 5 files changed, 2 insertions(+), 250 deletions(-) delete mode 100644 src/views/contact/ContactForm.tsx delete mode 100644 src/views/contact/CustomField.ts 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 ( -
- -