@mx-cartographer/experiences 8.0.0-alpha.bb4 → 8.0.0-alpha.mega2

package/dist/notifications/index.es.js

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

package/dist/notifications/stores/NotificationStore.d.ts

@@ -4,11 +4,9 @@ export declare class NotificationStore {
     api: NotificationApi;
     isLoading: boolean;
     notifications: Notification[];
-    notificationsLoaded: boolean;
+    recentNotifications: Notification[];
     constructor(globalStore: GlobalStore);
     get newNotifications(): Notification[];
-    get recentNotifications(): Notification[];
-    setNotifications: (notifications: Notification[]) => void;
     loadNotifications: () => Promise<void>;
     markAllAsViewed: () => Promise<void>;
     updateNotification: (notification: Notification) => Promise<void>;