@mx-cartographer/experiences 9.2.4-alpha.al4 → 9.3.0-alph.bb2

package/dist/finstrong/components/onboarding/OnboardingStepsDrawer.es.js

@@ -0,0 +1,313 @@
+import { useAccountStore as bt, useFinstrongStore as St, useGlobalCopyStore as Ct, useRecurringTransactionsStore as xt, useTransactionStore as Tt, useUserStore as At } from "../../../common/context/hooks.es.js";
+import Dt from "../../../common/components/drawer/Drawer.es.js";
+import { Frequency as It, RepeatingType as wt } from "../../../core/types/RepeatingTransaction.es.js";
+import { getNextPaymentDate as Mt } from "../../../core/utils/RecurringTransactionsUtil.es.js";
+import Ot from "../../../common/components/ConnectDrawer.es.js";
+import { incomeFilter as L, incomeFilterSearch as Bt } from "../../../transactions/utils/Filters.es.js";
+import { SelectTransaction as kt } from "../../../recurringtransactions/components/shared/recurringsettings/SelectTransaction.es.js";
+import "../../constants/index.es.js";
+import Pt from "../../../accounts/components/AccountsListCompact.es.js";
+import { OnboardingSteps as e } from "../../../core/types/Finstrong.es.js";
+import Ft from "./OnboardingAddMonthlyIncome.es.js";
+import vt from "./OnboardingBirthday.es.js";
+import Rt from "./OnboardingCreditScore.es.js";
+import Lt from "./OnboardingStepsHeader.es.js";
+import r from "react";
+import { observer as Et } from "mobx-react-lite";
+import D from "@mui/material/Stack";
+import { H2 as Ut, P as Nt } from "@mxenabled/mxui";
+import { endOfMonth as qt } from "date-fns/endOfMonth";
+import { startOfMonth as Gt } from "date-fns/startOfMonth";
+import { startOfToday as E } from "date-fns/startOfToday";
+import Ht from "@mui/material/Button";
+import { Add as Wt } from "@mxenabled/mx-icons";
+import { jsx as i, jsxs as g } from "react/jsx-runtime";
+import jt from "@mui/material/Box";
+import { subDays as $t } from "date-fns/subDays";
+import { fromUnixTime as zt } from "date-fns/fromUnixTime";
+import { formatISO as Jt } from "date-fns/formatISO";
+var U = {
+  step: e.ConnectAccounts,
+  type: "main"
+}, Kt = ({ isOpen: N, onClose: q }) => {
+  const { visibleAccounts: b } = bt(), { calculateHealthScore: G } = St(), { finstrong: n } = Ct(), { addRepeatingTransaction: H, setDateRange: W } = xt(), { filter: j, setFilter: I, transactions: S } = Tt(), { user: a, userProfile: $, updateUser: w, updateUserProfile: z } = At(), [l, J] = r.useState(a.credit_score || 0), [c, d] = r.useState(U), [C, K] = r.useState(1), [x, Q] = r.useState(It.EveryMonth), [y, M] = r.useState([]), [T, O] = r.useState(!1), [V, B] = r.useState(!1), [f, X] = r.useState(a.birthday), [A, Y] = r.useState(15), [s, k] = r.useState("");
+  r.useEffect(() => {
+    W({
+      start: Gt(E()),
+      end: qt(E())
+    });
+  }, []), r.useEffect(() => {
+    I({
+      accounts: b.map((t) => t.guid),
+      dateRange: {
+        start: $t(/* @__PURE__ */ new Date(), 90),
+        end: /* @__PURE__ */ new Date()
+      },
+      custom: L
+    });
+  }, [b]);
+  const P = r.useMemo(() => S.find((t) => t.guid === s), [s, S]), Z = r.useMemo(() => ({
+    [e.ConnectAccounts]: !0,
+    [e.MonthlyIncome]: !!s,
+    [e.Birthday]: !!a.birthday || !!f,
+    [e.CreditScore]: !!a.credit_score || !!l
+  })[c.step], [
+    l,
+    c,
+    f,
+    s,
+    a
+  ]), u = b.length > 0, tt = r.useMemo(() => {
+    const { step: t } = c;
+    let o = 0;
+    return t >= e.MonthlyIncome && u && o++, t >= e.Birthday && y.length && o++, t >= e.CreditScore && (a.birthday || a.credit_score) && o++, o;
+  }, [
+    c.step,
+    u,
+    y.length,
+    a.birthday,
+    a.credit_score
+  ]), et = (t) => {
+    I({
+      ...j,
+      custom: (o) => t ? Bt(o, t) : L(o)
+    });
+  }, nt = {
+    [e.ConnectAccounts]: {
+      main: u ? /* @__PURE__ */ i(Pt, { shouldShowBalance: !1 }) : null,
+      mainActionContent: u ? n.onboarding_next : n.onboarding_add_accounts,
+      primaryText: n.connect_your_accounts,
+      secondaryText: n.onboarding_connect_your_accounts_secondary
+    },
+    [e.MonthlyIncome]: {
+      detail: /* @__PURE__ */ i(Ft, {
+        firstDay: C,
+        frequency: x,
+        incomeTransactions: y,
+        secondDay: A,
+        setCurrentStep: (t) => {
+          d(t), M((o) => {
+            if (o.some((p) => p.guid === s)) return o.filter((p) => p.guid !== s);
+            const m = S.find((p) => p.guid === s);
+            return m ? [...o, {
+              ...m,
+              firstDay: C,
+              frequency: x,
+              secondDay: A
+            }] : o;
+          });
+        },
+        setFirstDay: K,
+        setFrequency: Q,
+        setSecondDay: Y,
+        transaction: P
+      }),
+      detailActionContent: n.onboarding_confirm_income,
+      main: /* @__PURE__ */ i(kt, {
+        onSearch: et,
+        onSelected: (t) => {
+          d({
+            step: e.MonthlyIncome,
+            type: "detail"
+          }), k(t);
+        }
+      }),
+      mainActionContent: n.onboarding_confirm_income,
+      primaryText: n.onboarding_add_income_primary,
+      secondaryText: n.onboarding_add_income_secondary
+    },
+    [e.Birthday]: {
+      main: /* @__PURE__ */ i(vt, {
+        selectedDate: f,
+        setSelectedDate: X
+      }),
+      mainActionContent: n.onboarding_next,
+      primaryText: n.onboarding_birthday_primary,
+      secondaryText: n.onboarding_birthday_secondary
+    },
+    [e.CreditScore]: {
+      main: /* @__PURE__ */ i(Rt, {
+        creditScore: l,
+        setCreditScore: J
+      }),
+      mainActionContent: n.onboarding_next,
+      primaryText: n.onboarding_credit_score_primary,
+      secondaryText: n.onboarding_credit_score_secondary
+    }
+  }, F = () => {
+    d(U), O(!1), k(""), q();
+  }, v = async () => {
+    O(!0), await it(y), await G(), await z({
+      ...$,
+      has_completed_finstrong_onboarding: !0
+    }), F();
+  }, ot = () => {
+    if (c.step === e.CreditScore) {
+      v();
+      return;
+    }
+    d({
+      step: c.step + 1,
+      type: "main"
+    });
+  }, rt = () => {
+    const { step: t } = c, o = t + 1;
+    switch (t) {
+      case e.Birthday:
+        f && f !== a.birthday && w({
+          ...a,
+          birthday: f
+        });
+        break;
+      case e.CreditScore:
+        l && l !== a.credit_score && w({
+          ...a,
+          credit_score: l
+        }), v();
+        return;
+      case e.MonthlyIncome:
+        s && y.findIndex(({ guid: m }) => m === s) === -1 && M((m) => [...m, {
+          ...P,
+          firstDay: C,
+          frequency: x,
+          secondDay: A
+        }]);
+        break;
+      case e.ConnectAccounts:
+        if (!u) {
+          B(!0);
+          return;
+        }
+        break;
+      default:
+        break;
+    }
+    o in e && d({
+      step: o,
+      type: "main"
+    });
+  }, at = () => {
+    const { step: t, type: o } = c;
+    if (o === "detail") {
+      d({
+        step: t,
+        type: "main"
+      });
+      return;
+    }
+    if (t === e.Birthday && y.length) {
+      d({
+        step: t - 1,
+        type: "detail"
+      });
+      return;
+    }
+    t > e.ConnectAccounts && d({
+      step: t - 1,
+      type: "main"
+    });
+  }, it = async (t) => {
+    for (const o of t) {
+      const { account_guid: m, amount: p, date: dt, description: mt, feed_description: ut, firstDay: pt, frequency: R, secondDay: lt, merchant_guid: yt, payee: ft, transaction_type: _t } = o, gt = Mt(R, zt(dt)), ht = {
+        account_guid: m,
+        amount: p,
+        created_by: 0,
+        description: ft || mt || ut,
+        merchant_guid: yt,
+        predicted_occurs_on: Jt(gt, { representation: "date" }),
+        recurrence_day: pt,
+        recurrence_type: R,
+        repeating_transaction_type: wt.Income,
+        second_recurrence_day: lt,
+        transaction_type: _t,
+        user_guid: a.guid
+      };
+      await H(ht, o);
+    }
+  }, _ = nt[c.step], h = c.step === e.ConnectAccounts, ct = {
+    fullWidth: !0,
+    ...h && !u && { startIcon: /* @__PURE__ */ i(Wt, {}) }
+  }, st = !h || h && !u;
+  return /* @__PURE__ */ g(r.Fragment, { children: [/* @__PURE__ */ i(Dt, {
+    footerStyles: {
+      borderTop: 1,
+      borderColor: "divider",
+      px: 24,
+      py: 16
+    },
+    hasSecondaryAction: !h,
+    isOpen: N,
+    isPrimaryDisabled: !Z,
+    onClose: F,
+    onSecondaryAction: at,
+    primaryButtonProps: ct,
+    primaryText: _?.mainActionContent,
+    secondaryColor: "primary",
+    secondaryText: n.onboarding_back,
+    title: n.title,
+    ...!T && { onPrimaryAction: rt },
+    children: /* @__PURE__ */ g(D, {
+      sx: {
+        bgcolor: "background.default",
+        height: "100%"
+      },
+      children: [T && /* @__PURE__ */ g(D, {
+        sx: {
+          alignItems: "center",
+          gap: 24,
+          position: "relative",
+          px: 16,
+          top: 126
+        },
+        children: [
+          /* @__PURE__ */ i("img", {
+            alt: "",
+            src: "https://content.moneydesktop.com/storage/MD_Assets/serenity/loading_animation_final.gif",
+            style: {
+              minHeight: 100,
+              width: 211
+            }
+          }),
+          /* @__PURE__ */ i(Ut, { children: n.onboarding_calculate_primary }),
+          /* @__PURE__ */ i(Nt, {
+            sx: { textAlign: "center" },
+            variant: "subtitle1",
+            children: n.onboarding_calculate_secondary
+          })
+        ]
+      }), _ && !T && /* @__PURE__ */ g(r.Fragment, { children: [
+        /* @__PURE__ */ i(Lt, {
+          completeCopy: n.complete,
+          primaryText: _.primaryText,
+          secondaryText: _.secondaryText,
+          value: tt
+        }),
+        c.type === "main" && /* @__PURE__ */ g(jt, {
+          sx: { bgcolor: "background.default" },
+          children: [_.main, st && /* @__PURE__ */ i(D, {
+            sx: {
+              alignItems: "center",
+              px: 24,
+              py: 12
+            },
+            children: /* @__PURE__ */ i(Ht, {
+              fullWidth: !0,
+              onClick: ot,
+              children: n.onboarding_do_it_later
+            })
+          })]
+        }),
+        c.type === "detail" && _.detail
+      ] })]
+    })
+  }), /* @__PURE__ */ i(Ot, {
+    onClose: () => B(!1),
+    showConnectWidget: V,
+    title: n.connect_more_accounts_button
+  })] });
+}, Ae = Et(Kt);
+export {
+  Ae as default
+};
+
+//# sourceMappingURL=OnboardingStepsDrawer.es.js.map

package/dist/finstrong/components/onboarding/OnboardingStepsDrawer.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OnboardingStepsDrawer.es.js","names":[],"sources":["../../../../src/finstrong/components/onboarding/OnboardingStepsDrawer.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport { endOfMonth } from 'date-fns/endOfMonth'\nimport { formatISO } from 'date-fns/formatISO'\nimport { fromUnixTime } from 'date-fns/fromUnixTime'\nimport { startOfMonth } from 'date-fns/startOfMonth'\nimport { startOfToday } from 'date-fns/startOfToday'\nimport { subDays } from 'date-fns/subDays'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Stack from '@mui/material/Stack'\n\nimport { H2, P } from '@mxenabled/mxui'\nimport { Add } from '@mxenabled/mx-icons'\n\nimport AccountsListCompact from '../../../accounts/components/AccountsListCompact'\nimport {\n  ConnectDrawer,\n  Drawer,\n  useAccountStore,\n  useFinstrongStore,\n  useGlobalCopyStore,\n  useRecurringTransactionsStore,\n  useTransactionStore,\n  useUserStore,\n} from '../../../common'\nimport {\n  Frequency,\n  type RepeatingTransaction,\n  RepeatingType,\n  type Transaction,\n} from '../../../core'\nimport { OnboardingSteps } from '../../../core/types/Finstrong'\nimport { SelectTransaction } from '../../../recurringtransactions'\nimport { getNextPaymentDate } from '../../../core/utils/RecurringTransactionsUtil'\nimport { incomeFilter, incomeFilterSearch } from '../../../transactions/utils/Filters'\n\nimport { CALCULATING_ANIMATION_URL } from '../../constants'\n\nimport OnboardingAddMonthlyIncome from './OnboardingAddMonthlyIncome'\nimport OnboardingBirthday from './OnboardingBirthday'\nimport OnboardingCreditScore from './OnboardingCreditScore'\nimport OnboardingStepsHeader from './OnboardingStepsHeader'\n\ninterface IncomeTransaction extends Transaction {\n  firstDay: number\n  frequency: Frequency\n  secondDay: number\n}\n\ninterface OnboardingStepsDrawerProps {\n  isOpen: boolean\n  onClose: () => void\n}\n\ninterface Steps {\n  detail?: React.ReactNode\n  detailActionContent?: string\n  main: React.ReactNode\n  mainActionContent: string\n  primaryText: string\n  secondaryText: string\n}\n\ntype StepType = 'main' | 'detail'\nexport interface StepState {\n  step: OnboardingSteps\n  type: StepType\n}\n\nconst INITIAL_STEP_STATE: StepState = {\n  step: OnboardingSteps.ConnectAccounts,\n  type: 'main',\n}\n\nconst OnboardingStepsDrawer = ({ isOpen, onClose }: OnboardingStepsDrawerProps) => {\n  const { visibleAccounts: accounts } = useAccountStore()\n  const { calculateHealthScore } = useFinstrongStore()\n  const { finstrong: copy } = useGlobalCopyStore()\n  const { addRepeatingTransaction, setDateRange } = useRecurringTransactionsStore()\n  const { filter, setFilter, transactions } = useTransactionStore()\n  const { user, userProfile, updateUser, updateUserProfile } = useUserStore()\n\n  const [creditScore, setCreditScore] = React.useState<number>(user.credit_score || 0)\n  const [currentStep, setCurrentStep] = React.useState<{ step: OnboardingSteps; type: StepType }>(\n    INITIAL_STEP_STATE,\n  )\n  const [firstDay, setFirstDay] = React.useState(1)\n  const [frequency, setFrequency] = React.useState(Frequency.EveryMonth)\n  const [incomeTransactions, setIncomeTransactions] = React.useState<IncomeTransaction[]>([])\n  const [isComplete, setIsComplete] = React.useState(false)\n  const [isConnectDrawerOpen, setIsConnectDrawerOpen] = React.useState(false)\n  const [selectedDate, setSelectedDate] = React.useState<number | null | undefined>(user.birthday)\n  const [secondDay, setSecondDay] = React.useState(15)\n  const [transactionGuid, setTransactionGuid] = React.useState('')\n\n  React.useEffect(() => {\n    setDateRange({ start: startOfMonth(startOfToday()), end: endOfMonth(startOfToday()) })\n  }, [])\n\n  React.useEffect(() => {\n    setFilter({\n      accounts: accounts.map((account) => account.guid),\n      dateRange: {\n        start: subDays(new Date(), 90),\n        end: new Date(),\n      },\n      custom: incomeFilter,\n    })\n  }, [accounts])\n\n  const transaction = React.useMemo(\n    () => transactions.find((t) => t.guid === transactionGuid),\n    [transactionGuid, transactions],\n  )\n\n  const isPrimaryActionEnabled = React.useMemo(() => {\n    const isValid: Partial<Record<OnboardingSteps, boolean>> = {\n      [OnboardingSteps.ConnectAccounts]: true,\n      [OnboardingSteps.MonthlyIncome]: !!transactionGuid,\n      [OnboardingSteps.Birthday]: !!user.birthday || !!selectedDate,\n      [OnboardingSteps.CreditScore]: !!user.credit_score || !!creditScore,\n    }\n\n    return isValid[currentStep.step]\n  }, [creditScore, currentStep, selectedDate, transactionGuid, user])\n\n  const hasAccounts = accounts.length > 0\n  const progressValue = React.useMemo(() => {\n    const { step } = currentStep\n\n    let value = 0\n\n    if (step >= OnboardingSteps.MonthlyIncome && hasAccounts) value++\n    if (step >= OnboardingSteps.Birthday && !!incomeTransactions.length) value++\n    if (step >= OnboardingSteps.CreditScore && (user.birthday || user.credit_score)) value++\n\n    return value\n  }, [currentStep.step, hasAccounts, incomeTransactions.length, user.birthday, user.credit_score])\n\n  const handleSelectTransaction = (searchValue: string) => {\n    setFilter({\n      ...filter,\n      custom: (transaction: Transaction) => {\n        if (searchValue) return incomeFilterSearch(transaction, searchValue)\n\n        return incomeFilter(transaction)\n      },\n    })\n  }\n\n  const steps: Partial<Record<OnboardingSteps, Steps>> = {\n    [OnboardingSteps.ConnectAccounts]: {\n      main: hasAccounts ? <AccountsListCompact shouldShowBalance={false} /> : null,\n      mainActionContent: hasAccounts ? copy.onboarding_next : copy.onboarding_add_accounts,\n      primaryText: copy.connect_your_accounts,\n      secondaryText: copy.onboarding_connect_your_accounts_secondary,\n    },\n    [OnboardingSteps.MonthlyIncome]: {\n      detail: (\n        <OnboardingAddMonthlyIncome\n          firstDay={firstDay}\n          frequency={frequency}\n          incomeTransactions={incomeTransactions}\n          secondDay={secondDay}\n          setCurrentStep={(step) => {\n            setCurrentStep(step)\n            setIncomeTransactions((prev) => {\n              const exists = prev.some((t) => t.guid === transactionGuid)\n              if (exists) return prev.filter((t) => t.guid !== transactionGuid)\n\n              const newTransaction = transactions.find((t) => t.guid === transactionGuid)\n              return newTransaction\n                ? [...prev, { ...newTransaction, firstDay, frequency, secondDay }]\n                : prev\n            })\n          }}\n          setFirstDay={setFirstDay}\n          setFrequency={setFrequency}\n          setSecondDay={setSecondDay}\n          transaction={transaction!}\n        />\n      ),\n      detailActionContent: copy.onboarding_confirm_income,\n      main: (\n        <SelectTransaction\n          onSearch={handleSelectTransaction}\n          onSelected={(guid) => {\n            setCurrentStep({ step: OnboardingSteps.MonthlyIncome, type: 'detail' })\n            setTransactionGuid(guid)\n          }}\n        />\n      ),\n      mainActionContent: copy.onboarding_confirm_income,\n      primaryText: copy.onboarding_add_income_primary,\n      secondaryText: copy.onboarding_add_income_secondary,\n    },\n    [OnboardingSteps.Birthday]: {\n      main: <OnboardingBirthday selectedDate={selectedDate} setSelectedDate={setSelectedDate} />,\n      mainActionContent: copy.onboarding_next,\n      primaryText: copy.onboarding_birthday_primary,\n      secondaryText: copy.onboarding_birthday_secondary,\n    },\n    [OnboardingSteps.CreditScore]: {\n      main: <OnboardingCreditScore creditScore={creditScore} setCreditScore={setCreditScore} />,\n      mainActionContent: copy.onboarding_next,\n      primaryText: copy.onboarding_credit_score_primary,\n      secondaryText: copy.onboarding_credit_score_secondary,\n    },\n  }\n\n  const handleClose = () => {\n    setCurrentStep(INITIAL_STEP_STATE)\n    setIsComplete(false)\n    setTransactionGuid('')\n\n    onClose()\n  }\n\n  const handleComplete = async () => {\n    setIsComplete(true)\n\n    await addRecurringIncome(incomeTransactions)\n    await calculateHealthScore()\n    await updateUserProfile({ ...userProfile, has_completed_finstrong_onboarding: true })\n\n    handleClose()\n  }\n\n  const handleDoItLater = () => {\n    if (currentStep.step === OnboardingSteps.CreditScore) {\n      handleComplete()\n      return\n    }\n\n    setCurrentStep({ step: currentStep.step + 1, type: 'main' })\n  }\n\n  const handlePrimaryAction = () => {\n    const { step } = currentStep\n    const nextStep = step + 1\n\n    switch (step) {\n      case OnboardingSteps.Birthday:\n        if (selectedDate && selectedDate !== user.birthday) {\n          updateUser({ ...user, birthday: selectedDate })\n        }\n        break\n\n      case OnboardingSteps.CreditScore:\n        if (creditScore && creditScore !== user.credit_score) {\n          updateUser({ ...user, credit_score: creditScore })\n        }\n        handleComplete()\n        return\n\n      case OnboardingSteps.MonthlyIncome:\n        if (\n          transactionGuid &&\n          incomeTransactions.findIndex(({ guid }) => guid === transactionGuid) === -1\n        ) {\n          setIncomeTransactions((prev) => [\n            ...prev,\n            { ...transaction!, firstDay, frequency, secondDay },\n          ])\n        }\n        break\n\n      case OnboardingSteps.ConnectAccounts:\n        if (!hasAccounts) {\n          setIsConnectDrawerOpen(true)\n          return\n        }\n        break\n\n      default:\n        break\n    }\n\n    if (nextStep in OnboardingSteps) setCurrentStep({ step: nextStep, type: 'main' })\n  }\n\n  const handleSecondaryAction = () => {\n    const { step, type } = currentStep\n\n    if (type === 'detail') {\n      setCurrentStep({ step, type: 'main' })\n      return\n    }\n\n    if (step === OnboardingSteps.Birthday && incomeTransactions.length) {\n      setCurrentStep({ step: step - 1, type: 'detail' })\n      return\n    }\n\n    if (step > OnboardingSteps.ConnectAccounts) setCurrentStep({ step: step - 1, type: 'main' })\n  }\n\n  const addRecurringIncome = async (transactions: IncomeTransaction[]) => {\n    for (const t of transactions) {\n      const {\n        account_guid,\n        amount,\n        date,\n        description,\n        feed_description,\n        firstDay,\n        frequency,\n        secondDay,\n        merchant_guid,\n        payee,\n        transaction_type,\n      } = t\n\n      const nextDate = getNextPaymentDate(frequency, fromUnixTime(date))\n\n      const repeatingTransaction = {\n        account_guid,\n        amount,\n        created_by: 0,\n        description: payee || description || feed_description,\n        merchant_guid,\n        predicted_occurs_on: formatISO(nextDate, { representation: 'date' }),\n        recurrence_day: firstDay,\n        recurrence_type: frequency,\n        repeating_transaction_type: RepeatingType.Income,\n        second_recurrence_day: secondDay,\n        transaction_type,\n        user_guid: user.guid,\n      } as RepeatingTransaction\n\n      await addRepeatingTransaction(repeatingTransaction, t)\n    }\n  }\n\n  const currentStepData = steps[currentStep.step]\n  const isConnectAccountsStep = currentStep.step === OnboardingSteps.ConnectAccounts\n  const primaryButtonProps = {\n    fullWidth: true,\n    ...(isConnectAccountsStep && !hasAccounts && { startIcon: <Add /> }),\n  }\n  const showDoItLaterButton = !isConnectAccountsStep || (isConnectAccountsStep && !hasAccounts)\n\n  return (\n    <React.Fragment>\n      <Drawer\n        footerStyles={{ borderTop: 1, borderColor: 'divider', px: 24, py: 16 }}\n        hasSecondaryAction={!isConnectAccountsStep}\n        isOpen={isOpen}\n        isPrimaryDisabled={!isPrimaryActionEnabled}\n        onClose={handleClose}\n        onSecondaryAction={handleSecondaryAction}\n        primaryButtonProps={primaryButtonProps}\n        primaryText={currentStepData?.mainActionContent}\n        secondaryColor=\"primary\"\n        secondaryText={copy.onboarding_back}\n        title={copy.title}\n        {...(!isComplete && { onPrimaryAction: handlePrimaryAction })}\n      >\n        <Stack sx={{ bgcolor: 'background.default', height: '100%' }}>\n          {isComplete && (\n            <Stack sx={{ alignItems: 'center', gap: 24, position: 'relative', px: 16, top: 126 }}>\n              <img alt=\"\" src={CALCULATING_ANIMATION_URL} style={{ minHeight: 100, width: 211 }} />\n              <H2>{copy.onboarding_calculate_primary}</H2>\n              <P sx={{ textAlign: 'center' }} variant=\"subtitle1\">\n                {copy.onboarding_calculate_secondary}\n              </P>\n            </Stack>\n          )}\n          {currentStepData && !isComplete && (\n            <React.Fragment>\n              <OnboardingStepsHeader\n                completeCopy={copy.complete}\n                primaryText={currentStepData.primaryText}\n                secondaryText={currentStepData.secondaryText}\n                value={progressValue}\n              />\n              {currentStep.type === 'main' && (\n                <Box sx={{ bgcolor: 'background.default' }}>\n                  {currentStepData.main}\n                  {showDoItLaterButton && (\n                    <Stack sx={{ alignItems: 'center', px: 24, py: 12 }}>\n                      <Button fullWidth={true} onClick={handleDoItLater}>\n                        {copy.onboarding_do_it_later}\n                      </Button>\n                    </Stack>\n                  )}\n                </Box>\n              )}\n              {currentStep.type === 'detail' && currentStepData.detail}\n            </React.Fragment>\n          )}\n        </Stack>\n      </Drawer>\n\n      <ConnectDrawer\n        onClose={() => setIsConnectDrawerOpen(false)}\n        showConnectWidget={isConnectDrawerOpen}\n        title={copy.connect_more_accounts_button}\n      />\n    </React.Fragment>\n  )\n}\n\nexport default observer(OnboardingStepsDrawer)\n"],"mappings":"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"}

package/dist/finstrong/components/onboarding/OnboardingStepsHeader.es.js

@@ -0,0 +1,25 @@
+import p from "../ProfileProgressBar.es.js";
+import e from "@mui/material/Stack";
+import { H3 as m, P as n } from "@mxenabled/mxui";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+var x = ({ completeCopy: o, primaryText: t, secondaryText: a, value: s }) => /* @__PURE__ */ i(e, {
+  sx: {
+    gap: 20,
+    p: 24
+  },
+  children: [/* @__PURE__ */ i(e, {
+    sx: { gap: 8 },
+    children: [/* @__PURE__ */ r(m, { children: t }), /* @__PURE__ */ r(n, {
+      variant: "subtitle1",
+      children: a
+    })]
+  }), /* @__PURE__ */ r(p, {
+    completeCopy: o,
+    value: s
+  })]
+});
+export {
+  x as default
+};
+
+//# sourceMappingURL=OnboardingStepsHeader.es.js.map

package/dist/finstrong/components/onboarding/OnboardingStepsHeader.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OnboardingStepsHeader.es.js","names":[],"sources":["../../../../src/finstrong/components/onboarding/OnboardingStepsHeader.tsx"],"sourcesContent":["import Stack from '@mui/material/Stack'\n\nimport { H3, P } from '@mxenabled/mxui'\n\nimport ProfileProgressBar from '../ProfileProgressBar'\n\ninterface OnboardingStepsHeaderProps {\n  completeCopy: string\n  primaryText: string\n  secondaryText: string\n  value: number\n}\n\nconst OnboardingStepsHeader = ({\n  completeCopy,\n  primaryText,\n  secondaryText,\n  value,\n}: OnboardingStepsHeaderProps) => {\n  return (\n    <Stack sx={{ gap: 20, p: 24 }}>\n      <Stack sx={{ gap: 8 }}>\n        <H3>{primaryText}</H3>\n        <P variant=\"subtitle1\">{secondaryText}</P>\n      </Stack>\n      <ProfileProgressBar completeCopy={completeCopy} value={value} />\n    </Stack>\n  )\n}\n\nexport default OnboardingStepsHeader\n"],"mappings":";;;;AAaA,IAAM,IAAA,CAAyB,EAC7B,cAAA,GACA,aAAA,GACA,eAAA,GACA,OAAA,EAAA,MAGE,gBAAA,EAAC,GAAD;AAAA,EAAO,IAAI;AAAA,IAAE,KAAK;AAAA,IAAI,GAAG;AAAA,EAAG;AAAA,YAA5B,CACE,gBAAA,EAAC,GAAD;AAAA,IAAO,IAAI,EAAE,KAAK,EAAE;AAAA,cAApB,CACE,gBAAA,EAAC,GAAD,EAAA,UAAK,EAAgB,CAAA,GACrB,gBAAA,EAAC,GAAD;AAAA,MAAG,SAAQ;AAAA,gBAAa;AAAA,IAAiB,CAAA,CACpC;AAAA,MACP,gBAAA,EAAC,GAAD;AAAA,IAAkC,cAAA;AAAA,IAAqB,OAAA;AAAA,EAAQ,CAAA,CAC1D"}

package/dist/finstrong/components/paybillsontime/PayBillsOnTimeDrawerComponent.es.js

@@ -0,0 +1,69 @@
+import { DATE_FORMATS_INTL as p, formatDate as d } from "../../../core/constants/DateFormats.es.js";
+import { useFinstrongStore as f, useGlobalCopyStore as _ } from "../../../common/context/hooks.es.js";
+import u from "../../../common/components/Loader.es.js";
+import g from "../shared/Transactions.es.js";
+import n from "react";
+import { observer as b } from "mobx-react-lite";
+import x from "@mui/material/Stack";
+import { H3 as i, P as y } from "@mxenabled/mxui";
+import { Cancel as h, CheckCircle as C } from "@mxenabled/mx-icons";
+import { Fragment as T, jsx as e, jsxs as t } from "react/jsx-runtime";
+import a from "@mui/material/Card";
+var k = () => {
+  const [s, l] = n.useState(!0), { finstrong: { key_indicators_spend: { pay_bills_on_time_drawer: r } } } = _(), { getSpendingFeeTransactions: m, allTransactions: o } = f();
+  return n.useEffect(() => {
+    m().finally(() => l(!1));
+  }, []), s ? /* @__PURE__ */ e(u, {}) : /* @__PURE__ */ e(T, { children: o.spendingFee.length === 0 ? /* @__PURE__ */ t(a, {
+    sx: {
+      backgroundColor: "background.paper",
+      pb: 48,
+      pt: 32,
+      px: 24,
+      textAlign: "center",
+      width: "100%"
+    },
+    children: [/* @__PURE__ */ e(C, {
+      filled: !0,
+      size: 48,
+      sx: { color: "success.main" }
+    }), /* @__PURE__ */ t(x, {
+      sx: {
+        alignItems: "center",
+        gap: 4,
+        pt: 24
+      },
+      children: [/* @__PURE__ */ e(i, { children: r.pay_bills_on_time_zero_fees_title }), /* @__PURE__ */ e(y, {
+        variant: "subtitle1",
+        children: r.pay_bills_on_time_zero_fees_description
+      })]
+    })]
+  }) : /* @__PURE__ */ t(a, {
+    sx: {
+      p: 16,
+      width: "100%",
+      backgroundColor: "background.paper"
+    },
+    children: [/* @__PURE__ */ e(i, {
+      sx: {
+        textAlign: "left",
+        pb: 16
+      },
+      children: r.pay_bills_on_time_sticky_fee_count
+    }), /* @__PURE__ */ e(g, {
+      amountColor: "text.primary",
+      amountPosition: "flex-start",
+      formatDate: (c) => d(/* @__PURE__ */ new Date(c * 1e3), p.MONTH_DAY),
+      secondaryIcon: /* @__PURE__ */ e(h, {
+        color: "error",
+        filled: !0,
+        size: 12
+      }),
+      transactions: o.spendingFee
+    })]
+  }) });
+}, j = b(k);
+export {
+  j as default
+};
+
+//# sourceMappingURL=PayBillsOnTimeDrawerComponent.es.js.map

package/dist/finstrong/components/paybillsontime/PayBillsOnTimeDrawerComponent.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PayBillsOnTimeDrawerComponent.es.js","names":[],"sources":["../../../../src/finstrong/components/paybillsontime/PayBillsOnTimeDrawerComponent.tsx"],"sourcesContent":["import React from 'react'\nimport { observer } from 'mobx-react-lite'\n\nimport Card from '@mui/material/Card'\nimport Stack from '@mui/material/Stack'\n\nimport { Cancel, CheckCircle } from '@mxenabled/mx-icons'\nimport { H3, P } from '@mxenabled/mxui'\n\nimport { Loader, useFinstrongStore, useGlobalCopyStore } from '../../../common'\nimport { DATE_FORMATS_INTL, formatDate } from '../../../core/constants'\n\nimport Transactions from '../shared/Transactions'\n\nconst PayBillsOnTimeDrawerComponent = () => {\n  const [isLoading, setIsLoading] = React.useState(true)\n\n  const {\n    finstrong: {\n      key_indicators_spend: { pay_bills_on_time_drawer: copy },\n    },\n  } = useGlobalCopyStore()\n\n  const { getSpendingFeeTransactions, allTransactions } = useFinstrongStore()\n\n  React.useEffect(() => {\n    getSpendingFeeTransactions().finally(() => setIsLoading(false))\n  }, [])\n\n  if (isLoading) {\n    return <Loader />\n  }\n\n  return (\n    <>\n      {allTransactions.spendingFee.length === 0 ? (\n        <Card\n          sx={{\n            backgroundColor: 'background.paper',\n            pb: 48,\n            pt: 32,\n            px: 24,\n            textAlign: 'center',\n            width: '100%',\n          }}\n        >\n          <CheckCircle filled={true} size={48} sx={{ color: 'success.main' }} />\n\n          <Stack sx={{ alignItems: 'center', gap: 4, pt: 24 }}>\n            <H3>{copy.pay_bills_on_time_zero_fees_title}</H3>\n            <P variant=\"subtitle1\">{copy.pay_bills_on_time_zero_fees_description}</P>\n          </Stack>\n        </Card>\n      ) : (\n        <Card\n          sx={{\n            p: 16,\n            width: '100%',\n            backgroundColor: 'background.paper',\n          }}\n        >\n          <H3 sx={{ textAlign: 'left', pb: 16 }}>{copy.pay_bills_on_time_sticky_fee_count}</H3>\n          <Transactions\n            amountColor=\"text.primary\"\n            amountPosition=\"flex-start\"\n            formatDate={(txnDate) =>\n              formatDate(new Date(txnDate * 1000), DATE_FORMATS_INTL.MONTH_DAY)\n            }\n            secondaryIcon={<Cancel color=\"error\" filled={true} size={12} />}\n            transactions={allTransactions.spendingFee}\n          />\n        </Card>\n      )}\n    </>\n  )\n}\nexport default observer(PayBillsOnTimeDrawerComponent)\n"],"mappings":";;;;;;;;;;;AAcA,IAAM,IAAA,MAAsC;AAC1C,QAAM,CAAC,GAAW,CAAA,IAAgB,EAAM,SAAS,EAAI,GAE/C,EACJ,WAAW,EACT,sBAAsB,EAAE,0BAA0B,EAAA,EAAA,EAAA,IAElD,EAAmB,GAEjB,EAAE,4BAAA,GAA4B,iBAAA,EAAA,IAAoB,EAAkB;AAM1E,SAJA,EAAM,UAAA,MAAgB;AACpB,IAAA,EAA2B,EAAE,QAAA,MAAc,EAAa,EAAK,CAAC;AAAA,EAChE,GAAG,CAAC,CAAC,GAED,IACK,gBAAA,EAAC,GAAD,CAAS,CAAA,IAIhB,gBAAA,EAAA,GAAA,EAAA,UACG,EAAgB,YAAY,WAAW,IACtC,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,iBAAiB;AAAA,MACjB,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,WAAW;AAAA,MACX,OAAO;AAAA,IACT;AAAA,cARF,CAUE,gBAAA,EAAC,GAAD;AAAA,MAAa,QAAQ;AAAA,MAAM,MAAM;AAAA,MAAI,IAAI,EAAE,OAAO,eAAe;AAAA,IAAI,CAAA,GAErE,gBAAA,EAAC,GAAD;AAAA,MAAO,IAAI;AAAA,QAAE,YAAY;AAAA,QAAU,KAAK;AAAA,QAAG,IAAI;AAAA,MAAG;AAAA,gBAAlD,CACE,gBAAA,EAAC,GAAD,EAAA,UAAK,EAAK,kCAAsC,CAAA,GAChD,gBAAA,EAAC,GAAD;AAAA,QAAG,SAAQ;AAAA,kBAAa,EAAK;AAAA,MAA2C,CAAA,CACnE;AAAA,MACH;AAAA,OAEN,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,GAAG;AAAA,MACH,OAAO;AAAA,MACP,iBAAiB;AAAA,IACnB;AAAA,cALF,CAOE,gBAAA,EAAC,GAAD;AAAA,MAAI,IAAI;AAAA,QAAE,WAAW;AAAA,QAAQ,IAAI;AAAA,MAAG;AAAA,gBAAI,EAAK;AAAA,IAAuC,CAAA,GACpF,gBAAA,EAAC,GAAD;AAAA,MACE,aAAY;AAAA,MACZ,gBAAe;AAAA,MACf,YAAA,CAAa,MACX,EAAW,oBAAI,KAAK,IAAU,GAAI,GAAG,EAAkB,SAAS;AAAA,MAElE,eAAe,gBAAA,EAAC,GAAD;AAAA,QAAQ,OAAM;AAAA,QAAQ,QAAQ;AAAA,QAAM,MAAM;AAAA,MAAK,CAAA;AAAA,MAC9D,cAAc,EAAgB;AAAA,IAC/B,CAAA,CACG;AAAA,KAER,CAAA;AAEN,GACA,IAAe,EAAS,CAA6B"}

package/dist/finstrong/components/paybillsontime/PayBillsOnTimeStickyComponent.es.js

@@ -0,0 +1,38 @@
+import { useFinstrongStore as c, useGlobalCopyStore as p } from "../../../common/context/hooks.es.js";
+import { getSpendingFeeCountState as _ } from "../../util/finstrongUtils.es.js";
+import d from "../StatusChip.es.js";
+import { observer as l } from "mobx-react-lite";
+import n from "@mui/material/Stack";
+import { H2 as m, P as y } from "@mxenabled/mxui";
+import { jsx as r, jsxs as o } from "react/jsx-runtime";
+var f = () => {
+  const { healthScore: t } = c(), { finstrong: i } = p(), { key_indicators_spend: s } = i, { pay_bills_on_time_drawer: e } = s, a = _(t.spending_fee_transaction_count);
+  return /* @__PURE__ */ o(n, {
+    sx: {
+      p: 24,
+      backgroundColor: "background.paper",
+      borderBottom: "1px solid",
+      borderColor: "divider"
+    },
+    children: [/* @__PURE__ */ r(y, {
+      variant: "body2",
+      children: e.pay_bills_on_time_sticky_description
+    }), /* @__PURE__ */ o(n, {
+      direction: "row",
+      sx: {
+        alignItems: "center",
+        justifyContent: "space-between"
+      },
+      children: [/* @__PURE__ */ o(m, { children: [
+        t.spending_fee_transaction_count,
+        " ",
+        e.pay_bills_on_time_sticky_fee_count
+      ] }), /* @__PURE__ */ r(d, { status: a })]
+    })]
+  });
+}, x = l(f);
+export {
+  x as default
+};
+
+//# sourceMappingURL=PayBillsOnTimeStickyComponent.es.js.map

package/dist/finstrong/components/paybillsontime/PayBillsOnTimeStickyComponent.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PayBillsOnTimeStickyComponent.es.js","names":[],"sources":["../../../../src/finstrong/components/paybillsontime/PayBillsOnTimeStickyComponent.tsx"],"sourcesContent":["import { observer } from 'mobx-react-lite'\n\nimport Stack from '@mui/material/Stack'\n\nimport { H2, P } from '@mxenabled/mxui'\n\nimport { useGlobalCopyStore, useFinstrongStore } from '../../../common'\n\nimport { getSpendingFeeCountState } from '../../util/finstrongUtils'\n\nimport StatusChip from '../StatusChip'\n\nconst PayBillsOnTimeStickyComponent = () => {\n  const { healthScore } = useFinstrongStore()\n  const { finstrong: copyContent } = useGlobalCopyStore()\n\n  const { key_indicators_spend: spendCopy } = copyContent\n  const { pay_bills_on_time_drawer: copy } = spendCopy\n\n  const state = getSpendingFeeCountState(healthScore.spending_fee_transaction_count)\n\n  return (\n    <Stack\n      sx={{\n        p: 24,\n        backgroundColor: 'background.paper',\n        borderBottom: '1px solid',\n        borderColor: 'divider',\n      }}\n    >\n      <P variant=\"body2\">{copy.pay_bills_on_time_sticky_description}</P>\n      <Stack direction=\"row\" sx={{ alignItems: 'center', justifyContent: 'space-between' }}>\n        <H2>\n          {healthScore.spending_fee_transaction_count} {copy.pay_bills_on_time_sticky_fee_count}\n        </H2>\n        <StatusChip status={state} />\n      </Stack>\n    </Stack>\n  )\n}\nexport default observer(PayBillsOnTimeStickyComponent)\n"],"mappings":";;;;;;;AAYA,IAAM,IAAA,MAAsC;AAC1C,QAAM,EAAE,aAAA,EAAA,IAAgB,EAAkB,GACpC,EAAE,WAAW,EAAA,IAAgB,EAAmB,GAEhD,EAAE,sBAAsB,EAAA,IAAc,GACtC,EAAE,0BAA0B,EAAA,IAAS,GAErC,IAAQ,EAAyB,EAAY,8BAA8B;AAEjF,SACE,gBAAA,EAAC,GAAD;AAAA,IACE,IAAI;AAAA,MACF,GAAG;AAAA,MACH,iBAAiB;AAAA,MACjB,cAAc;AAAA,MACd,aAAa;AAAA,IACf;AAAA,cANF,CAQE,gBAAA,EAAC,GAAD;AAAA,MAAG,SAAQ;AAAA,gBAAS,EAAK;AAAA,IAAwC,CAAA,GACjE,gBAAA,EAAC,GAAD;AAAA,MAAO,WAAU;AAAA,MAAM,IAAI;AAAA,QAAE,YAAY;AAAA,QAAU,gBAAgB;AAAA,MAAgB;AAAA,gBAAnF,CACE,gBAAA,EAAC,GAAD,EAAA,UAAA;AAAA,QACG,EAAY;AAAA,QAA+B;AAAA,QAAE,EAAK;AAAA,MACjD,EAAA,CAAA,GACJ,gBAAA,EAAC,GAAD,EAAY,QAAQ,EAAQ,CAAA,CACvB;AAAA,MACF;AAAA;AAEX,GACA,IAAe,EAAS,CAA6B"}

package/dist/finstrong/components/shared/Accounts.es.js

@@ -0,0 +1,102 @@
+import I from "../../../common/utils/AccountDisplayName.es.js";
+import { useAppConfig as D, useGlobalCopyStore as h, useGlobalUiStore as B } from "../../../common/context/hooks.es.js";
+import L from "../../../common/components/drawer/Drawer.es.js";
+import { formatCurrency as $ } from "../../../core/utils/NumberFormatting.es.js";
+import k from "../../../common/components/ConnectDrawer.es.js";
+import { getAccountBalanceDetails as O } from "../../../accounts/utils/AccountFields.es.js";
+import S from "../../../accounts/components/AccountsListCompact.es.js";
+import r from "react";
+import { observer as G } from "mobx-react-lite";
+import { InstitutionLogo as M, P as R, Text as _ } from "@mxenabled/mxui";
+import y from "@mui/material/Button";
+import { ChevronRight as T } from "@mxenabled/mx-icons";
+import { Fragment as s, jsx as t, jsxs as o } from "react/jsx-runtime";
+import { useTheme as j } from "@mui/material/styles";
+import a from "@mui/material/Box";
+import z from "@mui/material/Divider";
+import F from "@mui/material/ListItem";
+import N from "@mui/material/ListItemText";
+import P from "@mui/material/ListItemAvatar";
+var W = ({ loadAccounts: i, loadMoreLabel: b }) => {
+  const g = j(), { config: m } = D(), { connect: v, finstrong: l } = h(), { accounts: x } = h(), { selectedAccounts: u } = B(), [C, p] = r.useState(!1), [A, d] = r.useState(!1), n = r.useMemo(() => u.filter((e) => i ? i.includes(e.account_type) : !0), [u, i]), f = r.useMemo(() => n.slice(0, 3), [n]), w = (e) => {
+    const { firstValue: c } = O(e, x, m.display_available_balance_in_accounts);
+    return c;
+  };
+  return n.length >= 1 ? /* @__PURE__ */ o(s, { children: [/* @__PURE__ */ t(a, {
+    sx: {
+      border: `1px solid ${g.palette.divider}`,
+      borderRadius: 2
+    },
+    children: f.map((e, c) => /* @__PURE__ */ o(r.Fragment, { children: [/* @__PURE__ */ o(F, {
+      sx: { px: 24 },
+      children: [
+        /* @__PURE__ */ t(P, { children: /* @__PURE__ */ t(M, {
+          alt: "MX",
+          institutionGuid: e.institution_guid ?? ""
+        }) }),
+        /* @__PURE__ */ t(N, {
+          primary: `${I(e, { allowNickname: m?.show_account_nicknames_in_master })}
+              ${e.account_number ? ` *${e.account_number}` : ""}`,
+          slotProps: { primary: {
+            noWrap: !0,
+            pr: 4,
+            variant: "body1"
+          } }
+        }),
+        /* @__PURE__ */ t(R, {
+          bold: !0,
+          variant: "body2",
+          children: $(w(e), "0,0.00")
+        })
+      ]
+    }), c < f.length - 1 && /* @__PURE__ */ t(z, { variant: "inset" })] }, e.guid))
+  }), n.length > 3 && /* @__PURE__ */ o(s, { children: [/* @__PURE__ */ t(a, { children: /* @__PURE__ */ t(y, {
+    endIcon: /* @__PURE__ */ t(T, {}),
+    onClick: () => p(!0),
+    size: "small",
+    sx: {
+      my: 0,
+      px: 16,
+      py: 12,
+      width: "100%"
+    },
+    children: /* @__PURE__ */ o(_, {
+      bold: !0,
+      variant: "body1",
+      children: [
+        n.length - 3,
+        " ",
+        b
+      ]
+    })
+  }) }), /* @__PURE__ */ t(L, {
+    isOpen: C,
+    onClose: () => p(!1),
+    title: l.accounts,
+    children: /* @__PURE__ */ t(S, { loadAccounts: i })
+  })] })] }) : /* @__PURE__ */ o(s, { children: [/* @__PURE__ */ t(a, { children: /* @__PURE__ */ t(y, {
+    onClick: () => d(!0),
+    size: "small",
+    sx: {
+      my: 0,
+      px: 16,
+      py: 12,
+      width: "100%"
+    },
+    variant: "contained",
+    children: /* @__PURE__ */ t(_, {
+      bold: !0,
+      variant: "body1",
+      children: l.connect_more_accounts_button
+    })
+  }) }), /* @__PURE__ */ t(k, {
+    onClose: () => d(!1),
+    showConnectWidget: A,
+    title: v.mini_title
+  })] });
+}, at = G(W);
+export {
+  at as default
+};
+
+//# sourceMappingURL=Accounts.es.js.map

package/dist/finstrong/components/shared/Accounts.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accounts.es.js","names":[],"sources":["../../../../src/finstrong/components/shared/Accounts.tsx"],"sourcesContent":["import React from 'react'\n\nimport { observer } from 'mobx-react-lite'\n\nimport Box from '@mui/material/Box'\nimport Button from '@mui/material/Button'\nimport Divider from '@mui/material/Divider'\nimport ListItem from '@mui/material/ListItem'\nimport ListItemAvatar from '@mui/material/ListItemAvatar'\nimport ListItemText from '@mui/material/ListItemText'\n\nimport { InstitutionLogo, P, Text } from '@mxenabled/mxui'\n\nimport { ChevronRight } from '@mxenabled/mx-icons'\n\nimport { useTheme } from '@mui/material/styles'\n\nimport {\n  ConnectDrawer,\n  Drawer,\n  useAppConfig,\n  useGlobalCopyStore,\n  useGlobalUiStore,\n} from '../../../common'\nimport { type Account, type AccountType } from '../../../core'\n\nimport { getAccountDisplayName } from '../../../common/utils/AccountDisplayName'\nimport { getAccountBalanceDetails } from '../../../accounts'\nimport AccountsListCompact from '../../../accounts/components/AccountsListCompact'\nimport { formatCurrency } from '../../../core/utils/NumberFormatting'\n\ninterface AccountsProps {\n  loadAccounts: AccountType[]\n  loadMoreLabel: string\n}\n\nconst Accounts: React.FC<AccountsProps> = ({ loadAccounts, loadMoreLabel }) => {\n  const theme = useTheme()\n  const { config } = useAppConfig()\n  const { connect: connectCopy, finstrong: copy } = useGlobalCopyStore()\n  const { accounts: accountsData } = useGlobalCopyStore()\n  const { selectedAccounts } = useGlobalUiStore()\n  const [isOpen, setIsOpen] = React.useState(false)\n  const [isConnectAccountsOpen, setIsConnectAccountsOpen] = React.useState(false)\n\n  const accounts = React.useMemo(\n    () =>\n      selectedAccounts.filter((account) =>\n        loadAccounts ? loadAccounts.includes(account.account_type) : true,\n      ),\n    [selectedAccounts, loadAccounts],\n  )\n\n  const displayedAccounts = React.useMemo(() => accounts.slice(0, 3), [accounts])\n\n  const getAccountBalance = (account: Account) => {\n    const { firstValue: accountBalance } = getAccountBalanceDetails(\n      account,\n      accountsData,\n      config.display_available_balance_in_accounts,\n    )\n    return accountBalance\n  }\n\n  return accounts.length >= 1 ? (\n    <>\n      <Box sx={{ border: `1px solid ${theme.palette.divider}`, borderRadius: 2 }}>\n        {displayedAccounts.map((account, index) => (\n          <React.Fragment key={account.guid}>\n            <ListItem sx={{ px: 24 }}>\n              <ListItemAvatar>\n                <InstitutionLogo alt=\"MX\" institutionGuid={account.institution_guid ?? ''} />\n              </ListItemAvatar>\n              <ListItemText\n                primary={`${getAccountDisplayName(account, {\n                  allowNickname: config?.show_account_nicknames_in_master,\n                })}\n              ${account.account_number ? ` *${account.account_number}` : ''}`}\n                slotProps={{ primary: { noWrap: true, pr: 4, variant: 'body1' } }}\n              />\n              <P bold={true} variant=\"body2\">\n                {formatCurrency(getAccountBalance(account), '0,0.00')}\n              </P>\n            </ListItem>\n            {index < displayedAccounts.length - 1 && <Divider variant=\"inset\" />}\n          </React.Fragment>\n        ))}\n      </Box>\n      {accounts.length > 3 && (\n        <>\n          <Box>\n            <Button\n              endIcon={<ChevronRight />}\n              onClick={() => setIsOpen(true)}\n              size=\"small\"\n              sx={{ my: 0, px: 16, py: 12, width: '100%' }}\n            >\n              <Text bold={true} variant=\"body1\">\n                {accounts.length - 3} {loadMoreLabel}\n              </Text>\n            </Button>\n          </Box>\n          <Drawer isOpen={isOpen} onClose={() => setIsOpen(false)} title={copy.accounts}>\n            <AccountsListCompact loadAccounts={loadAccounts} />\n          </Drawer>\n        </>\n      )}\n    </>\n  ) : (\n    <>\n      <Box>\n        <Button\n          onClick={() => setIsConnectAccountsOpen(true)}\n          size=\"small\"\n          sx={{ my: 0, px: 16, py: 12, width: '100%' }}\n          variant=\"contained\"\n        >\n          <Text bold={true} variant=\"body1\">\n            {copy.connect_more_accounts_button}\n          </Text>\n        </Button>\n      </Box>\n      <ConnectDrawer\n        onClose={() => setIsConnectAccountsOpen(false)}\n        showConnectWidget={isConnectAccountsOpen}\n        title={connectCopy.mini_title}\n      />\n    </>\n  )\n}\n\nexport default observer(Accounts)\n"],"mappings":"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"}