import useTranslation from "next-translate/useTranslation";
import Link from "next/link";
import { useRouter } from "next/router";
import React, { useEffect } from "react";
import { connect } from "react-redux";
import { updateAccount } from "../../actions/services/accountService";
import { setCookie } from "nookies";

const PersonalDetailsComplete = (props) => {
    const {
        handleSubmit,
        value,
        setRegisterFormComplete,
        setAccountCreatedComplete
    } = props;
    let { t, lang } = useTranslation();

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

    // let contactid = props.accountDetails.loggedinUserId;
    // let updateBody = props.props.props.form.personalDetailsForm.values;
    // let prefLang =
    //     props.props.props.form.personalDetailsForm.values
    //         .pinswg_preferredlanguage;

    const { loggedinUserId } = props.accountDetails || {};
    const formValues = props.props?.props?.form?.personalDetailsForm?.values;
    const prefLang = formValues?.pinswg_preferredlanguage;

    const userLang = prefLang === "846040000" ? "cy" : "en"; // Move this outside useEffect

    useEffect(() => {
        // let contactid = props.accountDetails.loggedinUserId;
        // let updateBody = props.props.props.form.personalDetailsForm.values;
        // let prefLang =
        //     props.props.props.form.personalDetailsForm.values
        //         .pinswg_preferredlanguage;
        if (!loggedinUserId || !formValues) return;

        console.log("=============== pref lang", prefLang);
        setCookie(null, "pedw_locale", userLang, {
            path: "/"
        });

        console.log("Set cookie to:", userLang);

        async function doUpdate() {
            const response = await updateAccount(loggedinUserId, formValues);
        }

        doUpdate();
    }, [loggedinUserId, formValues, prefLang, userLang]);

    return (
        <>
            <p className="govuk-body">{t("account:account-complete-para-1")}</p>

            {/* <p className="govuk-body">{t("account:account-complete-para-2")}</p> */}

            <p className="govuk-body">
                <Link
                    locale={userLang}
                    href={userLang === "cy" ? "/cy/fymhorth" : "/myportal"}
                    className="govuk-link"
                >
                    {" "}
                    {t("account:account-complete-return-to-portal-link")}
                </Link>
            </p>
        </>
    );
};

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

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

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