Plantaddressform

import React, { Component } from "react";
import { connect } from "react-redux";
import { reduxForm, formValueSelector } from "redux-form";
import { Container, Form } from "react-bootstrap";

import { PlantAddressesTemplate } from "../../../templates/initial";
import { PagerButtons } from "../../../../fields";
import validate from "./validate";
import * as actions from "../../../../../../actions";

class PlantAddressForm extends Component {
    componentDidUpdate(prevProps) {
        const {
            plantRegion,
            plantProvince,
            plantGPS,
            plantgpsCoordinates,
            change
        } = this.props;

        if (plantRegion !== prevProps.plantRegion) {
            change("plantProvince", undefined);
            change("plantCity", undefined);
        }

        if (plantProvince !== prevProps.plantProvince) {
            change("plantCity", undefined);
        }

        if (plantGPS !== prevProps.plantGPS) {
            change("plantLat", plantGPS[0].toFixed(5));
            change("plantLon", plantGPS[1].toFixed(5));
        }

        if (plantgpsCoordinates !== prevProps.plantgpsCoordinates) {
            change("plantLat", plantgpsCoordinates[0].toFixed(5));
            change("plantLon", plantgpsCoordinates[1].toFixed(5));
            change("plantGPS", plantgpsCoordinates);
        }
    }

    render() {
        const {
            handleSubmit,
            previousPage,
            plantRegion,
            plantProvince,
            plantCity,
            plantAddress,
            plantgpsCoordinates,
            plantGeocodeAddress
        } = this.props;

        return (
            <Container>
                <Form noValidate onSubmit={handleSubmit}>
                    <PlantAddressesTemplate
                        plantRegion={plantRegion}
                        plantProvince={plantProvince}
                        plantCity={plantCity}
                        plantAddress={plantAddress}
                        plantgpsCoordinates={plantgpsCoordinates}
                        plantGeocodeAddress={plantGeocodeAddress}
                    />
                    <PagerButtons previousPage={previousPage} />
                </Form>
            </Container>
        );
    }
}

const formName = "LTOFoodManufacturerInitial";

const formWrapped = reduxForm({
    form: formName,
    destroyOnUnmount: false,
    forceUnregisterOnUnmount: true,
    validate
})(PlantAddressForm);

const selector = formValueSelector(formName);

const mapStateToProps = state => {
    const plantRegion = selector(state, "plantRegion");
    const plantProvince = selector(state, "plantProvince");
    const plantCity = selector(state, "plantCity");
    const plantAddress = selector(state, "plantAddress");
    const plantGPS = selector(state, "plantGPS");
    const plantgpsCoordinates = state.plantGeocodeAddress.plantgpsCoordinates;

    //console.log(plantgpsCoordinates);

    return {
        plantRegion,
        plantProvince,
        plantCity,
        plantAddress,
        plantGPS,
        plantgpsCoordinates
    };
};

export default connect(mapStateToProps, actions)(formWrapped);