@mx-cartographer/experiences 6.26.33-alpha.mm0 → 7.0.0-alpha.mega1

package/dist/notifications/index.es.js

@@ -0,0 +1,192 @@
+import { A as f, B as C } from "../Notification-AMGWM1Al.mjs";
+import { A as _ } from "../Fetch-CkFKy79O.mjs";
+import { s as L } from "../NotificationStore-DHtSGySy.mjs";
+import { N as Nt, f as St } from "../NotificationStore-DHtSGySy.mjs";
+import { jsx as t, jsxs as d, Fragment as x } from "react/jsx-runtime";
+import k, { useEffect as A } from "react";
+import { observer as p } from "mobx-react-lite";
+import y from "@mui/material/Box";
+import D from "@mui/material/Divider";
+import B from "@mui/material/List";
+import { Text as m, InstitutionLogo as T, CategoryIcon as R } from "@mxenabled/mxui";
+import { h as I } from "../DateUtil-BcuH7ErC.mjs";
+import { useTheme as O, Card as G } from "@mui/material";
+import { c as j, e as E, u as g, m as N, a as S, j as z } from "../hooks-30y_BLwc.mjs";
+import { Icon as U, Settings as F } from "@mxenabled/mx-icons";
+import P from "@mui/material/Button";
+import W from "@mui/material/Stack";
+import { L as w } from "../Loader-Dp1P2gNw.mjs";
+import $ from "@mui/material/IconButton";
+import { N as H } from "../NotificationSettings-VhHuMAFU.mjs";
+import { D as b } from "../Drawer-kEE73B87.mjs";
+const yt = (e) => {
+  switch (e) {
+    case C.BudgetExceeded:
+    case C.BudgetOffTarget:
+      return _.BUDGETS;
+    case f.DebtPaymentReminder:
+    case f.AccountBalanceLow:
+    case f.AccountDepositLarge:
+      return _.ACCOUNTS;
+    case f.TransactionExpenseLarge:
+    case f.TransactionFeeCharge:
+    case f.InternationalTransaction:
+      return _.TRANSACTIONS;
+    default:
+      return null;
+  }
+}, M = ({ date: e }) => /* @__PURE__ */ t(y, { sx: { display: "flex", justifyContent: "center", mt: 12, py: 8 }, children: /* @__PURE__ */ t(m, { bold: !0, variant: "Small", children: I(e) }) }), V = ({ notification: e }) => {
+  const { accounts: o } = j(), { budgets: a } = E(), { accounts: s } = g(), i = o.find((l) => l.guid === e.entity_guid), r = a.find((l) => l.guid === e.entity_guid), u = e.entity_guid.includes("GOL"), c = {
+    badge: {
+      display: "flex",
+      alignItems: "center",
+      justifyContent: "center",
+      borderRadius: 4,
+      marginRight: 12
+    }
+  };
+  return i || u ? /* @__PURE__ */ t("div", { style: c.badge, children: /* @__PURE__ */ t(
+    T,
+    {
+      alt: i?.institutionName || s.institution_logo_alt,
+      institutionGuid: i?.institution_guid ?? "",
+      size: 33
+    }
+  ) }) : /* @__PURE__ */ t("div", { style: c.badge, children: /* @__PURE__ */ t(R, { categoryGuid: r?.category_guid, size: 36 }) });
+}, X = p(V), Y = ({ notification: e, onClick: o }) => {
+  const { updateNotification: a } = N(), s = O(), i = {
+    card: {
+      alignItems: "center",
+      cursor: "pointer",
+      display: "flex",
+      marginBottom: 12,
+      paddingX: 24,
+      paddingY: 12,
+      "&:focus": {
+        backgroundColor: s.palette.background.default
+      },
+      "&:hover": {
+        backgroundColor: s.palette.background.default
+      }
+    },
+    dot: {
+      backgroundColor: s.palette.primary.main,
+      borderRadius: "100%",
+      flex: "0 0 auto",
+      marginLeft: -8,
+      marginRight: 8,
+      height: 8,
+      width: 8
+    }
+  };
+  return /* @__PURE__ */ d(G, { onClick: () => {
+    o(e), a({ ...e, has_been_viewed: !0 }).finally();
+  }, sx: i.card, children: [
+    e.has_been_viewed ? null : /* @__PURE__ */ t("div", { "data-testid": "new-message-dot", style: i.dot }),
+    /* @__PURE__ */ t(X, { notification: e }),
+    /* @__PURE__ */ t(m, { bold: !e.has_been_viewed, truncate: !1, variant: "Small", children: e.content })
+  ] });
+}, q = p(
+  ({ onManageNotifications: e }) => {
+    const { notifications: o } = g();
+    return /* @__PURE__ */ d(W, { sx: { alignItems: "center", height: "95%", justifyContent: "center" }, children: [
+      /* @__PURE__ */ t(U, { name: "notifications", size: 32 }),
+      /* @__PURE__ */ t(m, { sx: { pt: 32 }, variant: "H3", children: o.notification_empty_state.no_new_notifications }),
+      /* @__PURE__ */ t(
+        m,
+        {
+          sx: {
+            maxWidth: 327,
+            pb: 24,
+            pt: 12,
+            textAlign: "center",
+            whiteSpace: "normal"
+          },
+          variant: "subtitle1",
+          children: o.notification_empty_state.notification_description
+        }
+      ),
+      /* @__PURE__ */ t(P, { onClick: e, sx: { p: "12px 16px" }, variant: "outlined", children: o.notification_empty_state.manage_notifications })
+    ] });
+  }
+), J = ({ onClick: e, onManageNotifications: o }) => {
+  const { isLoading: a, loadNotifications: s, recentNotifications: i, markAllAsViewed: r } = N(), { notifications: u } = g(), { isCopyLoaded: c } = S(), l = (n) => {
+    e?.(n);
+  };
+  return A(() => (s().finally(), () => {
+    r().finally();
+  }), []), /* @__PURE__ */ d(x, { children: [
+    (!c || a) && /* @__PURE__ */ t(w, { label: u?.loading, size: 40 }),
+    c && !a && i.length === 0 && /* @__PURE__ */ t(q, { onManageNotifications: o }),
+    /* @__PURE__ */ t(B, { sx: { p: 16 }, children: c && !a && i.slice().sort((n, h) => h.delivered_at - n.delivered_at).map((n, h) => {
+      const v = L(h, i);
+      return /* @__PURE__ */ d(y, { sx: { mb: 12 }, children: [
+        v && /* @__PURE__ */ d(y, { sx: { mb: 12 }, children: [
+          /* @__PURE__ */ t(M, { date: n.delivered_at }),
+          /* @__PURE__ */ t(D, {})
+        ] }),
+        /* @__PURE__ */ t(Y, { notification: n, onClick: l })
+      ] }, n.guid);
+    }) })
+  ] });
+}, K = p(J), Ct = p(
+  ({ notificationTypes: e, isOpen: o, onClose: a, onNotificationClick: s }) => {
+    const { config: i } = z(), { notifications: r, settings: u } = g(), { isCopyLoaded: c } = S(), [l, n] = k.useState(!1);
+    return c ? /* @__PURE__ */ d(x, { children: [
+      /* @__PURE__ */ d(
+        b,
+        {
+          ariaLabelClose: r.close_notifications,
+          isOpen: o,
+          onClose: a,
+          title: r.notifications_title,
+          children: [
+            /* @__PURE__ */ t(
+              $,
+              {
+                "aria-label": u.open_notification_settings_btn_aria,
+                onClick: () => n(!0),
+                sx: {
+                  position: "absolute",
+                  right: 8,
+                  top: 8
+                },
+                children: /* @__PURE__ */ t(F, { size: 24 })
+              }
+            ),
+            /* @__PURE__ */ t(
+              K,
+              {
+                onClick: s,
+                onManageNotifications: () => n(!0)
+              }
+            )
+          ]
+        }
+      ),
+      /* @__PURE__ */ t(
+        b,
+        {
+          ariaLabelClose: r.close_notification_settings,
+          isOpen: l,
+          onClose: () => n(!1),
+          title: u.notification_settings_title,
+          children: /* @__PURE__ */ t(
+            H,
+            {
+              notificationTypes: e,
+              showPersonalDetails: !i.display_user_profile_in_settings
+            }
+          )
+        }
+      )
+    ] }) : /* @__PURE__ */ t(w, {});
+  }
+);
+export {
+  Ct as NotificationDrawer,
+  K as NotificationList,
+  Nt as NotificationStore,
+  St as filterRecentNotifications,
+  yt as getNotificationDetailRoute
+};