@layerfi/components 0.1.52 → 0.1.54

package/dist/esm/index.js

@@ -1,5 +1,5 @@
 // src/providers/LayerProvider/LayerProvider.tsx
-import React7, { useReducer, useEffect as useEffect3 } from "react";
+import React7, { useReducer, useEffect as useEffect4 } from "react";
 
 // src/api/util.ts
 var formStringFromObject = (object) => Object.entries(object).map(([k, v]) => `${encodeURIComponent(k)}=${encodeURIComponent(v)}`).join("&");
@@ -148,9 +148,12 @@ var getBankTransactions = get(
     businessId,
     cursor,
     categorized,
+    direction,
+    startDate,
+    endDate,
     sortBy = "date",
     sortOrder = "DESC"
-  }) => `/v1/businesses/${businessId}/bank-transactions?${cursor ? `cursor=${cursor}&` : ""}${categorized !== void 0 && categorized !== "" ? `categorized=${categorized}&` : ""}sort_by=${sortBy}&sort_order=${sortOrder}&limit=200`
+  }) => `/v1/businesses/${businessId}/bank-transactions?${cursor !== void 0 && cursor !== "" ? `cursor=${cursor}&` : ""}${categorized !== void 0 && categorized !== "" ? `categorized=${categorized}&` : ""}${direction !== void 0 ? `direction=${direction}&` : ""}${startDate !== void 0 && startDate !== "" ? `start_date=${startDate}&` : ""}${endDate !== void 0 && endDate !== "" ? `end_date=${endDate}&` : ""}sort_by=${sortBy}&sort_order=${sortOrder}&limit=200`
 );
 var categorizeBankTransaction = put(
   ({ businessId, bankTransactionId }) => `/v1/businesses/${businessId}/bank-transactions/${bankTransactionId}/categorize`
@@ -491,6 +494,7 @@ var LayerContext = createContext2({
   syncTimestamps: {},
   readTimestamps: {},
   hasBeenTouched: () => false,
+  expireDataCaches: () => void 0,
   eventCallbacks: {}
 });
 var useLayerContext = () => useContext2(LayerContext);
@@ -547,9 +551,19 @@ var DEPENDENCIES = {
   ["CHART_OF_ACCOUNTS" /* CHART_OF_ACCOUNTS */]: ALL_TOUCHABLE,
   ["JOURNAL" /* JOURNAL */]: ALL_TOUCHABLE,
   ["LEDGER_ACCOUNTS" /* LEDGER_ACCOUNTS */]: ALL_TOUCHABLE,
-  ["LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */]: ALL_TOUCHABLE,
+  ["LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */]: [
+    "BUSINESS" /* BUSINESS */,
+    "LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */,
+    "CHART_OF_ACCOUNTS" /* CHART_OF_ACCOUNTS */
+  ],
   ["PROFIT_AND_LOSS" /* PROFIT_AND_LOSS */]: ALL_TOUCHABLE,
-  ["STATEMENT_OF_CASH_FLOWS" /* STATEMENT_OF_CASH_FLOWS */]: ALL_TOUCHABLE
+  ["STATEMENT_OF_CASH_FLOWS" /* STATEMENT_OF_CASH_FLOWS */]: ALL_TOUCHABLE,
+  ["BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */]: [
+    "LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */,
+    "BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */,
+    "BUSINESS" /* BUSINESS */,
+    "CHART_OF_ACCOUNTS" /* CHART_OF_ACCOUNTS */
+  ]
 };
 var readTimestampsG = {};
 var useDataSync = () => {
@@ -561,7 +575,8 @@ var useDataSync = () => {
     ["LEDGER_ACCOUNTS" /* LEDGER_ACCOUNTS */]: initialTimestamp,
     ["LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */]: initialTimestamp,
     ["PROFIT_AND_LOSS" /* PROFIT_AND_LOSS */]: initialTimestamp,
-    ["STATEMENT_OF_CASH_FLOWS" /* STATEMENT_OF_CASH_FLOWS */]: initialTimestamp
+    ["STATEMENT_OF_CASH_FLOWS" /* STATEMENT_OF_CASH_FLOWS */]: initialTimestamp,
+    ["BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */]: initialTimestamp
   });
   const [readTimestamps, setReadTimestamps] = useState2({});
   const touch = (model) => {
@@ -591,12 +606,26 @@ var useDataSync = () => {
       })
     );
   };
+  const resetCaches = () => {
+    const now = Date.now();
+    setSyncTimestamps({
+      ["BALANCE_SHEET" /* BALANCE_SHEET */]: now,
+      ["CHART_OF_ACCOUNTS" /* CHART_OF_ACCOUNTS */]: now,
+      ["JOURNAL" /* JOURNAL */]: now,
+      ["LEDGER_ACCOUNTS" /* LEDGER_ACCOUNTS */]: now,
+      ["LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */]: now,
+      ["PROFIT_AND_LOSS" /* PROFIT_AND_LOSS */]: now,
+      ["STATEMENT_OF_CASH_FLOWS" /* STATEMENT_OF_CASH_FLOWS */]: now,
+      ["BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */]: now
+    });
+  };
   return {
     touch,
     read,
     syncTimestamps,
     readTimestamps,
-    hasBeenTouched
+    hasBeenTouched,
+    resetCaches
   };
 };
 
@@ -628,10 +657,10 @@ import React6 from "react";
 import { createContext as createContext3, useContext as useContext4 } from "react";
 
 // src/types/bank_transactions.ts
-var Direction = /* @__PURE__ */ ((Direction3) => {
-  Direction3["CREDIT"] = "CREDIT";
-  Direction3["DEBIT"] = "DEBIT";
-  return Direction3;
+var Direction = /* @__PURE__ */ ((Direction2) => {
+  Direction2["CREDIT"] = "CREDIT";
+  Direction2["DEBIT"] = "DEBIT";
+  return Direction2;
 })(Direction || {});
 var DisplayState = /* @__PURE__ */ ((DisplayState2) => {
   DisplayState2["all"] = "all";
@@ -663,6 +692,7 @@ var BankTransactionsContext = createContext3({
     pagination: void 0
   },
   updateOneLocal: () => void 0,
+  shouldHideAfterCategorize: () => false,
   removeAfterCategorize: () => void 0,
   activate: () => void 0,
   display: "review" /* review */,
@@ -673,1278 +703,1289 @@ var BankTransactionsContext = createContext3({
 var useBankTransactionsContext = () => useContext4(BankTransactionsContext);
 
 // src/hooks/useBankTransactions/useBankTransactions.tsx
-import { useEffect as useEffect2, useMemo as useMemo2, useState as useState4 } from "react";
-
-// src/components/BankTransactions/constants.ts
-var CategorizedCategories = [
-  "CATEGORIZED" /* CATEGORIZED */,
-  "JOURNALING" /* JOURNALING */,
-  "SPLIT" /* SPLIT */,
-  "MATCHED" /* MATCHED */
-];
-var ReviewCategories = [
-  "READY_FOR_INPUT" /* READY_FOR_INPUT */,
-  "LAYER_REVIEW" /* LAYER_REVIEW */
-];
+import { useEffect as useEffect3, useMemo as useMemo2, useRef, useState as useState5 } from "react";
 
-// src/components/BankTransactions/utils.ts
-var filterVisibility = (scope, bankTransaction) => {
-  const categorized = CategorizedCategories.includes(
-    bankTransaction.categorization_status
-  );
-  const inReview = ReviewCategories.includes(
-    bankTransaction.categorization_status
-  );
-  return scope === "all" /* all */ || scope === "review" /* review */ && inReview || scope === "categorized" /* categorized */ && categorized;
-};
-var isCategorized = (bankTransaction) => CategorizedCategories.includes(bankTransaction.categorization_status);
+// src/hooks/useLinkedAccounts/useLinkedAccounts.ts
+import { useEffect as useEffect2, useState as useState4 } from "react";
+import { usePlaidLink } from "react-plaid-link";
 
-// src/hooks/useBankTransactions/utils.ts
-import { parseISO } from "date-fns";
-var collectAccounts = (transactions) => {
-  const accounts = [];
-  if (!transactions) {
-    return accounts;
-  }
-  transactions.forEach((x) => {
-    if (!accounts.find((y) => y.id === x.source_account_id)) {
-      accounts.push({
-        id: x.source_account_id,
-        name: x.account_name || ""
-      });
-    }
-  });
-  return accounts.sort((a, b) => a.name.localeCompare(b.name));
-};
-var applyAmountFilter = (data, filter) => {
-  return data?.filter((x) => {
-    if ((filter?.min || filter?.min === 0) && (filter?.max || filter?.max === 0)) {
-      return x.amount >= filter.min * 100 && x.amount <= filter.max * 100;
-    }
-    if (filter?.min || filter?.min === 0) {
-      return x.amount >= filter.min * 100;
-    }
-    if (filter?.max || filter?.max === 0) {
-      return x.amount <= filter.max * 100;
-    }
-  });
-};
-var applyAccountFilter = (data, filter) => data?.filter((x) => filter && filter.includes(x.source_account_id));
-var applyDirectionFilter = (data, filter) => {
-  if (!filter) {
-    return data;
-  }
-  const normalizedFilter = filter.map((x) => x.toLowerCase());
-  return data?.filter(
-    (x) => normalizedFilter.includes(x.direction?.toLowerCase())
-  );
-};
-var applyCategorizationStatusFilter = (data, filter) => {
-  if (!filter) {
-    return data;
+// src/hooks/useLinkedAccounts/mockData.ts
+var LINKED_ACCOUNTS_MOCK_DATA = [
+  {
+    id: "d800ada8-8075-4436-a712-08efabcbd51a",
+    external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+    external_account_source: "PLAID",
+    external_account_name: "Citi Double Cash\xAE Card",
+    mask: "1234",
+    latest_balance_timestamp: {
+      external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+      external_account_source: "PLAID",
+      balance: 435121,
+      at: "2024-04-03T13:00:00Z",
+      created_at: "2024-04-06T22:47:59.715458Z"
+    },
+    current_ledger_balance: 373717,
+    institution: {
+      name: "Chase",
+      logo: ""
+    },
+    connection_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+    connection_external_id: "11111",
+    connection_needs_repair_as_of: null,
+    requires_user_confirmation_as_of: null,
+    is_syncing: true
+  },
+  {
+    id: "f98ec50a-c370-484d-a35b-d00207436075",
+    external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+    external_account_source: "PLAID",
+    external_account_name: "Citi Double Cash\xAE Card",
+    mask: "1234",
+    latest_balance_timestamp: {
+      external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+      external_account_source: "PLAID",
+      balance: 435121,
+      at: "2024-04-03T13:00:00Z",
+      created_at: "2024-04-06T16:44:35.715458Z"
+    },
+    current_ledger_balance: 373717,
+    institution: {
+      name: "Chase",
+      logo: ""
+    },
+    connection_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+    connection_external_id: "11111",
+    connection_needs_repair_as_of: null,
+    requires_user_confirmation_as_of: null,
+    is_syncing: false
+  },
+  {
+    id: "843f1748-fdaa-422d-a73d-2489a40c8dc7",
+    external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+    external_account_source: "PLAID",
+    external_account_name: "Citi Double Cash\xAE Card",
+    mask: "1234",
+    latest_balance_timestamp: {
+      external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+      external_account_source: "PLAID",
+      balance: 435121,
+      at: "2024-04-03T13:00:00Z",
+      created_at: "2024-04-06T16:44:35.715458Z"
+    },
+    current_ledger_balance: 373717,
+    institution: {
+      name: "Chase",
+      logo: ""
+    },
+    connection_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+    connection_external_id: "11111",
+    connection_needs_repair_as_of: "2024-03-06T16:44:35.715458Z",
+    requires_user_confirmation_as_of: null,
+    is_syncing: false
+  },
+  {
+    id: "8f430e29-e339-4d71-a08a-fce469c7a7c1",
+    external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+    external_account_source: "PLAID",
+    external_account_name: "Citi Double Cash\xAE Card",
+    mask: "1234",
+    latest_balance_timestamp: {
+      external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+      external_account_source: "PLAID",
+      balance: 435121,
+      at: "2024-04-03T13:00:00Z",
+      created_at: "2024-04-06T16:44:35.715458Z"
+    },
+    current_ledger_balance: 373717,
+    institution: {
+      name: "Chase",
+      logo: ""
+    },
+    connection_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
+    connection_external_id: "11111",
+    connection_needs_repair_as_of: null,
+    requires_user_confirmation_as_of: "2024-03-06T16:44:35.715458Z",
+    is_syncing: false
   }
-  return data?.filter(
-    (tx) => filterVisibility(filter, tx) || filter === "all" /* all */ || filter === "review" /* review */ && tx.recently_categorized || filter === "categorized" /* categorized */ && tx.recently_categorized
-  );
-};
-var appplyDateRangeFilter = (data, filter) => {
-  return data?.filter((x) => {
-    const txDate = parseISO(x.date);
-    if (filter?.startDate && filter?.endDate) {
-      return txDate >= filter.startDate && txDate <= filter.endDate;
-    }
-    if (filter?.startDate) {
-      return txDate >= filter.startDate;
-    }
-    if (filter?.endDate) {
-      return txDate <= filter.endDate;
-    }
-  });
-};
+];
 
-// src/hooks/useBankTransactions/useBankTransactions.tsx
-import useSWRInfinite from "swr/infinite";
-var useBankTransactions = (params) => {
+// src/hooks/useLinkedAccounts/useLinkedAccounts.ts
+import useSWR from "swr";
+var DEBUG = true;
+var USE_MOCK_RESPONSE_DATA = false;
+var useLinkedAccounts = () => {
   const {
     auth,
     businessId,
     apiUrl,
-    addToast,
+    usePlaidSandbox,
     touch,
     read,
     syncTimestamps,
-    hasBeenTouched,
-    eventCallbacks
+    hasBeenTouched
   } = useLayerContext();
-  const { scope = void 0 } = params ?? {};
-  const [filters, setTheFilters] = useState4(
-    scope ? { categorizationStatus: scope } : void 0
-  );
-  const display = useMemo2(() => {
-    if (filters?.categorizationStatus === "review" /* review */) {
-      return "review" /* review */;
-    } else if (filters?.categorizationStatus === "all" /* all */) {
-      return "all" /* all */;
-    }
-    return "categorized" /* categorized */;
-  }, [filters?.categorizationStatus]);
-  const [active, setActive] = useState4(false);
+  const [linkToken, setLinkToken] = useState4(null);
   const [loadingStatus, setLoadingStatus] = useState4("initial");
-  const getKey = (_index, prevData) => {
-    if (!auth?.access_token || !active) {
-      return [false, void 0];
-    }
-    if (!prevData?.meta?.pagination?.cursor) {
-      return [
-        businessId && auth?.access_token && `bank-transactions-${businessId}`,
-        void 0
-      ];
-    }
-    return [
-      businessId && auth?.access_token && `bank-transactions-${businessId}-${prevData.meta.pagination.cursor}`,
-      prevData.meta.pagination.cursor
-    ];
-  };
+  const USE_PLAID_SANDBOX = usePlaidSandbox ?? true;
+  const [linkMode, setLinkMode] = useState4("add");
+  const queryKey = businessId && auth?.access_token && `linked-accounts-${businessId}`;
   const {
-    data: rawResponseData,
+    data: responseData,
     isLoading,
     isValidating,
     error: responseError,
-    mutate,
-    size,
-    setSize
-  } = useSWRInfinite(
-    getKey,
-    async ([query, nextCursor]) => {
-      if (auth?.access_token) {
-        return Layer.getBankTransactions(apiUrl, auth?.access_token, {
-          params: {
-            businessId,
-            cursor: nextCursor
-          }
-        }).call(false);
-      }
-      return {};
-    },
-    {
-      initialSize: 1,
-      revalidateFirstPage: false
-    }
+    mutate
+  } = useSWR(
+    queryKey,
+    Layer.getLinkedAccounts(apiUrl, auth?.access_token, {
+      params: { businessId }
+    })
   );
-  const data = useMemo2(() => {
-    if (rawResponseData && rawResponseData.length > 0) {
-      return rawResponseData?.map((x) => x?.data).flat().filter((x) => !!x);
+  useEffect2(() => {
+    if (!isLoading && responseData?.data.external_accounts) {
+      setLoadingStatus("complete");
+      return;
     }
-    return void 0;
-  }, [rawResponseData]);
-  const lastMetadata = useMemo2(() => {
-    if (rawResponseData && rawResponseData.length > 0) {
-      return rawResponseData[rawResponseData.length - 1].meta;
+    if (isLoading && loadingStatus === "initial") {
+      setLoadingStatus("loading");
+      return;
     }
-    return void 0;
-  }, [rawResponseData]);
-  const hasMore = useMemo2(() => {
-    if (rawResponseData && rawResponseData.length > 0) {
-      const lastElement = rawResponseData[rawResponseData.length - 1];
-      return Boolean(
-        lastElement.meta?.pagination?.cursor && lastElement.meta?.pagination?.has_more
-      );
+    if (!isLoading && loadingStatus === "loading") {
+      setLoadingStatus("complete");
     }
-    return false;
-  }, [rawResponseData]);
-  const accountsList = useMemo2(
-    () => data ? collectAccounts(data) : [],
-    [data]
-  );
-  useEffect2(() => {
-    if (isLoading && loadingStatus === "initial") {
-      setLoadingStatus("loading");
-      return;
+  }, [isLoading]);
+  const fetchPlaidLinkToken = async () => {
+    if (auth?.access_token) {
+      const linkToken2 = (await Layer.getPlaidLinkToken(apiUrl, auth.access_token, {
+        params: { businessId }
+      })).data.link_token;
+      setLinkMode("add");
+      setLinkToken(linkToken2);
     }
-    if (!isLoading && loadingStatus === "loading") {
-      setLoadingStatus("complete");
-      return;
+  };
+  const fetchPlaidUpdateModeLinkToken = async (plaidItemPlaidId) => {
+    if (auth?.access_token) {
+      const linkToken2 = (await Layer.getPlaidUpdateModeLinkToken(apiUrl, auth.access_token, {
+        params: { businessId },
+        body: { plaid_item_id: plaidItemPlaidId }
+      })).data.link_token;
+      setLinkMode("update");
+      setLinkToken(linkToken2);
     }
-  }, [isLoading]);
-  const activate = () => {
-    setActive(true);
   };
-  const setFilters = (value) => {
-    setTheFilters({
-      ...filters,
-      ...value ?? {}
+  const exchangePlaidPublicToken2 = async (publicToken, metadata) => {
+    await Layer.exchangePlaidPublicToken(apiUrl, auth?.access_token, {
+      params: { businessId },
+      body: { public_token: publicToken, institution: metadata.institution }
     });
+    refetchAccounts();
   };
-  const filteredData = useMemo2(() => {
-    let filtered = data;
-    if (!filtered) {
-      return;
-    }
-    if (filters?.amount?.min || filters?.amount?.max) {
-      filtered = applyAmountFilter(filtered, filters.amount);
-    }
-    if (filters?.account) {
-      filtered = applyAccountFilter(filtered, filters.account);
-    }
-    if (filters?.direction) {
-      filtered = applyDirectionFilter(filtered, filters.direction);
+  const { open: plaidLinkStart, ready: plaidLinkReady } = usePlaidLink({
+    token: linkToken,
+    // If in update mode, we don't need to exchange the public token for an access token.
+    // The existing access token will automatically become valid again
+    onSuccess: async (publicToken, metadata) => {
+      if (linkMode == "add") {
+        exchangePlaidPublicToken2(publicToken, metadata);
+      } else {
+        await updateConnectionStatus2();
+        refetchAccounts();
+        setLinkMode("add");
+        touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
+      }
+    },
+    onExit: () => setLinkMode("add"),
+    env: USE_PLAID_SANDBOX ? "sandbox" : void 0
+  });
+  useEffect2(() => {
+    if (plaidLinkReady) {
+      plaidLinkStart();
     }
-    if (filters?.categorizationStatus) {
-      filtered = applyCategorizationStatusFilter(
-        filtered,
-        filters.categorizationStatus
+  }, [plaidLinkStart, plaidLinkReady]);
+  const mockResponseData = {
+    data: LINKED_ACCOUNTS_MOCK_DATA,
+    meta: {},
+    error: void 0
+  };
+  const addConnection = (source) => {
+    if (source === "PLAID") {
+      fetchPlaidLinkToken();
+    } else {
+      console.error(
+        `Adding a connection with source ${source} not yet supported`
       );
     }
-    if (filters?.dateRange?.startDate || filters?.dateRange?.endDate) {
-      filtered = appplyDateRangeFilter(filtered, filters?.dateRange);
+  };
+  const repairConnection = async (source, connectionExternalId) => {
+    if (source === "PLAID") {
+      await fetchPlaidUpdateModeLinkToken(connectionExternalId);
+    } else {
+      console.error(
+        `Repairing a connection with source ${source} not yet supported`
+      );
     }
-    return filtered;
-  }, [filters, data]);
-  const categorize = (id, newCategory, notify) => {
-    const foundBT = data?.find((x) => x.business_id === businessId && x.id === id);
-    if (foundBT) {
-      updateOneLocal({ ...foundBT, processing: true, error: void 0 });
+  };
+  const removeConnection = async (source, connectionExternalId) => {
+    if (source === "PLAID") {
+      await unlinkPlaidItem2(connectionExternalId);
+      await refetchAccounts();
+    } else {
+      console.error(
+        `Removing a connection with source ${source} not yet supported`
+      );
     }
-    return Layer.categorizeBankTransaction(apiUrl, auth.access_token, {
-      params: { businessId, bankTransactionId: id },
-      body: newCategory
-    }).then(({ data: newBT, errors }) => {
-      if (newBT) {
-        newBT.recently_categorized = true;
-        updateOneLocal(newBT);
-      }
-      if (errors) {
-        console.error(errors);
-        throw errors;
-      }
-      if (newBT?.recently_categorized === true && notify) {
-        addToast({ content: "Transaction saved" });
-      }
-    }).catch((err) => {
-      const newBT = data?.find(
-        (x) => x.business_id === businessId && x.id === id
+  };
+  const unlinkAccount2 = async (source, accountId) => {
+    DEBUG && console.log("unlinking account");
+    if (source === "PLAID") {
+      await Layer.unlinkAccount(apiUrl, auth?.access_token, {
+        params: { businessId, accountId }
+      });
+      await refetchAccounts();
+      touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
+    } else {
+      console.error(
+        `Unlinking an account with source ${source} not yet supported`
       );
-      if (newBT) {
-        updateOneLocal({
-          ...newBT,
-          error: err.message,
-          processing: false
-        });
-      }
-    }).finally(() => {
-      touch("BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */);
-      eventCallbacks?.onTransactionCategorized?.(id);
-    });
+    }
   };
-  const match = (id, matchId, notify) => {
-    const foundBT = data?.find((x) => x.business_id === businessId && x.id === id);
-    if (foundBT) {
-      updateOneLocal({ ...foundBT, processing: true, error: void 0 });
+  const confirmAccount = async (source, accountId) => {
+    DEBUG && console.log("confirming account");
+    if (source === "PLAID") {
+      await Layer.confirmConnection(apiUrl, auth?.access_token, {
+        params: {
+          businessId,
+          accountId
+        }
+      });
+      await refetchAccounts();
+      touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
+    } else {
+      console.error(
+        `Confirming an account with source ${source} not yet supported`
+      );
     }
-    return Layer.matchBankTransaction(apiUrl, auth.access_token, {
-      params: { businessId, bankTransactionId: id },
-      body: { match_id: matchId, type: "Confirm_Match" /* CONFIRM_MATCH */ }
-    }).then(({ data: bt, errors }) => {
-      const newBT = data?.find(
-        (x) => x.business_id === businessId && x.id === id
+  };
+  const denyAccount = async (source, accountId) => {
+    DEBUG && console.log("confirming account");
+    if (source === "PLAID") {
+      await Layer.denyConnection(apiUrl, auth?.access_token, {
+        params: {
+          businessId,
+          accountId
+        }
+      });
+      await refetchAccounts();
+      touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
+    } else {
+      console.error(
+        `Denying an account with source ${source} not yet supported`
       );
-      if (newBT) {
-        newBT.recently_categorized = true;
-        newBT.match = bt;
-        newBT.categorization_status = "MATCHED" /* MATCHED */;
-        updateOneLocal(newBT);
-      }
-      if (errors) {
-        console.error(errors);
-        throw errors;
-      }
-      if (newBT?.recently_categorized === true && notify) {
-        addToast({ content: "Transaction saved" });
-      }
-    }).catch((err) => {
-      const newBT = data?.find(
-        (x) => x.business_id === businessId && x.id === id
+    }
+  };
+  const breakConnection = async (source, connectionExternalId) => {
+    DEBUG && console.log("Breaking sandbox plaid item connection");
+    if (source === "PLAID") {
+      await Layer.breakPlaidItemConnection(apiUrl, auth?.access_token, {
+        params: {
+          businessId,
+          plaidItemPlaidId: connectionExternalId
+        }
+      });
+      await refetchAccounts();
+      touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
+    } else {
+      console.error(
+        `Breaking a sandbox connection with source ${source} not yet supported`
       );
-      if (newBT) {
-        updateOneLocal({
-          ...newBT,
-          error: err.message,
-          processing: false
-        });
-      }
-    }).finally(() => {
-      touch("BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */);
-      eventCallbacks?.onTransactionCategorized?.(id);
+    }
+  };
+  const refetchAccounts = async () => {
+    DEBUG && console.log("refetching accounts...");
+    await mutate();
+  };
+  const syncAccounts = async () => {
+    DEBUG && console.log("resyncing accounts...");
+    await Layer.syncConnection(apiUrl, auth?.access_token, {
+      params: { businessId }
     });
   };
-  const updateOneLocal = (newBankTransaction) => {
-    const updatedData = rawResponseData?.map((page) => {
-      return {
-        ...page,
-        data: page.data?.map(
-          (bt) => bt.id === newBankTransaction.id ? newBankTransaction : bt
-        )
-      };
+  const updateConnectionStatus2 = async () => {
+    DEBUG && console.log("updating connection status...");
+    await Layer.updateConnectionStatus(apiUrl, auth?.access_token, {
+      params: { businessId }
     });
-    mutate(updatedData, { revalidate: false });
   };
-  const removeAfterCategorize = (bankTransaction) => {
-  };
-  const refetch = () => {
-    mutate();
-  };
-  const fetchMore = () => {
-    if (hasMore) {
-      setSize(size + 1);
-    }
+  const unlinkPlaidItem2 = async (plaidItemPlaidId) => {
+    DEBUG && console.log("unlinking plaid item");
+    await Layer.unlinkPlaidItem(apiUrl, auth?.access_token, {
+      params: { businessId, plaidItemPlaidId }
+    });
+    await refetchAccounts();
+    touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
   };
   useEffect2(() => {
-    if (isLoading || isValidating) {
-      read("BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */, "bank-transactions");
+    if (queryKey && (isLoading || isValidating)) {
+      read("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */, queryKey);
     }
   }, [isLoading, isValidating]);
   useEffect2(() => {
-    if (hasBeenTouched("bank-transactions")) {
-      refetch();
+    if (queryKey && hasBeenTouched(queryKey)) {
+      refetchAccounts();
     }
   }, [syncTimestamps]);
   return {
-    data: filteredData,
-    metadata: lastMetadata,
-    loadingStatus,
+    data: USE_MOCK_RESPONSE_DATA ? mockResponseData.data : responseData?.data.external_accounts,
     isLoading,
+    loadingStatus,
     isValidating,
-    refetch,
     error: responseError,
-    categorize,
-    match,
-    updateOneLocal,
-    removeAfterCategorize,
-    filters,
-    setFilters,
-    accountsList,
-    activate,
-    display,
-    fetchMore,
-    hasMore
+    addConnection,
+    removeConnection,
+    repairConnection,
+    refetchAccounts,
+    unlinkAccount: unlinkAccount2,
+    confirmAccount,
+    denyAccount,
+    breakConnection,
+    syncAccounts,
+    updateConnectionStatus: updateConnectionStatus2
   };
 };
 
-// src/providers/BankTransactionsProvider/BankTransactionsProvider.tsx
-var BankTransactionsProvider = ({
-  children
-}) => {
-  const bankTransactionsContextData = useBankTransactions();
-  return /* @__PURE__ */ React6.createElement(BankTransactionsContext.Provider, { value: bankTransactionsContextData }, children);
-};
-
-// src/config/theme.ts
-var SHADES = {
-  50: { s: 1, l: 98 },
-  100: { s: 1, l: 96 },
-  200: { s: 1, l: 94 },
-  300: { s: 2, l: 92 },
-  500: { s: 5, l: 53 },
-  600: { s: 7, l: 40 },
-  700: { s: 9, l: 27 },
-  800: { s: 12, l: 20 },
-  1e3: { s: 20, l: 7 }
-};
-var COLORS = {
-  dark: {
-    h: 0,
-    s: 0,
-    l: 7
-  },
-  light: {
-    h: 0,
-    s: 0,
-    l: 100
-  }
-};
-
-// src/utils/colors.ts
-var parseStylesFromThemeConfig = (theme) => {
-  let styles = {};
-  if (!theme) {
-    return styles;
-  }
-  if (theme.colors) {
-    const darkColor = parseColorFromTheme("dark", theme.colors.dark);
-    const lightColor = parseColorFromTheme("light", theme.colors.light);
-    const textColor = parseTextColorFromTheme(theme.colors.text);
-    styles = { ...styles, ...darkColor, ...lightColor, ...textColor };
-  }
-  return styles;
-};
-var parseTextColorFromTheme = (color) => {
-  if (!color) {
-    return {};
+// src/hooks/useBankTransactions/utils.ts
+var collectAccounts = (transactions) => {
+  const accounts = [];
+  if (!transactions) {
+    return accounts;
   }
-  try {
-    if ("hex" in color) {
-      return { "--text-color-primary": color.hex };
+  transactions.forEach((x) => {
+    if (!accounts.find((y) => y.id === x.source_account_id)) {
+      accounts.push({
+        id: x.source_account_id,
+        name: x.account_name || ""
+      });
     }
-    return {};
-  } catch (_err) {
-    return {};
-  }
+  });
+  return accounts.sort((a, b) => a.name.localeCompare(b.name));
 };
-var parseColorFromTheme = (colorName, color) => {
-  if (!color) {
-    return {};
-  }
-  try {
-    if ("h" in color && "s" in color && "l" in color) {
-      return {
-        [`--color-${colorName}-h`]: color.h,
-        [`--color-${colorName}-s`]: color.s,
-        [`--color-${colorName}-l`]: color.l
-      };
+var applyAmountFilter = (data, filter) => {
+  return data?.filter((x) => {
+    if ((filter?.min || filter?.min === 0) && (filter?.max || filter?.max === 0)) {
+      return x.amount >= filter.min * 100 && x.amount <= filter.max * 100;
     }
-    if ("r" in color && "g" in color && "b" in color) {
-      const { h, s, l } = rgbToHsl(color);
-      return {
-        [`--color-${colorName}-h`]: h,
-        [`--color-${colorName}-s`]: `${s}%`,
-        [`--color-${colorName}-l`]: `${l}%`
-      };
+    if (filter?.min || filter?.min === 0) {
+      return x.amount >= filter.min * 100;
     }
-    if ("hex" in color) {
-      const rgb = hexToRgb(color.hex);
-      if (!rgb) {
-        return {};
-      }
-      const { h, s, l } = rgbToHsl({
-        r: rgb.r.toString(),
-        g: rgb.g.toString(),
-        b: rgb.b.toString()
-      });
-      return {
-        [`--color-${colorName}-h`]: h,
-        [`--color-${colorName}-s`]: `${s}%`,
-        [`--color-${colorName}-l`]: `${l}%`
-      };
+    if (filter?.max || filter?.max === 0) {
+      return x.amount <= filter.max * 100;
     }
-    return {};
-  } catch (_err) {
-    return {};
-  }
+  });
 };
-var parseColorFromThemeToHsl = (color) => {
-  if (!color) {
-    return;
-  }
-  try {
-    if ("h" in color && "s" in color && "l" in color) {
-      return {
-        h: Number(color.h),
-        s: Number(color.s),
-        l: Number(color.l)
-      };
+var applyAccountFilter = (data, filter) => data?.filter((x) => filter && filter.includes(x.source_account_id));
+
+// src/hooks/useBankTransactions/useBankTransactions.tsx
+import useSWRInfinite from "swr/infinite";
+var INITIAL_POLL_INTERVAL_MS = 1e3;
+var POLL_INTERVAL_AFTER_TXNS_RECEIVED_MS = 5e3;
+function useTriggerOnChange(data, anyAccountSyncing, callback) {
+  const prevDataRef = useRef();
+  useEffect3(() => {
+    if (anyAccountSyncing && prevDataRef.current !== void 0 && prevDataRef.current !== data) {
+      callback(data);
     }
-    if ("r" in color && "g" in color && "b" in color) {
-      const { h, s, l } = rgbToHsl(color);
-      return {
-        h,
-        s,
-        l
-      };
+    prevDataRef.current = data;
+  }, [data, anyAccountSyncing, callback]);
+}
+var filtersSettingString = (filters) => {
+  return `bank-transactions${filters?.categorizationStatus ? `-categorizationStatus-${filters.categorizationStatus}` : `-categorizationStatus-${"all" /* all */}`}${filters?.direction?.length === 1 ? `-direction-${filters.direction.join("-")}` : ""}${filters?.dateRange?.startDate ? `-startDate-${filters.dateRange.startDate.toISOString()}` : ""}${filters?.dateRange?.endDate ? `-endDate-${filters.dateRange.endDate.toISOString()}` : ""}`;
+};
+var useBankTransactions = (params) => {
+  const {
+    auth,
+    businessId,
+    apiUrl,
+    addToast,
+    touch,
+    read,
+    syncTimestamps,
+    hasBeenTouched,
+    eventCallbacks
+  } = useLayerContext();
+  const { scope = void 0 } = params ?? {};
+  const [filters, setTheFilters] = useState5(
+    scope ? { categorizationStatus: scope } : void 0
+  );
+  const display = useMemo2(() => {
+    if (filters?.categorizationStatus === "review" /* review */) {
+      return "review" /* review */;
+    } else if (filters?.categorizationStatus === "all" /* all */) {
+      return "all" /* all */;
     }
-    if ("hex" in color) {
-      const rgb = hexToRgb(color.hex);
-      if (!rgb) {
-        return void 0;
-      }
-      const { h, s, l } = rgbToHsl({
-        r: rgb.r.toString(),
-        g: rgb.g.toString(),
-        b: rgb.b.toString()
-      });
-      return {
-        h,
-        s,
-        l
-      };
+    return "categorized" /* categorized */;
+  }, [filters?.categorizationStatus]);
+  const [active, setActive] = useState5(false);
+  const [loadingStatus, setLoadingStatus] = useState5("initial");
+  const getKey = (index, prevData) => {
+    if (!auth?.access_token || !active) {
+      return [false, void 0];
     }
-    return;
-  } catch (_err) {
-    return;
-  }
-};
-var rgbToHsl = (color) => {
-  let r = Number(color.r);
-  let g = Number(color.g);
-  let b = Number(color.b);
-  r /= 255;
-  g /= 255;
-  b /= 255;
-  const l = Math.max(r, g, b);
-  const s = l - Math.min(r, g, b);
-  const h = s ? l === r ? (g - b) / s : l === g ? 2 + (b - r) / s : 4 + (r - g) / s : 0;
-  return {
-    h: 60 * h < 0 ? 60 * h + 360 : 60 * h,
-    s: 100 * (s ? l <= 0.5 ? s / (2 * l - s) : s / (2 - (2 * l - s)) : 0),
-    l: 100 * (2 * l - s) / 2
+    if (index === 0) {
+      return [
+        businessId && auth?.access_token && `${filtersSettingString(filters)}-${businessId}`,
+        void 0
+      ];
+    }
+    return [
+      businessId && auth?.access_token && `${filtersSettingString(filters)}-${businessId}-${prevData?.meta?.pagination?.cursor}`,
+      prevData?.meta?.pagination?.cursor.toString()
+    ];
   };
-};
-var hexToRgb = (hex) => {
-  const values = hex.replace(
-    /^#?([a-f\d])([a-f\d])([a-f\d])$/i,
-    (m, r, g, b) => "#" + r + r + g + g + b + b
-  ).substring(1).match(/.{2}/g)?.map((x) => parseInt(x, 16));
-  if (!values) {
-    return;
-  }
-  return {
-    r: values[0],
-    g: values[1],
-    b: values[2]
-  };
-};
-var buildColorsPalette = (theme) => {
-  const darkColor = parseColorFromThemeToHsl(theme?.colors?.dark) ?? COLORS.dark;
-  const lightColor = parseColorFromThemeToHsl(theme?.colors?.light) ?? COLORS.light;
-  return {
-    50: buildColorShade(50, darkColor),
-    100: buildColorShade(100, darkColor),
-    200: buildColorShade(200, darkColor),
-    300: buildColorShade(300, darkColor),
-    400: {
-      hsl: lightColor,
-      rgb: hslToRgb(lightColor),
-      hex: hslToHex(lightColor)
-    },
-    500: buildColorShade(500, darkColor),
-    600: buildColorShade(600, darkColor),
-    700: buildColorShade(700, darkColor),
-    800: buildColorShade(800, darkColor),
-    900: {
-      hsl: darkColor,
-      rgb: hslToRgb(darkColor),
-      hex: hslToHex(darkColor)
+  const {
+    data: rawResponseData,
+    isLoading,
+    isValidating,
+    error: responseError,
+    mutate,
+    size,
+    setSize
+  } = useSWRInfinite(
+    getKey,
+    async ([_query, nextCursor]) => {
+      if (auth?.access_token) {
+        return Layer.getBankTransactions(apiUrl, auth?.access_token, {
+          params: {
+            businessId,
+            cursor: nextCursor ?? "",
+            categorized: filters?.categorizationStatus ? filters?.categorizationStatus === "categorized" /* categorized */ ? "true" : filters?.categorizationStatus === "review" /* review */ ? "false" : "" : "",
+            direction: filters?.direction?.length === 1 ? filters.direction[0] === "CREDIT" /* CREDIT */ ? "INFLOW" : "OUTFLOW" : void 0,
+            startDate: filters?.dateRange?.startDate?.toISOString() ?? void 0,
+            endDate: filters?.dateRange?.endDate?.toISOString() ?? void 0
+          }
+        }).call(false);
+      }
+      return {};
     },
-    1e3: buildColorShade(1e3, darkColor)
+    {
+      initialSize: 1,
+      revalidateFirstPage: false
+    }
+  );
+  const data = useMemo2(() => {
+    if (rawResponseData && rawResponseData.length > 0) {
+      return rawResponseData?.map((x) => x?.data).flat().filter((x) => !!x);
+    }
+    return void 0;
+  }, [rawResponseData]);
+  const lastMetadata = useMemo2(() => {
+    if (rawResponseData && rawResponseData.length > 0) {
+      return rawResponseData[rawResponseData.length - 1].meta;
+    }
+    return void 0;
+  }, [rawResponseData]);
+  const hasMore = useMemo2(() => {
+    if (rawResponseData && rawResponseData.length > 0) {
+      const lastElement = rawResponseData[rawResponseData.length - 1];
+      return Boolean(
+        lastElement.meta?.pagination?.cursor && lastElement.meta?.pagination?.has_more
+      );
+    }
+    return false;
+  }, [rawResponseData]);
+  const accountsList = useMemo2(
+    () => data ? collectAccounts(data) : [],
+    [data]
+  );
+  useEffect3(() => {
+    if (isLoading && loadingStatus === "initial") {
+      setLoadingStatus("loading");
+      return;
+    }
+    if (!isLoading && loadingStatus === "loading") {
+      setLoadingStatus("complete");
+      return;
+    }
+  }, [isLoading]);
+  const activate = () => {
+    setActive(true);
   };
-};
-var buildColorShade = (shade, darkColorHsl) => {
-  const hsl = { h: darkColorHsl.h, ...SHADES[shade] };
-  const rgb = hslToRgb(hsl);
-  const hex = hslToHex(hsl);
-  return { hsl, rgb, hex };
-};
-var hueToRgb = (p, q, t) => {
-  if (t < 0)
-    t += 1;
-  if (t > 1)
-    t -= 1;
-  if (t < 1 / 6)
-    return p + (q - p) * 6 * t;
-  if (t < 1 / 2)
-    return q;
-  if (t < 2 / 3)
-    return p + (q - p) * (2 / 3 - t) * 6;
-  return p;
-};
-var hslToRgb = (hsl) => {
-  let r, g, b;
-  let l = hsl.l / 100;
-  let s = hsl.s / 100;
-  if (hsl.s === 0) {
-    r = g = b = l;
-  } else {
-    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
-    const p = 2 * l - q;
-    r = hueToRgb(p, q, hsl.h + 1 / 3);
-    g = hueToRgb(p, q, hsl.h);
-    b = hueToRgb(p, q, hsl.h - 1 / 3);
-  }
-  return {
-    r: Math.round(r * 255),
-    g: Math.round(g * 255),
-    b: Math.round(b * 255)
+  const setFilters = (value) => {
+    setTheFilters({
+      ...filters,
+      ...value ?? {}
+    });
   };
-};
-var hslToHex = (hsl) => {
-  const l = hsl.l / 100;
-  const s = hsl.s;
-  const a = s * Math.min(l, 1 - l) / 100;
-  const f = (n) => {
-    const k = (n + hsl.h / 30) % 12;
-    const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
-    return Math.round(255 * color).toString(16).padStart(2, "0");
+  const filteredData = useMemo2(() => {
+    let filtered = data;
+    if (!filtered) {
+      return;
+    }
+    if (filters?.amount?.min || filters?.amount?.max) {
+      filtered = applyAmountFilter(filtered, filters.amount);
+    }
+    if (filters?.account) {
+      filtered = applyAccountFilter(filtered, filters.account);
+    }
+    return filtered;
+  }, [filters, data]);
+  const categorize = (id, newCategory, notify) => {
+    const foundBT = data?.find((x) => x.business_id === businessId && x.id === id);
+    if (foundBT) {
+      updateOneLocal({ ...foundBT, processing: true, error: void 0 });
+    }
+    return Layer.categorizeBankTransaction(apiUrl, auth.access_token, {
+      params: { businessId, bankTransactionId: id },
+      body: newCategory
+    }).then(({ data: newBT, errors }) => {
+      if (newBT) {
+        newBT.recently_categorized = true;
+        updateOneLocal(newBT);
+      }
+      if (errors) {
+        console.error(errors);
+        throw errors;
+      }
+      if (newBT?.recently_categorized === true && notify) {
+        addToast({ content: "Transaction saved" });
+      }
+    }).catch((err) => {
+      const newBT = data?.find(
+        (x) => x.business_id === businessId && x.id === id
+      );
+      if (newBT) {
+        updateOneLocal({
+          ...newBT,
+          error: err.message,
+          processing: false
+        });
+      }
+    }).finally(() => {
+      touch("BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */);
+      eventCallbacks?.onTransactionCategorized?.(id);
+    });
   };
-  return `#${f(0)}${f(8)}${f(4)}`;
-};
-
-// src/providers/LayerProvider/LayerProvider.tsx
-import { add, isBefore } from "date-fns";
-import useSWR, { SWRConfig } from "swr";
-var reducer = (state, action) => {
-  switch (action.type) {
-    case "LayerContext.setAuth" /* setAuth */:
-    case "LayerContext.setBusiness" /* setBusiness */:
-    case "LayerContext.setCategories" /* setCategories */:
-    case "LayerContext.setTheme" /* setTheme */:
-    case "LayerContext.setOnboardingStep" /* setOnboardingStep */:
-    case "LayerContext.setColors" /* setColors */:
-      return { ...state, ...action.payload };
-    case "LayerContext.setToast" /* setToast */:
-      return {
-        ...state,
-        toasts: [
-          ...state.toasts,
-          { ...action.payload.toast, isExiting: false }
-        ]
-      };
-    case "LayerContext.setToastExit" /* setToastExit */:
+  const match = (id, matchId, notify) => {
+    const foundBT = data?.find((x) => x.business_id === businessId && x.id === id);
+    if (foundBT) {
+      updateOneLocal({ ...foundBT, processing: true, error: void 0 });
+    }
+    return Layer.matchBankTransaction(apiUrl, auth.access_token, {
+      params: { businessId, bankTransactionId: id },
+      body: { match_id: matchId, type: "Confirm_Match" /* CONFIRM_MATCH */ }
+    }).then(({ data: bt, errors }) => {
+      const newBT = data?.find(
+        (x) => x.business_id === businessId && x.id === id
+      );
+      if (newBT) {
+        newBT.recently_categorized = true;
+        newBT.match = bt;
+        newBT.categorization_status = "MATCHED" /* MATCHED */;
+        updateOneLocal(newBT);
+      }
+      if (errors) {
+        console.error(errors);
+        throw errors;
+      }
+      if (newBT?.recently_categorized === true && notify) {
+        addToast({ content: "Transaction saved" });
+      }
+    }).catch((err) => {
+      const newBT = data?.find(
+        (x) => x.business_id === businessId && x.id === id
+      );
+      if (newBT) {
+        updateOneLocal({
+          ...newBT,
+          error: err.message,
+          processing: false
+        });
+      }
+    }).finally(() => {
+      touch("BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */);
+      eventCallbacks?.onTransactionCategorized?.(id);
+    });
+  };
+  const updateOneLocal = (newBankTransaction) => {
+    const updatedData = rawResponseData?.map((page) => {
       return {
-        ...state,
-        toasts: state.toasts.map(
-          (toast) => toast.id === action.payload.toast.id ? { ...toast, isExiting: false } : toast
+        ...page,
+        data: page.data?.map(
+          (bt) => bt.id === newBankTransaction.id ? newBankTransaction : bt
         )
       };
-    case "LayerContext.removeToast" /* removeToast */:
-      return {
-        ...state,
-        toasts: state.toasts.filter((t) => t.id !== action.payload.toast.id)
-      };
-    default:
-      return state;
-  }
+    });
+    mutate(updatedData, { revalidate: false });
+  };
+  const shouldHideAfterCategorize = (bankTransaction) => {
+    return filters?.categorizationStatus === "review" /* review */;
+  };
+  const removeAfterCategorize = (bankTransaction) => {
+    if (shouldHideAfterCategorize(bankTransaction)) {
+      const updatedData = rawResponseData?.map((page) => {
+        return {
+          ...page,
+          data: page.data?.filter((bt) => bt.id !== bankTransaction.id)
+        };
+      });
+      mutate(updatedData, { revalidate: false });
+    }
+  };
+  const refetch = () => {
+    mutate();
+  };
+  const fetchMore = () => {
+    if (hasMore) {
+      setSize(size + 1);
+    }
+  };
+  const getCacheKey = (txnFilters) => {
+    return filtersSettingString(txnFilters);
+  };
+  useEffect3(() => {
+    if (isLoading || isValidating) {
+      read("BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */, getCacheKey(filters));
+    }
+  }, [isLoading, isValidating]);
+  useEffect3(() => {
+    if (hasBeenTouched(getCacheKey(filters))) {
+      refetch();
+    }
+  }, [syncTimestamps, filters]);
+  const { data: linkedAccounts, refetchAccounts } = useLinkedAccounts();
+  const anyAccountSyncing = useMemo2(
+    () => Boolean(linkedAccounts?.some((item) => item.is_syncing)),
+    [linkedAccounts]
+  );
+  const [pollIntervalMs, setPollIntervalMs] = useState5(INITIAL_POLL_INTERVAL_MS);
+  const transactionsNotSynced = useMemo2(
+    () => loadingStatus === "complete" && anyAccountSyncing && (!data || data?.length === 0),
+    [data, anyAccountSyncing, loadingStatus]
+  );
+  let intervalId = void 0;
+  const [refreshTrigger, setRefreshTrigger] = useState5(-1);
+  useEffect3(() => {
+    if (refreshTrigger !== -1) {
+      refetch();
+      refetchAccounts();
+    }
+  }, [refreshTrigger]);
+  useEffect3(() => {
+    if (anyAccountSyncing) {
+      intervalId = setInterval(() => {
+        setRefreshTrigger(Math.random());
+      }, pollIntervalMs);
+    } else {
+      if (intervalId) {
+        clearInterval(intervalId);
+      }
+    }
+    return () => {
+      if (intervalId) {
+        clearInterval(intervalId);
+      }
+    };
+  }, [anyAccountSyncing, transactionsNotSynced, pollIntervalMs]);
+  useTriggerOnChange(data, anyAccountSyncing, (newTransactionList) => {
+    clearInterval(intervalId);
+    setPollIntervalMs(POLL_INTERVAL_AFTER_TXNS_RECEIVED_MS);
+    touch("BANK_TRANSACTIONS" /* BANK_TRANSACTIONS */);
+  });
+  return {
+    data: filteredData,
+    metadata: lastMetadata,
+    loadingStatus,
+    isLoading,
+    isValidating,
+    refetch,
+    error: responseError,
+    categorize,
+    match,
+    updateOneLocal,
+    shouldHideAfterCategorize,
+    removeAfterCategorize,
+    filters,
+    setFilters,
+    accountsList,
+    activate,
+    display,
+    fetchMore,
+    hasMore
+  };
 };
-var LayerEnvironment = {
-  production: {
-    url: "https://auth.layerfi.com/oauth2/token",
-    scope: "https://api.layerfi.com/production",
-    apiUrl: "https://api.layerfi.com"
-  },
-  sandbox: {
-    url: "https://auth.layerfi.com/oauth2/token",
-    scope: "https://sandbox.layerfi.com/sandbox",
-    apiUrl: "https://sandbox.layerfi.com"
-  },
-  staging: {
-    url: "https://auth.layerfi.com/oauth2/token",
-    scope: "https://sandbox.layerfi.com/sandbox",
-    apiUrl: "https://sandbox.layerfi.com"
+
+// src/providers/BankTransactionsProvider/BankTransactionsProvider.tsx
+var BankTransactionsProvider = ({
+  children
+}) => {
+  const bankTransactionsContextData = useBankTransactions();
+  return /* @__PURE__ */ React6.createElement(BankTransactionsContext.Provider, { value: bankTransactionsContextData }, children);
+};
+
+// src/config/theme.ts
+var SHADES = {
+  50: { s: 1, l: 98 },
+  100: { s: 1, l: 96 },
+  200: { s: 1, l: 94 },
+  300: { s: 2, l: 92 },
+  500: { s: 5, l: 53 },
+  600: { s: 7, l: 40 },
+  700: { s: 9, l: 27 },
+  800: { s: 12, l: 20 },
+  1e3: { s: 20, l: 7 }
+};
+var COLORS = {
+  dark: {
+    h: 0,
+    s: 0,
+    l: 7
   },
-  internalStaging: {
-    url: "https://auth.layerfi.com/oauth2/token",
-    scope: "https://sandbox.layerfi.com/sandbox",
-    apiUrl: "https://staging.layerfi.com"
+  light: {
+    h: 0,
+    s: 0,
+    l: 100
   }
 };
-var LayerProvider = ({
-  appId,
-  appSecret,
-  businessId,
-  children,
-  businessAccessToken,
-  environment = "production",
-  theme,
-  usePlaidSandbox,
-  onError,
-  eventCallbacks
-}) => {
-  const defaultSWRConfig = {
-    revalidateInterval: 0,
-    revalidateOnFocus: false,
-    revalidateOnReconnect: false,
-    revalidateIfStale: false
-  };
-  errorHandler.setOnError(onError);
-  const colors = buildColorsPalette(theme);
-  const { url, scope, apiUrl } = LayerEnvironment[environment];
-  const [state, dispatch] = useReducer(reducer, {
-    auth: {
-      access_token: "",
-      token_type: "",
-      expires_in: 0,
-      expires_at: new Date(2e3, 1, 1)
-    },
-    businessId,
-    business: void 0,
-    categories: [],
-    apiUrl,
-    theme,
-    colors,
-    usePlaidSandbox,
-    onboardingStep: void 0,
-    environment,
-    toasts: [],
-    eventCallbacks: {}
-  });
-  const { touch, syncTimestamps, read, readTimestamps, hasBeenTouched } = useDataSync();
-  const { data: auth } = appId !== void 0 && appSecret !== void 0 ? useSWR(
-    businessAccessToken === void 0 && appId !== void 0 && appSecret !== void 0 && isBefore(state.auth.expires_at, /* @__PURE__ */ new Date()) && "authenticate",
-    Layer.authenticate({
-      appId,
-      appSecret,
-      authenticationUrl: url,
-      scope
-    }),
-    defaultSWRConfig
-  ) : { data: void 0 };
-  useEffect3(() => {
-    if (businessAccessToken) {
-      dispatch({
-        type: "LayerContext.setAuth" /* setAuth */,
-        payload: {
-          auth: {
-            access_token: businessAccessToken,
-            token_type: "Bearer",
-            expires_in: 3600,
-            expires_at: add(/* @__PURE__ */ new Date(), { seconds: 3600 })
-          }
-        }
-      });
-    } else if (auth?.access_token) {
-      dispatch({
-        type: "LayerContext.setAuth" /* setAuth */,
-        payload: {
-          auth: {
-            ...auth,
-            expires_at: add(/* @__PURE__ */ new Date(), { seconds: auth.expires_in })
-          }
-        }
-      });
+
+// src/utils/colors.ts
+var parseStylesFromThemeConfig = (theme) => {
+  let styles = {};
+  if (!theme) {
+    return styles;
+  }
+  if (theme.colors) {
+    const darkColor = parseColorFromTheme("dark", theme.colors.dark);
+    const lightColor = parseColorFromTheme("light", theme.colors.light);
+    const textColor = parseTextColorFromTheme(theme.colors.text);
+    styles = { ...styles, ...darkColor, ...lightColor, ...textColor };
+  }
+  return styles;
+};
+var parseTextColorFromTheme = (color) => {
+  if (!color) {
+    return {};
+  }
+  try {
+    if ("hex" in color) {
+      return { "--text-color-primary": color.hex };
     }
-  }, [businessAccessToken, auth?.access_token]);
-  const { data: categoriesData } = useSWR(
-    businessId && state.auth?.access_token && `categories-${businessId}`,
-    Layer.getCategories(apiUrl, state.auth?.access_token, {
-      params: { businessId }
-    }),
-    {
-      ...defaultSWRConfig,
-      onSuccess: (response) => {
-        if (response?.data?.categories?.length) {
-          dispatch({
-            type: "LayerContext.setCategories" /* setCategories */,
-            payload: { categories: response.data.categories || [] }
-          });
-        }
-      }
+    return {};
+  } catch (_err) {
+    return {};
+  }
+};
+var parseColorFromTheme = (colorName, color) => {
+  if (!color) {
+    return {};
+  }
+  try {
+    if ("h" in color && "s" in color && "l" in color) {
+      return {
+        [`--color-${colorName}-h`]: color.h,
+        [`--color-${colorName}-s`]: color.s,
+        [`--color-${colorName}-l`]: color.l
+      };
     }
-  );
-  useEffect3(() => {
-    if (categoriesData?.data?.categories?.length) {
-      dispatch({
-        type: "LayerContext.setCategories" /* setCategories */,
-        payload: { categories: categoriesData.data.categories || [] }
-      });
+    if ("r" in color && "g" in color && "b" in color) {
+      const { h, s, l } = rgbToHsl(color);
+      return {
+        [`--color-${colorName}-h`]: h,
+        [`--color-${colorName}-s`]: `${s}%`,
+        [`--color-${colorName}-l`]: `${l}%`
+      };
     }
-  }, [categoriesData]);
-  const { data: businessData } = useSWR(
-    businessId && state?.auth?.access_token && `business-${businessId}`,
-    Layer.getBusiness(apiUrl, state?.auth?.access_token, {
-      params: { businessId }
-    }),
-    {
-      ...defaultSWRConfig,
-      onSuccess: (response) => {
-        if (response?.data) {
-          dispatch({
-            type: "LayerContext.setBusiness" /* setBusiness */,
-            payload: { business: response.data || [] }
-          });
-        }
+    if ("hex" in color) {
+      const rgb = hexToRgb(color.hex);
+      if (!rgb) {
+        return {};
       }
-    }
-  );
-  useEffect3(() => {
-    if (businessData?.data) {
-      dispatch({
-        type: "LayerContext.setBusiness" /* setBusiness */,
-        payload: { business: businessData.data || [] }
+      const { h, s, l } = rgbToHsl({
+        r: rgb.r.toString(),
+        g: rgb.g.toString(),
+        b: rgb.b.toString()
       });
+      return {
+        [`--color-${colorName}-h`]: h,
+        [`--color-${colorName}-s`]: `${s}%`,
+        [`--color-${colorName}-l`]: `${l}%`
+      };
     }
-  }, [businessData]);
-  const setTheme = (theme2) => {
-    dispatch({
-      type: "LayerContext.setTheme" /* setTheme */,
-      payload: { theme: theme2 }
-    });
-    dispatch({
-      type: "LayerContext.setColors" /* setColors */,
-      payload: { colors: buildColorsPalette(theme2) }
-    });
-  };
-  const setLightColor = (color) => {
-    setTheme({
-      ...state.theme ?? {},
-      colors: {
-        ...state.theme?.colors ?? {},
-        light: color
-      }
-    });
-  };
-  const setDarkColor = (color) => {
-    setTheme({
-      ...state.theme ?? {},
-      colors: {
-        ...state.theme?.colors ?? {},
-        dark: color
-      }
-    });
-  };
-  const setTextColor = (color) => {
-    setTheme({
-      ...state.theme ?? {},
-      colors: {
-        ...state.theme?.colors ?? {},
-        text: color
+    return {};
+  } catch (_err) {
+    return {};
+  }
+};
+var parseColorFromThemeToHsl = (color) => {
+  if (!color) {
+    return;
+  }
+  try {
+    if ("h" in color && "s" in color && "l" in color) {
+      return {
+        h: Number(color.h),
+        s: Number(color.s),
+        l: Number(color.l)
+      };
+    }
+    if ("r" in color && "g" in color && "b" in color) {
+      const { h, s, l } = rgbToHsl(color);
+      return {
+        h,
+        s,
+        l
+      };
+    }
+    if ("hex" in color) {
+      const rgb = hexToRgb(color.hex);
+      if (!rgb) {
+        return void 0;
       }
-    });
-  };
-  const setToast = (toast) => {
-    dispatch({ type: "LayerContext.setToast" /* setToast */, payload: { toast } });
+      const { h, s, l } = rgbToHsl({
+        r: rgb.r.toString(),
+        g: rgb.g.toString(),
+        b: rgb.b.toString()
+      });
+      return {
+        h,
+        s,
+        l
+      };
+    }
+    return;
+  } catch (_err) {
+    return;
+  }
+};
+var rgbToHsl = (color) => {
+  let r = Number(color.r);
+  let g = Number(color.g);
+  let b = Number(color.b);
+  r /= 255;
+  g /= 255;
+  b /= 255;
+  const l = Math.max(r, g, b);
+  const s = l - Math.min(r, g, b);
+  const h = s ? l === r ? (g - b) / s : l === g ? 2 + (b - r) / s : 4 + (r - g) / s : 0;
+  return {
+    h: 60 * h < 0 ? 60 * h + 360 : 60 * h,
+    s: 100 * (s ? l <= 0.5 ? s / (2 * l - s) : s / (2 - (2 * l - s)) : 0),
+    l: 100 * (2 * l - s) / 2
   };
-  const removeToast = (toast) => {
-    dispatch({ type: "LayerContext.removeToast" /* removeToast */, payload: { toast } });
+};
+var hexToRgb = (hex) => {
+  const values = hex.replace(
+    /^#?([a-f\d])([a-f\d])([a-f\d])$/i,
+    (m, r, g, b) => "#" + r + r + g + g + b + b
+  ).substring(1).match(/.{2}/g)?.map((x) => parseInt(x, 16));
+  if (!values) {
+    return;
+  }
+  return {
+    r: values[0],
+    g: values[1],
+    b: values[2]
   };
-  const setToastExit = (toast) => {
-    dispatch({ type: "LayerContext.setToastExit" /* setToastExit */, payload: { toast } });
+};
+var buildColorsPalette = (theme) => {
+  const darkColor = parseColorFromThemeToHsl(theme?.colors?.dark) ?? COLORS.dark;
+  const lightColor = parseColorFromThemeToHsl(theme?.colors?.light) ?? COLORS.light;
+  return {
+    50: buildColorShade(50, darkColor),
+    100: buildColorShade(100, darkColor),
+    200: buildColorShade(200, darkColor),
+    300: buildColorShade(300, darkColor),
+    400: {
+      hsl: lightColor,
+      rgb: hslToRgb(lightColor),
+      hex: hslToHex(lightColor)
+    },
+    500: buildColorShade(500, darkColor),
+    600: buildColorShade(600, darkColor),
+    700: buildColorShade(700, darkColor),
+    800: buildColorShade(800, darkColor),
+    900: {
+      hsl: darkColor,
+      rgb: hslToRgb(darkColor),
+      hex: hslToHex(darkColor)
+    },
+    1e3: buildColorShade(1e3, darkColor)
   };
-  const addToast = (toast) => {
-    const id = `${Date.now()}-${Math.random()}`;
-    const newToast = { id, isExiting: false, ...toast };
-    setToast(newToast);
-    setTimeout(() => {
-      removeToast(newToast);
-      setTimeout(() => {
-        setToastExit(newToast);
-      }, 1e3);
-    }, toast.duration || 2e3);
+};
+var buildColorShade = (shade, darkColorHsl) => {
+  const hsl = { h: darkColorHsl.h, ...SHADES[shade] };
+  const rgb = hslToRgb(hsl);
+  const hex = hslToHex(hsl);
+  return { hsl, rgb, hex };
+};
+var hueToRgb = (p, q, t) => {
+  if (t < 0)
+    t += 1;
+  if (t > 1)
+    t -= 1;
+  if (t < 1 / 6)
+    return p + (q - p) * 6 * t;
+  if (t < 1 / 2)
+    return q;
+  if (t < 2 / 3)
+    return p + (q - p) * (2 / 3 - t) * 6;
+  return p;
+};
+var hslToRgb = (hsl) => {
+  let r, g, b;
+  let l = hsl.l / 100;
+  let s = hsl.s / 100;
+  if (hsl.s === 0) {
+    r = g = b = l;
+  } else {
+    const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
+    const p = 2 * l - q;
+    r = hueToRgb(p, q, hsl.h + 1 / 3);
+    g = hueToRgb(p, q, hsl.h);
+    b = hueToRgb(p, q, hsl.h - 1 / 3);
+  }
+  return {
+    r: Math.round(r * 255),
+    g: Math.round(g * 255),
+    b: Math.round(b * 255)
   };
-  const setColors = (colors2) => setTheme({
-    ...state.theme ?? {},
-    colors: colors2
-  });
-  const getColor = (shade) => {
-    if (state.colors && shade in state.colors) {
-      return state.colors[shade];
-    }
-    return;
+};
+var hslToHex = (hsl) => {
+  const l = hsl.l / 100;
+  const s = hsl.s;
+  const a = s * Math.min(l, 1 - l) / 100;
+  const f = (n) => {
+    const k = (n + hsl.h / 30) % 12;
+    const color = l - a * Math.max(Math.min(k - 3, 9 - k, 1), -1);
+    return Math.round(255 * color).toString(16).padStart(2, "0");
   };
-  const setOnboardingStep = (value) => dispatch({
-    type: "LayerContext.setOnboardingStep" /* setOnboardingStep */,
-    payload: { onboardingStep: value }
-  });
-  const drawerContextData = useDrawer();
-  return /* @__PURE__ */ React7.createElement(SWRConfig, { value: defaultSWRConfig }, /* @__PURE__ */ React7.createElement(
-    LayerContext.Provider,
-    {
-      value: {
-        ...state,
-        setTheme,
-        getColor,
-        setLightColor,
-        setDarkColor,
-        setTextColor,
-        setColors,
-        setOnboardingStep,
-        addToast,
-        removeToast,
-        onError: errorHandler.onError,
-        touch,
-        read,
-        syncTimestamps,
-        readTimestamps,
-        hasBeenTouched,
-        eventCallbacks
-      }
-    },
-    /* @__PURE__ */ React7.createElement(BankTransactionsProvider, null, /* @__PURE__ */ React7.createElement(DrawerContext.Provider, { value: drawerContextData }, children, /* @__PURE__ */ React7.createElement(GlobalWidgets, null)))
-  ));
+  return `#${f(0)}${f(8)}${f(4)}`;
 };
 
-// src/components/Onboarding/Onboarding.tsx
-import React44, { useContext as useContext6, useEffect as useEffect6, useState as useState8 } from "react";
-
-// src/contexts/LinkedAccountsContext/LinkedAccountsContext.ts
-import { createContext as createContext4 } from "react";
-var LinkedAccountsContext = createContext4({
-  data: void 0,
-  isLoading: false,
-  loadingStatus: "initial",
-  isValidating: false,
-  error: void 0,
-  updateConnectionStatus: () => {
-  },
-  addConnection: () => {
-  },
-  removeConnection: () => {
-  },
-  repairConnection: () => {
-  },
-  refetchAccounts: () => {
-  },
-  unlinkAccount: () => {
-  },
-  denyAccount: () => {
-  },
-  confirmAccount: () => {
-  },
-  breakConnection: () => {
-  },
-  syncAccounts: () => {
+// src/providers/LayerProvider/LayerProvider.tsx
+import { add, isBefore } from "date-fns";
+import useSWR2, { SWRConfig } from "swr";
+var reducer = (state, action) => {
+  switch (action.type) {
+    case "LayerContext.setAuth" /* setAuth */:
+    case "LayerContext.setBusiness" /* setBusiness */:
+    case "LayerContext.setCategories" /* setCategories */:
+    case "LayerContext.setTheme" /* setTheme */:
+    case "LayerContext.setOnboardingStep" /* setOnboardingStep */:
+    case "LayerContext.setColors" /* setColors */:
+      return { ...state, ...action.payload };
+    case "LayerContext.setToast" /* setToast */:
+      return {
+        ...state,
+        toasts: [
+          ...state.toasts,
+          { ...action.payload.toast, isExiting: false }
+        ]
+      };
+    case "LayerContext.setToastExit" /* setToastExit */:
+      return {
+        ...state,
+        toasts: state.toasts.map(
+          (toast) => toast.id === action.payload.toast.id ? { ...toast, isExiting: false } : toast
+        )
+      };
+    case "LayerContext.removeToast" /* removeToast */:
+      return {
+        ...state,
+        toasts: state.toasts.filter((t) => t.id !== action.payload.toast.id)
+      };
+    default:
+      return state;
   }
-});
-
-// src/providers/LinkedAccountsProvider/LinkedAccountsProvider.tsx
-import React8 from "react";
-
-// src/hooks/useLinkedAccounts/useLinkedAccounts.ts
-import { useEffect as useEffect4, useState as useState5 } from "react";
-import { usePlaidLink } from "react-plaid-link";
-
-// src/hooks/useLinkedAccounts/mockData.ts
-var LINKED_ACCOUNTS_MOCK_DATA = [
-  {
-    id: "d800ada8-8075-4436-a712-08efabcbd51a",
-    external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-    external_account_source: "PLAID",
-    external_account_name: "Citi Double Cash\xAE Card",
-    mask: "1234",
-    latest_balance_timestamp: {
-      external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-      external_account_source: "PLAID",
-      balance: 435121,
-      at: "2024-04-03T13:00:00Z",
-      created_at: "2024-04-06T22:47:59.715458Z"
-    },
-    current_ledger_balance: 373717,
-    institution: {
-      name: "Chase",
-      logo: ""
-    },
-    connection_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-    connection_external_id: "11111",
-    connection_needs_repair_as_of: null,
-    requires_user_confirmation_as_of: null,
-    is_syncing: true
+};
+var LayerEnvironment = {
+  production: {
+    url: "https://auth.layerfi.com/oauth2/token",
+    scope: "https://api.layerfi.com/production",
+    apiUrl: "https://api.layerfi.com"
   },
-  {
-    id: "f98ec50a-c370-484d-a35b-d00207436075",
-    external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-    external_account_source: "PLAID",
-    external_account_name: "Citi Double Cash\xAE Card",
-    mask: "1234",
-    latest_balance_timestamp: {
-      external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-      external_account_source: "PLAID",
-      balance: 435121,
-      at: "2024-04-03T13:00:00Z",
-      created_at: "2024-04-06T16:44:35.715458Z"
-    },
-    current_ledger_balance: 373717,
-    institution: {
-      name: "Chase",
-      logo: ""
-    },
-    connection_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-    connection_external_id: "11111",
-    connection_needs_repair_as_of: null,
-    requires_user_confirmation_as_of: null,
-    is_syncing: false
+  sandbox: {
+    url: "https://auth.layerfi.com/oauth2/token",
+    scope: "https://sandbox.layerfi.com/sandbox",
+    apiUrl: "https://sandbox.layerfi.com"
   },
-  {
-    id: "843f1748-fdaa-422d-a73d-2489a40c8dc7",
-    external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-    external_account_source: "PLAID",
-    external_account_name: "Citi Double Cash\xAE Card",
-    mask: "1234",
-    latest_balance_timestamp: {
-      external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-      external_account_source: "PLAID",
-      balance: 435121,
-      at: "2024-04-03T13:00:00Z",
-      created_at: "2024-04-06T16:44:35.715458Z"
-    },
-    current_ledger_balance: 373717,
-    institution: {
-      name: "Chase",
-      logo: ""
-    },
-    connection_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-    connection_external_id: "11111",
-    connection_needs_repair_as_of: "2024-03-06T16:44:35.715458Z",
-    requires_user_confirmation_as_of: null,
-    is_syncing: false
+  staging: {
+    url: "https://auth.layerfi.com/oauth2/token",
+    scope: "https://sandbox.layerfi.com/sandbox",
+    apiUrl: "https://sandbox.layerfi.com"
   },
-  {
-    id: "8f430e29-e339-4d71-a08a-fce469c7a7c1",
-    external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-    external_account_source: "PLAID",
-    external_account_name: "Citi Double Cash\xAE Card",
-    mask: "1234",
-    latest_balance_timestamp: {
-      external_account_external_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-      external_account_source: "PLAID",
-      balance: 435121,
-      at: "2024-04-03T13:00:00Z",
-      created_at: "2024-04-06T16:44:35.715458Z"
-    },
-    current_ledger_balance: 373717,
-    institution: {
-      name: "Chase",
-      logo: ""
-    },
-    connection_id: "0Br385JmgbTryJn8nEBnUb4A5ydv06U9Vbqqq",
-    connection_external_id: "11111",
-    connection_needs_repair_as_of: null,
-    requires_user_confirmation_as_of: "2024-03-06T16:44:35.715458Z",
-    is_syncing: false
+  internalStaging: {
+    url: "https://auth.layerfi.com/oauth2/token",
+    scope: "https://sandbox.layerfi.com/sandbox",
+    apiUrl: "https://staging.layerfi.com"
   }
-];
-
-// src/hooks/useLinkedAccounts/useLinkedAccounts.ts
-import useSWR2 from "swr";
-var DEBUG = true;
-var USE_MOCK_RESPONSE_DATA = false;
-var useLinkedAccounts = () => {
-  const {
-    auth,
+};
+var LayerProvider = ({
+  appId,
+  appSecret,
+  businessId,
+  children,
+  businessAccessToken,
+  environment = "production",
+  theme,
+  usePlaidSandbox,
+  onError,
+  eventCallbacks
+}) => {
+  const defaultSWRConfig = {
+    revalidateInterval: 0,
+    revalidateOnFocus: false,
+    revalidateOnReconnect: false,
+    revalidateIfStale: false
+  };
+  errorHandler.setOnError(onError);
+  const colors = buildColorsPalette(theme);
+  const { url, scope, apiUrl } = LayerEnvironment[environment];
+  const [state, dispatch] = useReducer(reducer, {
+    auth: {
+      access_token: "",
+      token_type: "",
+      expires_in: 0,
+      expires_at: new Date(2e3, 1, 1)
+    },
     businessId,
+    business: void 0,
+    categories: [],
     apiUrl,
+    theme,
+    colors,
     usePlaidSandbox,
+    onboardingStep: void 0,
+    environment,
+    toasts: [],
+    eventCallbacks: {}
+  });
+  const {
     touch,
-    read,
     syncTimestamps,
-    hasBeenTouched
-  } = useLayerContext();
-  const [linkToken, setLinkToken] = useState5(null);
-  const [loadingStatus, setLoadingStatus] = useState5("initial");
-  const USE_PLAID_SANDBOX = usePlaidSandbox ?? true;
-  const [linkMode, setLinkMode] = useState5("add");
-  const queryKey = businessId && auth?.access_token && `linked-accounts-${businessId}`;
-  const {
-    data: responseData,
-    isLoading,
-    isValidating,
-    error: responseError,
-    mutate
-  } = useSWR2(
-    queryKey,
-    Layer.getLinkedAccounts(apiUrl, auth?.access_token, {
-      params: { businessId }
-    })
-  );
-  useEffect4(() => {
-    if (!isLoading && responseData?.data.external_accounts) {
-      setLoadingStatus("complete");
-      return;
-    }
-    if (isLoading && loadingStatus === "initial") {
-      setLoadingStatus("loading");
-      return;
-    }
-    if (!isLoading && loadingStatus === "loading") {
-      setLoadingStatus("complete");
-    }
-  }, [isLoading]);
-  const fetchPlaidLinkToken = async () => {
-    if (auth?.access_token) {
-      const linkToken2 = (await Layer.getPlaidLinkToken(apiUrl, auth.access_token, {
-        params: { businessId }
-      })).data.link_token;
-      setLinkMode("add");
-      setLinkToken(linkToken2);
-    }
-  };
-  const fetchPlaidUpdateModeLinkToken = async (plaidItemPlaidId) => {
-    if (auth?.access_token) {
-      const linkToken2 = (await Layer.getPlaidUpdateModeLinkToken(apiUrl, auth.access_token, {
-        params: { businessId },
-        body: { plaid_item_id: plaidItemPlaidId }
-      })).data.link_token;
-      setLinkMode("update");
-      setLinkToken(linkToken2);
-    }
-  };
-  const exchangePlaidPublicToken2 = async (publicToken, metadata) => {
-    await Layer.exchangePlaidPublicToken(apiUrl, auth?.access_token, {
-      params: { businessId },
-      body: { public_token: publicToken, institution: metadata.institution }
-    });
-    refetchAccounts();
-  };
-  const { open: plaidLinkStart, ready: plaidLinkReady } = usePlaidLink({
-    token: linkToken,
-    // If in update mode, we don't need to exchange the public token for an access token.
-    // The existing access token will automatically become valid again
-    onSuccess: async (publicToken, metadata) => {
-      if (linkMode == "add") {
-        exchangePlaidPublicToken2(publicToken, metadata);
-      } else {
-        await updateConnectionStatus2();
-        refetchAccounts();
-        setLinkMode("add");
-        touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
-      }
-    },
-    onExit: () => setLinkMode("add"),
-    env: USE_PLAID_SANDBOX ? "sandbox" : void 0
-  });
+    read,
+    readTimestamps,
+    hasBeenTouched,
+    resetCaches
+  } = useDataSync();
+  const { data: auth } = appId !== void 0 && appSecret !== void 0 ? useSWR2(
+    businessAccessToken === void 0 && appId !== void 0 && appSecret !== void 0 && isBefore(state.auth.expires_at, /* @__PURE__ */ new Date()) && "authenticate",
+    Layer.authenticate({
+      appId,
+      appSecret,
+      authenticationUrl: url,
+      scope
+    }),
+    defaultSWRConfig
+  ) : { data: void 0 };
   useEffect4(() => {
-    if (plaidLinkReady) {
-      plaidLinkStart();
-    }
-  }, [plaidLinkStart, plaidLinkReady]);
-  const mockResponseData = {
-    data: LINKED_ACCOUNTS_MOCK_DATA,
-    meta: {},
-    error: void 0
-  };
-  const addConnection = (source) => {
-    if (source === "PLAID") {
-      fetchPlaidLinkToken();
-    } else {
-      console.error(
-        `Adding a connection with source ${source} not yet supported`
-      );
-    }
-  };
-  const repairConnection = async (source, connectionExternalId) => {
-    if (source === "PLAID") {
-      await fetchPlaidUpdateModeLinkToken(connectionExternalId);
-    } else {
-      console.error(
-        `Repairing a connection with source ${source} not yet supported`
-      );
-    }
-  };
-  const removeConnection = async (source, connectionExternalId) => {
-    if (source === "PLAID") {
-      await unlinkPlaidItem2(connectionExternalId);
-      await refetchAccounts();
-    } else {
-      console.error(
-        `Removing a connection with source ${source} not yet supported`
-      );
-    }
-  };
-  const unlinkAccount2 = async (source, accountId) => {
-    DEBUG && console.log("unlinking account");
-    if (source === "PLAID") {
-      await Layer.unlinkAccount(apiUrl, auth?.access_token, {
-        params: { businessId, accountId }
+    if (businessAccessToken) {
+      dispatch({
+        type: "LayerContext.setAuth" /* setAuth */,
+        payload: {
+          auth: {
+            access_token: businessAccessToken,
+            token_type: "Bearer",
+            expires_in: 3600,
+            expires_at: add(/* @__PURE__ */ new Date(), { seconds: 3600 })
+          }
+        }
+      });
+    } else if (auth?.access_token) {
+      dispatch({
+        type: "LayerContext.setAuth" /* setAuth */,
+        payload: {
+          auth: {
+            ...auth,
+            expires_at: add(/* @__PURE__ */ new Date(), { seconds: auth.expires_in })
+          }
+        }
       });
-      await refetchAccounts();
-      touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
-    } else {
-      console.error(
-        `Unlinking an account with source ${source} not yet supported`
-      );
     }
-  };
-  const confirmAccount = async (source, accountId) => {
-    DEBUG && console.log("confirming account");
-    if (source === "PLAID") {
-      await Layer.confirmConnection(apiUrl, auth?.access_token, {
-        params: {
-          businessId,
-          accountId
+  }, [businessAccessToken, auth?.access_token]);
+  const { data: categoriesData } = useSWR2(
+    businessId && state.auth?.access_token && `categories-${businessId}`,
+    Layer.getCategories(apiUrl, state.auth?.access_token, {
+      params: { businessId }
+    }),
+    {
+      ...defaultSWRConfig,
+      onSuccess: (response) => {
+        if (response?.data?.categories?.length) {
+          dispatch({
+            type: "LayerContext.setCategories" /* setCategories */,
+            payload: { categories: response.data.categories || [] }
+          });
         }
+      }
+    }
+  );
+  useEffect4(() => {
+    if (categoriesData?.data?.categories?.length) {
+      dispatch({
+        type: "LayerContext.setCategories" /* setCategories */,
+        payload: { categories: categoriesData.data.categories || [] }
       });
-      await refetchAccounts();
-      touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
-    } else {
-      console.error(
-        `Confirming an account with source ${source} not yet supported`
-      );
     }
-  };
-  const denyAccount = async (source, accountId) => {
-    DEBUG && console.log("confirming account");
-    if (source === "PLAID") {
-      await Layer.denyConnection(apiUrl, auth?.access_token, {
-        params: {
-          businessId,
-          accountId
+  }, [categoriesData]);
+  const { data: businessData } = useSWR2(
+    businessId && state?.auth?.access_token && `business-${businessId}`,
+    Layer.getBusiness(apiUrl, state?.auth?.access_token, {
+      params: { businessId }
+    }),
+    {
+      ...defaultSWRConfig,
+      onSuccess: (response) => {
+        if (response?.data) {
+          dispatch({
+            type: "LayerContext.setBusiness" /* setBusiness */,
+            payload: { business: response.data || [] }
+          });
         }
-      });
-      await refetchAccounts();
-      touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
-    } else {
-      console.error(
-        `Denying an account with source ${source} not yet supported`
-      );
+      }
     }
-  };
-  const breakConnection = async (source, connectionExternalId) => {
-    DEBUG && console.log("Breaking sandbox plaid item connection");
-    if (source === "PLAID") {
-      await Layer.breakPlaidItemConnection(apiUrl, auth?.access_token, {
-        params: {
-          businessId,
-          plaidItemPlaidId: connectionExternalId
-        }
+  );
+  useEffect4(() => {
+    if (businessData?.data) {
+      dispatch({
+        type: "LayerContext.setBusiness" /* setBusiness */,
+        payload: { business: businessData.data || [] }
       });
-      await refetchAccounts();
-      touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
-    } else {
-      console.error(
-        `Breaking a sandbox connection with source ${source} not yet supported`
-      );
     }
+  }, [businessData]);
+  const setTheme = (theme2) => {
+    dispatch({
+      type: "LayerContext.setTheme" /* setTheme */,
+      payload: { theme: theme2 }
+    });
+    dispatch({
+      type: "LayerContext.setColors" /* setColors */,
+      payload: { colors: buildColorsPalette(theme2) }
+    });
   };
-  const refetchAccounts = async () => {
-    DEBUG && console.log("refetching accounts...");
-    await mutate();
-  };
-  const syncAccounts = async () => {
-    DEBUG && console.log("resyncing accounts...");
-    await Layer.syncConnection(apiUrl, auth?.access_token, {
-      params: { businessId }
+  const setLightColor = (color) => {
+    setTheme({
+      ...state.theme ?? {},
+      colors: {
+        ...state.theme?.colors ?? {},
+        light: color
+      }
     });
   };
-  const updateConnectionStatus2 = async () => {
-    DEBUG && console.log("updating connection status...");
-    await Layer.updateConnectionStatus(apiUrl, auth?.access_token, {
-      params: { businessId }
+  const setDarkColor = (color) => {
+    setTheme({
+      ...state.theme ?? {},
+      colors: {
+        ...state.theme?.colors ?? {},
+        dark: color
+      }
     });
   };
-  const unlinkPlaidItem2 = async (plaidItemPlaidId) => {
-    DEBUG && console.log("unlinking plaid item");
-    await Layer.unlinkPlaidItem(apiUrl, auth?.access_token, {
-      params: { businessId, plaidItemPlaidId }
+  const setTextColor = (color) => {
+    setTheme({
+      ...state.theme ?? {},
+      colors: {
+        ...state.theme?.colors ?? {},
+        text: color
+      }
     });
-    await refetchAccounts();
-    touch("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */);
   };
-  useEffect4(() => {
-    if (queryKey && (isLoading || isValidating)) {
-      read("LINKED_ACCOUNTS" /* LINKED_ACCOUNTS */, queryKey);
-    }
-  }, [isLoading, isValidating]);
-  useEffect4(() => {
-    if (queryKey && hasBeenTouched(queryKey)) {
-      refetchAccounts();
+  const setToast = (toast) => {
+    dispatch({ type: "LayerContext.setToast" /* setToast */, payload: { toast } });
+  };
+  const removeToast = (toast) => {
+    dispatch({ type: "LayerContext.removeToast" /* removeToast */, payload: { toast } });
+  };
+  const setToastExit = (toast) => {
+    dispatch({ type: "LayerContext.setToastExit" /* setToastExit */, payload: { toast } });
+  };
+  const addToast = (toast) => {
+    const id = `${Date.now()}-${Math.random()}`;
+    const newToast = { id, isExiting: false, ...toast };
+    setToast(newToast);
+    setTimeout(() => {
+      removeToast(newToast);
+      setTimeout(() => {
+        setToastExit(newToast);
+      }, 1e3);
+    }, toast.duration || 2e3);
+  };
+  const setColors = (colors2) => setTheme({
+    ...state.theme ?? {},
+    colors: colors2
+  });
+  const getColor = (shade) => {
+    if (state.colors && shade in state.colors) {
+      return state.colors[shade];
     }
-  }, [syncTimestamps]);
-  return {
-    data: USE_MOCK_RESPONSE_DATA ? mockResponseData.data : responseData?.data.external_accounts,
-    isLoading,
-    loadingStatus,
-    isValidating,
-    error: responseError,
-    addConnection,
-    removeConnection,
-    repairConnection,
-    refetchAccounts,
-    unlinkAccount: unlinkAccount2,
-    confirmAccount,
-    denyAccount,
-    breakConnection,
-    syncAccounts,
-    updateConnectionStatus: updateConnectionStatus2
+    return;
   };
+  const setOnboardingStep = (value) => dispatch({
+    type: "LayerContext.setOnboardingStep" /* setOnboardingStep */,
+    payload: { onboardingStep: value }
+  });
+  const drawerContextData = useDrawer();
+  return /* @__PURE__ */ React7.createElement(SWRConfig, { value: defaultSWRConfig }, /* @__PURE__ */ React7.createElement(
+    LayerContext.Provider,
+    {
+      value: {
+        ...state,
+        setTheme,
+        getColor,
+        setLightColor,
+        setDarkColor,
+        setTextColor,
+        setColors,
+        setOnboardingStep,
+        addToast,
+        removeToast,
+        onError: errorHandler.onError,
+        touch,
+        read,
+        syncTimestamps,
+        readTimestamps,
+        expireDataCaches: resetCaches,
+        hasBeenTouched,
+        eventCallbacks
+      }
+    },
+    /* @__PURE__ */ React7.createElement(BankTransactionsProvider, null, /* @__PURE__ */ React7.createElement(DrawerContext.Provider, { value: drawerContextData }, children, /* @__PURE__ */ React7.createElement(GlobalWidgets, null)))
+  ));
 };
 
+// src/components/Onboarding/Onboarding.tsx
+import React44, { useContext as useContext6, useEffect as useEffect6, useState as useState8 } from "react";
+
+// src/contexts/LinkedAccountsContext/LinkedAccountsContext.ts
+import { createContext as createContext4 } from "react";
+var LinkedAccountsContext = createContext4({
+  data: void 0,
+  isLoading: false,
+  loadingStatus: "initial",
+  isValidating: false,
+  error: void 0,
+  updateConnectionStatus: () => {
+  },
+  addConnection: () => {
+  },
+  removeConnection: () => {
+  },
+  repairConnection: () => {
+  },
+  refetchAccounts: () => {
+  },
+  unlinkAccount: () => {
+  },
+  denyAccount: () => {
+  },
+  confirmAccount: () => {
+  },
+  breakConnection: () => {
+  },
+  syncAccounts: () => {
+  }
+});
+
 // src/providers/LinkedAccountsProvider/LinkedAccountsProvider.tsx
+import React8 from "react";
 var LinkedAccountsProvider = ({
   children
 }) => {
@@ -2218,8 +2259,32 @@ var Sunrise = ({ size = 12, ...props }) => /* @__PURE__ */ React16.createElement
 );
 var Sunrise_default = Sunrise;
 
+// src/components/BankTransactions/constants.ts
+var CategorizedCategories = [
+  "CATEGORIZED" /* CATEGORIZED */,
+  "JOURNALING" /* JOURNALING */,
+  "SPLIT" /* SPLIT */,
+  "MATCHED" /* MATCHED */
+];
+var ReviewCategories = [
+  "READY_FOR_INPUT" /* READY_FOR_INPUT */,
+  "LAYER_REVIEW" /* LAYER_REVIEW */
+];
+
+// src/components/BankTransactions/utils.ts
+var filterVisibility = (scope, bankTransaction) => {
+  const categorized = CategorizedCategories.includes(
+    bankTransaction.categorization_status
+  );
+  const inReview = ReviewCategories.includes(
+    bankTransaction.categorization_status
+  );
+  return scope === "all" /* all */ || scope === "review" /* review */ && inReview || scope === "categorized" /* categorized */ && categorized;
+};
+var isCategorized = (bankTransaction) => CategorizedCategories.includes(bankTransaction.categorization_status);
+
 // src/utils/bankTransactions.ts
-import { isWithinInterval, parseISO as parseISO2 } from "date-fns";
+import { isWithinInterval, parseISO } from "date-fns";
 var hasMatch = (bankTransaction) => {
   return Boolean(
     bankTransaction?.suggested_matches && bankTransaction?.suggested_matches?.length > 0 || bankTransaction?.match
@@ -2247,7 +2312,7 @@ var countTransactionsToReview = ({
       };
       return transactions.filter((tx) => {
         try {
-          return filterVisibility("review" /* review */, tx) && isWithinInterval(parseISO2(tx.date), dateRangeInterval);
+          return filterVisibility("review" /* review */, tx) && isWithinInterval(parseISO(tx.date), dateRangeInterval);
         } catch (_err) {
           return false;
         }
@@ -2304,7 +2369,7 @@ var ChevronRight = ({ size = 18, ...props }) => /* @__PURE__ */ React17.createEl
 var ChevronRight_default = ChevronRight;
 
 // src/components/Button/Button.tsx
-import React18, { useRef } from "react";
+import React18, { useRef as useRef2 } from "react";
 import classNames4 from "classnames";
 var Button = ({
   className,
@@ -2318,7 +2383,7 @@ var Button = ({
   fullWidth,
   ...props
 }) => {
-  const buttonRef = useRef(null);
+  const buttonRef = useRef2(null);
   let justifyContent = "center";
   if (justify) {
     justifyContent = justify;
@@ -2989,7 +3054,7 @@ var ExpandButton = ({
 
 // src/components/Button/Link.tsx
 import React35, {
-  useRef as useRef4
+  useRef as useRef5
 } from "react";
 import classNames12 from "classnames";
 var Link2 = ({
@@ -3004,7 +3069,7 @@ var Link2 = ({
   fullWidth,
   ...props
 }) => {
-  const linkRef = useRef4(null);
+  const linkRef = useRef5(null);
   let justifyContent = "center";
   if (justify) {
     justifyContent = justify;
@@ -3062,7 +3127,7 @@ var Link2 = ({
 };
 
 // src/components/Typography/Text.tsx
-import React36, { useRef as useRef5, useState as useState7, useEffect as useEffect5 } from "react";
+import React36, { useRef as useRef6, useState as useState7, useEffect as useEffect5 } from "react";
 import classNames13 from "classnames";
 var Text = ({
   as: Component2 = "p",
@@ -3103,7 +3168,7 @@ var TextWithTooltip = ({
   tooltipOptions,
   ...props
 }) => {
-  const textElementRef = useRef5();
+  const textElementRef = useRef6();
   const compareSize = () => {
     if (textElementRef.current) {
       const compare = textElementRef.current.children[0].scrollWidth > textElementRef.current.children[0].clientWidth;
@@ -3560,11 +3625,11 @@ var MoreVertical = ({ size = 18, ...props }) => {
 var MoreVertical_default = MoreVertical;
 
 // src/components/HoverMenu/HoverMenu.tsx
-import React49, { useEffect as useEffect7, useRef as useRef6, useState as useState9 } from "react";
+import React49, { useEffect as useEffect7, useRef as useRef7, useState as useState9 } from "react";
 import classNames17 from "classnames";
 var HoverMenu = ({ children, config }) => {
   const [openMenu, setOpenMenu] = useState9(false);
-  const hoverMenuRef = useRef6(null);
+  const hoverMenuRef = useRef7(null);
   const hoverMenuClassName = classNames17(
     "Layer__hover-menu",
     openMenu && "Layer__hover-menu--open"
@@ -4207,9 +4272,9 @@ var LinkedAccountsComponent = ({
 import React109, { useEffect as useEffect19, useMemo as useMemo6, useState as useState25 } from "react";
 
 // src/hooks/useElementSize/useElementSize.ts
-import { useLayoutEffect as useLayoutEffect2, useRef as useRef7 } from "react";
+import { useLayoutEffect as useLayoutEffect2, useRef as useRef8 } from "react";
 var useElementSize = (callback) => {
-  const ref = useRef7(null);
+  const ref = useRef8(null);
   useLayoutEffect2(() => {
     const element = ref?.current;
     if (!element) {
@@ -4250,7 +4315,7 @@ var debounce = (fnc, timeout = 300) => {
 import React85 from "react";
 
 // src/components/BankTransactionList/BankTransactionListItem.tsx
-import React84, { useEffect as useEffect12, useRef as useRef11, useState as useState15 } from "react";
+import React84, { useEffect as useEffect12, useRef as useRef12, useState as useState15 } from "react";
 
 // src/icons/ChevronDownFill.tsx
 import * as React57 from "react";
@@ -4278,7 +4343,7 @@ var ChevronDownFill = ({ size = 18, ...props }) => /* @__PURE__ */ React57.creat
 var ChevronDownFill_default = ChevronDownFill;
 
 // src/components/BankTransactionRow/BankTransactionRow.tsx
-import React82, { useEffect as useEffect11, useRef as useRef10, useState as useState14 } from "react";
+import React82, { useEffect as useEffect11, useRef as useRef11, useState as useState14 } from "react";
 
 // src/icons/Scissors.tsx
 import * as React58 from "react";
@@ -4696,7 +4761,7 @@ var CategorySelectDrawerContent = ({
 
 // src/components/CategorySelect/CategorySelect.tsx
 import classNames23 from "classnames";
-import { parseISO as parseISO3, format as formatTime } from "date-fns";
+import { parseISO as parseISO2, format as formatTime } from "date-fns";
 var mapCategoryToOption2 = (category) => {
   return {
     type: "category" /* CATEGORY */,
@@ -4748,7 +4813,7 @@ var Option2 = (props) => {
         ...props,
         className: `${props.className} Layer__select__option-content__match`
       },
-      /* @__PURE__ */ React65.createElement("div", { className: "Layer__select__option-content__match__main-row" }, /* @__PURE__ */ React65.createElement("span", { className: "Layer__select__option-content__match__date" }, props.data.payload.date && formatTime(parseISO3(props.data.payload.date), DATE_FORMAT)), /* @__PURE__ */ React65.createElement("span", { className: "Layer__select__option-content__match__description" }, props.data.payload.display_name)),
+      /* @__PURE__ */ React65.createElement("div", { className: "Layer__select__option-content__match__main-row" }, /* @__PURE__ */ React65.createElement("span", { className: "Layer__select__option-content__match__date" }, props.data.payload.date && formatTime(parseISO2(props.data.payload.date), DATE_FORMAT)), /* @__PURE__ */ React65.createElement("span", { className: "Layer__select__option-content__match__description" }, props.data.payload.display_name)),
       /* @__PURE__ */ React65.createElement("div", { className: "Layer__select__option-content__match__amount-row" }, /* @__PURE__ */ React65.createElement("span", { className: "Layer__select__option-content__match__amount" }, "$", centsToDollars(props.data.payload.amount)))
     );
   }
@@ -4878,7 +4943,7 @@ import React80, {
   useState as useState13,
   useCallback,
   useEffect as useEffect10,
-  useRef as useRef9
+  useRef as useRef10
 } from "react";
 
 // src/icons/ScissorsFullOpen.tsx
@@ -5040,7 +5105,7 @@ var InputGroup = ({
 };
 
 // src/components/Input/FileInput.tsx
-import React71, { useRef as useRef8 } from "react";
+import React71, { useRef as useRef9 } from "react";
 
 // src/icons/UploadCloud.tsx
 import * as React70 from "react";
@@ -5095,7 +5160,7 @@ var UploadCloud_default = UploadCloud;
 
 // src/components/Input/FileInput.tsx
 var FileInput = ({ text = "Upload", onUpload }) => {
-  const hiddenFileInput = useRef8(null);
+  const hiddenFileInput = useRef9(null);
   const onClick = () => {
     if (hiddenFileInput.current) {
       hiddenFileInput.current.click();
@@ -5196,7 +5261,7 @@ import React75 from "react";
 
 // src/components/BankTransactionRow/MatchBadge.tsx
 import React74 from "react";
-import { parseISO as parseISO4, format as formatTime2 } from "date-fns";
+import { parseISO as parseISO3, format as formatTime2 } from "date-fns";
 var MatchBadge = ({
   bankTransaction,
   classNamePrefix,
@@ -5209,7 +5274,7 @@ var MatchBadge = ({
       Badge,
       {
         icon: /* @__PURE__ */ React74.createElement(MinimizeTwo_default, { size: 11 }),
-        tooltip: /* @__PURE__ */ React74.createElement("span", { className: `${classNamePrefix}__match-tooltip` }, /* @__PURE__ */ React74.createElement("div", { className: `${classNamePrefix}__match-tooltip__date` }, formatTime2(parseISO4(date), dateFormat)), /* @__PURE__ */ React74.createElement("div", { className: `${classNamePrefix}__match-tooltip__description` }, bankTransaction.match?.details?.description ?? ""), /* @__PURE__ */ React74.createElement("div", { className: `${classNamePrefix}__match-tooltip__amount` }, "$", centsToDollars(amount)))
+        tooltip: /* @__PURE__ */ React74.createElement("span", { className: `${classNamePrefix}__match-tooltip` }, /* @__PURE__ */ React74.createElement("div", { className: `${classNamePrefix}__match-tooltip__date` }, formatTime2(parseISO3(date), dateFormat)), /* @__PURE__ */ React74.createElement("div", { className: `${classNamePrefix}__match-tooltip__description` }, bankTransaction.match?.details?.description ?? ""), /* @__PURE__ */ React74.createElement("div", { className: `${classNamePrefix}__match-tooltip__amount` }, "$", centsToDollars(amount)))
       },
       text
     );
@@ -5219,7 +5284,7 @@ var MatchBadge = ({
 
 // src/components/MatchForm/MatchForm.tsx
 import classNames28 from "classnames";
-import { parseISO as parseISO5, format as formatTime3 } from "date-fns";
+import { parseISO as parseISO4, format as formatTime3 } from "date-fns";
 var MatchForm = ({
   classNamePrefix,
   bankTransaction,
@@ -5258,7 +5323,7 @@ var MatchForm = ({
         {
           className: `Layer__nowrap ${classNamePrefix}__match-table__date`
         },
-        /* @__PURE__ */ React75.createElement("span", null, formatTime3(parseISO5(match.details.date), DATE_FORMAT)),
+        /* @__PURE__ */ React75.createElement("span", null, formatTime3(parseISO4(match.details.date), DATE_FORMAT)),
         /* @__PURE__ */ React75.createElement("span", { className: "amount-next-to-date" }, "$", centsToDollars(match.details.amount))
       ),
       /* @__PURE__ */ React75.createElement("div", { className: `${classNamePrefix}__match-table__desc` }, /* @__PURE__ */ React75.createElement(
@@ -5301,7 +5366,7 @@ var MatchForm = ({
 // src/components/MatchForm/MatchFormMobile.tsx
 import React76 from "react";
 import classNames29 from "classnames";
-import { parseISO as parseISO6, format as formatTime4 } from "date-fns";
+import { parseISO as parseISO5, format as formatTime4 } from "date-fns";
 var MatchFormMobile = ({
   classNamePrefix,
   bankTransaction,
@@ -5348,7 +5413,7 @@ var MatchFormMobile = ({
           size: "sm" /* sm */,
           as: "span"
         },
-        formatTime4(parseISO6(match.details.date), MONTH_DAY_FORMAT)
+        formatTime4(parseISO5(match.details.date), MONTH_DAY_FORMAT)
       ))),
       /* @__PURE__ */ React76.createElement("div", { className: `${classNamePrefix}__match-item__col-status` }, selectedMatchId && selectedMatchId === match.id ? /* @__PURE__ */ React76.createElement(
         Check_default,
@@ -5633,7 +5698,7 @@ import classNames32 from "classnames";
 var isAlreadyMatched2 = (bankTransaction) => {
   if (bankTransaction?.match) {
     const foundMatch = bankTransaction.suggested_matches?.find(
-      (x) => x.details.id === bankTransaction?.match?.details.id
+      (x) => x.details.id === bankTransaction?.match?.details.id || x.details.id === bankTransaction?.match?.bank_transaction.id
     );
     return foundMatch?.id;
   }
@@ -5671,13 +5736,13 @@ var ExpandedBankTransactionRow = forwardRef5(
       bankTransaction.category ? "categorize" /* categorize */ : hasMatch(bankTransaction) ? "match" /* match */ : "categorize" /* categorize */
     );
     const [selectedMatchId, setSelectedMatchId] = useState13(
-      isAlreadyMatched2(bankTransaction)
+      isAlreadyMatched2(bankTransaction) ?? bankTransaction?.suggested_matches?.[0]?.id
     );
     const [matchFormError, setMatchFormError] = useState13();
     const [splitFormError, setSplitFormError] = useState13();
     const [height, setHeight] = useState13(0);
     const [isOver, setOver] = useState13(false);
-    const bodyRef = useRef9(null);
+    const bodyRef = useRef10(null);
     const [memoText, setMemoText] = useState13();
     const [receiptUrls, setReceiptUrls] = useState13([]);
     const [isLoaded, setIsLoaded] = useState13(false);
@@ -5776,7 +5841,6 @@ var ExpandedBankTransactionRow = forwardRef5(
       setSplitFormError(void 0);
     };
     const save = async () => {
-      const endpoint = `/v1/businesses/${businessId}/bank-transactions/${bankTransaction.id}/metadata`;
       if (showDescriptions && memoText != void 0) {
         const result = await Layer.updateBankTransactionMetadata(
           apiUrl,
@@ -5795,9 +5859,12 @@ var ExpandedBankTransactionRow = forwardRef5(
       if (purpose === "match" /* match */) {
         if (!selectedMatchId) {
           setMatchFormError("Select an option to match the transaction");
+          return;
         } else if (selectedMatchId && selectedMatchId !== isAlreadyMatched2(bankTransaction)) {
-          onMatchSubmit(selectedMatchId);
+          await onMatchSubmit(selectedMatchId);
+          return;
         }
+        close();
         return;
       }
       if (!validateSplit(rowState)) {
@@ -6148,7 +6215,7 @@ var SplitTooltipDetails = ({
 
 // src/components/BankTransactionRow/BankTransactionRow.tsx
 import classNames33 from "classnames";
-import { parseISO as parseISO7, format as formatTime5 } from "date-fns";
+import { parseISO as parseISO6, format as formatTime5 } from "date-fns";
 var extractDescriptionForSplit = (category) => {
   if (!category.entries) {
     return "";
@@ -6180,12 +6247,12 @@ var BankTransactionRow = ({
   showReceiptUploads,
   stringOverrides
 }) => {
-  const expandedRowRef = useRef10(null);
+  const expandedRowRef = useRef11(null);
   const [showRetry, setShowRetry] = useState14(false);
   const {
-    filters,
     categorize: categorizeBankTransaction2,
-    match: matchBankTransaction2
+    match: matchBankTransaction2,
+    shouldHideAfterCategorize
   } = useBankTransactionsContext();
   const [selectedCategory, setSelectedCategory] = useState14(
     getDefaultSelectedCategory(bankTransaction)
@@ -6223,7 +6290,7 @@ var BankTransactionRow = ({
     }
   }, [bankTransaction.error]);
   useEffect11(() => {
-    if (editable && bankTransaction.recently_categorized) {
+    if (editable && bankTransaction.recently_categorized && shouldHideAfterCategorize(bankTransaction)) {
       setTimeout(() => {
         removeTransaction(bankTransaction);
       }, 300);
@@ -6256,7 +6323,7 @@ var BankTransactionRow = ({
   const openClassName = open ? `${className}--expanded` : "";
   const rowClassName = classNames33(
     className,
-    bankTransaction.recently_categorized && editable ? "Layer__bank-transaction-row--removing" : "",
+    bankTransaction.recently_categorized && editable && shouldHideAfterCategorize(bankTransaction) ? "Layer__bank-transaction-row--removing" : "",
     open ? openClassName : "",
     initialLoad ? "initial-load" : "",
     showComponent ? "show" : ""
@@ -6267,7 +6334,7 @@ var BankTransactionRow = ({
       className: "Layer__table-cell  Layer__bank-transaction-table__date-col",
       ...openRow
     },
-    /* @__PURE__ */ React82.createElement("span", { className: "Layer__table-cell-content" }, formatTime5(parseISO7(bankTransaction.date), dateFormat))
+    /* @__PURE__ */ React82.createElement("span", { className: "Layer__table-cell-content" }, formatTime5(parseISO6(bankTransaction.date), dateFormat))
   ), /* @__PURE__ */ React82.createElement(
     "td",
     {
@@ -6357,7 +6424,7 @@ var BankTransactionRow = ({
           dateFormat
         }
       ), /* @__PURE__ */ React82.createElement("span", { className: `${className}__category-text__text` }, `${formatTime5(
-        parseISO7(bankTransaction.match.bank_transaction.date),
+        parseISO6(bankTransaction.match.bank_transaction.date),
         dateFormat
       )}, ${bankTransaction.match?.details?.description}`)), bankTransaction?.categorization_status !== "MATCHED" /* MATCHED */ && bankTransaction?.categorization_status !== "SPLIT" /* SPLIT */ && /* @__PURE__ */ React82.createElement("span", { className: `${className}__category-text__text` }, bankTransaction?.category?.display_name)) : null,
       !categorized && !open && showRetry ? /* @__PURE__ */ React82.createElement(
@@ -6432,7 +6499,7 @@ var BankTransactionRow = ({
 
 // src/components/BankTransactionList/Assignment.tsx
 import React83 from "react";
-import { parseISO as parseISO8, format as formatTime6 } from "date-fns";
+import { parseISO as parseISO7, format as formatTime6 } from "date-fns";
 var Assignment = ({ bankTransaction }) => {
   if (bankTransaction.match && bankTransaction.categorization_status === "MATCHED" /* MATCHED */) {
     return /* @__PURE__ */ React83.createElement(React83.Fragment, null, /* @__PURE__ */ React83.createElement(
@@ -6444,7 +6511,7 @@ var Assignment = ({ bankTransaction }) => {
         text: "Matched"
       }
     ), /* @__PURE__ */ React83.createElement(Text, { className: "Layer__bank-transaction-list-item__category-text__text" }, `${formatTime6(
-      parseISO8(bankTransaction.match.bank_transaction.date),
+      parseISO7(bankTransaction.match.bank_transaction.date),
       DATE_FORMAT
     )}, ${bankTransaction.match.bank_transaction.description ?? bankTransaction.match?.details?.description}`));
   }
@@ -6469,7 +6536,7 @@ var Assignment = ({ bankTransaction }) => {
 
 // src/components/BankTransactionList/BankTransactionListItem.tsx
 import classNames34 from "classnames";
-import { parseISO as parseISO9, format as formatTime7 } from "date-fns";
+import { parseISO as parseISO8, format as formatTime7 } from "date-fns";
 var BankTransactionListItem = ({
   index = 0,
   dateFormat,
@@ -6482,9 +6549,13 @@ var BankTransactionListItem = ({
   removeTransaction,
   stringOverrides
 }) => {
-  const expandedRowRef = useRef11(null);
+  const expandedRowRef = useRef12(null);
   const [showRetry, setShowRetry] = useState15(false);
-  const { categorize: categorizeBankTransaction2, match: matchBankTransaction2 } = useBankTransactionsContext();
+  const {
+    categorize: categorizeBankTransaction2,
+    match: matchBankTransaction2,
+    shouldHideAfterCategorize
+  } = useBankTransactionsContext();
   const [selectedCategory, setSelectedCategory] = useState15(
     getDefaultSelectedCategory(bankTransaction)
   );
@@ -6506,7 +6577,7 @@ var BankTransactionListItem = ({
     }
   }, [bankTransaction.error]);
   useEffect12(() => {
-    if (editable && bankTransaction.recently_categorized) {
+    if (editable && bankTransaction.recently_categorized && shouldHideAfterCategorize(bankTransaction)) {
       setTimeout(() => {
         removeTransaction(bankTransaction);
       }, 300);
@@ -6534,11 +6605,11 @@ var BankTransactionListItem = ({
   const openClassName = open ? `${className}--expanded` : "";
   const rowClassName = classNames34(
     className,
-    bankTransaction.recently_categorized && editable ? "Layer__bank-transaction-row--removing" : "",
+    bankTransaction.recently_categorized && editable && shouldHideAfterCategorize(bankTransaction) ? "Layer__bank-transaction-row--removing" : "",
     open ? openClassName : "",
     showComponent ? "show" : ""
   );
-  return /* @__PURE__ */ React84.createElement("li", { className: rowClassName }, /* @__PURE__ */ React84.createElement("span", { className: `${className}__heading` }, /* @__PURE__ */ React84.createElement("div", { className: `${className}__heading__main` }, /* @__PURE__ */ React84.createElement("span", { className: `${className}__heading-date` }, formatTime7(parseISO9(bankTransaction.date), dateFormat)), /* @__PURE__ */ React84.createElement("span", { className: `${className}__heading-separator` }), /* @__PURE__ */ React84.createElement("span", { className: `${className}__heading-account-name` }, bankTransaction.account_name ?? "")), /* @__PURE__ */ React84.createElement(
+  return /* @__PURE__ */ React84.createElement("li", { className: rowClassName }, /* @__PURE__ */ React84.createElement("span", { className: `${className}__heading` }, /* @__PURE__ */ React84.createElement("div", { className: `${className}__heading__main` }, /* @__PURE__ */ React84.createElement("span", { className: `${className}__heading-date` }, formatTime7(parseISO8(bankTransaction.date), dateFormat)), /* @__PURE__ */ React84.createElement("span", { className: `${className}__heading-separator` }), /* @__PURE__ */ React84.createElement("span", { className: `${className}__heading-account-name` }, bankTransaction.account_name ?? "")), /* @__PURE__ */ React84.createElement(
     "div",
     {
       onClick: toggleOpen,
@@ -6648,7 +6719,7 @@ var BankTransactionList = ({
 import React93 from "react";
 
 // src/components/BankTransactionMobileList/BankTransactionMobileListItem.tsx
-import React92, { useContext as useContext11, useEffect as useEffect17, useRef as useRef12, useState as useState22 } from "react";
+import React92, { useContext as useContext11, useEffect as useEffect17, useRef as useRef13, useState as useState22 } from "react";
 
 // src/components/BankTransactionMobileList/BankTransactionMobileForms.tsx
 import React91 from "react";
@@ -7105,7 +7176,7 @@ var TransactionToOpenContext = createContext5({
 
 // src/components/BankTransactionMobileList/BankTransactionMobileListItem.tsx
 import classNames36 from "classnames";
-import { parseISO as parseISO10, format as formatTime8 } from "date-fns";
+import { parseISO as parseISO9, format as formatTime8 } from "date-fns";
 var DATE_FORMAT2 = "LLL d";
 var getAssignedValue2 = (bankTransaction) => {
   if (bankTransaction.categorization_status === "SPLIT" /* SPLIT */) {
@@ -7130,13 +7201,14 @@ var BankTransactionMobileListItem = ({
     setTransactionIdToOpen,
     clearTransactionIdToOpen
   } = useContext11(TransactionToOpenContext);
+  const { shouldHideAfterCategorize } = useBankTransactionsContext();
   const formRowRef = useElementSize(
     (_a, _b, { height: height2 }) => setHeight(height2)
   );
   const headingRowRef = useElementSize((_a, _b, { height: height2 }) => {
     setHeadingHeight(height2);
   });
-  const itemRef = useRef12(null);
+  const itemRef = useRef13(null);
   const [removeAnim, setRemoveAnim] = useState22(false);
   const [purpose, setPurpose] = useState22(
     bankTransaction.category ? bankTransaction.categorization_status === "SPLIT" /* SPLIT */ ? "more" /* more */ : "business" /* business */ : hasMatch(bankTransaction) ? "more" /* more */ : "business" /* business */
@@ -7163,7 +7235,7 @@ var BankTransactionMobileListItem = ({
   }, [transactionIdToOpen]);
   useEffect17(() => {
     if (!removeAnim && bankTransaction.recently_categorized) {
-      if (editable) {
+      if (editable && shouldHideAfterCategorize(bankTransaction)) {
         setRemoveAnim(true);
         openNext();
       } else {
@@ -7196,7 +7268,7 @@ var BankTransactionMobileListItem = ({
     }
   }, []);
   useEffect17(() => {
-    if (editable && bankTransaction.recently_categorized) {
+    if (editable && bankTransaction.recently_categorized && shouldHideAfterCategorize(bankTransaction)) {
       setTimeout(() => {
         removeTransaction(bankTransaction);
       }, 300);
@@ -7227,7 +7299,7 @@ var BankTransactionMobileListItem = ({
       },
       isCredit(bankTransaction) ? "+$" : " $",
       centsToDollars(bankTransaction.amount)
-    ), /* @__PURE__ */ React92.createElement("span", { className: `${className}__heading__date` }, formatTime8(parseISO10(bankTransaction.date), DATE_FORMAT2))))
+    ), /* @__PURE__ */ React92.createElement("span", { className: `${className}__heading__date` }, formatTime8(parseISO9(bankTransaction.date), DATE_FORMAT2))))
   ), categorizationEnabled(mode) ? /* @__PURE__ */ React92.createElement(
     "div",
     {
@@ -7750,11 +7822,11 @@ var DownloadCloud = ({ size = 18, ...props }) => /* @__PURE__ */ React103.create
 var DownloadCloud_default = DownloadCloud;
 
 // src/utils/business.ts
-import { differenceInCalendarMonths, parseISO as parseISO11, startOfMonth } from "date-fns";
+import { differenceInCalendarMonths, parseISO as parseISO10, startOfMonth } from "date-fns";
 var getActivationDate = (business) => {
   try {
     if (business && business.activation_at) {
-      return parseISO11(business.activation_at);
+      return parseISO10(business.activation_at);
     }
     return;
   } catch (_err) {
@@ -7780,7 +7852,7 @@ var isDateAllowedToBrowse = (date, business) => {
 };
 
 // src/components/DatePicker/DatePicker.tsx
-import React105, { useEffect as useEffect18, useRef as useRef13, useState as useState23 } from "react";
+import React105, { useEffect as useEffect18, useRef as useRef14, useState as useState23 } from "react";
 import ReactDatePicker from "react-datepicker";
 
 // src/components/DatePicker/DatePickerOptions.tsx
@@ -7943,7 +8015,7 @@ var DatePicker = ({
   navigateArrows = mode === "monthPicker",
   ...props
 }) => {
-  const pickerRef = useRef13(null);
+  const pickerRef = useRef14(null);
   const [updatePickerDate, setPickerDate] = useState23(false);
   const [selectedDates, setSelectedDates] = useState23(selected);
   const { isDesktop } = useSizeClass();
@@ -8339,7 +8411,7 @@ var DataStates = ({
   editable
 }) => {
   let title = editable ? "You are up to date with transactions!" : "You have no categorized transactions";
-  let description = editable ? "All uncategorized transaction will be displayed here" : "All transaction will be displayed here once reviewed";
+  let description = editable ? "All uncategorized transactions will be displayed here" : "All transactions will be displayed here once reviewed";
   const showRefreshButton = bankTransactions?.length;
   return /* @__PURE__ */ React108.createElement(React108.Fragment, null, !isLoading && !error && (bankTransactions === void 0 || bankTransactions !== void 0 && bankTransactions.length === 0) ? /* @__PURE__ */ React108.createElement("div", { className: "Layer__table-state-container" }, /* @__PURE__ */ React108.createElement(
     DataState,
@@ -8364,10 +8436,9 @@ var DataStates = ({
 };
 
 // src/components/BankTransactions/BankTransactions.tsx
-import { endOfMonth as endOfMonth3, parseISO as parseISO12, startOfMonth as startOfMonth4 } from "date-fns";
+import { endOfMonth as endOfMonth3, parseISO as parseISO11, startOfMonth as startOfMonth4 } from "date-fns";
 var COMPONENT_NAME2 = "bank-transactions";
 var TEST_EMPTY_STATE = false;
-var POLL_INTERVAL = 1e3;
 var categorizationEnabled = (mode) => {
   if (mode === "bookkeeping-client") {
     return false;
@@ -8415,39 +8486,11 @@ var BankTransactionsContent = ({
     fetchMore,
     removeAfterCategorize
   } = useBankTransactionsContext();
-  const { data: linkedAccounts, refetchAccounts } = useLinkedAccounts();
+  const { data: linkedAccounts } = useLinkedAccounts();
   const isSyncing = useMemo6(
     () => Boolean(linkedAccounts?.some((item) => item.is_syncing)),
     [linkedAccounts]
   );
-  const transactionsNotSynced = useMemo6(
-    () => loadingStatus === "complete" && isSyncing && (!data || data?.length === 0),
-    [data, isSyncing, loadingStatus]
-  );
-  let intervalId = void 0;
-  const [refreshTrigger, setRefreshTrigger] = useState25(-1);
-  useEffect19(() => {
-    if (refreshTrigger !== -1) {
-      refetch();
-      refetchAccounts();
-    }
-  }, [refreshTrigger]);
-  useEffect19(() => {
-    if (isSyncing) {
-      intervalId = setInterval(() => {
-        setRefreshTrigger(Math.random());
-      }, POLL_INTERVAL);
-    } else {
-      if (intervalId) {
-        clearInterval(intervalId);
-      }
-    }
-    return () => {
-      if (intervalId) {
-        clearInterval(intervalId);
-      }
-    };
-  }, [isSyncing, transactionsNotSynced]);
   useEffect19(() => {
     activate();
   }, []);
@@ -8489,7 +8532,7 @@ var BankTransactionsContent = ({
   const bankTransactions = TEST_EMPTY_STATE ? [] : useMemo6(() => {
     if (monthlyView) {
       return data?.filter(
-        (x) => parseISO12(x.date) >= dateRange.startDate && parseISO12(x.date) <= dateRange.endDate
+        (x) => parseISO11(x.date) >= dateRange.startDate && parseISO11(x.date) <= dateRange.endDate
       );
     }
     const firstPageIndex = (currentPage - 1) * pageSize;
@@ -8625,7 +8668,7 @@ var BankTransactionsContent = ({
 import React110 from "react";
 
 // src/hooks/useQuickbooks/useQuickbooks.ts
-import { useEffect as useEffect20, useRef as useRef14, useState as useState26 } from "react";
+import { useEffect as useEffect20, useRef as useRef16, useState as useState26 } from "react";
 var DEBUG2 = true;
 var useQuickbooks = () => {
   const { auth, businessId, apiUrl } = useLayerContext();
@@ -8633,7 +8676,7 @@ var useQuickbooks = () => {
   const [quickbooksIsLinked, setQuickbooksIsLinked] = useState26(
     null
   );
-  const syncStatusIntervalRef = useRef14(null);
+  const syncStatusIntervalRef = useRef16(null);
   useEffect20(() => {
     if (isSyncingFromQuickbooks && syncStatusIntervalRef.current === null) {
       const interval = setInterval(() => fetchIsSyncingFromQuickbooks(), 2e3);
@@ -11084,7 +11127,7 @@ var TableRow = ({
 };
 
 // src/components/Table/Table.tsx
-import React128, { useEffect as useEffect26, useRef as useRef15 } from "react";
+import React128, { useEffect as useEffect26, useRef as useRef17 } from "react";
 import classNames47 from "classnames";
 var Table = ({
   componentName,
@@ -11092,8 +11135,8 @@ var Table = ({
   borderCollapse = "separate",
   bottomSpacing = true
 }) => {
-  const tableRef = useRef15(null);
-  const prevChildrenRef = useRef15([]);
+  const tableRef = useRef17(null);
+  const prevChildrenRef = useRef17([]);
   useEffect26(() => {
     if (tableRef.current) {
       const tbody = tableRef.current.querySelector("tbody");
@@ -12304,7 +12347,10 @@ var useChartOfAccounts = ({ withDates, startDate: initialStartDate, endDate: ini
     }
     const data2 = {
       name: form.data.name ?? "",
-      stable_name: form.data.stable_name,
+      stable_name: form.data.stable_name ? {
+        type: "StableName",
+        stable_name: form.data.stable_name
+      } : void 0,
       parent_id: form.data.parent ? {
         type: "AccountId",
         id: form.data.parent.value
@@ -13081,7 +13127,7 @@ var Card = ({ children, className }) => {
 
 // src/components/DateTime/DateTime.tsx
 import React149 from "react";
-import { parseISO as parseISO13, format as formatTime9 } from "date-fns";
+import { parseISO as parseISO12, format as formatTime9 } from "date-fns";
 var DateTime = ({
   value,
   format: format7,
@@ -13091,10 +13137,10 @@ var DateTime = ({
   onlyTime
 }) => {
   if (format7) {
-    return /* @__PURE__ */ React149.createElement(Text, { className: "Layer__datetime" }, formatTime9(parseISO13(value), format7));
+    return /* @__PURE__ */ React149.createElement(Text, { className: "Layer__datetime" }, formatTime9(parseISO12(value), format7));
   }
-  const date = formatTime9(parseISO13(value), dateFormat ?? DATE_FORMAT);
-  const time = formatTime9(parseISO13(value), timeFormat ?? TIME_FORMAT);
+  const date = formatTime9(parseISO12(value), dateFormat ?? DATE_FORMAT);
+  const time = formatTime9(parseISO12(value), timeFormat ?? TIME_FORMAT);
   return /* @__PURE__ */ React149.createElement(Text, { className: "Layer__datetime" }, !onlyTime && /* @__PURE__ */ React149.createElement(
     Text,
     {
@@ -13259,7 +13305,7 @@ var LedgerAccountEntryDetails = ({ stringOverrides }) => {
 // src/components/LedgerAccount/LedgerAccountRow.tsx
 import React153, { useContext as useContext23, useEffect as useEffect36, useState as useState40 } from "react";
 import classNames54 from "classnames";
-import { parseISO as parseISO14, format as formatTime10 } from "date-fns";
+import { parseISO as parseISO13, format as formatTime10 } from "date-fns";
 var LedgerAccountRow = ({
   row,
   index,
@@ -13298,7 +13344,7 @@ var LedgerAccountRow = ({
           }
         }
       },
-      /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ React153.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ React153.createElement(Text, null, row.date && formatTime10(parseISO14(row.date), DATE_FORMAT)), /* @__PURE__ */ React153.createElement(
+      /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ React153.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ React153.createElement(Text, null, row.date && formatTime10(parseISO13(row.date), DATE_FORMAT)), /* @__PURE__ */ React153.createElement(
         Text,
         {
           weight: "normal" /* normal */,
@@ -13331,7 +13377,7 @@ var LedgerAccountRow = ({
           }
         }
       },
-      /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ React153.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ React153.createElement(Text, null, row.date && formatTime10(parseISO14(row.date), DATE_FORMAT)), /* @__PURE__ */ React153.createElement(
+      /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell Layer__ledger-account-table__tablet-main-col" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content" }, /* @__PURE__ */ React153.createElement("div", { className: "Layer__ledger-account-table__tablet-main-col__date" }, /* @__PURE__ */ React153.createElement(Text, null, row.date && formatTime10(parseISO13(row.date), DATE_FORMAT)), /* @__PURE__ */ React153.createElement(
         Text,
         {
           weight: "normal" /* normal */,
@@ -13360,7 +13406,7 @@ var LedgerAccountRow = ({
         }
       }
     },
-    /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content" }, row.date && formatTime10(parseISO14(row.date), DATE_FORMAT))),
+    /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content" }, row.date && formatTime10(parseISO13(row.date), DATE_FORMAT))),
     /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content" }, row.entry_id.substring(0, 5))),
     /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content" }, row.source?.display_description ?? "")),
     /* @__PURE__ */ React153.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ React153.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, row.direction === "DEBIT" /* DEBIT */ && `$${centsToDollars(row?.amount || 0)}`)),
@@ -13870,7 +13916,7 @@ import React161, { useContext as useContext31, useMemo as useMemo17, useState as
 // src/components/JournalRow/JournalRow.tsx
 import React156, { useContext as useContext26, useEffect as useEffect39, useState as useState44 } from "react";
 import classNames56 from "classnames";
-import { parseISO as parseISO15, format as formatTime11 } from "date-fns";
+import { parseISO as parseISO14, format as formatTime11 } from "date-fns";
 var INDENTATION2 = 24;
 var EXPANDED_STYLE3 = {
   height: "100%",
@@ -13983,7 +14029,7 @@ var JournalRow = ({
         )
       ))),
       /* @__PURE__ */ React156.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React156.createElement("span", { className: "Layer__table-cell-content" }, row.id.substring(0, 5))),
-      /* @__PURE__ */ React156.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React156.createElement("span", { className: "Layer__table-cell-content" }, row.date && formatTime11(parseISO15(row.date), DATE_FORMAT))),
+      /* @__PURE__ */ React156.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React156.createElement("span", { className: "Layer__table-cell-content" }, row.date && formatTime11(parseISO14(row.date), DATE_FORMAT))),
       /* @__PURE__ */ React156.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React156.createElement("span", { className: "Layer__table-cell-content" }, humanizeEnum(row.entry_type))),
       /* @__PURE__ */ React156.createElement("td", { className: "Layer__table-cell" }, /* @__PURE__ */ React156.createElement("span", { className: "Layer__table-cell-content" }, `(${row.line_items.length})`)),
       /* @__PURE__ */ React156.createElement("td", { className: "Layer__table-cell Layer__table-cell--primary" }, /* @__PURE__ */ React156.createElement("span", { className: "Layer__table-cell-content Layer__table-cell--amount" }, "$", centsToDollars(
@@ -15461,7 +15507,7 @@ var GeneralLedgerView = ({
 };
 
 // src/views/Reports/Reports.tsx
-import React180, { useContext as useContext38, useRef as useRef16, useState as useState55 } from "react";
+import React180, { useContext as useContext38, useRef as useRef18, useState as useState55 } from "react";
 var DownloadButton2 = ({
   stringOverrides
 }) => {
@@ -15533,7 +15579,7 @@ var Reports = ({
   stringOverrides,
   enabledReports = ["profitAndLoss", "balanceSheet", "statementOfCashFlow"]
 }) => {
-  const containerRef = useRef16(null);
+  const containerRef = useRef18(null);
   const [activeTab, setActiveTab] = useState55(enabledReports[0]);
   const options = getOptions(enabledReports);
   const defaultTitle = enabledReports.length > 1 ? "Reports" : options.find((option) => option.value = enabledReports[0])?.label;
@@ -15601,10 +15647,10 @@ var ReportsPanel = ({
 };
 
 // src/components/ProfitAndLossView/ProfitAndLossView.tsx
-import React181, { useContext as useContext39, useRef as useRef17 } from "react";
+import React181, { useContext as useContext39, useRef as useRef19 } from "react";
 var COMPONENT_NAME7 = "profit-and-loss";
 var ProfitAndLossView = (props) => {
-  const containerRef = useRef17(null);
+  const containerRef = useRef19(null);
   return /* @__PURE__ */ React181.createElement(Container, { name: COMPONENT_NAME7, ref: containerRef }, /* @__PURE__ */ React181.createElement(ProfitAndLoss, null, /* @__PURE__ */ React181.createElement(ProfitAndLossPanel, { containerRef, ...props })));
 };
 var ProfitAndLossPanel = ({
@@ -15699,6 +15745,7 @@ export {
   StatementOfCashFlow,
   Tasks,
   useBankTransactionsContext,
+  useDataSync,
   useLayerContext
 };
 //# sourceMappingURL=index.js.map