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 { sendEmail } 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">
                        {t("newappeal:new-appeal-complete-heading-1")}
                    </h1>
                    <div className="govuk-panel__body"></div>
                </div>

                <p className="govuk-body">
                    {t("newappeal:new-appeal-complete-paragraph-1")}
                </p>

                <h2 className="govuk-heading-m">
                    {" "}
                    {t("newappeal:new-appeal-complete-heading-2")}
                </h2>

                <p className="govuk-body">
                    {t("newappeal:new-appeal-complete-paragraph-2")}
                </p>
                <p className="govuk-body">
                    {t("newappeal:new-appeal-complete-paragraph-3")}
                    <Link href={"mailto:" + t("home:login-contact-email")}>
                        {t("home:login-contact-email")}
                    </Link>
                </p>
                <p className="govuk-body">
                    {t("newappeal:new-appeal-complete-paragraph-4")}
                    {router.locale == "cy" ? (
                        <Link href="https://www.llyw.cymru/diweddariad-i-wasanaeth-penderfyniadau-cynllunio-ac-amgylchedd-cymru-pcac">
                            https://www.llyw.cymru/diweddariad-i-wasanaeth-penderfyniadau-cynllunio-ac-amgylchedd-cymru-pcac
                        </Link>
                    ) : (
                        <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">
                        {t("newappeal:new-appeal-complete-back-link")}
                    </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);