@argusoft/medplat-core 1.0.28 → 1.0.30

package/dist/ManageTranslation-vRiptUAP.js

@@ -0,0 +1,833 @@
+import { jsxs as p, jsx as t, Fragment as Ne } from "react/jsx-runtime";
+import { useRef as _a, useState as i, useEffect as ea, useMemo as B, useCallback as za, Suspense as ta, lazy as sa } from "react";
+import { api as h } from "@/common/interceptors/AxiosInterceptor";
+import { execute as Me, executeQuery as P } from "@/common/services/GlobalApis";
+import { showToast as b } from "@/common/toaster/toaster";
+import C from "@mui/material/Grid2";
+import { getAssignedFeatures as we } from "@/utils/feature";
+import { Chip as Fa, Box as f, Typography as L, Paper as _e, Button as M, InputAdornment as Wa, IconButton as ze, FormControlLabel as Fe, ToggleButtonGroup as We, ToggleButton as Ea } from "@mui/material";
+import { useForm as Ee, useWatch as Da } from "react-hook-form";
+import De from "@/hooks/usePagination";
+import je from "@/views/custom-components/CustomConfirmationModal";
+import w from "@/common/services/util/GeneralUtil";
+import { useTranslateProvider as Be } from "@/common/languageTranslator/TranslationContext";
+import u from "prop-types";
+import { useSelector as K } from "react-redux";
+import { getUseSkeleton as $ } from "@/store/reducers/SkeletonReducer";
+import Pe from "@/views/custom-components/CustomizedTable/VirtualCustomizedTableV2";
+import ja from "@/views/custom-components/CustomDropdown";
+import Ve from "@/views/custom-components/CustomSwitch";
+import Ke from "@/views/custom-components/DebouncedSearchInput";
+import x from "@/common/fontAwesomeIcons/FontAwesomeIcons";
+import './ManageTranslation.css';const Ct = (e) => h.post("/translation/languages", e), Lt = (e) => h.put("/translation/languages", e), $e = () => h.get("/translation/languages"), St = (e) => h.post("/translation/apps", e), kt = (e) => h.post("/translation/apps", e), Oe = () => h.get("/translation/apps"), Tt = (e) => h.post("/translation/labels", e), It = (e) => h.post("/translation/map", e), Nt = (e) => h.post("/translation/mapUpdate", e), qe = (e, r, c) => {
+  const y = new URLSearchParams({
+    key: e,
+    isActive: r,
+    app: c
+  }).toString();
+  return h.put(`/translation/toggleActive?${y}`, { key: e, isActive: r, app: c });
+}, Mt = (e, r) => h.get("/translation/translate", { params: { targetLangs: e, englishText: r } }), Ba = ({ children: e, isLoading: r }) => !K($) || !r ? e : /* @__PURE__ */ p("div", { className: "flex flex-col gap-6 w-full", children: [
+  /* @__PURE__ */ p("div", { className: "flex w-full flex-wrap items-start justify-between gap-4", children: [
+    /* @__PURE__ */ p("div", { className: "flex flex-col gap-2 w-full lg:w-2/5", children: [
+      /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-56 h-7" }),
+      /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full max-w-140 h-4" })
+    ] }),
+    /* @__PURE__ */ p("div", { className: "flex flex-wrap gap-2", children: [
+      /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-32 h-9" }),
+      /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-36 h-9" }),
+      /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-28 h-9" })
+    ] })
+  ] }),
+  /* @__PURE__ */ p("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-4 w-full", children: [
+    /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10" }),
+    /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10" }),
+    /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10" }),
+    /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10" })
+  ] }),
+  /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-8" })
+] });
+Ba.propTypes = {
+  children: u.any,
+  isLoading: u.any
+};
+const Ge = ({ children: e, isLoading: r = !0 }) => !K($) || !r ? e : /* @__PURE__ */ t("div", { className: "flex flex-col gap-4 w-full", children: [1, 2, 3, 4].map((y) => /* @__PURE__ */ p(
+  "div",
+  {
+    className: "flex flex-col sm:flex-row gap-2 sm:gap-4 w-full",
+    children: [
+      /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full sm:w-1/3 h-5" }),
+      /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm w-full h-10" })
+    ]
+  },
+  y
+)) });
+Ge.propTypes = {
+  children: u.any,
+  isLoading: u.any
+};
+const He = ({ children: e, isLoading: r = !0 }) => !K($) || !r ? e : /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm h-[32px] w-[100px]" });
+He.propTypes = {
+  children: u.any,
+  isLoading: u.any
+};
+const Ue = ({ children: e, isLoading: r = !0 }) => !K($) || !r ? e : /* @__PURE__ */ t("div", { className: "bg-gray-300 animate-pulse rounded-sm h-[32px] w-[120px]" });
+Ue.propTypes = {
+  children: u.any,
+  isLoading: u.any
+};
+u.any, u.any;
+const Xe = {
+  Active: { label: "Active", color: "success" },
+  Inactive: { label: "Inactive", color: "default" }
+}, Pa = ({ state: e, translate: r = (c) => c }) => {
+  const c = Xe[e];
+  return c ? /* @__PURE__ */ t(
+    Fa,
+    {
+      size: "small",
+      label: r(c.label),
+      color: c.color,
+      variant: c.color === "default" ? "outlined" : "filled",
+      "data-testid": `translation-state-chip-${c.label.toLowerCase()}`
+    }
+  ) : /* @__PURE__ */ t(Fa, { size: "small", variant: "outlined", label: "—" });
+};
+Pa.propTypes = {
+  state: u.string,
+  translate: u.func
+};
+const V = ({ icon: e, title: r, body: c, action: y, dataTestId: O }) => /* @__PURE__ */ p(
+  f,
+  {
+    "data-testid": O,
+    sx: {
+      display: "flex",
+      flexDirection: "column",
+      alignItems: "center",
+      justifyContent: "center",
+      textAlign: "center",
+      gap: 1,
+      px: 3,
+      py: 8
+    },
+    children: [
+      /* @__PURE__ */ t(f, { sx: { color: "text.disabled" }, children: /* @__PURE__ */ t(x, { iconName: e, size: "2x" }) }),
+      /* @__PURE__ */ t(L, { variant: "subtitle1", sx: { fontWeight: 700 }, children: r }),
+      c && /* @__PURE__ */ t(L, { variant: "body2", color: "text.secondary", sx: { maxWidth: 440 }, children: c }),
+      y
+    ]
+  }
+);
+V.propTypes = {
+  icon: u.string,
+  title: u.node,
+  body: u.node,
+  action: u.node,
+  dataTestId: u.string
+};
+const Ye = ({ label: e, required: r = !1, hint: c, children: y }) => /* @__PURE__ */ p(
+  f,
+  {
+    sx: {
+      display: "flex",
+      flexDirection: { xs: "column", sm: "row" },
+      alignItems: { xs: "stretch", sm: "flex-start" },
+      gap: { xs: 0.5, sm: 2 },
+      width: "100%"
+    },
+    children: [
+      /* @__PURE__ */ p(
+        f,
+        {
+          sx: {
+            width: { xs: "100%", sm: "32%" },
+            flexShrink: 0,
+            pt: { xs: 0, sm: 1 }
+          },
+          children: [
+            /* @__PURE__ */ p(L, { variant: "body2", sx: { fontWeight: 600 }, component: "span", children: [
+              e,
+              r && /* @__PURE__ */ t(f, { component: "span", sx: { color: "error.main", ml: 0.5 }, children: "*" })
+            ] }),
+            c && /* @__PURE__ */ t(L, { variant: "caption", color: "text.secondary", display: "block", children: c })
+          ]
+        }
+      ),
+      /* @__PURE__ */ t(f, { sx: { flexGrow: 1, minWidth: 0 }, children: y })
+    ]
+  }
+);
+Ye.propTypes = {
+  label: u.node,
+  required: u.bool,
+  hint: u.node,
+  children: u.node
+};
+const Re = sa(() => import("./AppModal-CCtrQ5Tr.js")), Je = sa(() => import("./LanguagesModal-B3NTebYT.js")), Qe = sa(() => import("./AddLabelModal-Bq-wRqv9.js")), Ze = Array.from(
+  { length: 26 },
+  (e, r) => String.fromCharCode(65 + r)
+);
+function at() {
+  const { translate: e } = Be(), r = _a(!1), [c, y] = i([]), [O, na] = i([]), [Va, la] = i(!1), [Ka, q] = i(null), [$a, G] = i(!1), [W, Oa] = i([]), [oa, ia] = i(!1), [ra, ca] = i(!1), [da, qa] = i(!0), [E, Ga] = i([]), [pa, _] = i(!1), [Ha, H] = i(null), [ua, ma] = i(""), [z, ga] = i(""), [S, fa] = i(""), [k, ha] = i(!1), [o, Ua] = i(null), Xa = _a(o);
+  ea(() => {
+    Xa.current = o;
+  }, [o]);
+  const [Ya, U] = i(!1), [d, Ra] = i({}), [Ja, ya] = i(!1), [Qa, ba] = i(null), [X, Y] = i(!1), [Za, xa] = i(!1), [T, ae] = i(!1), [ee, R] = i(!1), [te, se] = i([]), { control: D, reset: va } = Ee({
+    defaultValues: { appId: "", namespaces: [] }
+  }), I = Da({ control: D, name: "appId" }) || "", Aa = Da({
+    control: D,
+    name: "namespaces"
+  }), v = B(
+    () => Aa || [],
+    [Aa]
+  ), ne = async () => {
+    var a;
+    try {
+      const s = await Me({
+        code: "get_distinct_namespce",
+        parameters: {}
+      });
+      se((a = s == null ? void 0 : s.data) == null ? void 0 : a.result);
+    } catch (s) {
+      console.error(s);
+    }
+  };
+  ea(() => {
+    le(), ne();
+  }, []);
+  const le = async () => {
+    try {
+      await J();
+      const { data: a } = await we(
+        "techo.manage.manageTranslation"
+      );
+      Ua(JSON.parse(a));
+    } catch (a) {
+      console.error(a), b({
+        message: "Could not load translations. Please try again.",
+        type: "error"
+      });
+    }
+  }, J = async () => {
+    var a, s;
+    try {
+      let l = await Oe();
+      const g = (a = l == null ? void 0 : l.data) == null ? void 0 : a.filter((m) => m.isActive === !0);
+      y(g), l = await $e();
+      const n = (s = l == null ? void 0 : l.data) == null ? void 0 : s.filter((m) => m.active === !0);
+      Ga(n);
+    } catch (l) {
+      console.error(l), b({
+        message: "Could not load apps and languages. Please try again.",
+        type: "error"
+      });
+    }
+  }, Ca = za((a) => {
+    ma(a);
+    const s = (a.match(/{/g) || []).length, l = (a.match(/}/g) || []).length;
+    s > l || ga(a);
+  }, []), oe = (a) => {
+    fa(a);
+  }, ie = B(
+    () => [
+      { field: "Sr. No.", label: "Sr.No", align: "left", minWidth: 80 },
+      { field: "Actions", label: e("Actions"), minWidth: 120 },
+      { field: "key", label: e("Key"), align: "left", minWidth: 260 },
+      { field: "app", label: e("App"), align: "left", minWidth: 130 },
+      {
+        field: "state",
+        label: e("State"),
+        align: "left",
+        minWidth: 110,
+        render: (a) => /* @__PURE__ */ t(Pa, { state: a == null ? void 0 : a.state, translate: e })
+      },
+      ...(E || []).map((a) => {
+        var s;
+        return {
+          field: (s = a == null ? void 0 : a.languageValue) == null ? void 0 : s.toLowerCase(),
+          label: a == null ? void 0 : a.languageValue,
+          align: "left",
+          minWidth: 220
+        };
+      })
+    ],
+    [E, e]
+  ), La = (d == null ? void 0 : d.state) === "Active", re = La ? "Mark as Inactive" : "Mark as Active", ce = La ? `"${d == null ? void 0 : d.key}" will stop showing in ${d == null ? void 0 : d.app} for every language. You can turn it back on from this screen.` : `"${d == null ? void 0 : d.key}" will start showing in ${d == null ? void 0 : d.app} again for every language.`, de = (a) => {
+    a && Ra(a), U((s) => !s);
+  }, pe = async (a) => {
+    try {
+      q({ key: a == null ? void 0 : a.key }), xa(!0), _((s) => !s);
+    } catch (s) {
+      console.error(s), b({
+        message: "Could not open the namespace form. Please try again.",
+        type: "error"
+      });
+    }
+  }, ue = async (a) => {
+    var s, l, g, n;
+    try {
+      let Le = {
+        code: "labels_selected_apps_for_editing",
+        parameters: { key: (s = a == null ? void 0 : a.key) == null ? void 0 : s.replace(/'/g, "''") }
+      };
+      const N = await P(Le);
+      let Se = (l = N == null ? void 0 : N.data) == null ? void 0 : l.result;
+      H((g = N == null ? void 0 : N.data) == null ? void 0 : g.result);
+      let ke = {
+        code: "labels_app_data_for_prepopulating",
+        parameters: {
+          key: a == null ? void 0 : a.key,
+          appValue: a == null ? void 0 : a.app
+        }
+      }, Te = Se.map((A) => A.app), wa = c.filter((A) => Te.indexOf(A.id) === -1);
+      if (wa.length > 0) {
+        const A = await P(ke);
+        q((n = A == null ? void 0 : A.data) == null ? void 0 : n.result), na(wa), la(!0), _((Ie) => !Ie);
+      } else
+        b({
+          message: "This label is already in every app.",
+          type: "info"
+        });
+    } catch (m) {
+      console.error(m), b({
+        message: "Could not open the app form. Please try again.",
+        type: "error"
+      });
+    }
+  }, me = async () => {
+    try {
+      let a = (d == null ? void 0 : d.state) === "Active";
+      await qe(d == null ? void 0 : d.key, !a, d == null ? void 0 : d.appId), j(), U((s) => !s), b({
+        message: a ? "Label marked inactive" : "Label marked active",
+        type: "success"
+      });
+    } catch (a) {
+      console.error(a), b({
+        message: "Could not change the label state. Please try again.",
+        type: "error"
+      });
+    }
+  }, ge = async (a) => {
+    var s;
+    try {
+      G(!0), _((m) => !m), ya((m) => !m);
+      let l = a == null ? void 0 : a.key.replace(/'/g, "''");
+      ba(l);
+      const n = await P({
+        code: "labels_selected_apps_for_editing",
+        parameters: { key: l }
+      });
+      H((s = n == null ? void 0 : n.data) == null ? void 0 : s.result), G(!1);
+    } catch (l) {
+      console.error(l), b({
+        message: "Could not open this label for editing. Please try again.",
+        type: "error"
+      }), G(!1);
+    }
+  }, fe = (a) => (a == null ? void 0 : a.state) !== "Inactive", he = za(
+    (a) => {
+      const s = [];
+      w.hasCheckRights(o == null ? void 0 : o["update.manage.manageTranslation"]) && s.push({
+        label: "",
+        icon: /* @__PURE__ */ t(x, { iconName: "faPen" }),
+        onClick: ge,
+        condition: fe,
+        ariaLabel: e("Edit label"),
+        dataTestId: "manage-translation-edit-icon"
+      });
+      const l = [];
+      return w.hasCheckRights(o == null ? void 0 : o["update.manage.manageTranslation"]) && l.push({
+        label: e(
+          (a == null ? void 0 : a.state) === "Active" ? "Mark as Inactive" : "Mark as Active"
+        ),
+        onClick: de
+      }), w.hasCheckRights(o == null ? void 0 : o["create.manage.manageTranslation"]) && (l.push({ label: e("Add app"), onClick: ue }), l.push({ label: e("Add Namespace"), onClick: pe })), l.length > 0 && s.push({
+        label: "",
+        icon: /* @__PURE__ */ t(x, { iconName: "faBars" }),
+        ariaLabel: e("More label actions"),
+        dataTestId: "manage-translation-menu-icon",
+        menuItems: l
+      }), s;
+    },
+    [o, e]
+  ), ye = () => {
+    ia((a) => !a);
+  }, be = () => {
+    ca((a) => !a);
+  }, Sa = () => {
+    _((a) => !a), na(c);
+  }, Q = (a) => a == null ? a : a.replace(/'/g, "''"), xe = async (a, s) => {
+    var l;
+    try {
+      s && !T ? (r.current = !0, Y(!0)) : s && T && R(!0);
+      let g = {
+        code: "fetch_labels_translation_translation_master",
+        parameters: {
+          appId: I || null,
+          searchString: Q(z || ""),
+          startsWith: Q(S || ""),
+          namespaceArray: v.length > 0 ? v.map((m) => Q(m)).join(",") : "",
+          showInactive: k || !1,
+          limit: (a == null ? void 0 : a.limit) || 100,
+          offset: (a == null ? void 0 : a.offset) || 0
+        }
+      };
+      const n = await P(g);
+      return (l = n == null ? void 0 : n.data) == null ? void 0 : l.result;
+    } catch (g) {
+      r.current = !1, console.error(g), R(!1), Y(!1), b({
+        message: "Could not load labels. Please try again.",
+        type: "error"
+      });
+    }
+  }, ka = B(() => z === "" && S === "" && k === !1 && I === "" && v.length === 0, [z, S, k, I, v]), ve = B(
+    () => [
+      "translation",
+      I,
+      z,
+      S,
+      k,
+      v
+    ],
+    [I, z, S, k, v]
+  ), {
+    data: F,
+    fetchNextPage: Ae,
+    hasNextPage: Ce,
+    refetch: j
+  } = De({
+    key: ve,
+    queryFn: ({ pageParam: a }) => {
+      const s = !T, g = (!(a != null && a.offset) || (a == null ? void 0 : a.offset) === 0) && s;
+      return xe(a, g);
+    },
+    limit: 100
+  });
+  ea(() => {
+    var a;
+    if (F) {
+      let s = ((a = F == null ? void 0 : F.pages) == null ? void 0 : a.flat()) || [];
+      const l = Object.values(
+        s == null ? void 0 : s.reduce((g, n) => {
+          const m = (n == null ? void 0 : n.key) + "-" + (n == null ? void 0 : n.app);
+          return g[m] || (g[m] = {
+            rowKey: m,
+            appId: n == null ? void 0 : n.appid,
+            key: n == null ? void 0 : n.key,
+            app: n == null ? void 0 : n.app,
+            state: n != null && n.is_active ? "Active" : "Inactive"
+          }), g[m][n == null ? void 0 : n.language.toLowerCase()] = n == null ? void 0 : n.value, n != null && n.is_active && (g[m].state = "Active"), g;
+        }, {})
+      );
+      qa(Ce), Oa(l), r.current && (T ? R(!1) : (Y(!1), ae(!0)), r.current = !1);
+    }
+  }, [F]);
+  const Ta = () => {
+    ma(""), ga(""), fa(""), ha(!1), va({ appId: "", namespaces: [] });
+  }, Ia = w.hasCheckRights(
+    o == null ? void 0 : o["create.manage.manageTranslation"]
+  ), Na = w.hasCheckRights(
+    o == null ? void 0 : o["create.manage.manageTranslation"],
+    o == null ? void 0 : o.canManage
+  ), Z = !X && o !== null && !w.hasCheckRights(o == null ? void 0 : o["view.manage.manageTranslation"]), aa = X || ee, Ma = (W == null ? void 0 : W.length) > 0;
+  return /* @__PURE__ */ p(C, { container: !0, mt: 3, spacing: 2, children: [
+    /* @__PURE__ */ t(ta, { children: oa && /* @__PURE__ */ t(
+      Re,
+      {
+        open: oa,
+        handleClose: () => ia((a) => !a),
+        languages: E,
+        refresh: J,
+        refetch: j,
+        selectedApp: I,
+        setSelectedApp: () => va({ appId: "", namespaces: v })
+      }
+    ) }),
+    /* @__PURE__ */ t(ta, { children: ra && /* @__PURE__ */ t(
+      Je,
+      {
+        open: ra,
+        handleClose: () => {
+          ca((a) => !a);
+        },
+        refresh: J,
+        refetch: j
+      }
+    ) }),
+    /* @__PURE__ */ t(ta, { children: pa && /* @__PURE__ */ t(
+      Qe,
+      {
+        open: pa,
+        handleClose: () => {
+          _((a) => !a), la(!1), xa(!1), H(null), q(null), ya(!1), ba(null);
+        },
+        apps: O,
+        addAppFlag: Va,
+        addNameSpaceFlag: Za,
+        languageList: E,
+        editLabel: Ha,
+        fieldsData: Ka,
+        editLabelFlag: Ja,
+        labelKey: Qa,
+        refetch: j,
+        isLoading: $a
+      }
+    ) }),
+    /* @__PURE__ */ t(
+      je,
+      {
+        description: ce,
+        title: e(re),
+        handleClick: me,
+        open: Ya,
+        handleClose: () => {
+          U((a) => !a);
+        },
+        "data-testid": "manageTranslation-modal-customconfirmation"
+      }
+    ),
+    /* @__PURE__ */ t(C, { size: { xs: 12 }, children: /* @__PURE__ */ t(
+      _e,
+      {
+        elevation: 0,
+        sx: {
+          p: { xs: 2.5, md: 3 },
+          mb: 3,
+          border: "1px solid",
+          borderColor: "divider",
+          borderRadius: (a) => `${a.shape.cardRadius}px`,
+          backgroundColor: "background.paper"
+        },
+        children: /* @__PURE__ */ p(f, { sx: { display: "flex", flexDirection: "column", gap: 3 }, children: [
+          /* @__PURE__ */ p(Ba, { isLoading: X, children: [
+            /* @__PURE__ */ p(
+              f,
+              {
+                sx: {
+                  display: "flex",
+                  justifyContent: "space-between",
+                  alignItems: "flex-start",
+                  flexWrap: "wrap",
+                  gap: 2
+                },
+                children: [
+                  /* @__PURE__ */ p(f, { sx: { minWidth: { xs: "100%", lg: "40%" } }, children: [
+                    /* @__PURE__ */ t(
+                      L,
+                      {
+                        variant: "h5",
+                        component: "h1",
+                        sx: { fontWeight: 800, color: "text.primary", mb: 0.5 },
+                        children: e("Translations")
+                      }
+                    ),
+                    /* @__PURE__ */ t(L, { variant: "body2", color: "text.secondary", children: e(
+                      "Every label the apps display, in every language. Edit a translation here and the apps using that label pick it up."
+                    ) })
+                  ] }),
+                  !Z && /* @__PURE__ */ p(
+                    f,
+                    {
+                      sx: {
+                        display: "flex",
+                        alignItems: "center",
+                        gap: 1.5,
+                        flexWrap: "wrap"
+                      },
+                      children: [
+                        Na && /* @__PURE__ */ t(
+                          M,
+                          {
+                            size: "small",
+                            variant: "outlined",
+                            "data-testid": "manageTranslation-manage-apps-button",
+                            color: "primary",
+                            onClick: ye,
+                            children: e("Manage Apps")
+                          }
+                        ),
+                        Na && /* @__PURE__ */ t(
+                          M,
+                          {
+                            size: "small",
+                            variant: "outlined",
+                            color: "primary",
+                            "data-testid": "managetranslation-manage-language-button",
+                            onClick: be,
+                            children: e("Manage Language")
+                          }
+                        ),
+                        Ia && /* @__PURE__ */ t(
+                          M,
+                          {
+                            size: "small",
+                            variant: "contained",
+                            "data-testid": "manageTranalation-add-label-button",
+                            startIcon: /* @__PURE__ */ t(x, { iconName: "faPlus" }),
+                            onClick: Sa,
+                            children: e("Add Label")
+                          }
+                        )
+                      ]
+                    }
+                  )
+                ]
+              }
+            ),
+            !Z && /* @__PURE__ */ p(Ne, { children: [
+              /* @__PURE__ */ p(C, { container: !0, spacing: 2, alignItems: "flex-start", children: [
+                /* @__PURE__ */ t(C, { size: { xs: 12, sm: 6, md: 3 }, children: /* @__PURE__ */ t(
+                  ja,
+                  {
+                    control: D,
+                    name: "appId",
+                    label: e("App"),
+                    options: c || [],
+                    displayName: "appValue",
+                    optionValue: "id",
+                    isNullSelectDisabled: !1,
+                    placeholder: e("All apps"),
+                    dataTestId: "managetranslation-app-dropdown"
+                  }
+                ) }),
+                /* @__PURE__ */ t(C, { size: { xs: 12, sm: 6, md: 3 }, children: /* @__PURE__ */ t(
+                  ja,
+                  {
+                    control: D,
+                    name: "namespaces",
+                    label: e("Name Spaces"),
+                    options: te || [],
+                    displayName: "label",
+                    optionValue: "value",
+                    multiple: !0,
+                    dataTestId: "autocomplete-namespace"
+                  }
+                ) }),
+                /* @__PURE__ */ t(C, { size: { xs: 12, sm: 6, md: 3 }, children: /* @__PURE__ */ t(
+                  Ke,
+                  {
+                    value: ua,
+                    onChange: Ca,
+                    placeholder: e("Search labels"),
+                    label: e("Search For"),
+                    autoFocus: !1,
+                    fullWidth: !0,
+                    size: "small",
+                    "data-testid": "managetranslation-search-textfield",
+                    slotProps: {
+                      htmlInput: {
+                        "aria-label": e("Search labels")
+                      },
+                      // The search icon adornment would otherwise sit
+                      // under the resting label.
+                      inputLabel: { shrink: !0 }
+                    },
+                    inputProps: {
+                      startAdornment: /* @__PURE__ */ t(Wa, { position: "start", children: /* @__PURE__ */ t(
+                        f,
+                        {
+                          sx: { color: "text.disabled", display: "flex" },
+                          children: /* @__PURE__ */ t(
+                            x,
+                            {
+                              iconName: "faMagnifyingGlass",
+                              size: "sm"
+                            }
+                          )
+                        }
+                      ) }),
+                      endAdornment: ua ? /* @__PURE__ */ t(Wa, { position: "end", children: /* @__PURE__ */ t(
+                        ze,
+                        {
+                          size: "small",
+                          "aria-label": e("Clear search"),
+                          onClick: () => Ca(""),
+                          children: /* @__PURE__ */ t(x, { iconName: "faXmark", size: "sm" })
+                        }
+                      ) }) : null
+                    }
+                  }
+                ) }),
+                /* @__PURE__ */ p(
+                  C,
+                  {
+                    size: { xs: 12, sm: 6, md: 3 },
+                    sx: {
+                      display: "flex",
+                      alignItems: "center",
+                      justifyContent: { xs: "flex-start", md: "flex-end" },
+                      gap: 1,
+                      flexWrap: "wrap",
+                      minHeight: 40
+                    },
+                    children: [
+                      /* @__PURE__ */ t(
+                        Fe,
+                        {
+                          className: "translation-inactive",
+                          control: /* @__PURE__ */ t(
+                            Ve,
+                            {
+                              checked: k,
+                              onChange: (a) => ha(a.target.checked),
+                              inputProps: {
+                                "aria-label": e("Show Inactive")
+                              }
+                            }
+                          ),
+                          label: e("Show Inactive"),
+                          labelPlacement: "end"
+                        }
+                      ),
+                      /* @__PURE__ */ t(
+                        M,
+                        {
+                          size: "small",
+                          variant: "text",
+                          disabled: ka,
+                          startIcon: /* @__PURE__ */ t(x, { iconName: "faXmark", size: "sm" }),
+                          onClick: Ta,
+                          "data-testid": "managetranslation-clear-filters",
+                          children: e("Clear filters")
+                        }
+                      )
+                    ]
+                  }
+                )
+              ] }),
+              /* @__PURE__ */ p(f, { children: [
+                /* @__PURE__ */ t(
+                  L,
+                  {
+                    variant: "caption",
+                    color: "text.secondary",
+                    sx: { display: "block", mb: 0.5 },
+                    children: e("Starts With")
+                  }
+                ),
+                /* @__PURE__ */ t(f, { sx: { overflowX: "auto", pb: 0.5 }, children: /* @__PURE__ */ p(
+                  We,
+                  {
+                    exclusive: !0,
+                    size: "small",
+                    value: S,
+                    onChange: (a, s) => oe(s ?? ""),
+                    "aria-label": e("Starts With"),
+                    sx: { flexWrap: "nowrap" },
+                    children: [
+                      /* @__PURE__ */ t(
+                        Ea,
+                        {
+                          value: "",
+                          "aria-label": e("All letters"),
+                          sx: { px: 1.5 },
+                          children: e("All")
+                        }
+                      ),
+                      Ze.map((a) => /* @__PURE__ */ t(
+                        Ea,
+                        {
+                          value: a,
+                          "aria-label": a,
+                          sx: { px: 1.25 },
+                          children: a
+                        },
+                        a
+                      ))
+                    ]
+                  }
+                ) })
+              ] })
+            ] })
+          ] }),
+          Z ? /* @__PURE__ */ t(
+            V,
+            {
+              icon: "faLock",
+              title: e("You don't have access to Translations"),
+              body: e(
+                "Your role doesn't include permission to view translations. Ask an administrator to grant the view right for this module."
+              ),
+              dataTestId: "no-permission-message"
+            }
+          ) : T && !aa && !Ma && !ka ? /* @__PURE__ */ t(
+            V,
+            {
+              icon: "faMagnifyingGlass",
+              title: e("No labels match these filters"),
+              body: e(
+                "Try a shorter search term, another app or namespace, or turn on Show Inactive to include labels that are switched off."
+              ),
+              action: /* @__PURE__ */ t(M, { variant: "text", size: "small", onClick: Ta, children: e("Clear filters") }),
+              dataTestId: "managetranslation-no-results"
+            }
+          ) : T && !aa && !Ma ? /* @__PURE__ */ t(
+            V,
+            {
+              icon: "faLanguage",
+              title: e("No labels yet"),
+              body: e(
+                "Add a label to give every app the text it displays, in each active language."
+              ),
+              action: Ia ? /* @__PURE__ */ t(
+                M,
+                {
+                  variant: "contained",
+                  size: "small",
+                  startIcon: /* @__PURE__ */ t(x, { iconName: "faPlus" }),
+                  onClick: Sa,
+                  children: e("Add Label")
+                }
+              ) : null,
+              dataTestId: "managetranslation-no-labels"
+            }
+          ) : /* @__PURE__ */ t(
+            Pe,
+            {
+              columns: ie,
+              tableData: W,
+              actions: he,
+              paginationConfig: {
+                pagination: !0,
+                paginationType: "infinite-scroll",
+                loadMore: () => da && Ae({ cancelRefetch: !1 }),
+                hasMore: da
+              },
+              dataTestId: "manageTranslation-table",
+              isLoading: aa,
+              showScrollArrows: !0,
+              rowUniqueKey: "rowKey",
+              disableHtml: !0,
+              showFullContent: !1,
+              styleConfig: { tableStyle: { maxHeight: 180 } }
+            }
+          )
+        ] })
+      }
+    ) })
+  ] });
+}
+const wt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  default: at
+}, Symbol.toStringTag, { value: "Module" }));
+export {
+  He as A,
+  V as E,
+  Ue as L,
+  Ye as M,
+  Pa as S,
+  $e as a,
+  Lt as b,
+  St as c,
+  Ct as d,
+  Ge as e,
+  Tt as f,
+  Oe as g,
+  It as h,
+  Nt as i,
+  wt as j,
+  Mt as t,
+  kt as u
+};
+//# sourceMappingURL=ManageTranslation-vRiptUAP.js.map