@argusoft/medplat-core 1.0.0

package/dist/AppModal-BgZyfrd-.js

@@ -0,0 +1,428 @@
+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

package/dist/AppModal-BgZyfrd-.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AppModal-BgZyfrd-.js","sources":["../src/views/Translation/AppModal.jsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\nimport PropTypes from \"prop-types\";\nimport { useForm } from \"react-hook-form\";\nimport { yupResolver } from \"@hookform/resolvers/yup\";\nimport Grid from \"@mui/material/Grid2\";\nimport * as Yup from \"yup\";\nimport {\n  Button,\n  IconButton,\n  Modal,\n  Box,\n  FormControl,\n  Typography,\n} from \"@mui/material\";\nimport CustomTextField from \"@/views/custom-components/CustomTextField\";\nimport { showToast } from \"@/common/toaster/toaster\";\nimport {\n  createApp,\n  getAllApps,\n  updateApp,\n} from \"../../services/TranslationService\";\nimport CustomConfirmationModal from \"@/views/custom-components/CustomConfirmationModal\";\nimport useTrackEvent from \"@/hooks/useTrackEvent\";\nimport { useTranslateProvider } from \"@/common/languageTranslator/TranslationContext\";\nimport { faBars, faPen, faXmark } from \"@fortawesome/free-solid-svg-icons\";\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\";\nimport CustomizedTable from \"@/views/custom-components/CustomizedTable/CustomizedTableV2\";\nimport { AppModalSkeleton } from \"./Skeletons/ManageTranslationSkeleton\";\n// Define the validation schema using Yup\n\n/**\n * Modal component for configuring mobile type event notifications.\n * @module appModal\n * @param {Object} props - The props for the component.\n * @param {boolean} props.open - Whether the modal is open or not.\n * @param {Function} props.handleClose - Function to close the modal.\n * @param {Array} props.languages - List of language objects for language-specific data.\n *\n * @returns {JSX.Element} The rendered modal component.\n *\n */\nconst AppModal = ({\n  open,\n  handleClose,\n  languages,\n  refresh,\n  refetch,\n  selectedApp,\n  setSelectedApp,\n}) => {\n  const formRef = useRef(null);\n  const trackEvent = useTrackEvent();\n  const [tableData, setTableData] = useState([]);\n  const [apps, setApps] = useState([]);\n  const [showForm, setShowForm] = useState(false);\n  const [isEdit, setIsEdit] = useState(false);\n  const { translate } = useTranslateProvider();\n\n  const [toggleOpen, setToggleOpen] = useState(false);\n\n  const [isActiveLabel, setIsActiveLabel] = useState(\"\");\n  const [isActiveDescription, setIsActiveDescription] = useState(\"\");\n  const [clickedRow, setClickedRow] = useState({});\n  const [loading, setLoading] = useState(false);\n\n  const validationSchema = Yup.object().shape({\n    appValue: Yup.string().required(\"Select App Value\"),\n    appKey: Yup.string().required(\"Enter App key\"),\n  });\n\n  const {\n    control,\n    handleSubmit,\n    reset,\n    setValue,\n    formState: { errors },\n  } = useForm({\n    defaultValues: {},\n    resolver: yupResolver(validationSchema),\n    mode: \"onChange\",\n  });\n\n  const cols = [\n    { field: \"Sr. No.\", label: `Sr.No`, align: \"left\" },\n    { field: \"appValue\", label: \"App\", align: \"left\" },\n    { field: \"stateValue\", label: \"State\", align: \"left\" },\n    { field: \"Actions\", label: \"Actions\" },\n  ];\n\n  /**\n   * Handles editing an existing app.\n   * @method handleEdit\n   * @param {Object} row - The row object containing app data to be edited.\n   */\n  const handleEdit = (row) => {\n    setValue(\"appKey\", row?.appKey);\n    setValue(\"appValue\", row?.appValue);\n    setValue(\"id\", row?.id);\n    setValue(\"isActive\", row?.isActive);\n    setIsEdit(true);\n    setShowForm(true);\n  };\n\n  /**\n   * Toggles the state option for an app.\n   * @method handleToggleOption\n   * @param {Object} data - The data related to the app state.\n   */\n  const handleToggleOption = (data) => {\n    setIsActiveLabel(\n      data?.stateValue === \"Active\" ? \"Mark as Inactive\" : \"Mark as Active\",\n    );\n    setIsActiveDescription(\n      data?.stateValue === \"Active\"\n        ? \"Are you sure you want to change the state from active to inactive?\"\n        : \"Are you sure you want to change the state from inactive to active?\",\n    );\n    setClickedRow(data);\n  };\n\n  /**\n   * Toggles the visibility of the state change confirmation modal.\n   * @method handleToggle\n   */\n  const handleToggle = () => {\n    setToggleOpen((curr) => !curr);\n  };\n\n  /**\n   * Handles the toggling of the app state (active/inactive).\n   * @method handleToggleState\n   */\n  const handleToggleState = async () => {\n    try {\n      clickedRow.isActive = !clickedRow.isActive;\n      await updateApp(clickedRow);\n      init();\n      if (selectedApp === clickedRow?.id) {\n        setSelectedApp(null);\n      }\n      await refresh();\n      refetch();\n\n      setToggleOpen((cur) => !cur);\n    } catch (error) {\n      console.error(error);\n      showToast({ message: \"Error in Toggle State\", type: \"error\" });\n    }\n  };\n\n  const menuItems = [\n    { label: translate(isActiveLabel), onClick: handleToggle },\n  ];\n\n  const actions = [\n    {\n      label: \"\",\n      icon: <FontAwesomeIcon icon={faPen} />,\n      onClick: handleEdit,\n      dataTestId: \"app-modal-edit-icon\",\n    },\n    {\n      label: \"\",\n      icon: <FontAwesomeIcon icon={faBars} />,\n      menuClick: handleToggleOption,\n      menuItems: menuItems,\n      dataTestId: \"app-modal-menu-icon\",\n    },\n  ];\n\n  /**\n   * Initializes the modal by resetting values and setting up state.\n   * @method addApp\n   */\n  const addApp = () => {\n    reset();\n    setIsEdit(false);\n    setShowForm(true);\n  };\n\n  useEffect(() => {\n    if (apps) {\n      const data = [];\n      apps?.forEach((element) => {\n        let newElement = { ...element };\n        if (element?.isActive) {\n          newElement.stateValue = \"Active\";\n        } else {\n          newElement.stateValue = \"Inactive\";\n        }\n        languages?.forEach((lang) => {\n          if (element.language === lang.id) {\n            newElement.languagevalue = lang.languageValue;\n          }\n        });\n\n        data.push(newElement);\n      });\n      setTableData(data);\n    }\n  }, [apps]);\n\n  useEffect(() => {\n    init();\n  }, []);\n  const init = async () => {\n    setLoading((cur) => !cur);\n    try {\n      const res = await getAllApps();\n      setApps(res?.data);\n    } catch (error) {\n      console.error(error);\n      showToast({ message: \"Error in loading apps\", type: \"error\" });\n    } finally {\n      setLoading((cur) => !cur);\n    }\n  };\n  const close = () => {\n    handleClose();\n  };\n  const onSubmit = async (data) => {\n    try {\n      trackEvent(\"button_click\", {\n        button_name: \"add-app-add-button\",\n        button_type: \"submit\",\n        button_id: \"add-app-submit-button\",\n      });\n      let appDto = { ...data };\n      if (isEdit) {\n        await updateApp(appDto);\n        showToast({ message: \"App Updated Succesfully\", type: \"success\" });\n      } else {\n        appDto.isActive = true;\n        await createApp(appDto);\n        showToast({ message: \"App added Succesfully\", type: \"success\" });\n      }\n\n      trackEvent(\"conversion_event\", {\n        form: formRef.current,\n        form_name: \"Add app Configuration\",\n        submit: true,\n      });\n\n      init();\n\n      await refresh();\n      refetch();\n      setShowForm(false);\n    } catch (error) {\n      console.error(error);\n      showToast({ message: \"Error in Adding App\", type: \"error\" });\n    }\n  };\n\n  return (\n    <Modal\n      data-testid=\"appModal-modal\"\n      open={open}\n      onClose={() => {\n        close();\n        reset();\n      }}\n      className=\"translation-modal\"\n    >\n      <Grid\n        container\n        sx={{\n          display: \"flex\",\n          flexDirection: \"column\",\n          position: \"absolute\",\n          top: 20,\n          left: \"50%\",\n          transform: \"translateX(-50%)\",\n          width: \"95%\",\n          maxW: \"100%\",\n          maxWidth: { sm: 600, md: 700, lg: 800 },\n          bgcolor: \"background.paper\",\n          boxShadow: 24,\n          border: 1,\n          borderColor: \"divider\",\n          borderRadius: 0.5,\n        }}\n      >\n        <CustomConfirmationModal\n          description={isActiveDescription}\n          title={\"CONFIRM ACTION\"}\n          handleClick={handleToggleState}\n          open={toggleOpen}\n          handleClose={() => {\n            setToggleOpen((cur) => !cur);\n          }}\n          data-testid=\"app-modal-customconfirmation\"\n        />\n\n        <Grid\n          sx={{\n            p: 1.25,\n            px: 3,\n            display: \"flex\",\n            justifyContent: \"space-between\",\n            alignItems: \"center\",\n            borderBottom: 1,\n            borderColor: \"divider\",\n            flexWrap: \"wrap\",\n            gap: 1,\n          }}\n          data-testid=\"appModal-header\"\n        >\n          <Typography\n            variant=\"body1\"\n            className=\"text-customBlue\"\n            sx={{ fontWeight: \"medium\", fontSize: \"1.125rem\" }}\n          >\n            {translate(\"Manage Apps\")}\n          </Typography>\n          <IconButton\n            size=\"small\"\n            onClick={() => {\n              close();\n            }}\n            data-testid=\"appModal-close-button\"\n          >\n            <FontAwesomeIcon icon={faXmark} />\n          </IconButton>\n        </Grid>\n\n        <Grid\n          item\n          sx={{\n            overflowY: \"auto\",\n            maxHeight: \"80vh\",\n            width: \"100%\",\n            overflowX: \"auto\",\n          }}\n        >\n          <Grid\n            sx={{\n              p: 1.25,\n              px: 3,\n              display: \"flex\",\n              justifyContent: \"space-between\",\n              alignItems: \"center\",\n              borderBottom: 1,\n              borderColor: \"divider\",\n              flexWrap: \"wrap\",\n              gap: 1,\n            }}\n          >\n            <Grid item className=\"w-full\">\n              {!showForm && (\n                <Grid container justifyContent=\"flex-end\" className=\"pb-[10px]\">\n                  <AppModalSkeleton isLoading={loading}>\n                    <Grid item>\n                      <Button\n                        size=\"small\"\n                        variant=\"contained\"\n                        data-testid=\"add-app-button\"\n                        color=\"primary\"\n                        onClick={addApp}\n                      >\n                        {translate(\"Add\")} {translate(\"App\")}\n                      </Button>\n                    </Grid>\n                  </AppModalSkeleton>\n                </Grid>\n              )}\n\n              {showForm && (\n                <Grid container justifyContent=\"flex-start\" sx={{ pb: 1.25 }}>\n                  <form onSubmit={handleSubmit(onSubmit)} className=\"w-full\">\n                    <Grid item className=\"pb-[5px]\">\n                      <FormControl\n                        variant=\"outlined\"\n                        className=\"w-full\"\n                        data-testid=\"app-value-field\"\n                      >\n                        <Box\n                          sx={{\n                            display: \"flex\",\n                            alignItems: \"center\",\n                            gap: 2,\n                            mb: 1,\n                            width: \"100%\",\n                          }}\n                        >\n                          <Box sx={{ width: \"100%\" }}>\n                            {translate(\"App\")}\n                            <Box\n                              component=\"span\"\n                              sx={{ color: \"error.main\", ml: 0.5 }}\n                            >\n                              *\n                            </Box>\n                          </Box>\n                          <CustomTextField\n                            control={control}\n                            id=\"appValue\"\n                            name=\"appValue\"\n                            errors={errors}\n                            label=\"\"\n                            size=\"small\"\n                            className=\"w-full\"\n                            data-testid=\"app-value-input\"\n                          />\n                        </Box>\n                      </FormControl>\n                    </Grid>\n\n                    <Grid item className=\"pb-[5px]\">\n                      <FormControl\n                        variant=\"outlined\"\n                        className=\"w-full\"\n                        data-testid=\"app-key-field\"\n                      >\n                        <Box\n                          sx={{\n                            display: \"flex\",\n                            alignItems: \"center\",\n                            gap: 2,\n                            mb: 1,\n                            width: \"100%\",\n                          }}\n                        >\n                          <Box sx={{ width: \"100%\" }}>\n                            {translate(\"App\")} {translate(\"Key\")}\n                            <Box\n                              component=\"span\"\n                              sx={{ color: \"error.main\", ml: 0.5 }}\n                            >\n                              *\n                            </Box>\n                          </Box>\n                          <CustomTextField\n                            control={control}\n                            id=\"appKey\"\n                            name=\"appKey\"\n                            errors={errors}\n                            label=\"\"\n                            size=\"small\"\n                            className=\"w-full\"\n                            data-testid=\"app-key-input\"\n                          />\n                        </Box>\n                      </FormControl>\n                    </Grid>\n\n                    <Grid\n                      item\n                      sx={{\n                        pb: 0.625,\n                        display: \"flex\",\n                        justifyContent: \"flex-end\",\n                        width: \"100%\",\n                      }}\n                    >\n                      <Box\n                        sx={{\n                          display: \"flex\",\n                          flexDirection: { xs: \"column\", sm: \"row\" },\n                          gap: 1,\n                          width: { xs: \"100%\", sm: \"auto\" },\n                          justifyContent: \"flex-end\",\n                        }}\n                      >\n                        <Button\n                          size=\"small\"\n                          variant=\"contained\"\n                          data-testid=\"add-app-cancel\"\n                          color=\"secondary\"\n                          onClick={() => {\n                            setShowForm(false);\n                            trackEvent(\"conversion_event\", {\n                              form: formRef.current,\n                              form_name: \"Add App Configuration\",\n                              submit: false,\n                            });\n                          }}\n                        >\n                          {translate(\"Cancel\")}\n                        </Button>\n                        <Button\n                          type=\"submit\"\n                          size=\"small\"\n                          variant=\"contained\"\n                          data-testid=\"add-app-save\"\n                          color=\"primary\"\n                        >\n                          {translate(\"Save\")}\n                        </Button>\n                      </Box>\n                    </Grid>\n                  </form>\n                </Grid>\n              )}\n              <Grid className=\"w-full block\">\n                <CustomizedTable\n                  columns={cols}\n                  tableData={tableData}\n                  actions={actions}\n                  paginationConfig={{ pagination: false }}\n                  styleConfig={{ tableStyle: { maxHeight: 120 } }}\n                  isLoading={loading}\n                />\n              </Grid>\n            </Grid>\n          </Grid>\n        </Grid>\n      </Grid>\n    </Modal>\n  );\n};\n\nAppModal.propTypes = {\n  open: PropTypes.any,\n  handleClose: PropTypes.any,\n  languages: PropTypes.any,\n  refresh: PropTypes.any,\n  refetch: PropTypes.any,\n  selectedApp: PropTypes.any,\n  setSelectedApp: PropTypes.any,\n};\n\nexport default AppModal;\n"],"names":["AppModal","open","handleClose","languages","refresh","refetch","selectedApp","setSelectedApp","formRef","useRef","trackEvent","useTrackEvent","tableData","setTableData","useState","apps","setApps","showForm","setShowForm","isEdit","setIsEdit","translate","useTranslateProvider","toggleOpen","setToggleOpen","isActiveLabel","setIsActiveLabel","isActiveDescription","setIsActiveDescription","clickedRow","setClickedRow","loading","setLoading","validationSchema","Yup","control","handleSubmit","reset","setValue","errors","useForm","yupResolver","cols","handleEdit","row","handleToggleOption","data","handleToggle","curr","handleToggleState","updateApp","init","cur","error","showToast","menuItems","actions","jsx","FontAwesomeIcon","faPen","faBars","addApp","useEffect","element","newElement","lang","res","getAllApps","close","onSubmit","appDto","createApp","Modal","jsxs","Grid","CustomConfirmationModal","Typography","IconButton","faXmark","AppModalSkeleton","Button","FormControl","Box","CustomTextField","CustomizedTable","PropTypes"],"mappings":"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"}

package/dist/ChangePasswordModal-MV7g8tkA.js

@@ -0,0 +1,176 @@
+import { jsx as e, jsxs as r } from "react/jsx-runtime";
+import { yupResolver as j } from "@hookform/resolvers/yup";
+import m from "prop-types";
+import { Modal as q, Paper as R, Card as k, CardHeader as A, Typography as l, CardContent as B, Button as g } from "@mui/material";
+import s from "@mui/material/Grid2";
+import * as n from "yup";
+import { useRef as y, useEffect as F } from "react";
+import { useForm as I } from "react-hook-form";
+import { P, a as M } from "./ManageUser-PHiTNyF8.js";
+import W from "@/hooks/useAESEncryption.js";
+import { o as _ } from "./UserListSkeleton-cglK2SaU.js";
+import { showToast as b } from "@/common/toaster/toaster.jsx";
+import $ from "@/hooks/useTrackEvent";
+import { useTranslateProvider as G } from "@/common/languageTranslator/TranslationContext";
+const H = n.object().shape({
+  password: n.string().required("Password is required").matches(
+    /^(?=.*[a-z])(?=.*[A-Z])(?=.*[@$!%*?&#]).{8,}$/,
+    "Password must be at least 8 characters long with one uppercase letter and one special character"
+  ),
+  confirmPassword: n.string().required("Confirm Password is required").oneOf([n.ref("password"), null], "Passwords do not match")
+}), O = ({ open: x, onClose: d, userId: C, ...v }) => {
+  const {
+    control: p,
+    formState: { errors: h },
+    handleSubmit: N,
+    watch: S
+  } = I({ resolver: j(H), mode: "onChange" }), i = y(null), u = y(!1), z = $(), E = W(), { translate: a } = G(), T = async ({ password: t }) => {
+    var w, f;
+    try {
+      const c = await E.encrypt(t);
+      try {
+        await _({
+          oldPassword: c,
+          userId: C
+        }), d(), b({
+          message: "Password Changed Successfully",
+          type: "success"
+        }), u.current = !0;
+      } catch (o) {
+        console.error(o), b({
+          message: ((f = (w = o == null ? void 0 : o.response) == null ? void 0 : w.data) == null ? void 0 : f.message) || "Something Went Wrong",
+          type: "error"
+        });
+      }
+    } catch (c) {
+      console.error(c);
+    }
+  };
+  return F(() => {
+    let t = i.current;
+    return () => {
+      t && z("conversion_event", {
+        form: t,
+        form_name: "Change Password",
+        submit: u.current
+      });
+    };
+  }, [i.current]), /* @__PURE__ */ e(q, { open: x, onClose: d, ...v, children: /* @__PURE__ */ e(R, { className: "absolute mt-[12rem] top-[10%] left-1/2 transform -translate-x-1/2 -translate-y-1/2 w-[90%] md:w-[60%]", children: /* @__PURE__ */ r(
+    k,
+    {
+      className: "m-0",
+      elevation: 5,
+      component: "form",
+      ref: i,
+      onSubmit: N(T),
+      noValidate: !0,
+      children: [
+        /* @__PURE__ */ e(
+          A,
+          {
+            className: "manage-user-type-header",
+            subheader: /* @__PURE__ */ r(l, { className: "subheader-style text-customBlue text-lg", children: [
+              a("Change Password"),
+              " "
+            ] }),
+            "data-testid": "changepasswordmodal-cardheader-subheader"
+          }
+        ),
+        /* @__PURE__ */ r(B, { children: [
+          /* @__PURE__ */ r(s, { container: !0, spacing: 2, alignItems: "space-between", children: [
+            /* @__PURE__ */ e(s, { size: { xs: 10 }, children: /* @__PURE__ */ r(l, { variant: "body1", className: "flex items-center", children: [
+              a("New Password"),
+              " ",
+              /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
+            ] }) }),
+            /* @__PURE__ */ e(
+              s,
+              {
+                size: { xs: 12 },
+                "data-testid": "changepasswordmodal-grid-newpasswordfield",
+                children: /* @__PURE__ */ e(
+                  P,
+                  {
+                    control: p,
+                    name: "password",
+                    errors: h
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ e(
+              s,
+              {
+                size: { xs: 12 },
+                "data-testid": "changepasswordmodal-grid-passwordstrengthbar",
+                children: /* @__PURE__ */ e(M, { password: S("password") })
+              }
+            ),
+            /* @__PURE__ */ e(
+              s,
+              {
+                size: { xs: 12 },
+                "data-testid": "changepasswordmodal-grid-confirmpasswordlabel",
+                children: /* @__PURE__ */ r(l, { variant: "body1", className: "flex items-center", children: [
+                  a("Confirm Password"),
+                  " ",
+                  /* @__PURE__ */ e("span", { className: "text-red-500 ml-1", children: "*" })
+                ] })
+              }
+            ),
+            /* @__PURE__ */ e(
+              s,
+              {
+                size: { xs: 12 },
+                "data-testid": "changepaConfirm Passwordsswordmodal-grid-confirmpasswordfield",
+                children: /* @__PURE__ */ e(
+                  P,
+                  {
+                    control: p,
+                    name: "confirmPassword",
+                    errors: h
+                  }
+                )
+              }
+            )
+          ] }),
+          /* @__PURE__ */ r(s, { container: !0, wrap: "nowrap", gap: 1, justifyContent: "flex-end", children: [
+            /* @__PURE__ */ e(
+              g,
+              {
+                type: "submit",
+                variant: "contained",
+                size: "small",
+                color: "primary",
+                className: "mt-[1rem]",
+                "data-testid": "changepasswordmodal-button-submit",
+                children: a("Change Password")
+              }
+            ),
+            /* @__PURE__ */ e(
+              g,
+              {
+                variant: "contained",
+                onClick: d,
+                className: "mt-[1rem]",
+                color: "secondary",
+                size: "small",
+                "data-testid": "changepasswordmodal-button-cancel",
+                children: a("Cancel")
+              }
+            )
+          ] })
+        ] })
+      ]
+    }
+  ) }) });
+};
+O.propTypes = {
+  open: m.any,
+  onClose: m.any,
+  userId: m.any
+};
+export {
+  O as default
+};
+//# sourceMappingURL=ChangePasswordModal-MV7g8tkA.js.map