@layerfi/components 0.1.87 → 0.1.88-alpha

package/dist/cjs/index.cjs

@@ -119,7 +119,7 @@ var import_react16 = require("react");
 var import_react14 = require("react");
 
 // package.json
-var version = "0.1.87";
+var version = "0.1.88-alpha";
 
 // src/models/APIError.ts
 var APIError = class _APIError extends Error {
@@ -341,7 +341,10 @@ var uploadBankTransactionDocument = (baseUrl, accessToken) => ({
 var getBusiness = get(({ businessId }) => `/v1/businesses/${businessId}`);
 
 // src/api/layer/categories.ts
-var getCategories = get(({ businessId }) => `/v1/businesses/${businessId}/categories`);
+var getCategories = get(({ businessId, mode }) => {
+  const parameters = toDefinedSearchParameters({ mode });
+  return `/v1/businesses/${businessId}/categories?${parameters}`;
+});
 
 // src/api/layer/chart_of_accounts.ts
 var getChartOfAccounts = get(
@@ -3214,11 +3217,11 @@ var Loader_default = Loader;
 var import_react22 = require("react");
 
 // src/components/Tooltip/useTooltip.ts
-var import_react20 = __toESM(require("react"));
+var import_react20 = require("react");
 var import_react21 = require("@floating-ui/react");
-var TooltipContext = import_react20.default.createContext(null);
+var TooltipContext = (0, import_react20.createContext)(null);
 var useTooltipContext = () => {
-  const context = import_react20.default.useContext(TooltipContext);
+  const context = (0, import_react20.useContext)(TooltipContext);
   if (context == null) {
     throw new Error("Tooltip components must be wrapped in <Tooltip />");
   }
@@ -3271,7 +3274,7 @@ var useTooltip = ({
     },
     duration: 300
   });
-  return import_react20.default.useMemo(
+  return (0, import_react20.useMemo)(
     () => __spreadValues(__spreadValues({
       open,
       setOpen,
@@ -5670,7 +5673,8 @@ function LinkedAccountToConfirm({
     /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(VStack, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(Heading2, { level: 3, size: "sm", children: account.external_account_name }),
       /* @__PURE__ */ (0, import_jsx_runtime72.jsxs)(P, { slot: "mask", children: [
-        "\u2022\u2022\u2022 ",
+        "\u2022\u2022\u2022",
+        " ",
         account.mask
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(P, { slot: "institution", children: account.institution.name })
@@ -7669,7 +7673,7 @@ var ActionableList = ({
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "Layer__actionable-list__content", children: [
           /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(Text, { size: "sm" /* sm */, children: x.label }),
-          /*TODO: Replace 'See all categories' with something more generic*/
+          /* TODO: Replace 'See all categories' with something more generic */
           showDescriptions && x.description && x.label !== "See all categories" && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
             Text,
             {
@@ -11462,7 +11466,7 @@ var SkeletonTableLoader = ({
       {
         colSpan: col.colSpan,
         className: "Layer__skeleton-loader__row",
-        children: col.colComponent ? col.colComponent : col.parts && col.parts > 1 ? /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("span", { className: "Layer__skeleton-loader__row__group", children: [...Array(col.parts)].map((_part, partIndex) => /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
+        children: col.colComponent ? col.colComponent : col.parts && col.parts > 1 ? /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("span", { className: "Layer__skeleton-loader__row__group", children: Array(col.parts).map((_part, partIndex) => /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
           SkeletonLoader,
           {
             width: "100%",
@@ -15596,7 +15600,7 @@ var TableProvider = ({ children }) => {
 };
 
 // src/components/ProfitAndLossTable/ProfitAndLossCompareTable.tsx
-var import_react101 = __toESM(require("react"));
+var import_react101 = require("react");
 
 // src/hooks/useTableExpandRow/useTableExpandRow.tsx
 var import_react99 = require("react");
@@ -15922,7 +15926,7 @@ var ProfitAndLossCompareTable = ({
     }
     const expandable = (lineItem == null ? void 0 : lineItem.line_items) && lineItem.line_items.length > 0 ? true : false;
     const expanded = expandable ? isOpen(rowKey) : true;
-    return /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(import_react101.default.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(import_react101.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(
         TableRow,
         {
@@ -15956,7 +15960,7 @@ var ProfitAndLossCompareTable = ({
   return /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(Table, { borderCollapse: "collapse", bottomSpacing: false, children: [
     /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(TableHead, { children: compareOptions && compareOptions.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(TableRow, { rowKey: "", children: [
       /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(TableCell, { isHeaderCell: true }),
-      compareOptions.map((option, i) => /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(import_react101.default.Fragment, { children: [
+      compareOptions.map((option, i) => /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(import_react101.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(TableCell, { primary: true, isHeaderCell: true, children: option.displayName }, option + "-" + i),
         compareMonths && Array.from({ length: compareMonths - 1 }, (_, index) => /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(TableCell, { isHeaderCell: true }, option + "-" + index))
       ] }, option + "-" + i))
@@ -15964,10 +15968,10 @@ var ProfitAndLossCompareTable = ({
     /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(TableBody, { children: [
       compareMonths && /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(TableRow, { rowKey: "", children: [
         /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(TableCell, { isHeaderCell: true }),
-        compareOptions && compareOptions.length > 0 ? compareOptions.map((option, i) => /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(import_react101.default.Fragment, { children: generatComparisonMonths(
+        compareOptions && compareOptions.length > 0 ? compareOptions.map((option, i) => /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(import_react101.Fragment, { children: generatComparisonMonths(
           dateRange.startDate,
           compareMonths
-        ).map((month, index) => /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(TableCell, { isHeaderCell: true, children: month }, option + "-" + index)) }, option + "-" + i)) : /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(import_react101.default.Fragment, { children: generatComparisonMonths(
+        ).map((month, index) => /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(TableCell, { isHeaderCell: true, children: month }, option + "-" + index)) }, option + "-" + i)) : /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(import_react101.Fragment, { children: generatComparisonMonths(
           dateRange.startDate,
           compareMonths
         ).map((month, index) => /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(TableCell, { isHeaderCell: true, children: month }, "total-" + index + "-cell")) }, "total-1")
@@ -15998,7 +16002,7 @@ var ProfitAndLossCompareTable = ({
 };
 
 // src/components/ProfitAndLossTable/ProfitAndLossTableComponent.tsx
-var import_react102 = __toESM(require("react"));
+var import_react102 = require("react");
 
 // src/icons/PieChart.tsx
 var import_jsx_runtime178 = require("react/jsx-runtime");
@@ -16119,7 +16123,7 @@ var ProfitAndLossTableComponent = ({
   const renderLineItem = (lineItem, depth, rowKey, rowIndex, scope, setSidebarScope2, variant) => {
     const expandable = !!lineItem.line_items && lineItem.line_items.length > 0;
     const expanded = expandable ? isOpen(rowKey) : true;
-    return /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)(import_react102.default.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)(import_react102.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)(
         TableRow,
         {
@@ -16229,8 +16233,8 @@ var ProfitAndLossTableComponent = ({
       void 0,
       "summation"
     ),
-    data.personal_expenses ? /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(import_react102.default.Fragment, { children: renderLineItem(data.personal_expenses, 0, "personal_expenses", 7) }) : null,
-    data.other_outflows ? /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(import_react102.default.Fragment, { children: renderLineItem(data.other_outflows, 0, "other_outflows", 6) }) : null
+    data.personal_expenses ? renderLineItem(data.personal_expenses, 0, "personal_expenses", 7) : null,
+    data.other_outflows ? renderLineItem(data.other_outflows, 0, "other_outflows", 6) : null
   ] }) });
 };
 
@@ -16416,7 +16420,7 @@ var BalanceSheetExpandAllButton = ({
 };
 
 // src/components/BalanceSheetTable/BalanceSheetTable.tsx
-var import_react108 = __toESM(require("react"));
+var import_react108 = require("react");
 var import_jsx_runtime184 = require("react/jsx-runtime");
 var BalanceSheetTable = ({
   data,
@@ -16440,7 +16444,7 @@ var BalanceSheetTable = ({
     if (expandable) {
       allRowKeys.push(rowKey);
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)(import_react108.default.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)(import_react108.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)(
         TableRow,
         {
@@ -16491,7 +16495,7 @@ var BalanceSheetTable = ({
       /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(TableCell, { isHeaderCell: true, children: (stringOverrides == null ? void 0 : stringOverrides.typeColumnHeader) || "Type" }),
       /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(TableCell, { isHeaderCell: true, align: "right" /* RIGHT */, children: (stringOverrides == null ? void 0 : stringOverrides.totalColumnHeader) || "Total" })
     ] }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(TableBody, { children: config.map((row, idx) => /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(import_react108.default.Fragment, { children: data[row.lineItem] && renderLineItem(
+    /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(TableBody, { children: config.map((row, idx) => /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(import_react108.Fragment, { children: data[row.lineItem] && renderLineItem(
       data[row.lineItem],
       0,
       row.lineItem,
@@ -16531,7 +16535,7 @@ function useInvisibleDownload() {
   const invisibleDownloadRef = (0, import_react109.useRef)(null);
   const triggerInvisibleDownload = (0, import_react109.useCallback)((options) => {
     var _a;
-    (_a = invisibleDownloadRef.current) == null ? void 0 : _a.trigger(options);
+    void ((_a = invisibleDownloadRef.current) == null ? void 0 : _a.trigger(options));
   }, []);
   return { invisibleDownloadRef, triggerInvisibleDownload };
 }
@@ -16758,7 +16762,7 @@ var useStatementOfCashFlow = (startDate = /* @__PURE__ */ new Date(), endDate =
 };
 
 // src/components/StatementOfCashFlowTable/StatementOfCashFlowTable.tsx
-var import_react112 = __toESM(require("react"));
+var import_react112 = require("react");
 var import_jsx_runtime188 = require("react/jsx-runtime");
 var StatementOfCashFlowTable = ({
   data,
@@ -16769,7 +16773,7 @@ var StatementOfCashFlowTable = ({
   const renderLineItem = (lineItem, depth = 0, rowKey, rowIndex) => {
     const expandable = !!lineItem.line_items && lineItem.line_items.length > 0;
     const expanded = expandable ? isOpen(rowKey) : true;
-    return /* @__PURE__ */ (0, import_jsx_runtime188.jsxs)(import_react112.default.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime188.jsxs)(import_react112.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime188.jsxs)(
         TableRow,
         {
@@ -16821,7 +16825,7 @@ var StatementOfCashFlowTable = ({
     ] }) }),
     /* @__PURE__ */ (0, import_jsx_runtime188.jsx)(TableBody, { children: config.map((row, idx) => {
       if (row.type === "line_item") {
-        return /* @__PURE__ */ (0, import_jsx_runtime188.jsx)(import_react112.default.Fragment, { children: data[row.lineItem] && renderLineItem(
+        return /* @__PURE__ */ (0, import_jsx_runtime188.jsx)(import_react112.Fragment, { children: data[row.lineItem] && renderLineItem(
           data[row.lineItem],
           0,
           row.lineItem ? row.lineItem : "",
@@ -18021,7 +18025,7 @@ var ChartOfAccountsSidebar = ({
 };
 
 // src/components/ChartOfAccountsTable/ChartOfAccountsTable.tsx
-var import_react120 = __toESM(require("react"));
+var import_react120 = require("react");
 
 // src/icons/Edit2.tsx
 var import_jsx_runtime196 = require("react/jsx-runtime");
@@ -18111,7 +18115,7 @@ var ChartOfAccountsTableContent = ({
     var _a, _b;
     const expandable = !!account.sub_accounts && account.sub_accounts.length > 0;
     const expanded = expandable ? isOpen(rowKey) : true;
-    return /* @__PURE__ */ (0, import_jsx_runtime197.jsxs)(import_react120.default.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime197.jsxs)(import_react120.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime197.jsxs)(
         TableRow,
         {
@@ -19654,7 +19658,56 @@ var import_react130 = require("react");
 
 // src/components/JournalForm/JournalFormEntryLines.tsx
 var import_react129 = require("react");
+
+// src/hooks/categories/useAllCategories.ts
+var import_swr12 = __toESM(require("swr"));
+function buildKey7({
+  access_token: accessToken,
+  apiUrl,
+  businessId
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      mode: "ALL",
+      tags: ["#categories"]
+    };
+  }
+}
+function useAllCategories() {
+  const { data: auth } = useAuth();
+  const { businessId } = useLayerContext();
+  return (0, import_swr12.default)(
+    () => buildKey7(__spreadProps(__spreadValues({}, auth), {
+      businessId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2, mode }) => getCategories(
+      apiUrl,
+      accessToken,
+      {
+        params: {
+          businessId: businessId2,
+          mode
+        }
+      }
+    )().then(({ data }) => data.categories)
+  );
+}
+
+// src/components/JournalForm/JournalFormEntryLines.tsx
 var import_jsx_runtime209 = require("react/jsx-runtime");
+function recursiveFlattenCategories(accounts) {
+  const flattenedResult = accounts.flatMap((a) => {
+    var _a;
+    return [
+      a,
+      recursiveFlattenCategories((_a = a.subCategories) != null ? _a : [])
+    ];
+  }).flat();
+  return flattenedResult;
+}
 var JournalFormEntryLines = ({
   entrylineItems,
   addEntryLine,
@@ -19663,9 +19716,47 @@ var JournalFormEntryLines = ({
   sendingForm,
   config
 }) => {
-  const { data: accountsData } = (0, import_react129.useContext)(ChartOfAccountsContext);
+  const { data } = useAllCategories();
   const { form } = (0, import_react129.useContext)(JournalContext);
-  const parentOptions = useParentOptions(accountsData);
+  const { flattenedCategories, parentOptions } = (0, import_react129.useMemo)(() => {
+    const flattenedCategories2 = recursiveFlattenCategories(data != null ? data : []);
+    const parentOptions2 = flattenedCategories2.sort((a, b) => a.display_name.localeCompare(b.display_name)).map(({ display_name, id }) => {
+      return {
+        label: display_name,
+        value: id
+      };
+    });
+    return { flattenedCategories: flattenedCategories2, parentOptions: parentOptions2 };
+  }, [data]);
+  const handleChangeParent = ({
+    lineItemIndex,
+    value
+  }) => {
+    var _a;
+    const relevantCategory = flattenedCategories.find((x) => x.id === value.value);
+    if (!relevantCategory) {
+      return;
+    }
+    return changeFormData(
+      "parent",
+      value,
+      lineItemIndex,
+      [
+        {
+          id: relevantCategory.id,
+          name: relevantCategory.display_name,
+          stable_name: (_a = relevantCategory.stable_name) != null ? _a : "",
+          account_type: {
+            value: relevantCategory.id,
+            display_name: relevantCategory.display_name
+          },
+          sub_accounts: [],
+          balance: 0,
+          normality: "DEBIT" /* DEBIT */
+        }
+      ]
+    );
+  };
   return /* @__PURE__ */ (0, import_jsx_runtime209.jsx)(import_jsx_runtime209.Fragment, { children: ["DEBIT", "CREDIT"].map((direction, idx) => {
     return /* @__PURE__ */ (0, import_jsx_runtime209.jsxs)(
       "div",
@@ -19678,9 +19769,11 @@ var JournalFormEntryLines = ({
               className: "Layer__journal__form__input-group__title",
               size: "lg" /* lg */,
               children: [
-                "Add ",
+                "Add",
+                " ",
                 humanizeEnum(direction),
-                " Account"
+                " ",
+                "Account"
               ]
             }
           ),
@@ -19735,12 +19828,10 @@ var JournalFormEntryLines = ({
                               value: item.account_identifier.id,
                               label: item.account_identifier.name
                             },
-                            onChange: (sel) => changeFormData(
-                              "parent",
-                              sel,
-                              idx2,
-                              accountsData == null ? void 0 : accountsData.accounts
-                            ),
+                            onChange: (value) => handleChangeParent({
+                              lineItemIndex: idx2,
+                              value
+                            }),
                             isInvalid: Boolean(
                               (_d = form == null ? void 0 : form.errors) == null ? void 0 : _d.lineItems.find(
                                 (x) => x.id === idx2 && x.field === "account"
@@ -19954,7 +20045,7 @@ var JournalSidebar = ({
 };
 
 // src/components/JournalTable/JournalTable.tsx
-var import_react132 = __toESM(require("react"));
+var import_react132 = require("react");
 var import_date_fns35 = require("date-fns");
 var import_jsx_runtime212 = require("react/jsx-runtime");
 var accountName = (row) => {
@@ -19992,7 +20083,7 @@ var JournalTableContent = ({
   const renderJournalRow = (row, index, rowKey, depth) => {
     const expandable = !!row.line_items && row.line_items.length > 0;
     const expanded = expandable ? isOpen(rowKey) : true;
-    return /* @__PURE__ */ (0, import_jsx_runtime212.jsxs)(import_react132.default.Fragment, { children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime212.jsxs)(import_react132.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime212.jsxs)(
         TableRow,
         {
@@ -20074,7 +20165,7 @@ var JournalTableContent = ({
 
 // src/components/Journal/download/useJournalEntriesDownload.ts
 var import_mutation6 = __toESM(require("swr/mutation"));
-function buildKey7({
+function buildKey8({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -20100,7 +20191,7 @@ function useJournalEntriesDownload({
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   return (0, import_mutation6.default)(
-    () => buildKey7(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey8(__spreadProps(__spreadValues({}, auth), {
       businessId,
       startCutoff,
       endCutoff
@@ -20384,7 +20475,7 @@ var mockData = [
 ];
 
 // src/hooks/useTasks/useTasks.tsx
-var import_swr12 = __toESM(require("swr"));
+var import_swr13 = __toESM(require("swr"));
 var import_date_fns37 = require("date-fns");
 var DEBUG_MODE = false;
 var useTasks = ({
@@ -20401,7 +20492,7 @@ var useTasks = ({
   });
   const [currentDate, setCurrentDate] = (0, import_react135.useState)(/* @__PURE__ */ new Date());
   const queryKey = businessId && (auth == null ? void 0 : auth.access_token) && `tasks-${businessId}-${dateRange.startDate}-${dateRange.endDate}`;
-  const { data, isLoading, isValidating, error, mutate } = (0, import_swr12.default)(
+  const { data, isLoading, isValidating, error, mutate } = (0, import_swr13.default)(
     queryKey,
     Layer.getTasks(apiUrl, auth == null ? void 0 : auth.access_token, {
       params: {