import React, { useMemo } from "react";
import { Trans, useTranslation } from "react-i18next";
import { Form } from "@local-logic/design-system";
import { useFlags } from "launchdarkly-react-client-sdk";
import { splitConsentText } from "./splitConsentText";
import { matchConsentText } from "./matchConsentText";
import * as styles from "./styles";
import { TrackingPipelineEvents, AnalyticsEvents, } from "~/sdks/LeadCapture/types";
import { useTracking } from "~/tracking";
import { useLeadCapture } from "~/sdks/LeadCapture/context";
export const PrivacyCheckbox = () => {
    const { t } = useTranslation("leadCapture");
    const tracking = useTracking();
    const flags = useFlags();
    const { consentText, consentLinks, country, state } = useLeadCapture();
    const handleOnChange = (event) => {
        const isChecked = event.target.checked;
        const eventAttributes = {
            isChecked,
        };
        tracking.postEvent({
            eventType: TrackingPipelineEvents.CONSENT_CHECKBOX_TOGGLED,
            eventAttributes: Object.entries(eventAttributes).map(([key, value]) => ({
                label: key,
                data: value,
            })),
        });
        tracking.trackAnalyticsEvent({
            eventName: AnalyticsEvents.CONSENT_CHECKBOX_TOGGLED,
            eventAttributes,
        });
    };
    const checkboxLabel = useMemo(() => {
        if (consentText && consentLinks && flags.leadCapConsentTexts) {
            const consentTextSplit = splitConsentText(consentText);
            return (React.createElement("div", { className: styles.privacyText, "data-testid": "privacy-checkbox-text" }, consentTextSplit &&
                consentTextSplit.map((part) => {
                    const match = matchConsentText(part);
                    if (match && consentLinks) {
                        const link = consentLinks[parseInt(match[1], 10)];
                        if (link) {
                            return (React.createElement("a", { key: link.href, "data-testid": "privacy-policy-link", href: link.href, target: "_blank", className: styles.privacyLink, rel: "noreferrer" }, link.text));
                        }
                        return null;
                    }
                    return React.createElement(React.Fragment, { key: part }, part);
                })));
        }
        if (country === "CAN" || state === "California") {
            return (React.createElement("div", { "data-testid": "privacy-checkbox-text" },
                React.createElement("p", { className: styles.privacyText, "data-testid": "privacy-consent-text" }, t("contactInfo.consentTexts.CANTopText")),
                React.createElement("p", { className: styles.privacyInfo },
                    React.createElement(Trans, { t: t, context: "leadCapture", i18nKey: "contactInfo.consentTexts.CANBottomText", tOptions: { interpolation: { escapeValue: false } }, components: {
                            LinkToPrivacyPolicy: (React.createElement("a", { "data-testid": "privacy-policy-link", href: "https://locallogic.co/privacy-policy/", target: "_blank", rel: "noreferrer", className: styles.privacyLink })),
                        } }))));
        }
        return (React.createElement("div", { "data-testid": "privacy-checkbox-text" },
            React.createElement("p", { className: styles.privacyText, "data-testid": "privacy-consent-text" }, t("contactInfo.consentTexts.topText")),
            React.createElement("p", { className: styles.privacyInfo, "data-testid": "privacy-policy-link" },
                React.createElement(Trans, { t: t, context: "leadCapture", i18nKey: "contactInfo.consentTexts.bottomText", tOptions: { interpolation: { escapeValue: false } }, components: {
                        LinkToPrivacyPolicy: (React.createElement("a", { href: "https://locallogic.co/privacy-policy/", target: "_blank", rel: "noreferrer", className: styles.privacyLink })),
                    } }))));
    }, [consentText, consentLinks, t]);
    return (React.createElement("div", { className: styles.privacyCheckbox, "data-testid": "privacy-checkbox-container" },
        React.createElement(Form.Checkbox, { name: "privacyPolicy", label: checkboxLabel, onChange: handleOnChange })));
};
//# sourceMappingURL=index.js.map