import React from 'react';
import PropTypes from 'prop-types';
import { reduxForm } from 'redux-form';
import cx from 'classnames';


class FormWrap extends React.Component {
    static propTypes = {
    }
    constructor(props) {
        super(props);
    }
    componentDidMount() {
    }
    UNSAFE_componentWillReceiveProps(nextProps) {
    }
    componentWillUnmount() {
    }
    render() {
        const { className } = this.props;
        return (
            <div className={cx('redux_form_wrap', className)}>
                {this.props.children}
            </div>
        );
    }
}


class ReduxFormWrap extends React.Component {
    static propTypes = {
        form: PropTypes.string,
        onSubmit: PropTypes.func,
        initialValues: PropTypes.object
    }
    static defaultProps = {
        form: '@@redux-form-wrap',
        onSubmit: (values) => { },
        initialValues: {}
    }
    constructor(props) {
        super(props);
        this.state = {
            component: null
        };
    }
    componentDidMount() {
        let MyFormWrap = reduxForm(this.props)(FormWrap);
        this.setState({
            component: MyFormWrap
        });
    }
    UNSAFE_componentWillReceiveProps(nextProps) {
        const C = this.state.component;
        if (!C) {
            let MyFormWrap = reduxForm(nextProps)(FormWrap);
            this.setState({
                component: MyFormWrap
            });
        }
    }
    render() {
        const C = this.state.component;
        const extInitialValues = {
            ...this.props.initialValues, '__form_name': this.props.form
        };
        return C
            ? <C {...this.props} initialValues={extInitialValues}>
                {this.props.children}
            </C >
            : null;
    }

}

export default ReduxFormWrap;