import { jsx as t, jsxs as i } from "react/jsx-runtime";
import { useRef as ce, useState as l, useEffect as _ } from "react";
import n from "prop-types";
import { useForm as pe } from "react-hook-form";
import { yupResolver as de } from "@hookform/resolvers/yup";
import a from "@mui/material/Grid2";
import * as v from "yup";
import { Modal as me, Typography as ue, IconButton as fe, Button as x, FormControl as B, Box as r } from "@mui/material";
import D from "@/views/custom-components/CustomTextField";
import { showToast as d } from "@/common/toaster/toaster";
import { g as he, A as ye, u as F, c as ge } from "./ManageTranslation-BTxvSYKb.js";
import be from "@/views/custom-components/CustomConfirmationModal";
import ve from "@/hooks/useTrackEvent";
import { useTranslateProvider as xe } from "@/common/languageTranslator/TranslationContext";
import { faXmark as Ae, faPen as Ce, faBars as Se } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon as A } from "@fortawesome/react-fontawesome";
import ke from "@/views/custom-components/CustomizedTable/CustomizedTableV2";
const we = ({
  open: K,
  handleClose: L,
  languages: h,
  refresh: C,
  refetch: S,
  selectedApp: O,
  setSelectedApp: R
}) => {
  const k = ce(null), y = ve(), [W, P] = l([]), [p, X] = l([]), [w, m] = l(!1), [q, T] = l(!1), { translate: s } = xe(), [H, g] = l(!1), [G, U] = l(""), [Y, J] = l(""), [c, Q] = l({}), [I, N] = l(!1), Z = v.object().shape({
    appValue: v.string().required("Select App Value"),
    appKey: v.string().required("Enter App key")
  }), {
    control: V,
    handleSubmit: $,
    reset: E,
    setValue: u,
    formState: { errors: M }
  } = pe({
    defaultValues: {},
    resolver: de(Z),
    mode: "onChange"
  }), ee = [
    { field: "Sr. No.", label: "Sr.No", align: "left" },
    { field: "appValue", label: "App", align: "left" },
    { field: "stateValue", label: "State", align: "left" },
    { field: "Actions", label: "Actions" }
  ], te = (e) => {
    u("appKey", e == null ? void 0 : e.appKey), u("appValue", e == null ? void 0 : e.appValue), u("id", e == null ? void 0 : e.id), u("isActive", e == null ? void 0 : e.isActive), T(!0), m(!0);
  }, ae = (e) => {
    U(
      (e == null ? void 0 : e.stateValue) === "Active" ? "Mark as Inactive" : "Mark as Active"
    ), J(
      (e == null ? void 0 : e.stateValue) === "Active" ? "Are you sure you want to change the state from active to inactive?" : "Are you sure you want to change the state from inactive to active?"
    ), Q(e);
  }, oe = () => {
    g((e) => !e);
  }, ie = async () => {
    try {
      c.isActive = !c.isActive, await F(c), b(), O === (c == null ? void 0 : c.id) && R(null), await C(), S(), g((e) => !e);
    } catch (e) {
      console.error(e), d({ message: "Error in Toggle State", type: "error" });
    }
  }, se = [
    { label: s(G), onClick: oe }
  ], le = [
    {
      label: "",
      icon: /* @__PURE__ */ t(A, { icon: Ce }),
      onClick: te,
      dataTestId: "app-modal-edit-icon"
    },
    {
      label: "",
      icon: /* @__PURE__ */ t(A, { icon: Se }),
      menuClick: ae,
      menuItems: se,
      dataTestId: "app-modal-menu-icon"
    }
  ], ne = () => {
    E(), T(!1), m(!0);
  };
  _(() => {
    if (p) {
      const e = [];
      p == null || p.forEach((o) => {
        let f = { ...o };
        o != null && o.isActive ? f.stateValue = "Active" : f.stateValue = "Inactive", h == null || h.forEach((z) => {
          o.language === z.id && (f.languagevalue = z.languageValue);
        }), e.push(f);
      }), P(e);
    }
  }, [p]), _(() => {
    b();
  }, []);
  const b = async () => {
    N((e) => !e);
    try {
      const e = await he();
      X(e == null ? void 0 : e.data);
    } catch (e) {
      console.error(e), d({ message: "Error in loading apps", type: "error" });
    } finally {
      N((e) => !e);
    }
  }, j = () => {
    L();
  }, re = async (e) => {
    try {
      y("button_click", {
        button_name: "add-app-add-button",
        button_type: "submit",
        button_id: "add-app-submit-button"
      });
      let o = { ...e };
      q ? (await F(o), d({ message: "App Updated Succesfully", type: "success" })) : (o.isActive = !0, await ge(o), d({ message: "App added Succesfully", type: "success" })), y("conversion_event", {
        form: k.current,
        form_name: "Add app Configuration",
        submit: !0
      }), b(), await C(), S(), m(!1);
    } catch (o) {
      console.error(o), d({ message: "Error in Adding App", type: "error" });
    }
  };
  return /* @__PURE__ */ t(
    me,
    {
      "data-testid": "appModal-modal",
      open: K,
      onClose: () => {
        j(), E();
      },
      className: "translation-modal",
      children: /* @__PURE__ */ i(
        a,
        {
          container: !0,
          sx: {
            display: "flex",
            flexDirection: "column",
            position: "absolute",
            top: 20,
            left: "50%",
            transform: "translateX(-50%)",
            width: "95%",
            maxW: "100%",
            maxWidth: { sm: 600, md: 700, lg: 800 },
            bgcolor: "background.paper",
            boxShadow: 24,
            border: 1,
            borderColor: "divider",
            borderRadius: 0.5
          },
          children: [
            /* @__PURE__ */ t(
              be,
              {
                description: Y,
                title: "CONFIRM ACTION",
                handleClick: ie,
                open: H,
                handleClose: () => {
                  g((e) => !e);
                },
                "data-testid": "app-modal-customconfirmation"
              }
            ),
            /* @__PURE__ */ i(
              a,
              {
                sx: {
                  p: 1.25,
                  px: 3,
                  display: "flex",
                  justifyContent: "space-between",
                  alignItems: "center",
                  borderBottom: 1,
                  borderColor: "divider",
                  flexWrap: "wrap",
                  gap: 1
                },
                "data-testid": "appModal-header",
                children: [
                  /* @__PURE__ */ t(
                    ue,
                    {
                      variant: "body1",
                      className: "text-customBlue",
                      sx: { fontWeight: "medium", fontSize: "1.125rem" },
                      children: s("Manage Apps")
                    }
                  ),
                  /* @__PURE__ */ t(
                    fe,
                    {
                      size: "small",
                      onClick: () => {
                        j();
                      },
                      "data-testid": "appModal-close-button",
                      children: /* @__PURE__ */ t(A, { icon: Ae })
                    }
                  )
                ]
              }
            ),
            /* @__PURE__ */ t(
              a,
              {
                item: !0,
                sx: {
                  overflowY: "auto",
                  maxHeight: "80vh",
                  width: "100%",
                  overflowX: "auto"
                },
                children: /* @__PURE__ */ t(
                  a,
                  {
                    sx: {
                      p: 1.25,
                      px: 3,
                      display: "flex",
                      justifyContent: "space-between",
                      alignItems: "center",
                      borderBottom: 1,
                      borderColor: "divider",
                      flexWrap: "wrap",
                      gap: 1
                    },
                    children: /* @__PURE__ */ i(a, { item: !0, className: "w-full", children: [
                      !w && /* @__PURE__ */ t(a, { container: !0, justifyContent: "flex-end", className: "pb-[10px]", children: /* @__PURE__ */ t(ye, { isLoading: I, children: /* @__PURE__ */ t(a, { item: !0, children: /* @__PURE__ */ i(
                        x,
                        {
                          size: "small",
                          variant: "contained",
                          "data-testid": "add-app-button",
                          color: "primary",
                          onClick: ne,
                          children: [
                            s("Add"),
                            " ",
                            s("App")
                          ]
                        }
                      ) }) }) }),
                      w && /* @__PURE__ */ t(a, { container: !0, justifyContent: "flex-start", sx: { pb: 1.25 }, children: /* @__PURE__ */ i("form", { onSubmit: $(re), className: "w-full", children: [
                        /* @__PURE__ */ t(a, { item: !0, className: "pb-[5px]", children: /* @__PURE__ */ t(
                          B,
                          {
                            variant: "outlined",
                            className: "w-full",
                            "data-testid": "app-value-field",
                            children: /* @__PURE__ */ i(
                              r,
                              {
                                sx: {
                                  display: "flex",
                                  alignItems: "center",
                                  gap: 2,
                                  mb: 1,
                                  width: "100%"
                                },
                                children: [
                                  /* @__PURE__ */ i(r, { sx: { width: "100%" }, children: [
                                    s("App"),
                                    /* @__PURE__ */ t(
                                      r,
                                      {
                                        component: "span",
                                        sx: { color: "error.main", ml: 0.5 },
                                        children: "*"
                                      }
                                    )
                                  ] }),
                                  /* @__PURE__ */ t(
                                    D,
                                    {
                                      control: V,
                                      id: "appValue",
                                      name: "appValue",
                                      errors: M,
                                      label: "",
                                      size: "small",
                                      className: "w-full",
                                      "data-testid": "app-value-input"
                                    }
                                  )
                                ]
                              }
                            )
                          }
                        ) }),
                        /* @__PURE__ */ t(a, { item: !0, className: "pb-[5px]", children: /* @__PURE__ */ t(
                          B,
                          {
                            variant: "outlined",
                            className: "w-full",
                            "data-testid": "app-key-field",
                            children: /* @__PURE__ */ i(
                              r,
                              {
                                sx: {
                                  display: "flex",
                                  alignItems: "center",
                                  gap: 2,
                                  mb: 1,
                                  width: "100%"
                                },
                                children: [
                                  /* @__PURE__ */ i(r, { sx: { width: "100%" }, children: [
                                    s("App"),
                                    " ",
                                    s("Key"),
                                    /* @__PURE__ */ t(
                                      r,
                                      {
                                        component: "span",
                                        sx: { color: "error.main", ml: 0.5 },
                                        children: "*"
                                      }
                                    )
                                  ] }),
                                  /* @__PURE__ */ t(
                                    D,
                                    {
                                      control: V,
                                      id: "appKey",
                                      name: "appKey",
                                      errors: M,
                                      label: "",
                                      size: "small",
                                      className: "w-full",
                                      "data-testid": "app-key-input"
                                    }
                                  )
                                ]
                              }
                            )
                          }
                        ) }),
                        /* @__PURE__ */ t(
                          a,
                          {
                            item: !0,
                            sx: {
                              pb: 0.625,
                              display: "flex",
                              justifyContent: "flex-end",
                              width: "100%"
                            },
                            children: /* @__PURE__ */ i(
                              r,
                              {
                                sx: {
                                  display: "flex",
                                  flexDirection: { xs: "column", sm: "row" },
                                  gap: 1,
                                  width: { xs: "100%", sm: "auto" },
                                  justifyContent: "flex-end"
                                },
                                children: [
                                  /* @__PURE__ */ t(
                                    x,
                                    {
                                      size: "small",
                                      variant: "contained",
                                      "data-testid": "add-app-cancel",
                                      color: "secondary",
                                      onClick: () => {
                                        m(!1), y("conversion_event", {
                                          form: k.current,
                                          form_name: "Add App Configuration",
                                          submit: !1
                                        });
                                      },
                                      children: s("Cancel")
                                    }
                                  ),
                                  /* @__PURE__ */ t(
                                    x,
                                    {
                                      type: "submit",
                                      size: "small",
                                      variant: "contained",
                                      "data-testid": "add-app-save",
                                      color: "primary",
                                      children: s("Save")
                                    }
                                  )
                                ]
                              }
                            )
                          }
                        )
                      ] }) }),
                      /* @__PURE__ */ t(a, { className: "w-full block", children: /* @__PURE__ */ t(
                        ke,
                        {
                          columns: ee,
                          tableData: W,
                          actions: le,
                          paginationConfig: { pagination: !1 },
                          styleConfig: { tableStyle: { maxHeight: 120 } },
                          isLoading: I
                        }
                      ) })
                    ] })
                  }
                )
              }
            )
          ]
        }
      )
    }
  );
};
we.propTypes = {
  open: n.any,
  handleClose: n.any,
  languages: n.any,
  refresh: n.any,
  refetch: n.any,
  selectedApp: n.any,
  setSelectedApp: n.any
};
export {
  we as default
};
//# sourceMappingURL=AppModal-BgZyfrd-.js.map
