@mx-cartographer/experiences 9.3.0-alpha.bb1 → 9.3.0-alpha.bb2

package/dist/settings/components/devices/DeviceDialog.es.js

@@ -0,0 +1,127 @@
+import { buildDynamicCopy as l } from "../../../core/utils/Localization.es.js";
+import { useGlobalCopyStore as A, useSettingsStore as C } from "../../../common/context/hooks.es.js";
+import E from "../../../common/components/dialog/Dialog.es.js";
+import { DialogType as e } from "../../constants/Settings.es.js";
+import f from "react";
+import { observer as j } from "mobx-react-lite";
+import b from "@mui/material/Stack";
+import { P as p, Text as m } from "@mxenabled/mxui";
+import { jsx as i, jsxs as h } from "react/jsx-runtime";
+import { useTheme as P } from "@mui/material/styles";
+import T from "@mui/material/TextField";
+var B = ({ dialogType: t, isOpen: x, onClose: n, device: r, deviceToken: D = "" }) => {
+  const v = P(), { common: a, settings: o } = A(), { updateDevice: y, deleteDevice: g, setAlert: c, loadDevices: u } = C(), [d, _] = f.useState("");
+  f.useEffect(() => {
+    r && _(r.name);
+  }, [r, t]);
+  const S = () => {
+    switch (t) {
+      case e.Edit:
+        return o.mobile_devices_edit_label;
+      case e.Delete:
+        return o.mobile_devices_delete_label;
+      default:
+        return "";
+    }
+  }, k = () => {
+    switch (t) {
+      case e.Token:
+        return a.done_button;
+      case e.Edit:
+        return a.save_button;
+      case e.Delete:
+        return a.delete_button;
+      default:
+        return "";
+    }
+  }, w = () => {
+    const s = { "& .MuiDialogContent-root": {
+      width: 400,
+      pt: 0
+    } };
+    return t === e.Token ? {
+      ...s,
+      "& .MuiToolbar-root:last-child": {
+        padding: "32px 60px 48px",
+        justifyContent: "center"
+      },
+      "& .MuiButton-root:first-of-type": { display: "none" },
+      "& .MuiButton-root:last-child": { flex: 1 }
+    } : {
+      ...s,
+      "& .MuiToolbar-root:last-child": {
+        gap: 8,
+        padding: 24,
+        justifyContent: "flex-end"
+      },
+      ...t === e.Delete && { "& .MuiTypography-body1": { padding: 0 } }
+    };
+  }, M = async () => {
+    if (t === e.Token && n(), t === e.Edit && r) {
+      const s = {
+        ...r,
+        name: d
+      };
+      (await y(s)).success ? (c(o.mobile_devices_edit_success, "success"), u()) : c(l(o.mobile_devices_edit_error, r.name), "error"), n();
+    }
+    t === e.Delete && r && ((await g(r.guid)).success ? (c(l(o.mobile_devices_delete_success, r.name), "success"), u()) : c(l(o.mobile_devices_delete_error, r.name), "error"), n());
+  };
+  return /* @__PURE__ */ h(E, {
+    copy: { title: S() },
+    isOpen: x,
+    onClose: n,
+    onPrimaryAction: M,
+    onSecondaryAction: n,
+    primaryColor: t === e.Delete ? "error" : void 0,
+    primaryText: k(),
+    secondaryText: t === e.Token ? a.back : a.cancel_button,
+    sx: w(),
+    children: [
+      t === e.Token && /* @__PURE__ */ h(b, {
+        spacing: 16,
+        sx: {
+          px: 40,
+          textAlign: "center",
+          width: "100%"
+        },
+        children: [
+          /* @__PURE__ */ i(m, {
+            bold: !0,
+            truncate: !1,
+            variant: "body1",
+            children: o.mobile_devices_access_label
+          }),
+          /* @__PURE__ */ i(m, {
+            truncate: !1,
+            variant: "body2",
+            children: o.mobile_devices_access_info_1
+          }),
+          /* @__PURE__ */ i(p, {
+            sx: {
+              border: `1px solid ${v.palette.neutral.light}`,
+              borderRadius: "4px",
+              p: "16px 32px"
+            },
+            variant: "h1",
+            children: D
+          }),
+          /* @__PURE__ */ i(m, {
+            truncate: !1,
+            variant: "body2",
+            children: o.mobile_devices_access_info_2
+          })
+        ]
+      }),
+      t === e.Edit && /* @__PURE__ */ i(b, { children: /* @__PURE__ */ i(T, {
+        onChange: (s) => _(s.target.value),
+        value: d
+      }) }),
+      t === e.Delete && /* @__PURE__ */ i(p, { children: o.mobile_devices_delete_info })
+    ]
+  });
+}, L = j(B);
+export {
+  L as default
+};
+
+//# sourceMappingURL=DeviceDialog.es.js.map

package/dist/settings/components/devices/DeviceDialog.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceDialog.es.js","names":[],"sources":["../../../../src/settings/components/devices/DeviceDialog.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { useTheme } from '@mui/material/styles'\nimport Stack from '@mui/material/Stack'\nimport TextField from '@mui/material/TextField'\nimport { P, Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore, useSettingsStore } from '../../../common'\nimport { Device } from '../../../core'\nimport { Dialog } from '../../../common/components'\nimport { DialogType } from '../../constants/Settings'\nimport { buildDynamicCopy } from '../../../core/utils/Localization'\n\ninterface DeviceDialogProps {\n  dialogType: string\n  isOpen: boolean\n  onClose: () => void\n  device?: Device\n  deviceToken?: string\n}\n\nconst DeviceDialog: React.FC<DeviceDialogProps> = ({\n  dialogType,\n  isOpen,\n  onClose,\n  device,\n  deviceToken = '',\n}) => {\n  const theme = useTheme()\n  const { common: commonCopy, settings: settingsCopy } = useGlobalCopyStore()\n  const { updateDevice, deleteDevice, setAlert, loadDevices } = useSettingsStore()\n\n  const [deviceName, setDeviceName] = React.useState('')\n\n  React.useEffect(() => {\n    if (device) setDeviceName(device.name)\n  }, [device, dialogType])\n\n  const getDialogTitle = () => {\n    switch (dialogType) {\n      case DialogType.Edit:\n        return settingsCopy.mobile_devices_edit_label\n      case DialogType.Delete:\n        return settingsCopy.mobile_devices_delete_label\n      default:\n        return ''\n    }\n  }\n\n  const getDialogPrimaryText = () => {\n    switch (dialogType) {\n      case DialogType.Token:\n        return commonCopy.done_button\n      case DialogType.Edit:\n        return commonCopy.save_button\n      case DialogType.Delete:\n        return commonCopy.delete_button\n      default:\n        return ''\n    }\n  }\n\n  const getDialogStyles = () => {\n    const baseStyles = {\n      '& .MuiDialogContent-root': {\n        width: 400,\n        pt: 0,\n      },\n    }\n\n    if (dialogType === DialogType.Token) {\n      return {\n        ...baseStyles,\n        '& .MuiToolbar-root:last-child': {\n          padding: '32px 60px 48px',\n          justifyContent: 'center',\n        },\n        '& .MuiButton-root:first-of-type': {\n          display: 'none',\n        },\n        '& .MuiButton-root:last-child': {\n          flex: 1,\n        },\n      }\n    }\n\n    return {\n      ...baseStyles,\n      '& .MuiToolbar-root:last-child': {\n        gap: 8,\n        padding: 24,\n        justifyContent: 'flex-end',\n      },\n      ...(dialogType === DialogType.Delete && {\n        '& .MuiTypography-body1': {\n          padding: 0,\n        },\n      }),\n    }\n  }\n\n  const handlePrimaryAction = async () => {\n    if (dialogType === DialogType.Token) {\n      onClose()\n    }\n\n    if (dialogType === DialogType.Edit && device) {\n      const updatedDevice = { ...device, name: deviceName }\n      const res = await updateDevice(updatedDevice)\n\n      if (res.success) {\n        setAlert(settingsCopy.mobile_devices_edit_success, 'success')\n        loadDevices()\n      } else {\n        setAlert(\n          buildDynamicCopy(settingsCopy.mobile_devices_edit_error, device.name) as string,\n          'error',\n        )\n      }\n      onClose()\n    }\n\n    if (dialogType === DialogType.Delete && device) {\n      const res = await deleteDevice(device.guid)\n\n      if (res.success) {\n        setAlert(\n          buildDynamicCopy(settingsCopy.mobile_devices_delete_success, device.name) as string,\n          'success',\n        )\n        loadDevices()\n      } else {\n        setAlert(\n          buildDynamicCopy(settingsCopy.mobile_devices_delete_error, device.name) as string,\n          'error',\n        )\n      }\n      onClose()\n    }\n  }\n\n  return (\n    <Dialog\n      copy={{ title: getDialogTitle() }}\n      isOpen={isOpen}\n      onClose={onClose}\n      onPrimaryAction={handlePrimaryAction}\n      onSecondaryAction={onClose}\n      primaryColor={dialogType === DialogType.Delete ? 'error' : undefined}\n      primaryText={getDialogPrimaryText()}\n      secondaryText={dialogType === DialogType.Token ? commonCopy.back : commonCopy.cancel_button}\n      sx={getDialogStyles()}\n    >\n      {dialogType === DialogType.Token && (\n        <Stack spacing={16} sx={{ px: 40, textAlign: 'center', width: '100%' }}>\n          <Text bold={true} truncate={false} variant=\"body1\">\n            {settingsCopy.mobile_devices_access_label}\n          </Text>\n          <Text truncate={false} variant=\"body2\">\n            {settingsCopy.mobile_devices_access_info_1}\n          </Text>\n          <P\n            sx={{\n              border: `1px solid ${theme.palette.neutral.light}`,\n              borderRadius: '4px',\n              p: '16px 32px',\n            }}\n            variant=\"h1\"\n          >\n            {deviceToken}\n          </P>\n          <Text truncate={false} variant=\"body2\">\n            {settingsCopy.mobile_devices_access_info_2}\n          </Text>\n        </Stack>\n      )}\n      {dialogType === DialogType.Edit && (\n        <Stack>\n          <TextField onChange={(e) => setDeviceName(e.target.value)} value={deviceName} />\n        </Stack>\n      )}\n      {dialogType === DialogType.Delete && <P>{settingsCopy.mobile_devices_delete_info}</P>}\n    </Dialog>\n  )\n}\n\nexport default observer(DeviceDialog)\n"],"mappings":"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"}

package/dist/settings/components/devices/DeviceList.es.js

@@ -0,0 +1,125 @@
+import { buildDynamicCopy as f } from "../../../core/utils/Localization.es.js";
+import { useGlobalCopyStore as u } from "../../../common/context/hooks.es.js";
+import y from "react";
+import d from "@mui/material/Stack";
+import { Icon as l, Text as t } from "@mxenabled/mxui";
+import { jsx as o, jsxs as i } from "react/jsx-runtime";
+import { useTheme as g } from "@mui/material/styles";
+import _ from "@mui/material/Box";
+import c from "@mui/material/IconButton";
+import { fromUnixTime as C } from "date-fns/fromUnixTime";
+import k from "@mui/material/Accordion";
+import w from "@mui/material/AccordionDetails";
+import v from "@mui/material/AccordionSummary";
+import { formatDistanceToNow as D } from "date-fns/formatDistanceToNow";
+var q = ({ devices: n, onClickDeviceEdit: m, onClickDeviceDelete: p }) => {
+  const r = g(), { settings: a } = u(), [s, b] = y.useState(!1), x = (e) => (S, h) => {
+    b(h ? e : !1);
+  };
+  return /* @__PURE__ */ i(d, {
+    mx: -28,
+    sx: { "& .MuiAccordion-root": {
+      mb: 0,
+      mt: 0
+    } },
+    children: [n.map((e) => /* @__PURE__ */ i(k, {
+      expanded: s === e.guid,
+      onChange: x(e.guid),
+      sx: { boxShadow: "none" },
+      children: [/* @__PURE__ */ o(v, {
+        expandIcon: /* @__PURE__ */ o(l, {
+          color: "secondary",
+          name: "keyboard_arrow_down",
+          size: 24
+        }),
+        sx: {
+          padding: "14px 24px",
+          borderBottom: "1px solid",
+          borderColor: r.palette.divider
+        },
+        children: /* @__PURE__ */ i(d, {
+          gap: 4,
+          children: [
+            /* @__PURE__ */ o(t, {
+              bold: !0,
+              variant: "body1",
+              children: e.name
+            }),
+            /* @__PURE__ */ o(t, {
+              color: r.palette.text.secondary,
+              variant: "body2",
+              children: `${e.make} ${e.model}`
+            }),
+            /* @__PURE__ */ o(t, {
+              color: r.palette.text.secondary,
+              variant: "body2",
+              children: D(C(e.created_at), { addSuffix: !0 })
+            })
+          ]
+        })
+      }), /* @__PURE__ */ i(w, {
+        sx: {
+          backgroundColor: r.palette.background.default,
+          p: "0 0 0 24px"
+        },
+        children: [/* @__PURE__ */ i(d, {
+          onClick: () => m(e),
+          sx: {
+            alignItems: "center",
+            flexDirection: "row",
+            width: "100%",
+            gap: 12,
+            py: 16,
+            cursor: "pointer",
+            borderBottom: "1px solid",
+            borderColor: r.palette.divider
+          },
+          children: [/* @__PURE__ */ o(c, {
+            "aria-label": a.mobile_devices_edit_label,
+            color: "secondary",
+            children: /* @__PURE__ */ o(l, { name: "edit" })
+          }), /* @__PURE__ */ o(t, {
+            variant: "body1",
+            children: a.mobile_devices_edit_label
+          })]
+        }), /* @__PURE__ */ i(d, {
+          onClick: () => p(e),
+          sx: {
+            alignItems: "center",
+            flexDirection: "row",
+            width: "100%",
+            gap: 12,
+            py: 16,
+            cursor: "pointer"
+          },
+          children: [/* @__PURE__ */ o(c, {
+            "aria-label": a.mobile_devices_delete_label,
+            color: "secondary",
+            children: /* @__PURE__ */ o(l, { name: "delete" })
+          }), /* @__PURE__ */ o(t, {
+            variant: "body1",
+            children: a.mobile_devices_delete_label
+          })]
+        })]
+      })]
+    }, e.guid)), /* @__PURE__ */ o(_, {
+      sx: {
+        backgroundColor: r.palette.background.default,
+        borderTop: "1px solid",
+        borderColor: r.palette.divider,
+        p: "12px 16px"
+      },
+      children: /* @__PURE__ */ o(t, {
+        color: r.palette.text.secondary,
+        variant: "body2",
+        children: f(a.mobile_devices_count, /* @__PURE__ */ o("b", { children: n.length }), /* @__PURE__ */ o("b", { children: n.length }))
+      })
+    })]
+  });
+};
+export {
+  q as DeviceList,
+  q as default
+};
+
+//# sourceMappingURL=DeviceList.es.js.map

package/dist/settings/components/devices/DeviceList.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceList.es.js","names":[],"sources":["../../../../src/settings/components/devices/DeviceList.tsx"],"sourcesContent":["import React from 'react'\nimport { formatDistanceToNow } from 'date-fns/formatDistanceToNow'\nimport { fromUnixTime } from 'date-fns/fromUnixTime'\n\nimport { useTheme } from '@mui/material/styles'\nimport Accordion from '@mui/material/Accordion'\nimport AccordionDetails from '@mui/material/AccordionDetails'\nimport AccordionSummary from '@mui/material/AccordionSummary'\nimport Box from '@mui/material/Box'\nimport IconButton from '@mui/material/IconButton'\nimport Stack from '@mui/material/Stack'\nimport { Icon, Text } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore } from '../../../common'\nimport { Device } from '../../../core'\nimport { buildDynamicCopy } from '../../../core/utils/Localization'\n\ninterface DeviceListProps {\n  devices: Device[]\n  onClickDeviceEdit: (device: Device) => void\n  onClickDeviceDelete: (device: Device) => void\n}\n\nexport const DeviceList: React.FC<DeviceListProps> = ({\n  devices,\n  onClickDeviceEdit,\n  onClickDeviceDelete,\n}) => {\n  const theme = useTheme()\n  const { settings: settingsCopy } = useGlobalCopyStore()\n  const [expanded, setExpanded] = React.useState<string | false>(false)\n\n  const handleChange = (guid: string) => (_: React.SyntheticEvent, isExpanded: boolean) => {\n    setExpanded(isExpanded ? guid : false)\n  }\n\n  return (\n    <Stack mx={-28} sx={{ '& .MuiAccordion-root': { mb: 0, mt: 0 } }}>\n      {devices.map((device) => (\n        <Accordion\n          expanded={expanded === device.guid}\n          key={device.guid}\n          onChange={handleChange(device.guid)}\n          sx={{ boxShadow: 'none' }}\n        >\n          <AccordionSummary\n            expandIcon={<Icon color={'secondary'} name=\"keyboard_arrow_down\" size={24} />}\n            sx={{\n              padding: '14px 24px',\n              borderBottom: '1px solid',\n              borderColor: theme.palette.divider,\n            }}\n          >\n            <Stack gap={4}>\n              <Text bold={true} variant=\"body1\">\n                {device.name}\n              </Text>\n              <Text color={theme.palette.text.secondary} variant=\"body2\">\n                {`${device.make} ${device.model}`}\n              </Text>\n              <Text color={theme.palette.text.secondary} variant=\"body2\">\n                {formatDistanceToNow(fromUnixTime(device.created_at), { addSuffix: true })}\n              </Text>\n            </Stack>\n          </AccordionSummary>\n          <AccordionDetails\n            sx={{ backgroundColor: theme.palette.background.default, p: '0 0 0 24px' }}\n          >\n            <Stack\n              onClick={() => onClickDeviceEdit(device)}\n              sx={{\n                alignItems: 'center',\n                flexDirection: 'row',\n                width: '100%',\n                gap: 12,\n                py: 16,\n                cursor: 'pointer',\n                borderBottom: '1px solid',\n                borderColor: theme.palette.divider,\n              }}\n            >\n              <IconButton aria-label={settingsCopy.mobile_devices_edit_label} color=\"secondary\">\n                <Icon name=\"edit\" />\n              </IconButton>\n              <Text variant=\"body1\">{settingsCopy.mobile_devices_edit_label}</Text>\n            </Stack>\n            <Stack\n              onClick={() => onClickDeviceDelete(device)}\n              sx={{\n                alignItems: 'center',\n                flexDirection: 'row',\n                width: '100%',\n                gap: 12,\n                py: 16,\n                cursor: 'pointer',\n              }}\n            >\n              <IconButton aria-label={settingsCopy.mobile_devices_delete_label} color=\"secondary\">\n                <Icon name=\"delete\" />\n              </IconButton>\n              <Text variant=\"body1\">{settingsCopy.mobile_devices_delete_label}</Text>\n            </Stack>\n          </AccordionDetails>\n        </Accordion>\n      ))}\n      <Box\n        sx={{\n          backgroundColor: theme.palette.background.default,\n          borderTop: '1px solid',\n          borderColor: theme.palette.divider,\n          p: '12px 16px',\n        }}\n      >\n        <Text color={theme.palette.text.secondary} variant=\"body2\">\n          {\n            buildDynamicCopy(\n              settingsCopy.mobile_devices_count,\n              <b>{devices.length}</b>,\n              <b>{devices.length}</b>,\n            ) as string\n          }\n        </Text>\n      </Box>\n    </Stack>\n  )\n}\n\nexport default DeviceList\n"],"mappings":"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"}

package/dist/settings/components/devices/DeviceTab.es.js

@@ -0,0 +1,107 @@
+import { useGlobalCopyStore as T, useGlobalUiStore as x, useSettingsStore as E } from "../../../common/context/hooks.es.js";
+import { useScreenSize as G } from "../../../common/hooks/useScreenSize.es.js";
+import L from "../../../common/components/Loader.es.js";
+import { DialogType as s } from "../../constants/Settings.es.js";
+import { DeviceTable as j } from "./DeviceTable.es.js";
+import { DeviceList as z } from "./DeviceList.es.js";
+import I from "./DeviceDialog.es.js";
+import c from "react";
+import { observer as w } from "mobx-react-lite";
+import l from "@mui/material/Stack";
+import { H3 as A, P as D, Text as B } from "@mxenabled/mxui";
+import H from "@mui/material/Button";
+import { jsx as e, jsxs as a } from "react/jsx-runtime";
+var X = w(() => {
+  const { isMobile: f } = G(), { settings: i } = T(), { isCopyLoaded: u, isInitialized: r } = x(), { setAlert: b, devices: d, loadDevices: g, generateDeviceToken: _ } = E(), [p, t] = c.useState({
+    open: !1,
+    type: ""
+  }), [k, n] = c.useState(), [y, C] = c.useState("");
+  c.useEffect(() => {
+    r && g();
+  }, [r]);
+  const h = async () => {
+    const o = await _();
+    o ? (C(o), t({
+      open: !0,
+      type: s.Token
+    })) : b(i.mobile_devices_access_error, "error");
+  }, m = (o) => {
+    n(o), t({
+      open: !0,
+      type: s.Edit
+    });
+  }, v = (o) => {
+    n(o), t({
+      open: !0,
+      type: s.Delete
+    });
+  }, S = () => {
+    t({
+      open: !1,
+      type: ""
+    }), n(void 0);
+  };
+  return !u || !r ? /* @__PURE__ */ e(L, {}) : /* @__PURE__ */ a(l, {
+    sx: {
+      backgroundColor: "background.paper",
+      p: 24,
+      gap: 24
+    },
+    children: [
+      /* @__PURE__ */ a(l, {
+        gap: 4,
+        children: [/* @__PURE__ */ e(A, { children: i.mobile_devices_title }), /* @__PURE__ */ e(D, {
+          variant: "body1",
+          children: i.mobile_devices_info
+        })]
+      }),
+      f ? /* @__PURE__ */ e(z, {
+        devices: d,
+        onClickDeviceDelete: v,
+        onClickDeviceEdit: m
+      }) : /* @__PURE__ */ e(j, {
+        devices: d,
+        onClickDeviceDelete: v,
+        onClickDeviceEdit: m
+      }),
+      /* @__PURE__ */ a(l, {
+        sx: {
+          alignItems: "center",
+          px: 24,
+          py: 12,
+          gap: 4
+        },
+        children: [
+          /* @__PURE__ */ e(B, {
+            bold: !0,
+            variant: "body1",
+            children: i.mobile_devices_access_title
+          }),
+          /* @__PURE__ */ e(D, {
+            align: "center",
+            variant: "body2",
+            children: i.mobile_devices_access_description
+          }),
+          /* @__PURE__ */ e(H, {
+            onClick: h,
+            variant: "text",
+            children: i.mobile_devices_access_cta
+          })
+        ]
+      }),
+      /* @__PURE__ */ e(I, {
+        device: k,
+        deviceToken: y,
+        dialogType: p.type,
+        isOpen: p.open,
+        onClose: S
+      })
+    ]
+  });
+});
+export {
+  X as DeviceTab,
+  X as default
+};
+
+//# sourceMappingURL=DeviceTab.es.js.map

package/dist/settings/components/devices/DeviceTab.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceTab.es.js","names":[],"sources":["../../../../src/settings/components/devices/DeviceTab.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\nimport { H3, P, Text } from '@mxenabled/mxui'\n\nimport {\n  Loader,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n  useScreenSize,\n  useSettingsStore,\n} from '../../../common'\n\nimport type { Device } from '../../../core'\n\nimport { DialogType } from '../../constants/Settings'\nimport DeviceTable from './DeviceTable'\nimport DeviceList from './DeviceList'\nimport DeviceDialog from './DeviceDialog'\n\nexport const DeviceTab = observer(() => {\n  const { isMobile } = useScreenSize()\n  const { settings: settingsCopy } = useGlobalCopyStore()\n  const { isCopyLoaded, isInitialized } = useGlobalUiStore()\n  const { setAlert, devices, loadDevices, generateDeviceToken } = useSettingsStore()\n\n  const [dialog, setDialog] = React.useState({ open: false, type: '' })\n  const [selectedDevice, setSelectedDevice] = React.useState<Device | undefined>()\n  const [deviceToken, setDeviceToken] = React.useState('')\n\n  React.useEffect(() => {\n    if (isInitialized) {\n      loadDevices()\n    }\n  }, [isInitialized])\n\n  const handleGenerateDeviceToken = async () => {\n    const token = await generateDeviceToken()\n    if (token) {\n      setDeviceToken(token)\n      setDialog({ open: true, type: DialogType.Token })\n    } else {\n      setAlert(settingsCopy.mobile_devices_access_error, 'error')\n    }\n  }\n\n  const handleClickDeviceEdit = (device: Device) => {\n    setSelectedDevice(device)\n    setDialog({ open: true, type: DialogType.Edit })\n  }\n\n  const handleClickDeviceDelete = (device: Device) => {\n    setSelectedDevice(device)\n    setDialog({ open: true, type: DialogType.Delete })\n  }\n\n  const handleCloseDialog = () => {\n    setDialog({ open: false, type: '' })\n    setSelectedDevice(undefined)\n  }\n\n  if (!isCopyLoaded || !isInitialized) {\n    return <Loader />\n  }\n\n  return (\n    <Stack\n      sx={{\n        backgroundColor: 'background.paper',\n        p: 24,\n        gap: 24,\n      }}\n    >\n      <Stack gap={4}>\n        <H3>{settingsCopy.mobile_devices_title}</H3>\n        <P variant=\"body1\">{settingsCopy.mobile_devices_info}</P>\n      </Stack>\n\n      {/* Device Table/List */}\n      {isMobile ? (\n        <DeviceList\n          devices={devices}\n          onClickDeviceDelete={handleClickDeviceDelete}\n          onClickDeviceEdit={handleClickDeviceEdit}\n        />\n      ) : (\n        <DeviceTable\n          devices={devices}\n          onClickDeviceDelete={handleClickDeviceDelete}\n          onClickDeviceEdit={handleClickDeviceEdit}\n        />\n      )}\n\n      {/* Token CTA */}\n      <Stack sx={{ alignItems: 'center', px: 24, py: 12, gap: 4 }}>\n        <Text bold={true} variant=\"body1\">\n          {settingsCopy.mobile_devices_access_title}\n        </Text>\n        <P align=\"center\" variant=\"body2\">\n          {settingsCopy.mobile_devices_access_description}\n        </P>\n        <Button onClick={handleGenerateDeviceToken} variant=\"text\">\n          {settingsCopy.mobile_devices_access_cta}\n        </Button>\n      </Stack>\n\n      {/* Dialogs (Token, Edit, or Delete) */}\n      <DeviceDialog\n        device={selectedDevice}\n        deviceToken={deviceToken}\n        dialogType={dialog.type}\n        isOpen={dialog.open}\n        onClose={handleCloseDialog}\n      />\n    </Stack>\n  )\n})\n\nexport default DeviceTab\n"],"mappings":"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"}

package/dist/settings/components/devices/DeviceTable.es.js

@@ -0,0 +1,120 @@
+import { buildDynamicCopy as p } from "../../../core/utils/Localization.es.js";
+import { useGlobalCopyStore as f } from "../../../common/context/hooks.es.js";
+import { HeaderCell as i } from "../../../trends/components/trendstable/HeaderCell.es.js";
+import b from "react";
+import a from "@mui/material/Stack";
+import { Icon as d, Text as n } from "@mxenabled/mxui";
+import { jsx as e, jsxs as h } from "react/jsx-runtime";
+import { alpha as x, useTheme as _ } from "@mui/material/styles";
+import m from "@mui/material/Box";
+import c from "@mui/material/IconButton";
+import { fromUnixTime as y } from "date-fns/fromUnixTime";
+import { DataGridPro as C } from "@mui/x-data-grid-pro";
+import { formatDistanceToNow as g } from "date-fns/formatDistanceToNow";
+var R = ({ devices: l, onClickDeviceEdit: s, onClickDeviceDelete: u }) => {
+  const o = _(), { settings: t } = f();
+  return /* @__PURE__ */ e(m, {
+    sx: { width: "100%" },
+    children: /* @__PURE__ */ e(C, {
+      columns: [
+        {
+          field: "name",
+          headerName: t.mobile_devices_column_name,
+          renderHeader: i,
+          renderCell: (r) => /* @__PURE__ */ h(a, {
+            alignItems: "center",
+            direction: "row",
+            gap: 4,
+            children: [/* @__PURE__ */ e(n, {
+              variant: "body2",
+              children: r.value
+            }), /* @__PURE__ */ e(c, {
+              "aria-label": t.mobile_devices_edit_label,
+              color: "secondary",
+              onClick: () => s(r.row),
+              children: /* @__PURE__ */ e(d, { name: "edit" })
+            })]
+          }),
+          sortable: !0,
+          flex: 1,
+          minWidth: 200
+        },
+        {
+          field: "device_type",
+          headerName: t.mobile_devices_column_type,
+          renderHeader: i,
+          sortable: !0,
+          hideSortIcons: !1,
+          flex: 1,
+          minWidth: 150
+        },
+        {
+          field: "created_at",
+          headerName: t.mobile_devices_column_added,
+          renderHeader: i,
+          valueFormatter: (r) => g(y(r), { addSuffix: !0 }),
+          sortable: !0,
+          hideSortIcons: !1,
+          flex: 1,
+          minWidth: 150
+        },
+        {
+          field: "delete",
+          headerName: "",
+          renderHeader: i,
+          renderCell: (r) => /* @__PURE__ */ e(a, {
+            mr: 4,
+            children: /* @__PURE__ */ e(c, {
+              "aria-label": t.mobile_devices_delete_label,
+              color: "secondary",
+              onClick: () => u(r.row),
+              children: /* @__PURE__ */ e(d, { name: "delete" })
+            })
+          }),
+          sortable: !1,
+          hideSortIcons: !1,
+          width: 58
+        }
+      ],
+      disableColumnFilter: !0,
+      disableColumnMenu: !0,
+      disableRowSelectionOnClick: !0,
+      rows: b.useMemo(() => l.map((r) => ({
+        id: r.guid,
+        ...r,
+        device_type: `${r.make} ${r.model}`
+      })), [l]),
+      slotProps: { footer: { sx: { justifyContent: "flex-end" } } },
+      slots: { footer: () => /* @__PURE__ */ e(m, {
+        sx: {
+          backgroundColor: o.palette.background.default,
+          display: "flex",
+          justifyContent: "flex-end",
+          alignItems: "center",
+          p: "12px 16px"
+        },
+        children: /* @__PURE__ */ e(n, {
+          color: o.palette.text.secondary,
+          variant: "body2",
+          children: p(t.mobile_devices_count, /* @__PURE__ */ e("b", { children: l.length }), /* @__PURE__ */ e("b", { children: l.length }))
+        })
+      }) },
+      sx: {
+        border: "1px solid",
+        borderColor: o.palette.neutral.light,
+        borderRadius: "8px",
+        "& .MuiDataGrid-columnHeader .MuiIconButton-root": {
+          color: o.palette.primary.main,
+          "&:hover": { backgroundColor: x(o.palette.primary.main, 0.1) }
+        },
+        "& .MuiDataGrid-sortIcon": { color: o.palette.primary.main }
+      }
+    })
+  });
+};
+export {
+  R as DeviceTable,
+  R as default
+};
+
+//# sourceMappingURL=DeviceTable.es.js.map

package/dist/settings/components/devices/DeviceTable.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DeviceTable.es.js","names":[],"sources":["../../../../src/settings/components/devices/DeviceTable.tsx"],"sourcesContent":["import React from 'react'\nimport { formatDistanceToNow } from 'date-fns/formatDistanceToNow'\nimport { fromUnixTime } from 'date-fns/fromUnixTime'\n\nimport { useTheme } from '@mui/material/styles'\nimport { alpha } from '@mui/material/styles'\n\nimport IconButton from '@mui/material/IconButton'\nimport Box from '@mui/material/Box'\nimport Stack from '@mui/material/Stack'\nimport { Icon, Text } from '@mxenabled/mxui'\nimport { DataGridPro, GridColDef } from '@mui/x-data-grid-pro'\n\nimport { useGlobalCopyStore } from '../../../common'\nimport { Device } from '../../../core'\nimport { HeaderCell } from '../../../trends/components/trendstable/HeaderCell'\nimport { buildDynamicCopy } from '../../../core/utils/Localization'\n\ninterface DeviceTableProps {\n  devices: Device[]\n  onClickDeviceEdit: (device: Device) => void\n  onClickDeviceDelete: (device: Device) => void\n}\n\nexport const DeviceTable: React.FC<DeviceTableProps> = ({\n  devices,\n  onClickDeviceEdit,\n  onClickDeviceDelete,\n}) => {\n  const theme = useTheme()\n  const { settings: settingsCopy } = useGlobalCopyStore()\n\n  const columns: GridColDef[] = [\n    {\n      field: 'name',\n      headerName: settingsCopy.mobile_devices_column_name,\n      renderHeader: HeaderCell,\n      renderCell: (params) => (\n        <Stack alignItems=\"center\" direction=\"row\" gap={4}>\n          <Text variant=\"body2\">{params.value}</Text>\n          <IconButton\n            aria-label={settingsCopy.mobile_devices_edit_label}\n            color=\"secondary\"\n            onClick={() => onClickDeviceEdit(params.row as Device)}\n          >\n            <Icon name=\"edit\" />\n          </IconButton>\n        </Stack>\n      ),\n      sortable: true,\n      flex: 1,\n      minWidth: 200,\n    },\n    {\n      field: 'device_type',\n      headerName: settingsCopy.mobile_devices_column_type,\n      renderHeader: HeaderCell,\n      sortable: true,\n      hideSortIcons: false,\n      flex: 1,\n      minWidth: 150,\n    },\n    {\n      field: 'created_at',\n      headerName: settingsCopy.mobile_devices_column_added,\n      renderHeader: HeaderCell,\n      valueFormatter: (value: number) =>\n        formatDistanceToNow(fromUnixTime(value), { addSuffix: true }),\n      sortable: true,\n      hideSortIcons: false,\n      flex: 1,\n      minWidth: 150,\n    },\n    {\n      field: 'delete',\n      headerName: '',\n      renderHeader: HeaderCell,\n      renderCell: (params) => (\n        <Stack mr={4}>\n          <IconButton\n            aria-label={settingsCopy.mobile_devices_delete_label}\n            color=\"secondary\"\n            onClick={() => onClickDeviceDelete(params.row as Device)}\n          >\n            <Icon name=\"delete\" />\n          </IconButton>\n        </Stack>\n      ),\n      sortable: false,\n      hideSortIcons: false,\n      width: 58,\n    },\n  ]\n\n  const rows = React.useMemo(() => {\n    return devices.map((device) => ({\n      id: device.guid,\n      ...device,\n      device_type: `${device.make} ${device.model}`,\n    }))\n  }, [devices])\n\n  return (\n    <Box sx={{ width: '100%' }}>\n      <DataGridPro\n        columns={columns}\n        disableColumnFilter={true}\n        disableColumnMenu={true}\n        disableRowSelectionOnClick={true}\n        rows={rows}\n        slotProps={{\n          footer: {\n            sx: { justifyContent: 'flex-end' },\n          },\n        }}\n        slots={{\n          footer: () => (\n            <Box\n              sx={{\n                backgroundColor: theme.palette.background.default,\n                display: 'flex',\n                justifyContent: 'flex-end',\n                alignItems: 'center',\n                p: '12px 16px',\n              }}\n            >\n              <Text color={theme.palette.text.secondary} variant=\"body2\">\n                {\n                  buildDynamicCopy(\n                    settingsCopy.mobile_devices_count,\n                    <b>{devices.length}</b>,\n                    <b>{devices.length}</b>,\n                  ) as string\n                }\n              </Text>\n            </Box>\n          ),\n        }}\n        sx={{\n          border: '1px solid',\n          borderColor: theme.palette.neutral.light,\n          borderRadius: '8px',\n          '& .MuiDataGrid-columnHeader .MuiIconButton-root': {\n            color: theme.palette.primary.main,\n            '&:hover': {\n              backgroundColor: alpha(theme.palette.primary.main, 0.1),\n            },\n          },\n          '& .MuiDataGrid-sortIcon': {\n            color: theme.palette.primary.main,\n          },\n        }}\n      />\n    </Box>\n  )\n}\n\nexport default DeviceTable\n"],"mappings":"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"}

package/dist/settings/components/notifications/AccountNotificationProfile.es.js

@@ -0,0 +1,92 @@
+import { useGlobalCopyStore as v, useSettingsStore as S, useUserStore as D } from "../../../common/context/hooks.es.js";
+import { useScreenSize as P } from "../../../common/hooks/useScreenSize.es.js";
+import { ToggleListItem as _ } from "../../../common/components/listitems/ToggleListItem.es.js";
+import { AccountProfileListItem as k } from "./AccountProfileListItem.es.js";
+import { observer as C } from "mobx-react-lite";
+import t from "@mui/material/Stack";
+import { Text as x } from "@mxenabled/mxui";
+import { Fragment as E, jsx as i, jsxs as c } from "react/jsx-runtime";
+import h from "@mui/material/Divider";
+import g from "@mui/material/List";
+var N = C(({ onUpdateProfile: s, profile: e }) => {
+  const { settings: n } = v(), { user: o } = D(), { clientCommunicationProfile: f, userCommunicationsProfile: y } = S(), { isMobile: u } = P(), T = e.notification_type > 2, { opted_out_of_email_notifications: r, opted_out_of_push_notifications: b, opted_out_of_sms_notifications: m } = y, { email_notifications_enabled: d, push_notifications_enabled: a, sms_notifications_enabled: l } = f;
+  return /* @__PURE__ */ c(t, { children: [(d || l || a) && /* @__PURE__ */ c(E, { children: [/* @__PURE__ */ i(x, {
+    bold: !0,
+    sx: {
+      mb: 4,
+      ml: 24,
+      mt: 12
+    },
+    variant: "caption",
+    children: n.delivery_method_title
+  }), /* @__PURE__ */ c(g, {
+    sx: { bgcolor: "background.paper" },
+    children: [
+      d && /* @__PURE__ */ i(t, {
+        sx: { pl: 24 },
+        children: /* @__PURE__ */ i(_, {
+          isChecked: !r && e.email_channel && !!o.email,
+          isDisabled: r || !o.email,
+          onToggle: () => s({
+            ...e,
+            email_channel: !e.email_channel
+          }),
+          primaryText: n.delivery_method_email_label,
+          secondaryText: r || !e.email_channel || !o.email ? n.notification_disabled : n.notification_enabled,
+          useExtraPadding: !1
+        })
+      }),
+      d && (l || a) && /* @__PURE__ */ i(h, { sx: { ml: u ? 0 : 24 } }),
+      l && /* @__PURE__ */ i(t, {
+        sx: { pl: 24 },
+        children: /* @__PURE__ */ i(_, {
+          isChecked: !m && e.sms_channel && !!o.phone,
+          isDisabled: m || !o.phone,
+          onToggle: () => s({
+            ...e,
+            sms_channel: !e.sms_channel
+          }),
+          primaryText: `${n.delivery_method_sms_label}`,
+          secondaryText: m || !e.sms_channel || !o.phone ? n.notification_disabled : n.notification_enabled,
+          useExtraPadding: !1
+        })
+      }),
+      l && a && /* @__PURE__ */ i(h, { sx: { ml: u ? 0 : 24 } }),
+      a && /* @__PURE__ */ i(t, {
+        sx: { pl: 24 },
+        children: /* @__PURE__ */ i(_, {
+          isChecked: !b && e.push_channel,
+          isDisabled: b,
+          onToggle: () => s({
+            ...e,
+            push_channel: !e.push_channel
+          }),
+          primaryText: n.delivery_method_push_label,
+          secondaryText: n.delivery_method_push_subtitle,
+          useExtraPadding: !1
+        })
+      }),
+      /* @__PURE__ */ i(h, {})
+    ]
+  })] }), T && !!e.children?.length && /* @__PURE__ */ c(t, { children: [/* @__PURE__ */ i(x, {
+    bold: !0,
+    sx: {
+      mb: 4,
+      ml: 24,
+      mt: 12
+    },
+    variant: "caption",
+    children: n.accounts_threshold_title
+  }), /* @__PURE__ */ i(g, {
+    sx: { bgcolor: "background.paper" },
+    children: e.children?.map((p) => /* @__PURE__ */ i(k, {
+      onProfileUpdated: s,
+      profile: p
+    }, p.guid))
+  })] })] });
+});
+export {
+  N as AccountNotificationProfile
+};
+
+//# sourceMappingURL=AccountNotificationProfile.es.js.map

package/dist/settings/components/notifications/AccountNotificationProfile.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccountNotificationProfile.es.js","names":[],"sources":["../../../../src/settings/components/notifications/AccountNotificationProfile.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport Divider from '@mui/material/Divider'\nimport List from '@mui/material/List'\nimport Stack from '@mui/material/Stack'\n\nimport { Text } from '@mxenabled/mxui'\n\nimport {\n  ToggleListItem,\n  useGlobalCopyStore,\n  useScreenSize,\n  useSettingsStore,\n  useUserStore,\n} from '../../../common'\nimport { DetailedNotificationProfile } from '../../../core'\n\nimport { AccountProfileListItem } from './AccountProfileListItem'\n\ninterface AccountNotificationProfileProps {\n  onUpdateProfile: (profile: DetailedNotificationProfile) => void\n  profile: DetailedNotificationProfile\n}\n\nexport const AccountNotificationProfile = observer(\n  ({ onUpdateProfile, profile }: AccountNotificationProfileProps) => {\n    const { settings: copy } = useGlobalCopyStore()\n    const { user } = useUserStore()\n    const { clientCommunicationProfile, userCommunicationsProfile } = useSettingsStore()\n    const { isMobile } = useScreenSize()\n\n    const isAccountProfile = profile.notification_type > 2\n    const {\n      opted_out_of_email_notifications: emailDisabled,\n      opted_out_of_push_notifications: pushDisabled,\n      opted_out_of_sms_notifications: smsDisabled,\n    } = userCommunicationsProfile\n\n    const {\n      email_notifications_enabled: showEmail,\n      push_notifications_enabled: showPush,\n      sms_notifications_enabled: showSms,\n    } = clientCommunicationProfile\n\n    return (\n      <Stack>\n        {(showEmail || showSms || showPush) && (\n          <>\n            <Text bold={true} sx={{ mb: 4, ml: 24, mt: 12 }} variant=\"caption\">\n              {copy.delivery_method_title}\n            </Text>\n            <List sx={{ bgcolor: 'background.paper' }}>\n              {showEmail && (\n                <Stack sx={{ pl: 24 }}>\n                  <ToggleListItem\n                    isChecked={!emailDisabled && profile.email_channel && !!user.email}\n                    isDisabled={emailDisabled || !user.email}\n                    onToggle={() =>\n                      onUpdateProfile({ ...profile, email_channel: !profile.email_channel })\n                    }\n                    primaryText={copy.delivery_method_email_label}\n                    secondaryText={\n                      emailDisabled || !profile.email_channel || !user.email\n                        ? copy.notification_disabled\n                        : copy.notification_enabled\n                    }\n                    useExtraPadding={false}\n                  />\n                </Stack>\n              )}\n\n              {showEmail && (showSms || showPush) && <Divider sx={{ ml: isMobile ? 0 : 24 }} />}\n\n              {showSms && (\n                <Stack sx={{ pl: 24 }}>\n                  <ToggleListItem\n                    isChecked={!smsDisabled && profile.sms_channel && !!user.phone}\n                    isDisabled={smsDisabled || !user.phone}\n                    onToggle={() =>\n                      onUpdateProfile({ ...profile, sms_channel: !profile.sms_channel })\n                    }\n                    primaryText={`${copy.delivery_method_sms_label}`}\n                    secondaryText={\n                      smsDisabled || !profile.sms_channel || !user.phone\n                        ? copy.notification_disabled\n                        : copy.notification_enabled\n                    }\n                    useExtraPadding={false}\n                  />\n                </Stack>\n              )}\n\n              {showSms && showPush && <Divider sx={{ ml: isMobile ? 0 : 24 }} />}\n\n              {showPush && (\n                <Stack sx={{ pl: 24 }}>\n                  <ToggleListItem\n                    isChecked={!pushDisabled && profile.push_channel}\n                    isDisabled={pushDisabled}\n                    onToggle={() =>\n                      onUpdateProfile({ ...profile, push_channel: !profile.push_channel })\n                    }\n                    primaryText={copy.delivery_method_push_label}\n                    secondaryText={copy.delivery_method_push_subtitle}\n                    useExtraPadding={false}\n                  />\n                </Stack>\n              )}\n              <Divider />\n            </List>\n          </>\n        )}\n\n        {isAccountProfile && Boolean(profile.children?.length) && (\n          <Stack>\n            <Text bold={true} sx={{ mb: 4, ml: 24, mt: 12 }} variant=\"caption\">\n              {copy.accounts_threshold_title}\n            </Text>\n\n            <List sx={{ bgcolor: 'background.paper' }}>\n              {profile.children?.map((child) => (\n                <AccountProfileListItem\n                  key={child.guid}\n                  onProfileUpdated={onUpdateProfile}\n                  profile={child}\n                />\n              ))}\n            </List>\n          </Stack>\n        )}\n      </Stack>\n    )\n  },\n)\n"],"mappings":"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"}