;
{
  try {
    let e = "undefined" != typeof window ? window : "undefined" != typeof global ? global : "undefined" != typeof globalThis ? globalThis : "undefined" != typeof self ? self : {}, n = new e.Error().stack;
    n && (e._sentryDebugIds = e._sentryDebugIds || {}, e._sentryDebugIds[n] = "0ee493c4-4eb9-4644-8b05-c5d7d5a99e91", e._sentryDebugIdIdentifier = "sentry-dbid-0ee493c4-4eb9-4644-8b05-c5d7d5a99e91");
  } catch (e) {
  }
}
;
import { jsx, jsxs } from "preact/jsx-runtime";
import { useQueryClient } from "@tanstack/preact-query";
import { useCallback, useMemo, useEffect } from "preact/hooks";
import { c as useLegalEntity, L as Loader, R as ROOT_LE, a8 as EntityTypes, u as useTranslation, p as useAnalyticsContext, a3 as createLogger } from "./StoreProvider-CqQrndhS.js";
import { u as useUpdateLegalEntity } from "./useUpdateLegalEntity-CcNBhTXa.js";
import { c as contactDetailsValidationRules, f as fieldConfig, u as useValidatePhoneNumberImperatively, g as getAsyncPhoneValidationRules, C as ContactDetails, d as defaultFieldMetadata } from "./ContactDetails-pYgoiSM_.js";
import { H as Header } from "./Header-Dt-hNg1U.js";
import { u as useToastContext } from "./useToastContext-CPvuqSMm.js";
import { u as useMultiForm } from "./useMultiForm-XT1CUuQs.js";
import { E as ErrorPanel } from "./ErrorPanel-D-VMcBB9.js";
import { u as useCapabilityProblems, g as getProblemsForEntity } from "./getProblemsForEntity-C1PgQbDM.js";
import { r as resolveFieldMetadata } from "./fieldConfigurations-BUT9DTUH.js";
import { c as createFormUtils } from "./formUtils-CwOJPw6N.js";
import { A as ActionBar } from "./ActionBar-DPfNdSxA.js";
const mapCustomerSupportSchemaToCustomerSupportType = (customerSupport) => {
  return {
    email: customerSupport?.customerSupport?.email || "",
    phone: {
      number: customerSupport?.customerSupport?.phoneNumber?.number || "",
      type: "mobile"
    }
  };
};
const logger = createLogger();
const CustomerSupport = (props) => {
  const { data, isLoading } = useLegalEntity(ROOT_LE);
  if (isLoading || !data) {
    return /* @__PURE__ */ jsx(Loader, { size: "large" });
  }
  return /* @__PURE__ */ jsx(CustomerSupportInner, { ...props, legalEntity: data });
};
function CustomerSupportInner({
  country,
  onSubmit,
  legalEntity
}) {
  const capabilityProblems = useCapabilityProblems();
  const problems = capabilityProblems ? getProblemsForEntity(capabilityProblems, EntityTypes.LEGAL_ENTITY, legalEntity.id) : void 0;
  const { t } = useTranslation("common");
  const userEvents = useAnalyticsContext();
  const { showToast } = useToastContext();
  const formUtils = createFormUtils({}, t);
  const { mutateAsync: updateLegalEntity } = useUpdateLegalEntity();
  const queryClient = useQueryClient();
  const requiredFields = {
    customerSupport: ["email", "phoneNumber"]
  };
  const validators = useCallback(
    (data2) => ({
      customerSupport: {
        ...contactDetailsValidationRules,
        phoneNumber: resolveFieldMetadata(
          fieldConfig[data2?.customerSupport?.phoneNumber?.phoneCountryCode ?? country],
          {},
          defaultFieldMetadata
        )?.validators
      }
    }),
    [country]
  );
  const validatePhoneNumber = useValidatePhoneNumberImperatively();
  const asyncValidators = useMemo(
    () => ({
      customerSupport: {
        phoneNumber: getAsyncPhoneValidationRules(validatePhoneNumber).phoneNumber
      }
    }),
    [validatePhoneNumber]
  );
  const legalEntityType = legalEntity.type;
  const defaultCustomerSupportData = {
    customerSupport: {
      phoneNumber: legalEntity[legalEntityType]?.support?.phone,
      email: legalEntity[legalEntityType]?.support?.email
    }
  };
  const { data, handleChangeFor, valid, errors, isValid, triggerValidation } = useMultiForm({
    requiredFields,
    defaultData: defaultCustomerSupportData,
    rules: validators,
    asyncRules: asyncValidators
  });
  useEffect(() => {
    userEvents.addTaskEvent("Landed on page", {
      actionType: "start"
    });
  }, [userEvents]);
  const submitForm = async () => {
    const isAsyncValidationValid = await triggerValidation("customerSupport");
    if (!isValid?.customerSupport || !isAsyncValidationValid) {
      return;
    }
    const support = mapCustomerSupportSchemaToCustomerSupportType(data);
    const payload = {
      [legalEntityType]: { support }
    };
    try {
      const patchLegalEntity = {
        ...payload,
        id: legalEntity.id
      };
      await updateLegalEntity(patchLegalEntity);
      queryClient.invalidateQueries({ queryKey: ["legalEntity", legalEntity?.id] });
      onSubmit();
      userEvents.addTaskEvent("Success", {
        actionType: "submit"
      });
    } catch {
      const label = t(($) => $["failedToUpdateDetails"]);
      logger.error(label, payload);
      showToast({ label, variant: "error" });
    }
  };
  const handleFieldChange = (fieldName, mode) => handleChangeFor(fieldName, "customerSupport", mode);
  return /* @__PURE__ */ jsxs("form", { className: "adyen-kyc-individual__customer-support", "aria-describedby": "ariaErrorField", children: [
    /* @__PURE__ */ jsx(
      Header,
      {
        title: t(($) => $["customerSupport"]),
        description: t(($) => $["howYourCustomersCanReachYou"])
      }
    ),
    /* @__PURE__ */ jsx(
      ErrorPanel,
      {
        verificationErrors: problems?.verificationErrors?.["customerSupport"],
        formUtils,
        id: "ariaErrorField"
      }
    ),
    /* @__PURE__ */ jsx(
      ContactDetails,
      {
        data: data.customerSupport,
        errors: errors.customerSupport,
        valid: valid.customerSupport,
        country,
        requiredFields: requiredFields?.customerSupport,
        handleFieldChange
      }
    ),
    /* @__PURE__ */ jsx(ActionBar, { onNext: submitForm, nextButtonLabel: t(($) => $["submit"]) })
  ] });
}
export {
  CustomerSupport
};
