@mx-cartographer/experiences 6.26.18-alpha.mega3 → 6.26.18-alpha.mega4

package/dist/settings/index.es.js

@@ -1,29 +1,879 @@
-import { SettingsApi as e } from "./api/SettingsApi/index.es.js";
-import { SettingsStore as r } from "./stores/SettingsStore/index.es.js";
-import { SettingsTabs as s, SettingsWidget as n } from "./SettingsWidget/index.es.js";
-import { SettingsWidgetContents as p } from "./components/SettingsWidgetContents/index.es.js";
-import { default as m } from "./components/profile/ProfileTab/index.es.js";
-import { default as c } from "./components/devices/DeviceTab/index.es.js";
-import { NotificationSettingsWidget as d } from "./NotificationSettingsWidget/index.es.js";
-import { NotificationSettings as u } from "./components/notifications/NotificationSettings/index.es.js";
-import { AccountNotificationProfiles as N } from "./components/notifications/AccountNotificationProfiles/index.es.js";
-import { BudgetNotificationProfiles as P } from "./components/notifications/BudgetNotificationProfiles/index.es.js";
-import { InsightsNotificationProfiles as A } from "./components/notifications/InsightsNotificationProfiles/index.es.js";
-import { default as h } from "./components/transactionrules/TransactionRulesTab/index.es.js";
-import { TransactionRulesWidget as B } from "./TransactionRulesWidget/index.es.js";
+import { S as Jt, a as Kt } from "../SettingsStore-CE7jDVFL.mjs";
+import { jsxs as c, Fragment as q, jsx as e } from "react/jsx-runtime";
+import h from "react";
+import { observer as D } from "mobx-react-lite";
+import p from "@mui/material/Stack";
+import me from "@mui/material/Tab";
+import ue from "@mui/material/Tabs";
+import pe from "@mui/material/Alert";
+import he from "@mui/material/Snackbar";
+import { getUnixTime as fe } from "date-fns/getUnixTime";
+import { AdapterDateFns as _e } from "@mui/x-date-pickers/AdapterDateFnsV3";
+import { DatePicker as ge } from "@mui/x-date-pickers";
+import { LocalizationProvider as be } from "@mui/x-date-pickers/LocalizationProvider";
+import { useTheme as ye, alpha as U } from "@mui/material/styles";
+import F from "@mui/material/Box";
+import Q from "@mui/material/Button";
+import I from "@mui/material/TextField";
+import { H3 as J, P as H, Text as x, Icon as M, ChevronRightIcon as xe } from "@mxenabled/mxui";
+import { V as ve, a as Ce, N as z } from "../NotificationSettings-CPZN0l8X.mjs";
+import { A as Yt, B as qt, I as Qt } from "../NotificationSettings-CPZN0l8X.mjs";
+import { u as k, j as $, r as A, o as De, a as Z, k as ee } from "../hooks-ClhFlg78.mjs";
+import { u as L } from "../useScreenSize-B6JyS_Lj.mjs";
+import { a as W } from "../Dialog-CWW597AF.mjs";
+import { formatDistanceToNow as te } from "date-fns/formatDistanceToNow";
+import { fromUnixTime as oe } from "date-fns/fromUnixTime";
+import P from "@mui/material/styles/useTheme";
+import V from "@mui/material/IconButton";
+import { DataGridPro as Se } from "@mui/x-data-grid-pro";
+import { H as O } from "../HeaderCell-DjuifqHJ.mjs";
+import { b as N } from "../Localization-2MODESHW.mjs";
+import ke from "@mui/material/Accordion";
+import we from "@mui/material/AccordionDetails";
+import Te from "@mui/material/AccordionSummary";
+import { L as ne } from "../Loader-Dp1P2gNw.mjs";
+import Ie from "@mui/material/List";
+import G from "@mui/material/Divider";
+import Ae from "@mui/material/ListSubheader";
+import { a as Ee, u as Pe } from "../CategorySelectorDrawer-DgrePTRg.mjs";
+import Re from "@mui/material/ListItem";
+import Be from "@mui/material/ListItemButton";
+import Me from "@mui/material/ListItemIcon";
+import Ne from "@mui/material/ListItemText";
+import { D as He } from "../Drawer-kEE73B87.mjs";
+import { H as Le } from "../Help-toqAK5eD.mjs";
+import { W as K } from "../WidgetContainer-CmGNZW0M.mjs";
+const Oe = ({ availableWidth: t, handleOnLeavClick: a }) => {
+  const o = ye(), { common: n, settings: r } = k(), { isDesktop: m, isMobile: l, isSmallMobile: i, isTablet: s } = L(t), { config: g } = $(), { updateUser: _ } = A(), { user: d } = De(), [u, S] = h.useState({
+    first_name: d.first_name,
+    last_name: d.last_name,
+    email: d.email,
+    phone: d.phone,
+    birthday: d.birthday,
+    postal_code: d.postal_code,
+    credit_score: d.credit_score
+  }), [v, w] = h.useState(!1), [C, T] = h.useState(!1), y = h.useRef(null), j = u.email && !d.email_is_verified && !v, Y = u.phone && !d.phone_is_verified && !v;
+  h.useEffect(() => {
+    if (a) {
+      const f = (R) => {
+        y.current && !y.current.contains(R.target) && v && T(!0);
+      };
+      return document.addEventListener("mousedown", f), () => {
+        document.removeEventListener("mousedown", f);
+      };
+    }
+  }, [v]);
+  const ie = () => {
+    if (u.birthday) {
+      const f = new Date(u.birthday * 1e3), R = f.getUTCFullYear(), ce = f.getUTCMonth(), de = f.getUTCDate();
+      return new Date(R, ce, de);
+    }
+  }, ae = async () => {
+    await _({ ...d, ...u }), w(!1);
+  }, le = () => {
+    T(!1), a && a();
+  }, se = () => {
+    T(!1);
+  }, E = (f) => {
+    const R = {
+      ...u,
+      ...f
+    };
+    S(R), w(JSON.stringify({ ...d, ...R }) !== JSON.stringify(d));
+  };
+  return /* @__PURE__ */ c(q, { children: [
+    /* @__PURE__ */ c(
+      F,
+      {
+        component: "form",
+        ref: y,
+        sx: {
+          backgroundColor: "background.paper",
+          p: 24,
+          width: i ? 320 : s ? 680 : m ? 990 : 400,
+          "& .MuiTextField-root": {
+            width: i ? 272 : s ? 328 : m ? 483 : 352
+          }
+        },
+        children: [
+          /* @__PURE__ */ e(J, { children: r.personal_details }),
+          /* @__PURE__ */ e(H, { variant: "Body", children: r.update_information }),
+          /* @__PURE__ */ c(
+            p,
+            {
+              direction: l ? "column" : "row",
+              spacing: l ? 44 : 24,
+              sx: { mb: 44, pt: 32 },
+              children: [
+                /* @__PURE__ */ e(
+                  I,
+                  {
+                    defaultValue: u.first_name,
+                    label: r.first_name,
+                    onChange: (f) => E({ first_name: f.target.value })
+                  }
+                ),
+                /* @__PURE__ */ e(
+                  I,
+                  {
+                    defaultValue: u.last_name,
+                    label: r.last_name,
+                    onChange: (f) => E({ last_name: f.target.value })
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ c(p, { direction: l ? "column" : "row", children: [
+            g.display_email_edit_field_in_settings && /* @__PURE__ */ c(p, { sx: { mb: j ? 20 : 44, mr: l ? 0 : 24 }, children: [
+              /* @__PURE__ */ e(
+                I,
+                {
+                  defaultValue: u.email,
+                  label: r.email_address,
+                  onChange: (f) => E({ email: f.target.value })
+                }
+              ),
+              j && /* @__PURE__ */ e(ve, {})
+            ] }),
+            g.display_sms_edit_field_in_settings && /* @__PURE__ */ c(p, { sx: { mb: Y ? 20 : 44 }, children: [
+              /* @__PURE__ */ e(
+                I,
+                {
+                  defaultValue: u.phone,
+                  label: r.mobile_number,
+                  onChange: (f) => E({ phone: f.target.value }),
+                  type: "tel"
+                }
+              ),
+              Y && /* @__PURE__ */ e(Ce, {})
+            ] })
+          ] }),
+          /* @__PURE__ */ c(p, { direction: l ? "column" : "row", spacing: l ? 44 : 24, sx: { mb: 44 }, children: [
+            /* @__PURE__ */ e(be, { dateAdapter: _e, children: /* @__PURE__ */ e(
+              ge,
+              {
+                label: r.birthdate,
+                onChange: (f) => E({ birthday: fe(f) }),
+                slotProps: {
+                  nextIconButton: {
+                    sx: {
+                      color: "primary.main",
+                      "&:hover": { backgroundColor: U(o.palette.primary.light, 0.1) }
+                    }
+                  },
+                  previousIconButton: {
+                    sx: {
+                      color: "primary.main",
+                      "&:hover": { backgroundColor: U(o.palette.primary.light, 0.1) }
+                    }
+                  }
+                },
+                sx: {
+                  width: "100%",
+                  "& .MuiIconButton-edgeEnd": {
+                    color: "primary.main",
+                    "&:hover": { backgroundColor: U(o.palette.primary.light, 0.1) }
+                  }
+                },
+                value: ie()
+              }
+            ) }),
+            /* @__PURE__ */ e(
+              I,
+              {
+                defaultValue: u.postal_code,
+                label: r.zip_code,
+                onChange: (f) => E({ postal_code: f.target.value })
+              }
+            )
+          ] }),
+          /* @__PURE__ */ c(p, { children: [
+            /* @__PURE__ */ e(
+              I,
+              {
+                defaultValue: u.credit_score,
+                label: r.credit_score,
+                onChange: (f) => E({ credit_score: Number(f.target.value) }),
+                sx: { mb: 44 }
+              }
+            ),
+            /* @__PURE__ */ e(
+              Q,
+              {
+                disabled: !v,
+                onClick: ae,
+                sx: { width: i ? 272 : 124 },
+                variant: "contained",
+                children: n.save_button
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    /* @__PURE__ */ e(
+      W,
+      {
+        copy: { title: r.discard_changes },
+        isOpen: C,
+        onClose: se,
+        onSecondaryAction: le,
+        primaryText: r.keep_editing,
+        secondaryText: r.leave,
+        children: r.discard_changes_message
+      }
+    )
+  ] });
+}, Ue = D(Oe);
+var b = /* @__PURE__ */ ((t) => (t.Delete = "delete", t.Edit = "edit", t.Token = "token", t))(b || {});
+const Fe = ({
+  devices: t,
+  onClickDeviceEdit: a,
+  onClickDeviceDelete: o
+}) => {
+  const n = P(), { settings: r } = k(), m = [
+    {
+      field: "name",
+      headerName: r.mobile_devices_column_name,
+      renderHeader: O,
+      renderCell: (i) => /* @__PURE__ */ c(p, { alignItems: "center", direction: "row", gap: 4, children: [
+        /* @__PURE__ */ e(x, { variant: "Small", children: i.value }),
+        /* @__PURE__ */ e(
+          V,
+          {
+            "aria-label": r.mobile_devices_edit_label,
+            color: "secondary",
+            onClick: () => a(i.row),
+            children: /* @__PURE__ */ e(M, { name: "edit" })
+          }
+        )
+      ] }),
+      sortable: !0,
+      flex: 1,
+      minWidth: 200
+    },
+    {
+      field: "device_type",
+      headerName: r.mobile_devices_column_type,
+      renderHeader: O,
+      sortable: !0,
+      hideSortIcons: !1,
+      flex: 1,
+      minWidth: 150
+    },
+    {
+      field: "created_at",
+      headerName: r.mobile_devices_column_added,
+      renderHeader: O,
+      valueFormatter: (i) => te(oe(i), { addSuffix: !0 }),
+      sortable: !0,
+      hideSortIcons: !1,
+      flex: 1,
+      minWidth: 150
+    },
+    {
+      field: "delete",
+      headerName: "",
+      renderHeader: O,
+      renderCell: (i) => /* @__PURE__ */ e(p, { mr: 4, children: /* @__PURE__ */ e(
+        V,
+        {
+          "aria-label": r.mobile_devices_delete_label,
+          color: "secondary",
+          onClick: () => o(i.row),
+          children: /* @__PURE__ */ e(M, { name: "delete" })
+        }
+      ) }),
+      sortable: !1,
+      hideSortIcons: !1,
+      width: 58
+    }
+  ], l = h.useMemo(() => t.map((i) => ({
+    id: i.guid,
+    ...i,
+    device_type: `${i.make} ${i.model}`
+  })), [t]);
+  return /* @__PURE__ */ e(F, { sx: { width: "100%" }, children: /* @__PURE__ */ e(
+    Se,
+    {
+      columns: m,
+      disableColumnFilter: !0,
+      disableColumnMenu: !0,
+      disableRowSelectionOnClick: !0,
+      rows: l,
+      slotProps: {
+        footer: {
+          sx: { justifyContent: "flex-end" }
+        }
+      },
+      slots: {
+        footer: () => /* @__PURE__ */ e(
+          F,
+          {
+            sx: {
+              backgroundColor: n.palette.background.default,
+              display: "flex",
+              justifyContent: "flex-end",
+              alignItems: "center",
+              p: "12px 16px"
+            },
+            children: /* @__PURE__ */ e(x, { color: n.palette.text.secondary, variant: "Small", children: N(
+              r.mobile_devices_count,
+              /* @__PURE__ */ e("b", { children: t.length }),
+              /* @__PURE__ */ e("b", { children: t.length })
+            ) })
+          }
+        )
+      },
+      sx: {
+        border: "1px solid",
+        borderColor: n.palette.border.light,
+        borderRadius: "8px",
+        "& .MuiDataGrid-columnHeader .MuiIconButton-root": {
+          color: n.palette.primary.main,
+          "&:hover": {
+            backgroundColor: U(n.palette.primary.main, 0.1)
+          }
+        },
+        "& .MuiDataGrid-sortIcon": {
+          color: n.palette.primary.main
+        }
+      }
+    }
+  ) });
+}, Ve = ({
+  devices: t,
+  onClickDeviceEdit: a,
+  onClickDeviceDelete: o
+}) => {
+  const n = P(), { settings: r } = k(), [m, l] = h.useState(!1), i = (s) => (g, _) => {
+    l(_ ? s : !1);
+  };
+  return /* @__PURE__ */ c(p, { mx: -28, sx: { "& .MuiAccordion-root": { mb: 0, mt: 0 } }, children: [
+    t.map((s) => /* @__PURE__ */ c(
+      ke,
+      {
+        expanded: m === s.guid,
+        onChange: i(s.guid),
+        sx: { boxShadow: "none" },
+        children: [
+          /* @__PURE__ */ e(
+            Te,
+            {
+              expandIcon: /* @__PURE__ */ e(M, { color: "secondary", name: "keyboard_arrow_down", size: 24 }),
+              sx: {
+                padding: "14px 24px",
+                borderBottom: "1px solid",
+                borderColor: n.palette.border.light
+              },
+              children: /* @__PURE__ */ c(p, { gap: 4, children: [
+                /* @__PURE__ */ e(x, { bold: !0, variant: "Body", children: s.name }),
+                /* @__PURE__ */ e(x, { color: n.palette.text.secondary, variant: "Small", children: `${s.make} ${s.model}` }),
+                /* @__PURE__ */ e(x, { color: n.palette.text.secondary, variant: "Small", children: te(oe(s.created_at), { addSuffix: !0 }) })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ c(
+            we,
+            {
+              sx: { backgroundColor: n.palette.background.default, p: "0 0 0 24px" },
+              children: [
+                /* @__PURE__ */ c(
+                  p,
+                  {
+                    onClick: () => a(s),
+                    sx: {
+                      alignItems: "center",
+                      flexDirection: "row",
+                      width: "100%",
+                      gap: 12,
+                      py: 16,
+                      cursor: "pointer",
+                      borderBottom: "1px solid",
+                      borderColor: n.palette.border.light
+                    },
+                    children: [
+                      /* @__PURE__ */ e(V, { "aria-label": r.mobile_devices_edit_label, color: "secondary", children: /* @__PURE__ */ e(M, { name: "edit" }) }),
+                      /* @__PURE__ */ e(x, { variant: "Body", children: r.mobile_devices_edit_label })
+                    ]
+                  }
+                ),
+                /* @__PURE__ */ c(
+                  p,
+                  {
+                    onClick: () => o(s),
+                    sx: {
+                      alignItems: "center",
+                      flexDirection: "row",
+                      width: "100%",
+                      gap: 12,
+                      py: 16,
+                      cursor: "pointer"
+                    },
+                    children: [
+                      /* @__PURE__ */ e(V, { "aria-label": r.mobile_devices_delete_label, color: "secondary", children: /* @__PURE__ */ e(M, { name: "delete" }) }),
+                      /* @__PURE__ */ e(x, { variant: "Body", children: r.mobile_devices_delete_label })
+                    ]
+                  }
+                )
+              ]
+            }
+          )
+        ]
+      },
+      s.guid
+    )),
+    /* @__PURE__ */ e(
+      F,
+      {
+        sx: {
+          backgroundColor: n.palette.background.default,
+          borderTop: "1px solid",
+          borderColor: n.palette.border.light,
+          p: "12px 16px"
+        },
+        children: /* @__PURE__ */ e(x, { color: n.palette.text.secondary, variant: "Small", children: N(
+          r.mobile_devices_count,
+          /* @__PURE__ */ e("b", { children: t.length }),
+          /* @__PURE__ */ e("b", { children: t.length })
+        ) })
+      }
+    )
+  ] });
+}, $e = ({
+  dialogType: t,
+  isOpen: a,
+  onClose: o,
+  device: n,
+  deviceToken: r = ""
+}) => {
+  const m = P(), { common: l, settings: i } = k(), { updateDevice: s, deleteDevice: g, setAlert: _, loadDevices: d } = A(), [u, S] = h.useState("");
+  h.useEffect(() => {
+    n && S(n.name);
+  }, [n, t]);
+  const v = () => {
+    switch (t) {
+      case b.Edit:
+        return i.mobile_devices_edit_label;
+      case b.Delete:
+        return i.mobile_devices_delete_label;
+      default:
+        return "";
+    }
+  }, w = () => {
+    switch (t) {
+      case b.Token:
+        return l.done_button;
+      case b.Edit:
+        return l.save_button;
+      case b.Delete:
+        return l.delete_button;
+      default:
+        return "";
+    }
+  }, C = () => {
+    const y = {
+      "& .MuiDialogContent-root": {
+        width: 400,
+        pt: 0
+      }
+    };
+    return t === b.Token ? {
+      ...y,
+      "& .MuiToolbar-root:last-child": {
+        padding: "32px 60px 48px",
+        justifyContent: "center"
+      },
+      "& .MuiButton-root:first-child": {
+        display: "none"
+      },
+      "& .MuiButton-root:last-child": {
+        flex: 1
+      }
+    } : {
+      ...y,
+      "& .MuiToolbar-root:last-child": {
+        gap: 8,
+        padding: 24,
+        justifyContent: "flex-end"
+      },
+      ...t === b.Delete && {
+        "& .MuiTypography-Body": {
+          padding: 0
+        }
+      }
+    };
+  }, T = async () => {
+    if (t === b.Token && o(), t === b.Edit && n) {
+      const y = { ...n, name: u };
+      (await s(y)).success ? (_(i.mobile_devices_edit_success, "success"), d()) : _(
+        N(i.mobile_devices_edit_error, n.name),
+        "error"
+      ), o();
+    }
+    t === b.Delete && n && ((await g(n.guid)).success ? (_(
+      N(i.mobile_devices_delete_success, n.name),
+      "success"
+    ), d()) : _(
+      N(i.mobile_devices_delete_error, n.name),
+      "error"
+    ), o());
+  };
+  return /* @__PURE__ */ c(
+    W,
+    {
+      copy: { title: v() },
+      isOpen: a,
+      onClose: o,
+      onPrimaryAction: T,
+      onSecondaryAction: o,
+      primaryColor: t === b.Delete ? "error" : void 0,
+      primaryText: w(),
+      secondaryText: t === b.Token ? l.back : l.cancel_button,
+      sx: C(),
+      children: [
+        t === b.Token && /* @__PURE__ */ c(p, { spacing: 16, sx: { px: 40, textAlign: "center", width: "100%" }, children: [
+          /* @__PURE__ */ e(x, { bold: !0, truncate: !1, variant: "Body", children: i.mobile_devices_access_label }),
+          /* @__PURE__ */ e(x, { truncate: !1, variant: "Small", children: i.mobile_devices_access_info_1 }),
+          /* @__PURE__ */ e(
+            x,
+            {
+              sx: {
+                border: `1px solid ${m.palette.border.light}`,
+                borderRadius: "4px",
+                p: "16px 32px"
+              },
+              variant: "H1",
+              children: r
+            }
+          ),
+          /* @__PURE__ */ e(x, { truncate: !1, variant: "Small", children: i.mobile_devices_access_info_2 })
+        ] }),
+        t === b.Edit && /* @__PURE__ */ e(p, { children: /* @__PURE__ */ e(I, { onChange: (y) => S(y.target.value), value: u }) }),
+        t === b.Delete && /* @__PURE__ */ e(H, { children: i.mobile_devices_delete_info })
+      ]
+    }
+  );
+}, We = D($e), je = D(() => {
+  const { isMobile: t } = L(), { settings: a } = k(), { isCopyLoaded: o, isInitialized: n } = Z(), { setAlert: r, devices: m, loadDevices: l, generateDeviceToken: i } = A(), [s, g] = h.useState({ open: !1, type: "" }), [_, d] = h.useState(), [u, S] = h.useState("");
+  h.useEffect(() => {
+    n && l();
+  }, [n]);
+  const v = async () => {
+    const y = await i();
+    y ? (S(y), g({ open: !0, type: b.Token })) : r(a.mobile_devices_access_error, "error");
+  }, w = (y) => {
+    d(y), g({ open: !0, type: b.Edit });
+  }, C = (y) => {
+    d(y), g({ open: !0, type: b.Delete });
+  }, T = () => {
+    g({ open: !1, type: "" }), d(void 0);
+  };
+  return !o || !n ? /* @__PURE__ */ e(ne, {}) : /* @__PURE__ */ c(
+    p,
+    {
+      sx: {
+        backgroundColor: "background.paper",
+        p: 24,
+        gap: 24
+      },
+      children: [
+        /* @__PURE__ */ c(p, { gap: 4, children: [
+          /* @__PURE__ */ e(J, { children: a.mobile_devices_title }),
+          /* @__PURE__ */ e(H, { variant: "Body", children: a.mobile_devices_info })
+        ] }),
+        t ? /* @__PURE__ */ e(
+          Ve,
+          {
+            devices: m,
+            onClickDeviceDelete: C,
+            onClickDeviceEdit: w
+          }
+        ) : /* @__PURE__ */ e(
+          Fe,
+          {
+            devices: m,
+            onClickDeviceDelete: C,
+            onClickDeviceEdit: w
+          }
+        ),
+        /* @__PURE__ */ c(p, { sx: { alignItems: "center", px: 24, py: 12, gap: 4 }, children: [
+          /* @__PURE__ */ e(x, { bold: !0, variant: "Body", children: a.mobile_devices_access_title }),
+          /* @__PURE__ */ e(H, { align: "center", variant: "Small", children: a.mobile_devices_access_description }),
+          /* @__PURE__ */ e(Q, { onClick: v, variant: "text", children: a.mobile_devices_access_cta })
+        ] }),
+        /* @__PURE__ */ e(
+          We,
+          {
+            device: _,
+            deviceToken: u,
+            dialogType: s.type,
+            isOpen: s.open,
+            onClose: T
+          }
+        )
+      ]
+    }
+  );
+}), ze = je, X = D(
+  ({ onClick: t, primaryText: a, secondaryText: o, sx: n }) => {
+    const r = P();
+    return /* @__PURE__ */ e(Re, { sx: { bgcolor: r.palette.background.paper }, children: /* @__PURE__ */ c(Be, { alignItems: "flex-start", onClick: t, sx: n, children: [
+      /* @__PURE__ */ e(Ne, { primary: a, secondary: o }),
+      /* @__PURE__ */ e(Me, { children: /* @__PURE__ */ e(xe, {}) })
+    ] }) });
+  }
+), Ge = D(() => {
+  const { settings: t } = k(), { categories: a } = ee(), { selectedRule: o, updateRuleCategory: n } = A(), [r, m] = h.useState(!1), l = () => {
+    m(!1);
+  }, i = () => {
+    m(!0);
+  }, s = (_) => a.find((d) => d.guid === _)?.name, g = async (_) => {
+    o && o.category_guid !== _ && (o.category_guid = _, await n(o)), l();
+  };
+  return /* @__PURE__ */ c(h.Fragment, { children: [
+    /* @__PURE__ */ e(
+      X,
+      {
+        onClick: i,
+        primaryText: o?.category_guid ? s(o.category_guid) : "",
+        secondaryText: t.category
+      }
+    ),
+    /* @__PURE__ */ e(
+      Ee,
+      {
+        initialSelected: o?.category_guid ? o.category_guid : void 0,
+        onClose: l,
+        onSelect: g,
+        showDrawer: r,
+        title: t.select_category
+      }
+    )
+  ] });
+}), Je = D(() => {
+  const { common: t, settings: a } = k(), { selectedRule: o, updateRulePayee: n } = A(), r = P(), [m, l] = h.useState(!1), i = o?.description ? o.description : o?.match_description, [s, g] = h.useState(i || ""), _ = () => {
+    l(!0);
+  }, d = async () => {
+    s !== i && o && (o.description = s, await n(o), l(!1));
+  };
+  return /* @__PURE__ */ c(h.Fragment, { children: [
+    /* @__PURE__ */ e(
+      X,
+      {
+        onClick: _,
+        primaryText: i,
+        secondaryText: a.payee
+      }
+    ),
+    /* @__PURE__ */ e(
+      W,
+      {
+        copy: { title: a.edit_payee },
+        isOpen: m,
+        onClose: () => l(!1),
+        onPrimaryAction: d,
+        onSecondaryAction: () => l(!1),
+        primaryText: t.save_button,
+        secondaryText: t.cancel_button,
+        sx: {
+          "& .MuiDialogContent-root": { pt: 0, width: 400 },
+          path: { fill: r.palette.secondary.darker }
+        },
+        children: /* @__PURE__ */ e(
+          I,
+          {
+            onChange: (u) => g(u.target.value),
+            sx: { width: 352 },
+            value: s
+          }
+        )
+      }
+    )
+  ] });
+}), Ke = D(({ onClose: t, onDelete: a, isOpen: o }) => {
+  const { common: n, settings: r } = k(), m = P();
+  return /* @__PURE__ */ e(
+    W,
+    {
+      copy: { title: r.delete_rule },
+      isOpen: o,
+      onClose: t,
+      onPrimaryAction: a,
+      onSecondaryAction: t,
+      primaryColor: "error",
+      primaryText: n.delete_button,
+      secondaryText: n.cancel_button,
+      sx: {
+        "& .MuiButton-outlined": {
+          borderColor: m.palette.border.main,
+          color: m.palette.secondary.main
+        },
+        "& .MuiDialogContent-root": { pt: 0, width: 400 },
+        path: { fill: m.palette.secondary.darker }
+      },
+      children: /* @__PURE__ */ e(x, { truncate: !1, variant: "Small", children: r.delete_rule_confirm })
+    }
+  );
+}), Xe = D(
+  ({ isOpen: t, onClose: a, onDelete: o }) => {
+    const { common: n, settings: r } = k(), m = P(), [l, i] = h.useState(!1);
+    return /* @__PURE__ */ c(
+      He,
+      {
+        hasSecondaryAction: !1,
+        isOpen: t,
+        onClose: a,
+        onPrimaryAction: () => {
+          i(!0);
+        },
+        primaryColor: "error",
+        primaryText: n.delete_button,
+        sx: {
+          "& .MuiToolbar-root": { borderTop: `1px solid ${m.palette.border.light}` }
+        },
+        title: r.edit_rule,
+        children: [
+          /* @__PURE__ */ e(Ae, { children: /* @__PURE__ */ e(x, { bold: !0, variant: "XSmall", children: r.details }) }),
+          /* @__PURE__ */ e(Je, {}),
+          /* @__PURE__ */ e(G, { sx: { ml: 24 } }),
+          /* @__PURE__ */ e(Ge, {}),
+          /* @__PURE__ */ e(G, { sx: { ml: 24 } }),
+          /* @__PURE__ */ e(
+            Ke,
+            {
+              isOpen: l,
+              onClose: () => i(!1),
+              onDelete: o
+            }
+          )
+        ]
+      }
+    );
+  }
+), Ye = D(({ rule: t }) => {
+  const { categories: a } = ee(), { setSelectedGuid: o } = Pe(), { deleteTransactionRule: n, setSelectedRule: r } = A(), { isDesktop: m, isTablet: l } = L(), [i, s] = h.useState(!1), g = () => {
+    s(!1), o(null), r(void 0);
+  }, _ = async () => {
+    await n(), g();
+  }, d = () => {
+    s(!0), r(t);
+  }, u = (S) => a.find((v) => v.guid === S)?.name;
+  return /* @__PURE__ */ c(h.Fragment, { children: [
+    /* @__PURE__ */ e(
+      X,
+      {
+        onClick: d,
+        primaryText: t.description ? t.description : t.match_description,
+        secondaryText: t.category_guid ? u(t.category_guid) : ""
+      }
+    ),
+    /* @__PURE__ */ e(G, { sx: { ml: l || m ? 0 : 24 } }),
+    /* @__PURE__ */ e(Xe, { isOpen: i, onClose: g, onDelete: _ })
+  ] });
+}), qe = D(() => {
+  const { settings: t } = k(), { loadTransactionRules: a, transactionRules: o } = A();
+  return h.useEffect(() => {
+    a().finally();
+  }, []), /* @__PURE__ */ c(p, { sx: { gap: 24, py: 24 }, children: [
+    /* @__PURE__ */ c(p, { sx: { px: 24 }, children: [
+      /* @__PURE__ */ e(J, { children: t.transaction_rules_label }),
+      /* @__PURE__ */ e(H, { variant: "Body", children: t.transaction_rules_description })
+    ] }),
+    /* @__PURE__ */ e(Ie, { children: o.map((n, r) => /* @__PURE__ */ e(Ye, { rule: n }, r)) })
+  ] });
+}), re = qe, Qe = D(({ selectedTab: t }) => {
+  const { alert: a, setAlert: o } = A(), {
+    config: { display_user_profile_in_settings: n }
+  } = $();
+  return /* @__PURE__ */ c(q, { children: [
+    t === B.Profile && /* @__PURE__ */ e(Ue, {}),
+    t === B.Devices && /* @__PURE__ */ e(ze, {}),
+    t === B.Notifications && /* @__PURE__ */ e(z, { showPersonalDetails: !n }),
+    t === B.TransactionRules && /* @__PURE__ */ e(re, {}),
+    t === B.Help && /* @__PURE__ */ e(p, { sx: { px: 24 }, children: /* @__PURE__ */ e(Le, {}) }),
+    /* @__PURE__ */ e(
+      he,
+      {
+        anchorOrigin: { vertical: "bottom", horizontal: "right" },
+        autoHideDuration: 3500,
+        onClose: () => o(""),
+        open: !!a.message,
+        children: /* @__PURE__ */ e(
+          pe,
+          {
+            onClose: () => {
+              o("");
+            },
+            severity: a.severity,
+            variant: "filled",
+            children: a.message
+          }
+        )
+      }
+    )
+  ] });
+});
+var B = /* @__PURE__ */ ((t) => (t[t.Profile = 0] = "Profile", t[t.Devices = 1] = "Devices", t[t.Notifications = 2] = "Notifications", t[t.TransactionRules = 3] = "TransactionRules", t[t.Help = 4] = "Help", t))(B || {});
+const $t = D(({ onBackClick: t, sx: a }) => {
+  const { settings: o } = k(), { isCopyLoaded: n, isInitialized: r } = Z(), { config: m } = $(), { isMobile: l } = L(), {
+    display_user_profile_in_settings: i,
+    display_mobile_devices_in_settings: s,
+    display_notification_settings_in_settings: g,
+    display_user_transaction_rules_in_settings: _,
+    show_help_widget_in_master: d
+  } = m, u = [
+    { enabled: i, index: 0, label: o?.profile_label },
+    { enabled: s, index: 1, label: o?.mobile_devices_label },
+    { enabled: g, index: 2, label: o?.notifications_label },
+    { enabled: _, index: 3, label: o?.transaction_rules_label },
+    { enabled: d, index: 4, label: o?.help_label }
+  ], S = u.find((C) => C.enabled), [v, w] = h.useState(S ? S.index : -1);
+  return !n || !r ? /* @__PURE__ */ e(ne, {}) : /* @__PURE__ */ e(
+    K,
+    {
+      onBackClick: t,
+      sx: { height: "calc(100dvh - 24px)", overflow: "auto", ...a },
+      title: o.title,
+      children: /* @__PURE__ */ c(p, { mx: l ? 0 : 48, my: 24, children: [
+        /* @__PURE__ */ e(
+          ue,
+          {
+            onChange: (C, T) => w(T),
+            sx: { bgcolor: "background.paper" },
+            textColor: "primary",
+            value: v,
+            variant: "scrollable",
+            children: u.map(
+              (C) => C.enabled && /* @__PURE__ */ e(me, { label: C.label, value: C.index }, C.index)
+            )
+          }
+        ),
+        /* @__PURE__ */ e(Qe, { selectedTab: v })
+      ] })
+    }
+  );
+}), Wt = D((t) => {
+  const { clientConfig: a } = $(), o = a?.master?.deep_link_params?.view;
+  return o ? /* @__PURE__ */ e(z, { view: o }) : /* @__PURE__ */ e(K, { ...t, children: /* @__PURE__ */ e(p, { my: 24, children: /* @__PURE__ */ e(z, {}) }) });
+}), jt = (t) => {
+  const { isMobile: a } = L();
+  return /* @__PURE__ */ e(K, { ...t, children: /* @__PURE__ */ e(p, { sx: { mx: a ? 0 : 48, my: 24 }, children: /* @__PURE__ */ e(re, {}) }) });
+};
 export {
-  N as AccountNotificationProfiles,
-  P as BudgetNotificationProfiles,
-  c as DeviceTab,
-  A as InsightsNotificationProfiles,
-  u as NotificationSettings,
-  d as NotificationSettingsWidget,
-  m as ProfileTab,
-  e as SettingsApi,
-  r as SettingsStore,
-  s as SettingsTabs,
-  n as SettingsWidget,
-  p as SettingsWidgetContents,
-  h as TransactionRulesTab,
-  B as TransactionRulesWidget
+  Yt as AccountNotificationProfiles,
+  qt as BudgetNotificationProfiles,
+  ze as DeviceTab,
+  Qt as InsightsNotificationProfiles,
+  z as NotificationSettings,
+  Wt as NotificationSettingsWidget,
+  Ue as ProfileTab,
+  Jt as SettingsApi,
+  Kt as SettingsStore,
+  B as SettingsTabs,
+  $t as SettingsWidget,
+  Qe as SettingsWidgetContents,
+  re as TransactionRulesTab,
+  jt as TransactionRulesWidget
 };