import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import { useEffect } from "react";
import { connect } from "react-redux";
import { formValueSelector } from "redux-form";
import {
    patchCase,
    sendCaseCompleteMessage,
    sendEmail,
    updateCase,
} from "../../actions";
import { setCurrentSection } from "../../store/appealType/action";
import { getFormCollectionByID } from "../utils";

let CompleteAppeal = (props) => {
    useEffect(() => {
        let incidentId = props.appealType.caseReference.incidentid;
        let updateBody = props.props.form.appealForm.values;

        let appTypeCollection = getFormCollectionByID(
            props.appealType.appealTypeID
        );
        let updateBindAppealTypeToIncident =
            appTypeCollection.NavigationProperty;

        console.log(props.appealType.appealTypeID, appTypeCollection);

        Object.assign(updateBody, {
            "pinswg_Appellant@odata.bind":
                "/contacts(" + props.props.accountDetails.loggedinUserId + ")",
            "pinswg_LocalPlanningAuthority@odata.bind":
                "/accounts(" + props.appealType.appealLPA + ")",
            "pinswg_name": props.appealType.caseReference.ticketnumber,
            [updateBindAppealTypeToIncident + "@odata.bind"]:
                "/incidents(" + incidentId + ")",
        });

        updateBody = JSON.stringify(updateBody);
        updateBody = updateBody.replace(/:"Yes"/gm, `:true`);
        updateBody = updateBody.replace(/:"No"/gm, `:false`);
        updateBody = JSON.parse(updateBody);

        let updateFormCollection = appTypeCollection.LogicalCollectionName;
        let primaryAttribute = appTypeCollection.PrimaryIdAttribute;

        updateCase(
            incidentId,
            updateBody,
            updateFormCollection,
            primaryAttribute,
            props.appealType.caseReference.ticketnumber
        );

        const reference = "PEDW-COMPLETE";
        const templateId = "618e0463-b092-4733-a024-bf8a3bbde808";
        const emailAddress = props.props.accountDetails.loggedinUserEmail;
        const personalisation = {
            "caseReference": props.appealType.caseReference.ticketnumber,
            "emailAddress": props.props.accountDetails.loggedinUserEmail,
            "linkExpiry": 10 * 60,
        };
        sendEmail(templateId, emailAddress, personalisation, reference);

        sendCaseCompleteMessage(
            props.props.accountDetails.containerID,
            props.appealType.caseReference.ticketnumber
        );

        console.log("patching////////");
        //
        //patchCase(incidentId);
    }, [
        props.appealType.caseReference,
        props.props.form.appealForm.values,
        props.appealType.appealLPA,
        props.props.accountDetails.loggedinUserId,
        props.appealType.appealTypeID,
        props.props.accountDetails.loggedinUserEmail,
        props.props.accountDetails.containerID,
    ]);

    let { t } = useTranslation();

    const router = useRouter();
    const { locale } = router;

    const {
        formXML,
        sectionCount,
        onSubmit,
        handleSubmit,
        formTitle,
        setCurrentSection,
    } = props;

    const currentSection = props.appealType.currentSection;

    const handleParam = (setValue) => (e) => setValue(e.target.value);

    const onHandleSubmit = (values) => {
        setCurrentSection(currentSection + 1);
    };

    // console.log(JSON.stringify(props.props.form.appealForm.values, null, 2));
    //alert(JSON.stringify(props.props.form.appealForm.values, null, 2));

    return (
        <div className="govuk-grid-row">
            <div className="govuk-grid-column-two-thirds">
                <div className="govuk-panel govuk-panel--confirmation">
                    <h1 className="govuk-panel__title">
                        Appeal Submission complete
                    </h1>
                    <div className="govuk-panel__body"></div>
                </div>

                <p className="govuk-body">
                    We have sent you a confirmation email.
                </p>

                <h2 className="govuk-heading-m">What happens next</h2>

                <p className="govuk-body">
                    When we receive your appeal form, we will write to you
                    letting you know if your appeal is valid, who is dealing
                    with it and what happens next.
                </p>
                <p className="govuk-body">
                    Any enquiries regarding this document/publication should be
                    sent to us at the address above or e-mail:
                    <Link href="mailto:PEDW.Casework@gov.wales">
                        PEDW.Casework@gov.wales
                    </Link>{" "}
                    /{" "}
                    <Link href="mailto:PEDW.GwaithAchos@llyw.cymru">
                        PEDW.GwaithAchos@llyw.cymru
                    </Link>
                </p>
                <p className="govuk-body">
                    Please note you can check for updates on our current service
                    at:
                    <Link href="https://www.gov.wales/planning-and-environment-decisions-wales-pedw-service-update">
                        https://www.gov.wales/planning-and-environment-decisions-wales-pedw-service-update
                    </Link>
                </p>

                <p className="govuk-body">
                    <Link href="/myportal" className="govuk-link">
                        Back to My Portal
                    </Link>
                </p>
            </div>
        </div>
    );
};

const mapStateToProps = (state) => {
    return {
        search: state.search,
        searchResultsObj: state.searchResultsObj,
        formData: state.formData,
        appealType: state.appealType,
        //form: state.form,
    };
};

const mapDispatchToProps = (dispatch) => {
    return {
        setCurrentSection: (currentSection) => {
            dispatch(setCurrentSection(currentSection));
        },
    };
};

const selector = formValueSelector("appealForm"); // <-- same as form name

export default connect(mapStateToProps, mapDispatchToProps)(CompleteAppeal);