@mx-cartographer/experiences 8.0.0-alpha.sms2 → 9.0.0-alpha.mega1

package/dist/GlobalAccountFilter-BpWlPAl5.mjs

@@ -0,0 +1,316 @@
+import { jsxs as l, jsx as t } from "react/jsx-runtime";
+import b from "react";
+import { observer as w } from "mobx-react-lite";
+import M from "@mui/material/Box";
+import I from "@mui/material/Button";
+import N from "@mui/material/Divider";
+import R from "@mui/material/IconButton";
+import T from "@mui/material/Popover";
+import k from "@mui/material/Stack";
+import U from "@mui/material/Tooltip";
+import { FilterAlt as G, AccountBalance as Y } from "@mxenabled/mx-icons";
+import { Text as Z, P as D } from "@mxenabled/mxui";
+import W from "@mui/material/Checkbox";
+import B from "@mui/material/List";
+import v from "@mui/material/ListItem";
+import L from "@mui/material/ListItemButton";
+import q from "@mui/material/ListItemIcon";
+import E from "@mui/material/ListItemText";
+import { b as O, u as A, d as z, e as J, a as K } from "./hooks-fY_n74f7.mjs";
+import Q from "@mui/material/styles/useTheme";
+import { ConnectWidget as V } from "@mxenabled/web-widget-sdk";
+import X from "@mui/material/CircularProgress";
+import { D as tt } from "./Drawer-Bet2ZPJo.mjs";
+import { u as et } from "./useScreenSize-B6JyS_Lj.mjs";
+const ot = w(
+  ({ allowedAccountTypes: o }) => {
+    const { accountFilterMap: i, updateAccountFilterMap: d } = O(), { accounts: C, common: f } = A(), { account_filter: x } = f, { accountsByTypeMap: r } = z(), _ = b.useMemo(
+      () => Array.from(r.keys()).reduce((e, n) => {
+        if (!o || o && o.includes(n)) {
+          const c = r.get(n);
+          c && e.push(...c);
+        }
+        return e;
+      }, []),
+      [r, o]
+    ), m = new Map(
+      Array.from(i.entries()).filter(([e]) => _.some((n) => n.guid === e))
+    ), s = Array.from(m.values()).every((e) => e), S = Array.from(m.values()).some((e) => e), p = () => {
+      for (const e of m.keys())
+        d(e, !s);
+    }, g = (e) => {
+      const n = r.get(e);
+      if (!n) return;
+      const c = n.some((u) => i.get(u.guid));
+      for (const u of n)
+        d(u.guid, !c);
+    };
+    return /* @__PURE__ */ l(
+      B,
+      {
+        dense: !0,
+        id: "filter_accounts",
+        sx: { overflowY: "scroll", maxHeight: 350, minWidth: 280 },
+        children: [
+          /* @__PURE__ */ t(v, { disableGutters: !0, disablePadding: !0, sx: { py: 16 }, children: /* @__PURE__ */ l(L, { disableGutters: !0, onClick: p, sx: { p: 0, px: 8 }, children: [
+            /* @__PURE__ */ t(
+              W,
+              {
+                checked: s,
+                disableRipple: !0,
+                indeterminate: !s && S,
+                inputProps: { "aria-labelledby": "label-select-all" },
+                size: "small",
+                tabIndex: -1
+              }
+            ),
+            /* @__PURE__ */ t(
+              E,
+              {
+                id: "label-select-all",
+                primary: x.select_all_accounts,
+                primaryTypographyProps: { variant: "body1" }
+              }
+            )
+          ] }) }),
+          Array.from(r.keys()).map((e) => {
+            const n = r.get(e), c = o ? !o.includes(e) : !1, u = C.account_type_accounts[e];
+            return (
+              // Account Type Header
+              /* @__PURE__ */ t(v, { disableGutters: !0, disablePadding: !0, children: /* @__PURE__ */ l(k, { sx: { pb: 8, width: "100%" }, children: [
+                /* @__PURE__ */ t(N, {}),
+                /* @__PURE__ */ t(
+                  B,
+                  {
+                    dense: !0,
+                    subheader: /* @__PURE__ */ t(v, { children: /* @__PURE__ */ t(
+                      L,
+                      {
+                        disableGutters: !0,
+                        disabled: c,
+                        onClick: () => g(e),
+                        sx: { pl: 16, minHeight: 40, justifyContent: "left" },
+                        children: /* @__PURE__ */ t(
+                          E,
+                          {
+                            primary: u,
+                            primaryTypographyProps: { variant: "body1", fontWeight: "bold" }
+                          }
+                        )
+                      }
+                    ) }),
+                    children: n?.map((a) => (
+                      // Account Checkbox
+                      /* @__PURE__ */ t(v, { children: /* @__PURE__ */ l(
+                        L,
+                        {
+                          disableGutters: !0,
+                          disabled: c,
+                          onClick: () => d(a.guid, !i.get(a.guid)),
+                          sx: { p: 0, minHeight: 40 },
+                          children: [
+                            /* @__PURE__ */ t(q, { children: /* @__PURE__ */ t(
+                              W,
+                              {
+                                checked: i.get(a.guid),
+                                disableRipple: !0,
+                                inputProps: { "aria-labelledby": `label-${a.guid}` },
+                                size: "small",
+                                tabIndex: -1
+                              }
+                            ) }),
+                            /* @__PURE__ */ t(
+                              E,
+                              {
+                                id: `label-${a.guid}`,
+                                primary: a.displayName,
+                                primaryTypographyProps: { variant: "body1" }
+                              }
+                            )
+                          ]
+                        }
+                      ) }, a.guid)
+                    ))
+                  }
+                )
+              ] }) }, e)
+            );
+          })
+        ]
+      }
+    );
+  }
+), rt = ({ status: o = y.Loading }) => {
+  const { connect: i } = A();
+  return /* @__PURE__ */ t(
+    M,
+    {
+      sx: {
+        height: "calc(100% - 62px)",
+        position: "absolute",
+        width: "100%"
+      },
+      children: /* @__PURE__ */ l(k, { alignItems: "center", direction: "column", justifyContent: "center", sx: { height: "100%" }, children: [
+        o === y.Loading && /* @__PURE__ */ t(X, { color: "primary", size: 48 }),
+        /* @__PURE__ */ t(
+          Z,
+          {
+            sx: {
+              color: "grey.600",
+              marginTop: "16px"
+            },
+            children: o === y.Error ? i.oops : i.loading
+          }
+        )
+      ] })
+    }
+  );
+}, P = w(rt);
+var y = /* @__PURE__ */ ((o) => (o.Loading = "loading", o.Error = "error", o))(y || {}), nt = /* @__PURE__ */ ((o) => (o.Currency = "currency", o.Date = "date", o.Input = "input", o.Select = "select", o))(nt || {});
+const F = "connect_widget", Gt = "connections_widget", it = ({
+  loadWidgetProps: o,
+  onClose: i,
+  showConnectWidget: d,
+  title: C
+}) => {
+  let f;
+  const { refreshAccounts: x } = z(), { loadWidget: r } = J(), { connect: _ } = A(), [m, s] = b.useState(!1), [S, p] = b.useState(!1), {
+    palette: { mode: g }
+  } = Q();
+  return b.useEffect(() => (d ? (s(!0), r({ mode: g, ...o }).then((e) => {
+    f = new V({
+      container: `#${F}`,
+      style: {
+        border: "none",
+        height: "calc(100% - 62px)",
+        maxWidth: "450px",
+        position: "absolute",
+        width: "100%"
+      },
+      url: e.url,
+      onSsoUrlLoadError: () => {
+        s(!1), p(!0);
+      },
+      onLoad: () => {
+        s(!1), p(!1);
+      }
+    });
+  })) : (s(!1), p(!1)), () => {
+    f?.unmount();
+  }), [d]), /* @__PURE__ */ t(
+    tt,
+    {
+      ariaLabelClose: _.close_manage_connection_aria,
+      isOpen: d,
+      onClose: () => {
+        i(), x();
+      },
+      title: C,
+      children: /* @__PURE__ */ l("div", { id: F, children: [
+        S && /* @__PURE__ */ t(P, { status: y.Error }),
+        m && /* @__PURE__ */ t(P, { status: y.Loading })
+      ] })
+    }
+  );
+}, st = w(it), Dt = w(
+  ({
+    allowedAccountTypes: o,
+    onAccountFilterClick: i,
+    sx: d = {},
+    variant: C = "text"
+  }) => {
+    const { isDesktop: f } = et(), {
+      config: { show_connections_widget_in_master: x }
+    } = K(), { common: r, connect: _ } = A(), { accountFilterMap: m, resetAccountFilterMap: s } = O(), { detailedAccounts: S, updateAccountFilter: p } = z(), [g, e] = b.useState(null), [n, c] = b.useState(!1), u = (H) => {
+      s(), e(H.currentTarget), i?.();
+    }, a = () => {
+      e(null);
+    }, j = async () => {
+      await p(m), e(null);
+    }, h = r.account_filter, $ = S.length === 0;
+    return /* @__PURE__ */ l(M, { m: 4, sx: { ...d }, children: [
+      f ? /* @__PURE__ */ t(
+        I,
+        {
+          "aria-controls": "filter_accounts",
+          "aria-haspopup": !0,
+          "aria-label": h.title,
+          onClick: u,
+          startIcon: /* @__PURE__ */ t(G, { size: 24 }),
+          sx: { p: 8, whiteSpace: "nowrap", minWidth: "max-content" },
+          variant: C,
+          children: r.filter_button
+        }
+      ) : /* @__PURE__ */ t(U, { id: "filter-accounts", placement: "bottom", title: h.title, children: /* @__PURE__ */ t(
+        R,
+        {
+          "aria-controls": "filter_accounts",
+          "aria-describedby": "filter-accounts",
+          "aria-haspopup": !0,
+          "aria-label": h.title,
+          color: "primary",
+          onClick: u,
+          sx: { p: 8 },
+          children: /* @__PURE__ */ t(G, { size: 24 })
+        }
+      ) }),
+      /* @__PURE__ */ t(
+        T,
+        {
+          anchorEl: g,
+          anchorOrigin: { vertical: "bottom", horizontal: "left" },
+          onClose: a,
+          open: !!g,
+          transformOrigin: { vertical: "top", horizontal: "left" },
+          children: $ ? /* @__PURE__ */ l(
+            k,
+            {
+              alignItems: "center",
+              direction: "column",
+              sx: { p: 16, width: 320, maxWidth: "100%" },
+              children: [
+                /* @__PURE__ */ t(Y, { size: 32 }),
+                /* @__PURE__ */ t(D, { bold: !0, mt: 12, children: h.zero_state_title }),
+                /* @__PURE__ */ t(D, { mt: 12, children: h.zero_state_description }),
+                x && /* @__PURE__ */ t(I, { onClick: () => c(!0), children: h.zero_state_button })
+              ]
+            }
+          ) : /* @__PURE__ */ l(k, { children: [
+            /* @__PURE__ */ t(ot, { allowedAccountTypes: o }),
+            /* @__PURE__ */ t(N, {}),
+            /* @__PURE__ */ l(k, { direction: "row", justifyContent: "space-between", spacing: 16, sx: { p: 16 }, children: [
+              /* @__PURE__ */ t(I, { fullWidth: !0, onClick: a, variant: "text", children: r.cancel_button }),
+              /* @__PURE__ */ t(
+                I,
+                {
+                  "aria-label": h.filter_button_aria,
+                  color: "primary",
+                  fullWidth: !0,
+                  onClick: j,
+                  variant: "contained",
+                  children: r.filter_button
+                }
+              )
+            ] })
+          ] })
+        }
+      ),
+      n && /* @__PURE__ */ t(
+        st,
+        {
+          onClose: () => c(!1),
+          showConnectWidget: n,
+          title: _.mini_title
+        }
+      )
+    ] });
+  }
+);
+export {
+  Gt as C,
+  nt as F,
+  Dt as G,
+  y as M,
+  P as a,
+  st as b
+};