@layerfi/components 0.1.114 → 0.1.115

package/dist/esm/index.mjs

@@ -65,12 +65,12 @@ import useSWRInfinite from "swr/infinite";
 import useSWRMutation from "swr/mutation";
 import { useStoreWithEqualityFn } from "zustand/traditional";
 import { useFloating, offset, flip, shift, autoUpdate, useHover, useFocus, useDismiss, useRole, useInteractions, useTransitionStyles, useMergeRefs, FloatingPortal } from "@floating-ui/react";
-import { Button as Button$2, Header as Header$3, Label as Label$1, Text as Text$1, ModalOverlay as ModalOverlay$1, Modal as Modal$1, Dialog as Dialog$1, Heading as Heading$2, Group, SearchField as SearchField$1, Input as Input$2, Form as Form$1, TextField as TextField$1, FieldError as FieldError$1, Checkbox as Checkbox$1, DateField as DateField$1, DateInput as DateInput$1, DateSegment as DateSegment$1, DatePicker as DatePicker$2, NumberField as NumberField$1, TextArea as TextArea$1, MenuTrigger, Popover as Popover$1, Menu as Menu$1, MenuItem as MenuItem$2, GridList, GridListItem, DialogTrigger, ToggleButton, SelectionIndicator, ToggleButtonGroup, Table as Table$2, Column as Column$1, Cell as Cell$1, TableHeader as TableHeader$1, TableBody as TableBody$2, Row as Row$1, Switch as Switch$1, Calendar as Calendar$1, CalendarGrid as CalendarGrid$1, CalendarGridBody as CalendarGridBody$1, CalendarCell as CalendarCell$1, CalendarGridHeader as CalendarGridHeader$1, CalendarHeaderCell as CalendarHeaderCell$1, Meter as Meter$1, Link as Link$3 } from "react-aria-components";
-import { LoaderCircle, X as X$1, ChevronDown as ChevronDown$1, Layers2Icon, UploadCloud as UploadCloud$1, Search, ChevronLeft as ChevronLeft$1, CopyIcon, FileSpreadsheet, FileDownIcon, Minus, Check as Check$1, RefreshCcw as RefreshCcw$1, MenuIcon, ChevronRight as ChevronRight$1, PencilRuler, SearchX, Trash2, CheckIcon, AlertCircle as AlertCircle$1, TriangleAlert, List, AlertTriangle, Save as Save$1, Plus as Plus$1, HandCoins, Menu as Menu$2, Trash as Trash$1, Send, Calendar as Calendar$2, Download, Users, Milestone, Video, Clock as Clock$1, Link as Link$4, Car } from "lucide-react";
+import { Button as Button$2, Header as Header$3, Label as Label$1, Text as Text$1, ModalOverlay as ModalOverlay$1, Modal as Modal$1, Dialog as Dialog$1, Heading as Heading$2, Group, SearchField as SearchField$1, Input as Input$2, Form as Form$1, TextField as TextField$1, FieldError as FieldError$1, Checkbox as Checkbox$1, DateField as DateField$1, DateInput as DateInput$1, DateSegment as DateSegment$1, DatePicker as DatePicker$2, NumberField as NumberField$1, Switch as Switch$1, TextArea as TextArea$1, MenuTrigger, Popover as Popover$1, Menu as Menu$1, MenuItem as MenuItem$2, GridList, GridListItem, DialogTrigger, ToggleButton, SelectionIndicator, ToggleButtonGroup, Table as Table$2, Column as Column$1, Cell as Cell$1, TableHeader as TableHeader$1, TableBody as TableBody$2, Row as Row$1, Calendar as Calendar$1, CalendarGrid as CalendarGrid$1, CalendarGridBody as CalendarGridBody$1, CalendarCell as CalendarCell$1, CalendarGridHeader as CalendarGridHeader$1, CalendarHeaderCell as CalendarHeaderCell$1, Meter as Meter$1, Link as Link$3 } from "react-aria-components";
+import { LoaderCircle, X as X$1, ChevronDown as ChevronDown$1, Layers2Icon, UploadCloud as UploadCloud$1, Search, ChevronLeft as ChevronLeft$1, CopyIcon, FileSpreadsheet, FileDownIcon, Minus, Check as Check$1, RefreshCcw as RefreshCcw$1, MenuIcon, ChevronRight as ChevronRight$1, PencilRuler, SearchX, Trash2, CheckIcon, AlertCircle as AlertCircle$1, TriangleAlert, List, AlertTriangle, Save as Save$1, Plus as Plus$1, HandCoins, Menu as Menu$2, Trash as Trash$1, Send, Calendar as Calendar$2, Download, Users, Milestone, Video, Clock as Clock$1, Link as Link$4, Car, Edit, RotateCcw, Archive } from "lucide-react";
 import pluralize from "pluralize";
 import { mergeRefs } from "react-merge-refs";
 import useResizeObserver from "@react-hook/resize-observer";
-import Select$1, { components } from "react-select";
+import ReactSelect, { components } from "react-select";
 import { useDropzone } from "react-dropzone";
 import { createFormHookContexts, createFormHook, useForm as useForm$1, useStore as useStore$1, revalidateLogic } from "@tanstack/react-form";
 import BaseCreatableSelect from "react-select/creatable";
@@ -202,7 +202,7 @@ class ErrorHandlerClass {
 }
 const errorHandler = new ErrorHandlerClass();
 const reportError = (payload) => errorHandler.onError(payload);
-const version = "0.1.114";
+const version = "0.1.115";
 const pkg = {
   version
 };
@@ -673,7 +673,7 @@ function requestOAuthToken(_0) {
     }).then((res) => res.json());
   });
 }
-function buildKey$10({
+function buildKey$14({
   appId,
   appSecret,
   businessAccessToken,
@@ -716,7 +716,7 @@ function useAuth() {
     businessAccessToken
   } = useAuthInput();
   return useSWR(
-    () => buildKey$10({ appId, appSecret, businessAccessToken, apiUrl, authUrl, scope }),
+    () => buildKey$14({ appId, appSecret, businessAccessToken, apiUrl, authUrl, scope }),
     (key) => {
       if (key.mode === "explicit") {
         const { businessAccessToken: businessAccessToken2, apiUrl: apiUrl3 } = key;
@@ -751,7 +751,7 @@ const useLayerContext = () => {
   return ctx;
 };
 const EXTERNAL_ACCOUNTS_TAG_KEY = "#external-accounts";
-function buildKey$$({
+function buildKey$13({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -770,7 +770,7 @@ function useListExternalAccounts() {
   const { apiUrl } = useEnvironment();
   const { data: auth } = useAuth();
   return useSWR(
-    () => buildKey$$(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$13(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       businessId
     })),
@@ -2603,7 +2603,7 @@ const BANK_ACCOUNTS_TAG_KEY = "#bank-accounts";
 const getBankAccounts = get(
   ({ businessId }) => `/v1/businesses/${businessId}/bank-accounts`
 );
-function buildKey$_({
+function buildKey$12({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -2624,7 +2624,7 @@ const useBankAccounts = () => {
   const { apiUrl } = useEnvironment();
   const { data: auth } = useAuth();
   const { data, error, isLoading } = useSWR(
-    () => buildKey$_(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$12(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       businessId
     })),
@@ -4065,7 +4065,7 @@ class ProfitAndLossReportSWRResponse {
     return this.swrResponse.mutate;
   }
 }
-function buildKey$Z({
+function buildKey$11({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -4109,7 +4109,7 @@ function useProfitAndLossReport({ startDate, endDate, tagKey, tagValues, reporti
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const response = useSWR(
-    () => buildKey$Z(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$11(__spreadProps(__spreadValues({}, data), {
       businessId,
       startDate,
       endDate,
@@ -4175,7 +4175,7 @@ class ProfitAndLossSummariesSWRResponse {
     return this.swrResponse.mutate;
   }
 }
-function buildKey$Y({
+function buildKey$10({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -4222,7 +4222,7 @@ function useProfitAndLossSummaries({ startYear, startMonth, endYear, endMonth, t
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const response = useSWR(
-    () => buildKey$Y(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$10(__spreadProps(__spreadValues({}, data), {
       businessId,
       startYear,
       startMonth,
@@ -4292,7 +4292,7 @@ const useProfitAndLossGlobalInvalidator = () => {
   return { invalidateProfitAndLoss, debouncedInvalidateProfitAndLoss };
 };
 const CATEGORIZE_BANK_TRANSACTION_TAG = "#categorize-bank-transaction";
-function buildKey$X({
+function buildKey$$({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -4315,7 +4315,7 @@ function useCategorizeBankTransaction({
   const { debouncedInvalidateProfitAndLoss } = useProfitAndLossGlobalInvalidator();
   const { invalidatePnlDetailLines } = usePnlDetailLinesInvalidator();
   const mutationResponse = useSWRMutation(
-    () => buildKey$X({
+    () => buildKey$$({
       access_token: auth == null ? void 0 : auth.access_token,
       apiUrl: auth == null ? void 0 : auth.apiUrl,
       businessId
@@ -4363,7 +4363,7 @@ function useCategorizeBankTransaction({
   });
 }
 const MATCH_BANK_TRANSACTION_TAG = "#match-bank-transaction";
-function buildKey$W({
+function buildKey$_({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -4385,7 +4385,7 @@ function useMatchBankTransaction({
   const { mutate } = useSWRConfig();
   const { debouncedInvalidateProfitAndLoss } = useProfitAndLossGlobalInvalidator();
   const mutationResponse = useSWRMutation(
-    () => buildKey$W({
+    () => buildKey$_({
       access_token: auth == null ? void 0 : auth.access_token,
       apiUrl: auth == null ? void 0 : auth.apiUrl,
       businessId
@@ -4851,16 +4851,24 @@ const useAugmentedBankTransactions = (params) => {
     }
     return filtered;
   }, [filters, data]);
-  const updateOneLocal = (newBankTransaction) => {
-    if (newBankTransaction.update_categorization_rules_suggestion) {
-      const decodedRuleSuggestion = decodeRulesSuggestion(newBankTransaction.update_categorization_rules_suggestion);
-      setRuleSuggestion(decodedRuleSuggestion);
+  const updateLocalBankTransactions = (newBankTransactions) => {
+    const transactionsById = new Map(
+      newBankTransactions.map((bt) => [bt.id, bt])
+    );
+    for (const bt of newBankTransactions) {
+      if (bt.update_categorization_rules_suggestion) {
+        const decodedRuleSuggestion = decodeRulesSuggestion(bt.update_categorization_rules_suggestion);
+        setRuleSuggestion(decodedRuleSuggestion);
+      }
     }
     const updatedData = rawResponseData == null ? void 0 : rawResponseData.map((page) => {
       var _a2;
       return __spreadProps(__spreadValues({}, page), {
         data: (_a2 = page.data) == null ? void 0 : _a2.map(
-          (bt) => bt.id === newBankTransaction.id ? newBankTransaction : bt
+          (bt) => {
+            var _a3;
+            return (_a3 = transactionsById.get(bt.id)) != null ? _a3 : bt;
+          }
         )
       });
     });
@@ -4872,25 +4880,29 @@ const useAugmentedBankTransactions = (params) => {
   const categorizeWithOptimisticUpdate = (bankTransactionId, newCategory, notify) => __async(null, null, function* () {
     const existingTransaction = data == null ? void 0 : data.find(({ id }) => id === bankTransactionId);
     if (existingTransaction) {
-      updateOneLocal(__spreadProps(__spreadValues({}, existingTransaction), { update_categorization_rules_suggestion: void 0, processing: true, error: void 0 }));
+      updateLocalBankTransactions([__spreadProps(__spreadValues({}, existingTransaction), {
+        update_categorization_rules_suggestion: void 0,
+        processing: true,
+        error: void 0
+      })]);
     }
     return categorizeBankTransaction2(__spreadValues({
       bankTransactionId
     }, newCategory)).then((updatedTransaction) => {
-      updateOneLocal(__spreadProps(__spreadValues({}, updatedTransaction), {
+      updateLocalBankTransactions([__spreadProps(__spreadValues({}, updatedTransaction), {
         processing: false,
         recently_categorized: true
-      }));
+      })]);
       if (notify) {
         addToast({ content: "Transaction confirmed" });
       }
     }).catch((error) => {
       const targetedTransaction = data == null ? void 0 : data.find(({ id }) => id === bankTransactionId);
       if (targetedTransaction) {
-        updateOneLocal(__spreadProps(__spreadValues({}, targetedTransaction), {
+        updateLocalBankTransactions([__spreadProps(__spreadValues({}, targetedTransaction), {
           error: error instanceof Error ? error.message : "An unknown error occurred",
           processing: false
-        }));
+        })]);
       }
     }).finally(() => {
       var _a2;
@@ -4900,71 +4912,76 @@ const useAugmentedBankTransactions = (params) => {
   const { trigger: matchBankTransaction2 } = useMatchBankTransaction({
     mutateBankTransactions: mutate
   });
-  const matchWithOptimisticUpdate = (bankTransactionId, suggestedMatchId, notify) => __async(null, null, function* () {
-    const existingTransaction = data == null ? void 0 : data.find(({ id }) => id === bankTransactionId);
-    if (existingTransaction) {
-      updateOneLocal(__spreadProps(__spreadValues({}, existingTransaction), {
-        processing: true,
-        error: void 0
-      }));
-    }
-    const transferBankTransaction = data == null ? void 0 : data.find(
-      ({ id, suggested_matches }) => id !== bankTransactionId && (suggested_matches == null ? void 0 : suggested_matches.some(({ id: id2 }) => id2 === suggestedMatchId))
+  const matchWithOptimisticUpdate = (bankTransaction, suggestedMatchId, notify) => __async(null, null, function* () {
+    var _a2, _b;
+    const suggestedMatch = (_a2 = bankTransaction.suggested_matches) == null ? void 0 : _a2.find(
+      (sm) => sm.id === suggestedMatchId
     );
-    if (transferBankTransaction) {
-      updateOneLocal(__spreadProps(__spreadValues({}, transferBankTransaction), {
+    const matchedTransferBankTransactionId = (_b = suggestedMatch == null ? void 0 : suggestedMatch.details) == null ? void 0 : _b.id;
+    const matchedTransferBankTransaction = matchedTransferBankTransactionId ? data == null ? void 0 : data.find(({ id }) => id === matchedTransferBankTransactionId) : void 0;
+    const transactionsToSetProcessing = [
+      __spreadProps(__spreadValues({}, bankTransaction), { processing: true, error: void 0 })
+    ];
+    if (matchedTransferBankTransaction) {
+      transactionsToSetProcessing.push(__spreadProps(__spreadValues({}, matchedTransferBankTransaction), {
         processing: true,
         error: void 0
       }));
     }
+    updateLocalBankTransactions(transactionsToSetProcessing);
     return matchBankTransaction2({
-      bankTransactionId,
+      bankTransactionId: bankTransaction.id,
       match_id: suggestedMatchId,
       type: "Confirm_Match"
     }).then((match) => {
-      const matchedTransaction = data == null ? void 0 : data.find(({ id }) => id === match.bank_transaction.id);
-      if (matchedTransaction) {
-        updateOneLocal(__spreadProps(__spreadValues({}, matchedTransaction), {
+      const transactionsToUpdate = [
+        __spreadProps(__spreadValues({}, bankTransaction), {
           categorization_status: CategorizationStatus.MATCHED,
           match,
           processing: false,
           recently_categorized: true
-        }));
-      }
-      const matchedTransferTransaction = data == null ? void 0 : data.find(
-        ({ id, suggested_matches }) => id !== bankTransactionId && (suggested_matches == null ? void 0 : suggested_matches.some(({ id: id2 }) => id2 === suggestedMatchId))
-      );
-      if (matchedTransferTransaction) {
-        updateOneLocal(__spreadProps(__spreadValues({}, matchedTransferTransaction), {
+        })
+      ];
+      if (matchedTransferBankTransaction) {
+        transactionsToUpdate.push(__spreadProps(__spreadValues({}, matchedTransferBankTransaction), {
+          categorization_status: CategorizationStatus.MATCHED,
+          match,
           processing: false,
           recently_categorized: true
         }));
       }
+      updateLocalBankTransactions(transactionsToUpdate);
       if (notify) {
         addToast({ content: "Transaction saved" });
       }
     }).catch((error) => {
-      const targetedTransaction = data == null ? void 0 : data.find(({ id }) => id === bankTransactionId);
-      if (targetedTransaction) {
-        updateOneLocal(__spreadProps(__spreadValues({}, targetedTransaction), {
+      const transactionsToResetProcessing = [
+        __spreadProps(__spreadValues({}, bankTransaction), {
           error: error instanceof Error ? error.message : "An unknown error occurred",
           processing: false
+        })
+      ];
+      if (matchedTransferBankTransaction) {
+        transactionsToResetProcessing.push(__spreadProps(__spreadValues({}, matchedTransferBankTransaction), {
+          error: void 0,
+          processing: false
         }));
       }
+      updateLocalBankTransactions(transactionsToResetProcessing);
     }).finally(() => {
-      var _a2;
-      (_a2 = eventCallbacks == null ? void 0 : eventCallbacks.onTransactionCategorized) == null ? void 0 : _a2.call(eventCallbacks);
+      var _a3;
+      (_a3 = eventCallbacks == null ? void 0 : eventCallbacks.onTransactionCategorized) == null ? void 0 : _a3.call(eventCallbacks);
     });
   });
   const shouldHideAfterCategorize = () => {
     return (filters == null ? void 0 : filters.categorizationStatus) === DisplayState.review;
   };
-  const removeAfterCategorize = (bankTransaction) => {
+  const removeAfterCategorize = (transactionIds) => {
     if (shouldHideAfterCategorize()) {
       const updatedData = rawResponseData == null ? void 0 : rawResponseData.map((page) => {
         var _a2;
         return __spreadProps(__spreadValues({}, page), {
-          data: (_a2 = page.data) == null ? void 0 : _a2.filter((bt) => bt.id !== bankTransaction.id)
+          data: (_a2 = page.data) == null ? void 0 : _a2.filter((bt) => !transactionIds.includes(bt.id))
         });
       });
       void mutate(updatedData, { revalidate: false });
@@ -5043,7 +5060,7 @@ const useAugmentedBankTransactions = (params) => {
     isError: !!responseError,
     categorize: categorizeWithOptimisticUpdate,
     match: matchWithOptimisticUpdate,
-    updateOneLocal,
+    updateLocalBankTransactions,
     shouldHideAfterCategorize,
     removeAfterCategorize,
     display,
@@ -6411,7 +6428,7 @@ const getBookkeepingStatus = get(({ businessId }) => {
 });
 const BOOKKEEPING_TAG_KEY = "#bookkeeping";
 const BOOKKEEPING_STATUS_TAG_KEY = "#bookkeeping-status";
-function buildKey$V({
+function buildKey$Z({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -6429,7 +6446,7 @@ function useBookkeepingStatus() {
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   return useSWR(
-    () => buildKey$V(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$Z(__spreadProps(__spreadValues({}, auth), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }) => getBookkeepingStatus(
@@ -6469,6 +6486,50 @@ function isCategorizationEnabledForStatus(status) {
     }
   }
 }
+const CATEGORIES_TAG_KEY = "#categories";
+function buildKey$Y({
+  access_token: accessToken,
+  apiUrl,
+  businessId,
+  mode
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      mode,
+      tags: [CATEGORIES_TAG_KEY]
+    };
+  }
+}
+const getCategories = get(({ businessId, mode }) => {
+  const parameters = toDefinedSearchParameters({ mode });
+  return `/v1/businesses/${businessId}/categories?${parameters}`;
+});
+function useCategories({ mode } = {}) {
+  const { data: auth } = useAuth();
+  const { businessId } = useLayerContext();
+  return useSWR(
+    () => buildKey$Y(__spreadProps(__spreadValues({}, auth), {
+      businessId,
+      mode
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2, mode: mode2 }) => getCategories(
+      apiUrl,
+      accessToken,
+      {
+        params: {
+          businessId: businessId2,
+          mode: mode2
+        }
+      }
+    )().then(({ data }) => Schema.decodeUnknownPromise(CategoryListSchema)(data)).then((categoryList) => categoryList.categories)
+  );
+}
+function usePreloadCategories(options2) {
+  useCategories(options2);
+}
 const useElementSize = (callback) => {
   const ref = useRef(null);
   const resizeTimeout = useRef(null);
@@ -6596,15 +6657,15 @@ const BankTransactionsContext = createContext({
   isError: false,
   refetch: () => {
   },
-  categorize: () => Promise.resolve(void 0),
-  match: () => Promise.resolve(void 0),
+  categorize: () => Promise.resolve(),
+  match: () => Promise.resolve(),
   metadata: {
     pagination: {
       cursor: void 0,
       has_more: false
     }
   },
-  updateOneLocal: () => void 0,
+  updateLocalBankTransactions: () => void 0,
   shouldHideAfterCategorize: () => false,
   removeAfterCategorize: () => void 0,
   display: DisplayState.review,
@@ -6887,7 +6948,7 @@ const useBusinessActivationDate = () => {
   const { business } = useLayerContext();
   return useMemo(() => getActivationDate(business), [business]);
 };
-function buildKey$U({
+function buildKey$X({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -6905,7 +6966,7 @@ function useBankTransactionsDownload() {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   return useSWRMutation(
-    () => buildKey$U(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$X(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({
@@ -7063,7 +7124,7 @@ const BulkCategorizeRequestSchema = Schema.Struct({
   transactions: Schema.Array(CategorizeTransactionRequestSchema$1)
 });
 const bulkCategorize = post(({ businessId }) => `/v1/businesses/${businessId}/bank-transactions/bulk-categorize`);
-function buildKey$T({
+function buildKey$W({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -7082,7 +7143,7 @@ const useBulkCategorize = () => {
   const { businessId, eventCallbacks } = useLayerContext();
   const { forceReloadBankTransactions } = useBankTransactionsGlobalCacheActions();
   const mutationResponse = useSWRMutation(
-    () => buildKey$T(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$W(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg }) => bulkCategorize(
@@ -7326,50 +7387,6 @@ const Span = forwardRef(
     );
   }
 );
-const CATEGORIES_TAG_KEY = "#categories";
-function buildKey$S({
-  access_token: accessToken,
-  apiUrl,
-  businessId,
-  mode
-}) {
-  if (accessToken && apiUrl) {
-    return {
-      accessToken,
-      apiUrl,
-      businessId,
-      mode,
-      tags: [CATEGORIES_TAG_KEY]
-    };
-  }
-}
-const getCategories = get(({ businessId, mode }) => {
-  const parameters = toDefinedSearchParameters({ mode });
-  return `/v1/businesses/${businessId}/categories?${parameters}`;
-});
-function useCategories({ mode } = {}) {
-  const { data: auth } = useAuth();
-  const { businessId } = useLayerContext();
-  return useSWR(
-    () => buildKey$S(__spreadProps(__spreadValues({}, auth), {
-      businessId,
-      mode
-    })),
-    ({ accessToken, apiUrl, businessId: businessId2, mode: mode2 }) => getCategories(
-      apiUrl,
-      accessToken,
-      {
-        params: {
-          businessId: businessId2,
-          mode: mode2
-        }
-      }
-    )().then(({ data }) => Schema.decodeUnknownPromise(CategoryListSchema)(data)).then((categoryList) => categoryList.categories)
-  );
-}
-function usePreloadCategories(options2) {
-  useCategories(options2);
-}
 const Check = (_R) => {
   var _S = _R, { size = 18 } = _S, props = __objRest(_S, ["size"]);
   return /* @__PURE__ */ jsx(
@@ -7635,7 +7652,7 @@ function ComboBox(_T) {
   const CustomDropdownIndicatorRef = useRef(buildCustomDropdownIndicator());
   return /* @__PURE__ */ jsxs(VStack, { gap: "3xs", fluid: true, className: className ? `${className}__Container` : void 0, children: [
     /* @__PURE__ */ jsx(
-      Select$1,
+      ReactSelect,
       __spreadProps(__spreadValues({
         inputId: effectiveInputId
       }, ariaProps), {
@@ -9048,7 +9065,7 @@ const bulkMatchOrCategorize = post(
     return `/v1/businesses/${businessId}/bank-transactions/bulk-match-or-categorize?${parameters}`;
   }
 );
-function buildKey$R({
+function buildKey$V({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -9073,7 +9090,7 @@ const useBulkMatchOrCategorize = () => {
     return { transactions };
   }, [selectedIds, transactionCategories]);
   const mutationResponse = useSWRMutation(
-    () => buildKey$R(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$V(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg }) => bulkMatchOrCategorize(
@@ -9143,7 +9160,7 @@ const BulkUncategorizeRequestSchema = Schema.Struct({
   )
 });
 const bulkUncategorize = post(({ businessId }) => `/v1/businesses/${businessId}/bank-transactions/bulk-uncategorize`);
-function buildKey$Q({
+function buildKey$U({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -9162,7 +9179,7 @@ const useBulkUncategorize = () => {
   const { businessId, eventCallbacks } = useLayerContext();
   const { forceReloadBankTransactions } = useBankTransactionsGlobalCacheActions();
   const mutationResponse = useSWRMutation(
-    () => buildKey$Q(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$U(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg }) => bulkUncategorize(
@@ -9566,7 +9583,7 @@ const mapRawCustomAccountToCustomAccount = (raw) => ({
   userCreated: raw.user_created
 });
 const CUSTOM_ACCOUNTS_TAG_KEY = "#custom-accounts";
-function buildKey$P({
+function buildKey$T({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -9593,7 +9610,7 @@ function useCustomAccounts({ userCreated } = {}) {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   return useSWR(
-    () => buildKey$P(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$T(__spreadProps(__spreadValues({}, data), {
       businessId,
       userCreated
     })),
@@ -9606,7 +9623,7 @@ function useCustomAccounts({ userCreated } = {}) {
     )().then(({ data: data2 }) => data2 == null ? void 0 : data2.custom_accounts.map((account) => mapRawCustomAccountToCustomAccount(account)))
   );
 }
-function buildKey$O({
+function buildKey$S({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -9639,7 +9656,7 @@ function useCustomAccountParseCsv() {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   return useSWRMutation(
-    () => buildKey$O(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$S(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: { customAccountId, file } }) => parseCsv(
@@ -9884,7 +9901,7 @@ function flattenValidationErrors(errors) {
   );
 }
 const createCustomAccount = post(({ businessId }) => `/v1/businesses/${businessId}/custom-accounts`);
-function buildKey$N({
+function buildKey$R({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -9903,7 +9920,7 @@ function useCreateCustomAccount() {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const mutationResponse = useSWRMutation(
-    () => buildKey$N(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$R(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: body }) => createCustomAccount(
@@ -10440,10 +10457,63 @@ function FormNumberField({
     })
   );
 }
+const SWITCH_CLASS_NAME = "Layer__UI__Switch";
+const Switch = forwardRef((_Va, ref) => {
+  var _Wa = _Va, {
+    children,
+    className
+  } = _Wa, props = __objRest(_Wa, [
+    "children",
+    "className"
+  ]);
+  return /* @__PURE__ */ jsx(
+    Switch$1,
+    __spreadProps(__spreadValues({}, props), {
+      className: classNames(SWITCH_CLASS_NAME, className),
+      ref,
+      children: withRenderProp(children, (node) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx("div", { slot: "indicator" }),
+        node
+      ] }))
+    })
+  );
+});
+Switch.displayName = "Switch";
+const FORM_SWITCH_FIELD_CLASSNAME = "Layer__FormSwitchField";
+function FormSwitchField({
+  label,
+  className,
+  inline = false,
+  showLabel = true,
+  isReadOnly = false
+}) {
+  const field = useFieldContext();
+  const { name, state, handleChange } = field;
+  const { value } = state;
+  const additionalAriaProps = !showLabel && { "aria-label": label };
+  const switchClassNames = classNames(
+    FORM_SWITCH_FIELD_CLASSNAME,
+    inline && `${FORM_SWITCH_FIELD_CLASSNAME}--inline`,
+    className
+  );
+  return /* @__PURE__ */ jsx(
+    Switch,
+    __spreadProps(__spreadValues({
+      className: switchClassNames,
+      isSelected: value,
+      onChange: handleChange,
+      name,
+      isReadOnly,
+      slot: "switch"
+    }, additionalAriaProps), {
+      children: showLabel && /* @__PURE__ */ jsx(Label, { slot: "label", size: "sm", htmlFor: name, children: label })
+    })
+  );
+}
 const TEXTAREA_CLASS_NAME = "Layer__UI__TextArea";
 const TextArea = forwardRef(
-  function TextArea2(_Va, ref) {
-    var _Wa = _Va, { resize = "none" } = _Wa, restProps = __objRest(_Wa, ["resize"]);
+  function TextArea2(_Xa, ref) {
+    var _Ya = _Xa, { resize = "none" } = _Ya, restProps = __objRest(_Ya, ["resize"]);
     const dataProperties = toDataProperties({ resize });
     return /* @__PURE__ */ jsx(
       TextArea$1,
@@ -10454,8 +10524,8 @@ const TextArea = forwardRef(
     );
   }
 );
-function FormTextAreaField(_Xa) {
-  var _Ya = _Xa, { placeholder } = _Ya, props = __objRest(_Ya, ["placeholder"]);
+function FormTextAreaField(_Za) {
+  var __a = _Za, { placeholder } = __a, props = __objRest(__a, ["placeholder"]);
   const field = useFieldContext();
   const { name, state, handleChange, handleBlur } = field;
   const { value } = state;
@@ -10475,8 +10545,8 @@ function FormTextAreaField(_Xa) {
     }
   ) }));
 }
-function FormTextField(_Za) {
-  var __a = _Za, { placeholder } = __a, props = __objRest(__a, ["placeholder"]);
+function FormTextField(_$a) {
+  var _ab = _$a, { placeholder } = _ab, props = __objRest(_ab, ["placeholder"]);
   const field = useFieldContext();
   const { name, state, handleChange, handleBlur } = field;
   const { value } = state;
@@ -10504,6 +10574,7 @@ const { useAppForm: useRawAppForm } = createFormHook({
     FormCheckboxField,
     FormDateField,
     FormNumberField,
+    FormSwitchField,
     FormTextAreaField,
     FormTextField
   },
@@ -10564,13 +10635,13 @@ const useCustomAccountForm = ({ onSuccess }) => {
   const isFormValid = useStore$1(form.store, (state) => state.isValid);
   return { form, submitError, isFormValid };
 };
-const Input = (_$a) => {
-  var _ab = _$a, {
+const Input = (_bb) => {
+  var _cb = _bb, {
     className,
     isInvalid,
     errorMessage,
     leftText
-  } = _ab, props = __objRest(_ab, [
+  } = _cb, props = __objRest(_cb, [
     "className",
     "isInvalid",
     "errorMessage",
@@ -10616,8 +10687,8 @@ const InputGroup = ({
     children
   ] });
 };
-const ChevronDownFill = (_bb) => {
-  var _cb = _bb, { size = 18 } = _cb, props = __objRest(_cb, ["size"]);
+const ChevronDownFill = (_db) => {
+  var _eb = _db, { size = 18 } = _eb, props = __objRest(_eb, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -10642,6 +10713,21 @@ const ChevronDownFill = (_bb) => {
     })
   );
 };
+const SelectMenuPortal = (_fb) => {
+  var _gb = _fb, {
+    children
+  } = _gb, restProps = __objRest(_gb, [
+    "children"
+  ]);
+  const dataProperties = toDataProperties({ "react-aria-top-layer": true });
+  return /* @__PURE__ */ jsx(
+    components.MenuPortal,
+    __spreadProps(__spreadValues({}, restProps), {
+      innerProps: dataProperties,
+      children
+    })
+  );
+};
 const Select = ({
   name,
   options: options2,
@@ -10665,7 +10751,7 @@ const Select = ({
   const DropdownIndicator = useCallback((props) => /* @__PURE__ */ jsx(components.DropdownIndicator, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx(ChevronDownFill, {}) })), []);
   return /* @__PURE__ */ jsxs(DeprecatedTooltip, { disabled: !isInvalid || !errorMessage, children: [
     /* @__PURE__ */ jsx(DeprecatedTooltipTrigger, { className: "Layer__input-tooltip", children: /* @__PURE__ */ jsx(
-      Select$1,
+      ReactSelect,
       {
         inputId,
         name,
@@ -10678,7 +10764,7 @@ const Select = ({
         onChange: (newValue) => newValue && onChange(newValue),
         menuPortalTarget: document.body,
         styles: { menuPortal: (base) => __spreadProps(__spreadValues({}, base), { zIndex: 9999 }) },
-        components: { DropdownIndicator },
+        components: { DropdownIndicator, MenuPortal: SelectMenuPortal },
         isLoading,
         isDisabled: disabled
       }
@@ -10686,8 +10772,8 @@ const Select = ({
     /* @__PURE__ */ jsx(DeprecatedTooltipContent, { className: "Layer__tooltip", children: errorMessage })
   ] });
 };
-const ErrorText = (_db) => {
-  var _eb = _db, { className } = _eb, props = __objRest(_eb, ["className"]);
+const ErrorText = (_hb) => {
+  var _ib = _hb, { className } = _ib, props = __objRest(_ib, ["className"]);
   return /* @__PURE__ */ jsx(Text, __spreadProps(__spreadValues({}, props), { status: "error", className }));
 };
 const accountTypeOptions = [
@@ -10841,7 +10927,7 @@ const CreatableSelect = ({
         formatCreateLabel: formatCreateLabel2,
         menuPortalTarget: document.body,
         styles: { menuPortal: (base) => __spreadProps(__spreadValues({}, base), { zIndex: 9999 }) },
-        components: { DropdownIndicator },
+        components: { DropdownIndicator, MenuPortal: SelectMenuPortal },
         isLoading,
         isDisabled: disabled,
         isClearable,
@@ -11026,7 +11112,7 @@ function UploadTransactionsUploadCsvStep({ selectedAccount, onSelectAccount, sel
 const createCustomAccountTransactions = post(
   ({ businessId, customAccountId }) => `/v1/businesses/${businessId}/custom-accounts/${customAccountId}/transactions`
 );
-function buildKey$M({
+function buildKey$Q({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -11045,7 +11131,7 @@ function useCreateCustomAccountTransactions() {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   return useSWRMutation(
-    () => buildKey$M(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$Q(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, _a) => {
@@ -11545,8 +11631,8 @@ const BulkActionsModule = ({ slots }) => {
     /* @__PURE__ */ jsx(slots.BulkActions, {})
   ] });
 };
-const DownloadCloud = (_fb) => {
-  var _gb = _fb, { size = 18 } = _gb, props = __objRest(_gb, ["size"]);
+const DownloadCloud = (_jb) => {
+  var _kb = _jb, { size = 18 } = _kb, props = __objRest(_kb, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -11798,8 +11884,8 @@ function MonthCalendar({
 const POPOVER_CLASS_NAME = "Layer__Popover";
 const POPOVER_CLASS_NAMES = `Layer__Portal ${POPOVER_CLASS_NAME}`;
 const Popover = forwardRef(
-  function Popover2(_hb, ref) {
-    var _ib = _hb, { flexInline = false } = _ib, restProps = __objRest(_ib, ["flexInline"]);
+  function Popover2(_lb, ref) {
+    var _mb = _lb, { flexInline = false } = _mb, restProps = __objRest(_mb, ["flexInline"]);
     const dataProperties = toDataProperties({ "flex-inline": flexInline });
     return /* @__PURE__ */ jsx(
       Popover$1,
@@ -12196,8 +12282,8 @@ const BankTransactionsHeader = ({
     }
   );
 };
-const Inbox = (_jb) => {
-  var _kb = _jb, { size = 18 } = _kb, props = __objRest(_kb, ["size"]);
+const Inbox = (_nb) => {
+  var _ob = _nb, { size = 18 } = _ob, props = __objRest(_ob, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -12281,7 +12367,7 @@ function BankTransactionsTableEmptyStates({
   return /* @__PURE__ */ jsx("div", { className: "Layer__table-state-container", children: StateComponent });
 }
 const REJECT_CATEGORIZATION_RULE_SUGGESTION_TAG = "#reject-categorization-rule-suggestion";
-function buildKey$L({
+function buildKey$P({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -12302,7 +12388,7 @@ function useRejectCategorizationRulesUpdateSuggestion() {
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   const mutationResponse = useSWRMutation(
-    () => buildKey$L({
+    () => buildKey$P({
       access_token: auth == null ? void 0 : auth.access_token,
       apiUrl: auth == null ? void 0 : auth.apiUrl,
       businessId
@@ -12521,7 +12607,7 @@ function useCategorizationRulesGlobalCacheActions() {
   return { patchCategorizationRuleByKey, forceReloadCategorizationRules };
 }
 const CREATE_CATEGORIZATION_RULE_TAG = "#create-categorization-rule";
-function buildKey$K({
+function buildKey$O({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -12549,7 +12635,7 @@ function useCreateCategorizationRule() {
   const { invalidatePnlDetailLines } = usePnlDetailLinesInvalidator();
   const { forceReloadCategorizationRules } = useCategorizationRulesGlobalCacheActions();
   const mutationResponse = useSWRMutation(
-    () => buildKey$K({
+    () => buildKey$O({
       access_token: auth == null ? void 0 : auth.access_token,
       apiUrl: auth == null ? void 0 : auth.apiUrl,
       businessId
@@ -12679,8 +12765,8 @@ function asMutable(a) {
 const CSS_PREFIX$1 = "Layer__UI__Table";
 const getClassName = (component, additionalClassNames, withHidden) => classNames(`${CSS_PREFIX$1}-${component}`, withHidden && `${CSS_PREFIX$1}-${component}--hidden`, additionalClassNames);
 const Table$1 = forwardRef(
-  (_lb, ref) => {
-    var _mb = _lb, { children, className } = _mb, restProps = __objRest(_mb, ["children", "className"]);
+  (_pb, ref) => {
+    var _qb = _pb, { children, className } = _qb, restProps = __objRest(_qb, ["children", "className"]);
     return /* @__PURE__ */ jsx(
       Table$2,
       __spreadProps(__spreadValues({
@@ -12693,8 +12779,8 @@ const Table$1 = forwardRef(
   }
 );
 Table$1.displayName = "Table";
-const TableHeaderInner = (_nb, ref) => {
-  var _ob = _nb, { children, className, hideHeader } = _ob, restProps = __objRest(_ob, ["children", "className", "hideHeader"]);
+const TableHeaderInner = (_rb, ref) => {
+  var _sb = _rb, { children, className, hideHeader } = _sb, restProps = __objRest(_sb, ["children", "className", "hideHeader"]);
   return /* @__PURE__ */ jsx(
     TableHeader$1,
     __spreadProps(__spreadValues({
@@ -12707,8 +12793,8 @@ const TableHeaderInner = (_nb, ref) => {
 };
 const TableHeader = forwardRef(TableHeaderInner);
 TableHeader.displayName = "TableHeader";
-const TableBodyInner = (_pb, ref) => {
-  var _qb = _pb, { children, className } = _qb, restProps = __objRest(_qb, ["children", "className"]);
+const TableBodyInner = (_tb, ref) => {
+  var _ub = _tb, { children, className } = _ub, restProps = __objRest(_ub, ["children", "className"]);
   return /* @__PURE__ */ jsx(
     TableBody$2,
     __spreadProps(__spreadValues({
@@ -12721,8 +12807,8 @@ const TableBodyInner = (_pb, ref) => {
 };
 const TableBody$1 = forwardRef(TableBodyInner);
 TableBody$1.displayName = "TableBody";
-const RowInner = (_rb, ref) => {
-  var _sb = _rb, { children, className, depth = 0 } = _sb, restProps = __objRest(_sb, ["children", "className", "depth"]);
+const RowInner = (_vb, ref) => {
+  var _wb = _vb, { children, className, depth = 0 } = _wb, restProps = __objRest(_wb, ["children", "className", "depth"]);
   const dataProperties = toDataProperties({ depth });
   return /* @__PURE__ */ jsx(
     Row$1,
@@ -12737,8 +12823,8 @@ const RowInner = (_rb, ref) => {
 const Row = forwardRef(RowInner);
 Row.displayName = "Row";
 const Column = forwardRef(
-  (_tb, ref) => {
-    var _ub = _tb, { children, className, textAlign = "left" } = _ub, restProps = __objRest(_ub, ["children", "className", "textAlign"]);
+  (_xb, ref) => {
+    var _yb = _xb, { children, className, textAlign = "left" } = _yb, restProps = __objRest(_yb, ["children", "className", "textAlign"]);
     const dataProperties = toDataProperties({ "text-align": textAlign });
     return /* @__PURE__ */ jsx(
       Column$1,
@@ -12753,8 +12839,8 @@ const Column = forwardRef(
 );
 Column.displayName = "Column";
 const Cell = forwardRef(
-  (_vb, ref) => {
-    var _wb = _vb, { children, className } = _wb, restProps = __objRest(_wb, ["children", "className"]);
+  (_zb, ref) => {
+    var _Ab = _zb, { children, className } = _Ab, restProps = __objRest(_Ab, ["children", "className"]);
     return /* @__PURE__ */ jsx(
       Cell$1,
       __spreadProps(__spreadValues({
@@ -12779,7 +12865,7 @@ const DEFAULT_NUM_ROWS = 15;
 const HEADER_HEIGHT = 52;
 const DEFAULT_TABLE_HEIGHT = DEFAULT_ROW_HEIGHT * DEFAULT_NUM_ROWS + HEADER_HEIGHT - 2;
 const CSS_PREFIX = "Layer__UI__VirtualizedTable";
-const EMPTY_ARRAY$3 = [];
+const EMPTY_ARRAY$2 = [];
 const VirtualizedDataTable = ({
   columnConfig,
   data,
@@ -12804,7 +12890,7 @@ const VirtualizedDataTable = ({
   }, [data, height, rowHeight, shrinkHeightToFitRows]);
   const columnHelper = createColumnHelper();
   const columns = Object.values(columnConfig);
-  const tableData = data != null ? data : EMPTY_ARRAY$3;
+  const tableData = data != null ? data : EMPTY_ARRAY$2;
   const columnDefs = columns.map((col) => {
     return columnHelper.display({
       id: col.id,
@@ -13095,7 +13181,7 @@ const useSaveBankTransactionRow = () => {
       return;
     }
     if (isSuggestedMatchAsOption(selectedCategory)) {
-      return matchBankTransaction2(bankTransaction.id, selectedCategory.original.id);
+      return matchBankTransaction2(bankTransaction, selectedCategory.original.id);
     }
     if (isSplitAsOption(selectedCategory)) {
       const splitCategorizationRequest = buildCategorizeBankTransactionPayloadForSplit(selectedCategory.original);
@@ -13131,8 +13217,8 @@ function useDelayedVisibility({
   );
   return { isVisible };
 }
-const File = (_xb) => {
-  var _yb = _xb, { size = 12 } = _yb, props = __objRest(_yb, ["size"]);
+const File = (_Bb) => {
+  var _Cb = _Bb, { size = 12 } = _Cb, props = __objRest(_Cb, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -13215,14 +13301,14 @@ const variants = {
     }
   }
 };
-const AnimatedPresenceDiv = (_zb) => {
-  var _Ab = _zb, {
+const AnimatedPresenceDiv = (_Db) => {
+  var _Eb = _Db, {
     children,
     variant,
     isOpen,
     slotProps = { AnimatePresence: { initial: false } },
     key
-  } = _Ab, props = __objRest(_Ab, [
+  } = _Eb, props = __objRest(_Eb, [
     "children",
     "variant",
     "isOpen",
@@ -13297,7 +13383,7 @@ const getBookkeepingPeriods = get(({ businessId }) => {
   return `/v1/businesses/${businessId}/bookkeeping/periods`;
 });
 const BOOKKEEPING_PERIODS_TAG_KEY = "#bookkeeping-periods";
-function buildKey$J({
+function buildKey$N({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -13318,7 +13404,7 @@ function useBookkeepingPeriods() {
   const { data, isLoading: isLoadingBookkeepingStatus } = useBookkeepingStatus();
   const isActiveOrPaused = data ? isActiveOrPausedBookkeepingStatus(data.status) : false;
   const swrResponse = useSWR(
-    () => buildKey$J(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$N(__spreadProps(__spreadValues({}, auth), {
       businessId,
       isActiveOrPaused
     })),
@@ -13342,8 +13428,8 @@ function useBookkeepingPeriods() {
     }
   });
 }
-const Clock = (_Bb) => {
-  var _Cb = _Bb, { size = 18 } = _Cb, props = __objRest(_Cb, ["size"]);
+const Clock = (_Fb) => {
+  var _Gb = _Fb, { size = 18 } = _Gb, props = __objRest(_Gb, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -13669,8 +13755,8 @@ const useSplitsForm = ({
     saveLocalSplitsToCategoryStore
   };
 };
-const ScissorsFullOpen = (_Db) => {
-  var _Eb = _Db, { size = 12 } = _Eb, props = __objRest(_Eb, ["size"]);
+const ScissorsFullOpen = (_Hb) => {
+  var _Ib = _Hb, { size = 12 } = _Ib, props = __objRest(_Ib, ["size"]);
   return /* @__PURE__ */ jsx(
     "svg",
     __spreadProps(__spreadValues({
@@ -13735,8 +13821,8 @@ const ScissorsFullOpen = (_Db) => {
     })
   );
 };
-const Trash = (_Fb) => {
-  var _Gb = _Fb, { size = 18 } = _Gb, props = __objRest(_Gb, ["size"]);
+const Trash = (_Jb) => {
+  var _Kb = _Jb, { size = 18 } = _Kb, props = __objRest(_Kb, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -13798,7 +13884,7 @@ const useReceipts = ({
   const { businessId } = useLayerContext();
   const { apiUrl } = useEnvironment();
   const { data: auth } = useAuth();
-  const { updateOneLocal: updateBankTransaction } = useBankTransactionsContext();
+  const { updateLocalBankTransactions } = useBankTransactionsContext();
   const [receiptUrls, setReceiptUrls] = useState([]);
   useEffect(() => {
     if (isActive && receiptUrls.length === 0 && hasReceipts(bankTransaction)) {
@@ -13854,10 +13940,10 @@ const useReceipts = ({
         documentType: "RECEIPT"
       });
       yield fetchDocuments();
-      if (updateBankTransaction && ((_a = result == null ? void 0 : result.data) == null ? void 0 : _a.id) && (bankTransaction == null ? void 0 : bankTransaction.document_ids) && bankTransaction.document_ids.length === 0) {
-        updateBankTransaction(__spreadProps(__spreadValues({}, bankTransaction), {
+      if (((_a = result == null ? void 0 : result.data) == null ? void 0 : _a.id) && (bankTransaction == null ? void 0 : bankTransaction.document_ids) && bankTransaction.document_ids.length === 0) {
+        updateLocalBankTransactions([__spreadProps(__spreadValues({}, bankTransaction), {
           document_ids: [result.data.id]
-        }));
+        })]);
       }
     } catch (_err) {
       const newReceiptUrls = receipts.map((url) => {
@@ -13931,8 +14017,8 @@ const ReceiptsProvider = ({
   const contextData = useReceipts({ bankTransaction, isActive });
   return /* @__PURE__ */ jsx(ReceiptsContext.Provider, { value: contextData, children });
 };
-const Eye = (_Hb) => {
-  var _Ib = _Hb, { size = 18 } = _Ib, props = __objRest(_Ib, ["size"]);
+const Eye = (_Lb) => {
+  var _Mb = _Lb, { size = 18 } = _Mb, props = __objRest(_Mb, ["size"]);
   return /* @__PURE__ */ jsx(
     "svg",
     __spreadProps(__spreadValues({
@@ -14068,11 +14154,11 @@ const FileThumb = ({
     }
   );
 };
-const TextButton = (_Jb) => {
-  var _Kb = _Jb, {
+const TextButton = (_Nb) => {
+  var _Ob = _Nb, {
     className,
     children
-  } = _Kb, props = __objRest(_Kb, [
+  } = _Ob, props = __objRest(_Ob, [
     "className",
     "children"
   ]);
@@ -14156,8 +14242,8 @@ const openReceiptInNewTab = (url, index) => (e) => {
       `);
   }
 };
-const BankTransactionReceiptsWithProvider = forwardRef((_Lb, ref) => {
-  var _Mb = _Lb, { bankTransaction, isActive } = _Mb, props = __objRest(_Mb, ["bankTransaction", "isActive"]);
+const BankTransactionReceiptsWithProvider = forwardRef((_Pb, ref) => {
+  var _Qb = _Pb, { bankTransaction, isActive } = _Qb, props = __objRest(_Qb, ["bankTransaction", "isActive"]);
   return /* @__PURE__ */ jsx(ReceiptsProvider, { bankTransaction, isActive, children: /* @__PURE__ */ jsx(BankTransactionReceipts, __spreadProps(__spreadValues({}, props), { ref })) });
 });
 BankTransactionReceiptsWithProvider.displayName = "BankTransactionReceiptsWithProvider";
@@ -14324,8 +14410,8 @@ const transformCurrencyValue = (rawValue) => {
   }
   return cleaned;
 };
-const AmountInput = (_Nb) => {
-  var _Ob = _Nb, {
+const AmountInput = (_Rb) => {
+  var _Sb = _Rb, {
     onChange,
     className,
     leftText,
@@ -14333,7 +14419,7 @@ const AmountInput = (_Nb) => {
     isInvalid,
     badge,
     placeholder = "$0.00"
-  } = _Ob, props = __objRest(_Ob, [
+  } = _Sb, props = __objRest(_Sb, [
     "onChange",
     "className",
     "leftText",
@@ -14653,7 +14739,7 @@ const ToggleOption = ({
   ] });
 };
 const GET_BANK_TRANSACTION_METADATA_TAG_KEY = "#bank-transaction-metadata";
-function buildKey$I({
+function buildKey$M({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -14673,7 +14759,7 @@ function useBankTransactionMetadata({ bankTransactionId }) {
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   return useSWR(
-    () => buildKey$I(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$M(__spreadProps(__spreadValues({}, auth), {
       businessId,
       bankTransactionId
     })),
@@ -14703,7 +14789,7 @@ class UpdateBankTransactionMetadataSWRResponse {
     return this.swrResponse.error !== void 0;
   }
 }
-function buildKey$H({
+function buildKey$L({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -14724,7 +14810,7 @@ function useUpdateBankTransactionMetadata({ bankTransactionId, onSuccess }) {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$H({
+    () => buildKey$L({
       access_token: auth == null ? void 0 : auth.access_token,
       apiUrl: auth == null ? void 0 : auth.apiUrl,
       businessId,
@@ -14807,12 +14893,12 @@ const useBankTransactionMemo = ({ bankTransactionId }) => {
     isSaved
   }), [form, isErrorUpdatingMemo, isUpdatingMemo, isSaved]);
 };
-const Textarea = (_Pb) => {
-  var _Qb = _Pb, {
+const Textarea = (_Tb) => {
+  var _Ub = _Tb, {
     className,
     isInvalid,
     errorMessage
-  } = _Qb, props = __objRest(_Qb, [
+  } = _Ub, props = __objRest(_Ub, [
     "className",
     "isInvalid",
     "errorMessage"
@@ -14905,7 +14991,7 @@ function useMinMutatingMutation({
   });
 }
 const SET_METADATA_ON_BANK_TRANSACTION_TAG_KEY = "#set-metadata-on-bank-transaction";
-function buildKey$G({
+function buildKey$K({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -14931,7 +15017,7 @@ function useSetMetadataOnBankTransaction({
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const mutationResponse = useSWRMutation(
-    () => buildKey$G(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$K(__spreadProps(__spreadValues({}, data), {
       businessId,
       bankTransactionId
     })),
@@ -15514,7 +15600,7 @@ function BankTransactionCustomerVendorVisibilityProvider({
 }
 const REMOVE_TAG_FROM_BANK_TRANSACTION_TAG_KEY = "#remove-tag-from-bank-transaction";
 const removeTagFromBankTransaction = del(({ businessId }) => `/v1/businesses/${businessId}/bank-transactions/tags`);
-function buildKey$F({
+function buildKey$J({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -15534,7 +15620,7 @@ function useRemoveTagFromBankTransaction({ bankTransactionId }) {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const mutationResponse = useSWRMutation(
-    () => buildKey$F(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$J(__spreadProps(__spreadValues({}, data), {
       businessId,
       bankTransactionId
     })),
@@ -15593,7 +15679,7 @@ function useRemoveTagFromBankTransaction({ bankTransactionId }) {
 }
 const TAG_BANK_TRANSACTION_TAG_KEY = "#tag-bank-transaction";
 const tagBankTransaction = post(({ businessId }) => `/v1/businesses/${businessId}/bank-transactions/tags`);
-function buildKey$E({
+function buildKey$I({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -15613,7 +15699,7 @@ function useTagBankTransaction({ bankTransactionId }) {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const mutationResponse = useSWRMutation(
-    () => buildKey$E(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$I(__spreadProps(__spreadValues({}, data), {
       businessId,
       bankTransactionId
     })),
@@ -15728,7 +15814,7 @@ const FallbackWithSkeletonLoader = ({
   return children;
 };
 const TAG_DIMENSION_BY_KEY_TAG_KEY = "#tag-dimension-by-key";
-function buildKey$D({
+function buildKey$H({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -15772,7 +15858,7 @@ function useTagDimensionByKey({ isEnabled = true, dimensionKey }) {
   const { apiUrl } = useEnvironment();
   const { businessId } = useLayerContext();
   const swrResponse = useSWR(
-    () => buildKey$D(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$H(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       isEnabled,
       businessId,
@@ -16115,7 +16201,7 @@ const ExpandedBankTransactionRow = forwardRef(
       if (!foundMatch) {
         return;
       }
-      yield matchBankTransaction2(bankTransaction.id, foundMatch.id);
+      yield matchBankTransaction2(bankTransaction, foundMatch.id);
       deselect(bankTransaction.id);
       close2();
     });
@@ -16395,7 +16481,8 @@ const BankTransactionRow = ({
   const { setTransactionCategory } = useBankTransactionsCategoryActions();
   const { selectedCategory } = useGetBankTransactionCategory(bankTransaction.id);
   const { saveBankTransactionRow } = useSaveBankTransactionRow();
-  const displayAsCategorized = bankTransaction.recently_categorized && shouldHideAfterCategorize() ? false : categorized;
+  const isBeingRemoved = bankTransaction.recently_categorized && shouldHideAfterCategorize();
+  const displayAsCategorized = isBeingRemoved ? false : categorized;
   useEffect(() => {
     if (bankTransaction.error) {
       setShowRetry(true);
@@ -16429,7 +16516,7 @@ const BankTransactionRow = ({
   const openClassName = open ? `${className}--expanded` : "";
   const rowClassName = classNames(
     className,
-    bankTransaction.recently_categorized && editable && shouldHideAfterCategorize() ? "Layer__bank-transaction-row--removing" : "",
+    isBeingRemoved && editable ? "Layer__bank-transaction-row--removing" : "",
     open ? openClassName : "",
     initialLoad ? "initial-load" : "",
     isVisible ? "show" : ""
@@ -16602,7 +16689,7 @@ const BankTransactionRow = ({
                 children: "Retry"
               }
             ),
-            !displayAsCategorized && categorizationEnabled && !showRetry && /* @__PURE__ */ jsx(
+            !displayAsCategorized && categorizationEnabled && !showRetry && !isBeingRemoved && /* @__PURE__ */ jsx(
               SubmitButton,
               {
                 onClick: () => {
@@ -16618,8 +16705,8 @@ const BankTransactionRow = ({
                 children: displayAsCategorized ? (stringOverrides == null ? void 0 : stringOverrides.updateButtonText) || "Update" : (stringOverrides == null ? void 0 : stringOverrides.approveButtonText) || "Confirm"
               }
             ),
-            !categorizationEnabled && !displayAsCategorized && /* @__PURE__ */ jsx(VStack, { pis: "xs", fluid: true, children: /* @__PURE__ */ jsx(BankTransactionsProcessingInfo, {}) }),
-            /* @__PURE__ */ jsx(
+            !categorizationEnabled && !displayAsCategorized && !isBeingRemoved && /* @__PURE__ */ jsx(VStack, { pis: "xs", fluid: true, children: /* @__PURE__ */ jsx(BankTransactionsProcessingInfo, {}) }),
+            !isBeingRemoved && /* @__PURE__ */ jsx(
               IconButton,
               {
                 onClick: toggleOpen,
@@ -16956,26 +17043,6 @@ const BankTransactionsList = ({
     ) })
   ] });
 };
-const SWITCH_CLASS_NAME = "Layer__Switch";
-const Switch = forwardRef((_Rb, ref) => {
-  var _Sb = _Rb, {
-    children
-  } = _Sb, props = __objRest(_Sb, [
-    "children"
-  ]);
-  return /* @__PURE__ */ jsx(
-    Switch$1,
-    __spreadProps(__spreadValues({}, props), {
-      className: SWITCH_CLASS_NAME,
-      ref,
-      children: withRenderProp(children, (node) => /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx("div", { slot: "indicator" }),
-        node
-      ] }))
-    })
-  );
-});
-Switch.displayName = "Switch";
 const BankTransactionsMobileBulkActionsHeader = ({
   bankTransactions,
   bulkActionsEnabled,
@@ -17099,8 +17166,8 @@ const BankTransactionsMobileListItemCheckbox = ({
     }
   ) });
 };
-const Paperclip = (_Tb) => {
-  var _Ub = _Tb, { size = 20 } = _Ub, props = __objRest(_Ub, ["size"]);
+const Paperclip = (_Vb) => {
+  var _Wb = _Vb, { size = 20 } = _Wb, props = __objRest(_Wb, ["size"]);
   return /* @__PURE__ */ jsx(
     "svg",
     __spreadProps(__spreadValues({
@@ -17548,7 +17615,7 @@ const BankTransactionsMobileListMatchForm = ({
     if (!foundMatch) {
       return;
     }
-    yield matchBankTransaction2(bankTransaction.id, foundMatch.id, true);
+    yield matchBankTransaction2(bankTransaction, foundMatch.id, true);
   });
   const save = () => {
     var _a2;
@@ -18357,8 +18424,8 @@ const BankTransactionsTable = ({
     }
   );
 };
-const BackArrow = (_Vb) => {
-  var _Wb = _Vb, { size = 18 } = _Wb, props = __objRest(_Wb, ["size"]);
+const BackArrow = (_Xb) => {
+  var _Yb = _Xb, { size = 18 } = _Yb, props = __objRest(_Yb, ["size"]);
   return /* @__PURE__ */ jsx(
     "svg",
     __spreadProps(__spreadValues({
@@ -18391,7 +18458,7 @@ const BaseDetailView = ({ name, onGoBack, slots, children, borderless = false })
   ] });
 };
 const ARCHIVE_CATEGORIZATION_RULE_TAG = "#archive-categorization-rule";
-function buildKey$C({
+function buildKey$G({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -18416,7 +18483,7 @@ function useArchiveCategorizationRule() {
   const { businessId } = useLayerContext();
   const { forceReloadCategorizationRules } = useCategorizationRulesGlobalCacheActions();
   const mutationResponse = useSWRMutation(
-    () => buildKey$C({
+    () => buildKey$G({
       access_token: auth == null ? void 0 : auth.access_token,
       apiUrl: auth == null ? void 0 : auth.apiUrl,
       businessId
@@ -18526,8 +18593,8 @@ const usePaginationRange = ({
   }, [totalCount, pageSize, siblingCount, currentPage]);
   return paginationRange;
 };
-const ChevronLeft = (_Xb) => {
-  var props = __objRest(_Xb, []);
+const ChevronLeft = (_Zb) => {
+  var props = __objRest(_Zb, []);
   return /* @__PURE__ */ jsx(
     "svg",
     __spreadProps(__spreadValues({
@@ -18549,8 +18616,8 @@ const ChevronLeft = (_Xb) => {
     })
   );
 };
-const PaginationButton = (_Yb) => {
-  var _Zb = _Yb, { children, isSelected } = _Zb, buttonProps = __objRest(_Zb, ["children", "isSelected"]);
+const PaginationButton = (__b) => {
+  var _$b = __b, { children, isSelected } = _$b, buttonProps = __objRest(_$b, ["children", "isSelected"]);
   return /* @__PURE__ */ jsx(
     Button,
     __spreadProps(__spreadValues({
@@ -18632,7 +18699,6 @@ const Pagination = ({
     ) }, "page-next")
   ] }) }) });
 };
-const EMPTY_ARRAY$2 = [];
 function PaginatedTable({
   data,
   isLoading,
@@ -18643,7 +18709,8 @@ function PaginatedTable({
   paginationProps,
   slots
 }) {
-  const { pageSize = 20, hasMore, fetchMore, initialPage = 0, onSetPage } = paginationProps;
+  var _a;
+  const { pageSize = 20, hasMore, fetchMore, initialPage = 0, onSetPage, autoResetPageIndexRef } = paginationProps;
   const [pagination, setPagination] = useState({ pageIndex: initialPage, pageSize });
   const columnHelper = createColumnHelper();
   const columns = Object.values(columnConfig);
@@ -18655,7 +18722,7 @@ function PaginatedTable({
     });
   });
   const table2 = useReactTable({
-    data: data != null ? data : EMPTY_ARRAY$2,
+    data: data != null ? data : [],
     columns: columnDefs,
     state: { pagination },
     onPaginationChange: (updaterOrValue) => {
@@ -18665,7 +18732,7 @@ function PaginatedTable({
     },
     getPaginationRowModel: getPaginationRowModel(),
     getCoreRowModel: getCoreRowModel(),
-    autoResetPageIndex: false
+    autoResetPageIndex: (_a = autoResetPageIndexRef == null ? void 0 : autoResetPageIndexRef.current) != null ? _a : false
   });
   const { rows } = table2.getRowModel();
   const rowData = useMemo(() => rows.map((r) => r.original), [rows]);
@@ -18911,7 +18978,7 @@ const SuggestedCategorizationRuleUpdatesDrawer = ({
   ] }) });
 };
 const TAG_DIMENSIONS_TAG_KEY = "#tag-dimensions";
-function buildKey$B({
+function buildKey$F({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -18954,7 +19021,7 @@ function useTagDimensions({ isEnabled = true } = {}) {
   const { apiUrl } = useEnvironment();
   const { businessId } = useLayerContext();
   const swrResponse = useSWR(
-    () => buildKey$B(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$F(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       businessId,
       isEnabled
@@ -18979,8 +19046,8 @@ function usePreloadTagDimensions(parameters) {
   useTagDimensions(parameters);
 }
 const COMPONENT_NAME$c = "bank-transactions";
-const BankTransactions = (__b) => {
-  var _$b = __b, {
+const BankTransactions = (_ac) => {
+  var _bc = _ac, {
     onError,
     showTags = false,
     showCustomerVendor = false,
@@ -18988,7 +19055,7 @@ const BankTransactions = (__b) => {
     applyGlobalDateRange = false,
     mode,
     renderInAppLink
-  } = _$b, props = __objRest(_$b, [
+  } = _bc, props = __objRest(_bc, [
     "onError",
     "showTags",
     "showCustomerVendor",
@@ -19000,6 +19067,7 @@ const BankTransactions = (__b) => {
   usePreloadTagDimensions({ isEnabled: showTags });
   usePreloadCustomers({ isEnabled: showCustomerVendor });
   usePreloadVendors({ isEnabled: showCustomerVendor });
+  usePreloadCategories();
   return /* @__PURE__ */ jsx(ErrorBoundary, { onError, children: /* @__PURE__ */ jsx(CategorizationRulesProvider, { children: /* @__PURE__ */ jsx(BankTransactionsRouteStoreProvider, { children: /* @__PURE__ */ jsx(
     BankTransactionsProvider,
     {
@@ -19146,7 +19214,7 @@ const BankTransactionsTableView = ({
   const [listView, setListView] = useState(false);
   const [containerWidth, setContainerWidth] = useState(0);
   const debounceContainerWidth = debounce(setContainerWidth, 500);
-  const removeTransaction = (bankTransaction) => removeAfterCategorize(bankTransaction);
+  const removeTransaction = (bankTransaction) => removeAfterCategorize([bankTransaction.id]);
   const containerRef = useElementSize((_el, _en, size) => {
     if ((size == null ? void 0 : size.height) && (size == null ? void 0 : size.height) >= 90) {
       const newShift = -Math.floor(size.height / 2) + 6;
@@ -19353,8 +19421,8 @@ function QuickbooksContextProvider({ children }) {
   const quickbooksContextData = useQuickbooks();
   return /* @__PURE__ */ jsx(QuickbooksContext.Provider, { value: quickbooksContextData, children });
 }
-const Cog = (_ac) => {
-  var _bc = _ac, { size = 12 } = _bc, props = __objRest(_bc, ["size"]);
+const Cog = (_cc) => {
+  var _dc = _cc, { size = 12 } = _dc, props = __objRest(_dc, ["size"]);
   const id = useId();
   return /* @__PURE__ */ jsxs(
     "svg",
@@ -19375,8 +19443,8 @@ const Cog = (_ac) => {
     })
   );
 };
-const QuickbooksIcon = (_cc) => {
-  var _dc = _cc, { size = 24 } = _dc, props = __objRest(_dc, ["size"]);
+const QuickbooksIcon = (_ec) => {
+  var _fc = _ec, { size = 24 } = _fc, props = __objRest(_fc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -19535,8 +19603,8 @@ function IntegrationsQuickbooksUnlinkConfirmationModal({ isOpen, onOpenChange })
     }
   );
 }
-const MoreVertical = (_ec) => {
-  var _fc = _ec, { size = 18 } = _fc, props = __objRest(_fc, ["size"]);
+const MoreVertical = (_gc) => {
+  var _hc = _gc, { size = 18 } = _hc, props = __objRest(_hc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -19765,8 +19833,8 @@ const IntegrationsComponent = ({
     (quickbooksConnectionStatus == null ? void 0 : quickbooksConnectionStatus.is_connected) && /* @__PURE__ */ jsx(IntegrationsContent, {})
   ] });
 };
-const PlusIcon = (_gc) => {
-  var _hc = _gc, { size = 14 } = _hc, props = __objRest(_hc, ["size"]);
+const PlusIcon = (_ic) => {
+  var _jc = _ic, { size = 14 } = _jc, props = __objRest(_jc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -19808,8 +19876,8 @@ const PlusIcon = (_gc) => {
     })
   );
 };
-const InstitutionIcon = (_ic) => {
-  var _jc = _ic, { size = 18 } = _jc, props = __objRest(_jc, ["size"]);
+const InstitutionIcon = (_kc) => {
+  var _lc = _kc, { size = 18 } = _lc, props = __objRest(_lc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -20169,7 +20237,7 @@ function LinkedAccountToConfirm({
     ) })
   ] });
 }
-function buildKey$A({
+function buildKey$E({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -20227,7 +20295,7 @@ function useConfirmAndExcludeMultiple({ onSuccess }) {
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   return useSWRMutation(
-    () => buildKey$A({
+    () => buildKey$E({
       access_token: auth == null ? void 0 : auth.access_token,
       apiUrl: auth == null ? void 0 : auth.apiUrl,
       businessId
@@ -20427,8 +20495,8 @@ const MenuItem = forwardRef(
 );
 const PILL_CLASS_NAME = "Layer__Pill";
 const Pill = forwardRef(
-  function Pill2(_kc, ref) {
-    var _lc = _kc, { children, status } = _lc, restProps = __objRest(_lc, ["children", "status"]);
+  function Pill2(_mc, ref) {
+    var _nc = _mc, { children, status } = _nc, restProps = __objRest(_nc, ["children", "status"]);
     const dataProperties = toDataProperties({ status });
     return /* @__PURE__ */ jsx(
       Button$2,
@@ -20791,8 +20859,8 @@ const LinkedAccountsContent = ({
 };
 const CALENDAR_CLASS_NAME = "Layer__UI__Calendar";
 const Calendar = forwardRef(
-  function Calendar2(_mc, ref) {
-    var _nc = _mc, { className, isReadOnly } = _nc, restProps = __objRest(_nc, ["className", "isReadOnly"]);
+  function Calendar2(_oc, ref) {
+    var _pc = _oc, { className, isReadOnly } = _pc, restProps = __objRest(_pc, ["className", "isReadOnly"]);
     const dataProperties = toDataProperties({ readonly: isReadOnly });
     return /* @__PURE__ */ jsx(
       Calendar$1,
@@ -20806,8 +20874,8 @@ const Calendar = forwardRef(
 );
 const CALENDAR_GRID_CLASS_NAME = "Layer__UI__CalendarGrid";
 const CalendarGrid = forwardRef(
-  function CalendarGrid2(_oc, ref) {
-    var _pc = _oc, { className } = _pc, restProps = __objRest(_pc, ["className"]);
+  function CalendarGrid2(_qc, ref) {
+    var _rc = _qc, { className } = _rc, restProps = __objRest(_rc, ["className"]);
     return /* @__PURE__ */ jsx(
       CalendarGrid$1,
       __spreadProps(__spreadValues({}, restProps), {
@@ -20819,8 +20887,8 @@ const CalendarGrid = forwardRef(
 );
 const CALENDAR_GRID_BODY_CLASS_NAME = "Layer__UI__CalendarGridBody";
 const CalendarGridBody = forwardRef(
-  function CalendarGridBody2(_qc, ref) {
-    var _rc = _qc, { className } = _rc, restProps = __objRest(_rc, ["className"]);
+  function CalendarGridBody2(_sc, ref) {
+    var _tc = _sc, { className } = _tc, restProps = __objRest(_tc, ["className"]);
     return /* @__PURE__ */ jsx(
       CalendarGridBody$1,
       __spreadProps(__spreadValues({}, restProps), {
@@ -20832,8 +20900,8 @@ const CalendarGridBody = forwardRef(
 );
 const CALENDAR_CELL_CLASS_NAME = "Layer__UI__CalendarCell";
 const CalendarCell = forwardRef(
-  function CalendarCell2(_sc, ref) {
-    var _tc = _sc, { className, size = "sm" } = _tc, restProps = __objRest(_tc, ["className", "size"]);
+  function CalendarCell2(_uc, ref) {
+    var _vc = _uc, { className, size = "sm" } = _vc, restProps = __objRest(_vc, ["className", "size"]);
     const dataProperties = toDataProperties({ size });
     return /* @__PURE__ */ jsx(
       CalendarCell$1,
@@ -20846,8 +20914,8 @@ const CalendarCell = forwardRef(
 );
 const CALENDAR_GRID_HEADER_CLASS_NAME = "Layer__UI__CalendarGridHeader";
 const CalendarGridHeader = forwardRef(
-  function CalendarGridHeader2(_uc, ref) {
-    var _vc = _uc, { className } = _vc, restProps = __objRest(_vc, ["className"]);
+  function CalendarGridHeader2(_wc, ref) {
+    var _xc = _wc, { className } = _xc, restProps = __objRest(_xc, ["className"]);
     return /* @__PURE__ */ jsx(
       CalendarGridHeader$1,
       __spreadProps(__spreadValues({}, restProps), {
@@ -20859,8 +20927,8 @@ const CalendarGridHeader = forwardRef(
 );
 const CALENDAR_HEADER_CELL_CLASS_NAME = "Layer__UI__CalendarHeaderCell";
 const CalendarHeaderCell = forwardRef(
-  function CalendarHeaderCell2(_wc, ref) {
-    var _xc = _wc, { className, size = "sm" } = _xc, restProps = __objRest(_xc, ["className", "size"]);
+  function CalendarHeaderCell2(_yc, ref) {
+    var _zc = _yc, { className, size = "sm" } = _zc, restProps = __objRest(_zc, ["className", "size"]);
     const dataProperties = toDataProperties({ size });
     return /* @__PURE__ */ jsx(
       CalendarHeaderCell$1,
@@ -21102,7 +21170,7 @@ const AccountFormBox = ({
     /* @__PURE__ */ jsx("div", { className: `${CLASS_NAME$3}__success-banner`, children: /* @__PURE__ */ jsx(CheckCircle, { size: 36 }) })
   ] }));
 };
-function buildKey$z({
+function buildKey$D({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -21158,7 +21226,7 @@ function useBulkSetOpeningBalanceAndDate(data, { onSuccess }) {
     return errors;
   };
   return useSWRMutation(
-    () => buildKey$z({ access_token: auth == null ? void 0 : auth.access_token, apiUrl: auth == null ? void 0 : auth.apiUrl, businessId, data }),
+    () => buildKey$D({ access_token: auth == null ? void 0 : auth.access_token, apiUrl: auth == null ? void 0 : auth.apiUrl, businessId, data }),
     ({ accessToken, apiUrl, businessId: businessId2, data: data2 }) => Promise.allSettled(
       data2.map(
         ({ accountId, openingDate, openingBalance, isDateInvalid }) => {
@@ -21430,6 +21498,33 @@ const applyShare = (items, total) => {
     });
   });
 };
+const createPnlLineItemComparator = (filters) => {
+  return (a, b) => {
+    switch (filters == null ? void 0 : filters.sortBy) {
+      case "category":
+        if ((filters == null ? void 0 : filters.sortDirection) === "asc") {
+          return a.displayName.localeCompare(b.displayName);
+        }
+        return b.displayName.localeCompare(a.displayName);
+      case "type":
+        if ((filters == null ? void 0 : filters.sortDirection) === "asc") {
+          return a.type.localeCompare(b.type);
+        }
+        return b.type.localeCompare(a.type);
+      default:
+        if ((filters == null ? void 0 : filters.sortDirection) === "asc") {
+          return a.value - b.value;
+        }
+        return b.value - a.value;
+    }
+  };
+};
+const sortPnlLineItemsAndCalculateTotal = (items, filter) => {
+  const sorted = items.sort(createPnlLineItemComparator(filter));
+  const total = sorted.reduce((x, { value }) => x + value, 0);
+  const withShare = applyShare(sorted, total);
+  return { items: withShare, total };
+};
 const useProfitAndLoss = ({ tagFilter, reportingBasis }) => {
   var _a;
   const [displayMode, setDisplayMode] = useState("month");
@@ -21455,85 +21550,20 @@ const useProfitAndLoss = ({ tagFilter, reportingBasis }) => {
       })
     }));
   };
-  const setFilterTypes = (scope, types) => {
-    setFilters(__spreadProps(__spreadValues({}, filters), {
-      [scope]: __spreadProps(__spreadValues({}, filters[scope]), {
-        types
-      })
-    }));
-  };
   const { filteredDataRevenue, filteredTotalRevenue } = useMemo(() => {
-    var _a2;
     if (!data) {
       return { filteredDataRevenue: [], filteredTotalRevenue: void 0 };
     }
     const items = collectRevenueItems(data);
-    const revenueTypeFilters = (_a2 = filters["revenue"]) == null ? void 0 : _a2.types;
-    const filtered = items.map((x) => {
-      if (revenueTypeFilters && revenueTypeFilters.length > 0 && !revenueTypeFilters.includes(x.type)) {
-        return __spreadProps(__spreadValues({}, x), { isHidden: true });
-      }
-      return x;
-    });
-    const sorted = filtered.sort((a, b) => {
-      var _a3, _b, _c, _d;
-      switch ((_a3 = filters["revenue"]) == null ? void 0 : _a3.sortBy) {
-        case "category":
-          if (((_b = filters["revenue"]) == null ? void 0 : _b.sortDirection) === "asc") {
-            return a.displayName.localeCompare(b.displayName);
-          }
-          return b.displayName.localeCompare(a.displayName);
-        case "type":
-          if (((_c = filters["revenue"]) == null ? void 0 : _c.sortDirection) === "asc") {
-            return a.type.localeCompare(b.type);
-          }
-          return b.type.localeCompare(a.type);
-        default:
-          if (((_d = filters["revenue"]) == null ? void 0 : _d.sortDirection) === "asc") {
-            return a.value - b.value;
-          }
-          return b.value - a.value;
-      }
-    });
-    const total = sorted.filter((x) => !x.isHidden).reduce((x, { value }) => x + value, 0);
-    const withShare = applyShare(sorted, total);
+    const { items: withShare, total } = sortPnlLineItemsAndCalculateTotal(items, filters["revenue"]);
     return { filteredDataRevenue: withShare, filteredTotalRevenue: total };
   }, [data, filters]);
   const { filteredDataExpenses, filteredTotalExpenses } = useMemo(() => {
-    var _a2;
     if (!data) {
       return { filteredDataExpenses: [], filteredTotalExpenses: void 0 };
     }
     const items = collectExpensesItems(data);
-    const expenseTypeFilters = (_a2 = filters["expenses"]) == null ? void 0 : _a2.types;
-    const filtered = items.map((x) => {
-      if (expenseTypeFilters && expenseTypeFilters.length > 0 && !expenseTypeFilters.includes(x.type)) {
-        return __spreadProps(__spreadValues({}, x), { isHidden: true });
-      }
-      return x;
-    });
-    const sorted = filtered.sort((a, b) => {
-      var _a3, _b, _c, _d;
-      switch ((_a3 = filters["expenses"]) == null ? void 0 : _a3.sortBy) {
-        case "category":
-          if (((_b = filters["expenses"]) == null ? void 0 : _b.sortDirection) === "asc") {
-            return a.displayName.localeCompare(b.displayName);
-          }
-          return b.displayName.localeCompare(a.displayName);
-        case "type":
-          if (((_c = filters["expenses"]) == null ? void 0 : _c.sortDirection) === "asc") {
-            return a.type.localeCompare(b.type);
-          }
-          return b.type.localeCompare(a.type);
-        default:
-          if (((_d = filters["expenses"]) == null ? void 0 : _d.sortDirection) === "asc") {
-            return a.value - b.value;
-          }
-          return b.value - a.value;
-      }
-    });
-    const total = sorted.filter((x) => !x.isHidden).reduce((x, { value }) => x + value, 0);
-    const withShare = applyShare(sorted, total);
+    const { items: withShare, total } = sortPnlLineItemsAndCalculateTotal(items, filters["expenses"]);
     return { filteredDataExpenses: withShare, filteredTotalExpenses: total };
   }, [data, filters]);
   const refetch = useCallback(() => {
@@ -21553,7 +21583,6 @@ const useProfitAndLoss = ({ tagFilter, reportingBasis }) => {
     setSidebarScope,
     sortBy,
     filters,
-    setFilterTypes,
     tagFilter,
     dateRange,
     selectedLineItem,
@@ -21738,8 +21767,6 @@ const ProfitAndLossContext = createContext({
   },
   sortBy: () => {
   },
-  setFilterTypes: () => {
-  },
   filters: {
     expenses: void 0,
     revenue: void 0
@@ -21757,7 +21784,7 @@ const isNotOnlyNoneTag = (compareOptions) => {
     compareOptions == null ? void 0 : compareOptions.some((option) => option.tagFilterConfig.tagFilters !== "None")
   );
 };
-function buildKey$y({
+function buildKey$C({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -21815,7 +21842,7 @@ function useProfitAndLossComparison({
   const { data: auth } = useAuth();
   const periods = preparePeriodsBody(dateRange, comparePeriods, comparisonPeriodMode);
   const tagFilters = prepareFiltersBody(selectedCompareOptions);
-  const queryKey = buildKey$y(__spreadProps(__spreadValues({}, auth), {
+  const queryKey = buildKey$C(__spreadProps(__spreadValues({}, auth), {
     businessId,
     periods,
     tagFilters,
@@ -21975,8 +22002,8 @@ const useProfitAndLossLTM = ({ currentDate, tagFilter, reportingBasis } = {
     refetch
   };
 };
-const BarChart2 = (_yc) => {
-  var _zc = _yc, { size = 12 } = _zc, props = __objRest(_zc, ["size"]);
+const BarChart2 = (_Ac) => {
+  var _Bc = _Ac, { size = 12 } = _Bc, props = __objRest(_Bc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -22766,11 +22793,11 @@ const ProfitAndLossChart = ({
     isSyncing && !hasNonZeroData ? /* @__PURE__ */ jsx(ChartStateCard, {}) : null
   ] });
 };
-const BackButton = (_Ac) => {
-  var _Bc = _Ac, {
+const BackButton = (_Cc) => {
+  var _Dc = _Cc, {
     className,
     textOnly = false
-  } = _Bc, props = __objRest(_Bc, [
+  } = _Dc, props = __objRest(_Dc, [
     "className",
     "textOnly"
   ]);
@@ -22818,8 +22845,8 @@ const TASKS_CHARTS_COLORS = {
   done: "#3B9C63",
   pending: "#DFA000"
 };
-const SortArrows = (_Cc) => {
-  var _Dc = _Cc, { size = 13 } = _Dc, props = __objRest(_Dc, ["size"]);
+const SortArrows = (_Ec) => {
+  var _Fc = _Ec, { size = 13 } = _Fc, props = __objRest(_Fc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -22886,39 +22913,12 @@ const SortArrows = (_Cc) => {
   );
 };
 const UNCATEGORIZED_TYPES = ["UNCATEGORIZED_INFLOWS", "UNCATEGORIZED_OUTFLOWS"];
-const mapTypesToColors = (data, colorList = DEFAULT_CHART_COLOR_TYPE) => {
-  const typeToColor = {};
-  const typeToLastOpacity = {};
-  let colorIndex = 0;
-  return data.map((obj) => {
-    var _a;
-    const type = (_a = obj.name) != null ? _a : obj.type;
-    if (type === "Uncategorized") {
-      return {
-        color: "#EEEEF0",
-        opacity: 1
-      };
-    }
-    if (!typeToColor[type]) {
-      typeToColor[type] = colorList[colorIndex % colorList.length];
-      colorIndex++;
-      typeToLastOpacity[type] = 1;
-    } else {
-      typeToLastOpacity[type] -= 0.1;
-    }
-    const opacity = typeToLastOpacity[type];
-    return {
-      color: typeToColor[type],
-      opacity
-    };
-  });
-};
 const ValueIcon = ({
   item,
   typeColorMapping,
   idx
 }) => {
-  if (item.type === "Uncategorized") {
+  if (isLineItemUncategorized(item)) {
     return /* @__PURE__ */ jsxs(
       "svg",
       {
@@ -22985,7 +22985,7 @@ const DetailedTable = ({
     );
   };
   const typeColorMapping = mapTypesToColors(filteredData, chartColorsList);
-  const positiveTotal = filteredData.filter((x) => !x.isHidden && x.value > 0).reduce((sum, x) => sum + x.value, 0);
+  const positiveTotal = filteredData.filter((x) => x.value > 0).reduce((sum, x) => sum + x.value, 0);
   return /* @__PURE__ */ jsx("div", { className: "details-container", children: /* @__PURE__ */ jsx("div", { className: "table", children: /* @__PURE__ */ jsxs("table", { children: [
     /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
       /* @__PURE__ */ jsxs(
@@ -23026,16 +23026,16 @@ const DetailedTable = ({
         }
       )
     ] }) }),
-    /* @__PURE__ */ jsx("tbody", { children: filteredData.filter((x) => !x.isHidden).map((item, idx) => {
+    /* @__PURE__ */ jsx("tbody", { children: filteredData.map((item, idx) => {
       const share = item.value > 0 ? item.value / positiveTotal : 0;
       return /* @__PURE__ */ jsxs(
         "tr",
         {
           className: classNames(
             "Layer__profit-and-loss-detailed-table__row",
-            hoveredItem && hoveredItem === item.displayName ? "active" : ""
+            hoveredItem && hoveredItem.name === item.name ? "active" : ""
           ),
-          onMouseEnter: () => setHoveredItem(item.displayName),
+          onMouseEnter: () => setHoveredItem(item),
           onMouseLeave: () => setHoveredItem(void 0),
           children: [
             /* @__PURE__ */ jsx("td", { className: "category-col", children: item.displayName }),
@@ -23067,6 +23067,35 @@ const DetailedTable = ({
     }) })
   ] }) }) });
 };
+const isLineItemUncategorized = (item) => {
+  return UNCATEGORIZED_TYPES.includes(item.name);
+};
+const mapTypesToColors = (data, colorList = DEFAULT_CHART_COLOR_TYPE) => {
+  const nameToColor = {};
+  const nameToLastOpacity = {};
+  let colorIndex = 0;
+  return data.map((lineItem) => {
+    if (isLineItemUncategorized(lineItem)) {
+      return {
+        color: "#EEEEF0",
+        opacity: 1
+      };
+    }
+    const name = lineItem.name;
+    if (!nameToColor[name]) {
+      nameToColor[name] = colorList[colorIndex % colorList.length];
+      colorIndex++;
+      nameToLastOpacity[name] = 1;
+    } else {
+      nameToLastOpacity[name] -= 0.1;
+    }
+    const opacity = nameToLastOpacity[name];
+    return {
+      color: nameToColor[name],
+      opacity
+    };
+  });
+};
 const DetailedChart = ({
   filteredData,
   filteredTotal,
@@ -23077,18 +23106,9 @@ const DetailedChart = ({
   showDatePicker = true
 }) => {
   const chartData = useMemo(
-    () => filteredData.map((x) => {
-      if (x.isHidden) {
-        return __spreadProps(__spreadValues({}, x), {
-          name: x.displayName,
-          value: 0
-        });
-      }
-      return __spreadProps(__spreadValues({}, x), {
-        name: x.displayName,
-        value: x.value > 0 ? x.value : 0
-      });
-    }),
+    () => filteredData.map((x) => __spreadProps(__spreadValues({}, x), {
+      value: x.value > 0 ? x.value : 0
+    })),
     [filteredData]
   );
   const noValue = chartData.length === 0 || !chartData.find((x) => x.value !== 0);
@@ -23134,7 +23154,7 @@ const DetailedChart = ({
         {
           data: chartData,
           dataKey: "value",
-          nameKey: "name",
+          nameKey: "displayName",
           cx: "50%",
           cy: "50%",
           innerRadius: "91%",
@@ -23147,7 +23167,7 @@ const DetailedChart = ({
             chartData.map((entry, index) => {
               let fill = typeColorMapping[index].color;
               let active = true;
-              if (hoveredItem && entry.name !== hoveredItem) {
+              if (hoveredItem && entry.name !== hoveredItem.name) {
                 active = false;
                 fill = void 0;
               }
@@ -23157,13 +23177,13 @@ const DetailedChart = ({
                   className: classNames(
                     "Layer__profit-and-loss-detailed-charts__pie",
                     hoveredItem && active ? "active" : "inactive",
-                    entry.type === "Uncategorized" && "Layer__profit-and-loss-detailed-charts__pie--border"
+                    isLineItemUncategorized(entry) && "Layer__profit-and-loss-detailed-charts__pie--border"
                   ),
                   style: {
-                    fill: entry.type === "Uncategorized" && fill ? "url(#layer-pie-dots-pattern)" : fill
+                    fill: isLineItemUncategorized(entry) && fill ? "url(#layer-pie-dots-pattern)" : fill
                   },
                   opacity: typeColorMapping[index].opacity,
-                  onMouseEnter: () => setHoveredItem(entry.name),
+                  onMouseEnter: () => setHoveredItem(entry),
                   onMouseLeave: () => setHoveredItem(void 0)
                 },
                 `cell-${index}`
@@ -23189,7 +23209,7 @@ const DetailedChart = ({
                   };
                   let text = "Total";
                   if (hoveredItem) {
-                    text = hoveredItem;
+                    text = hoveredItem.displayName;
                   }
                   return /* @__PURE__ */ jsx(
                     Text$2,
@@ -23222,7 +23242,7 @@ const DetailedChart = ({
                   let value = filteredTotal;
                   if (hoveredItem) {
                     value = (_b = filteredData.find(
-                      (x) => x.displayName === hoveredItem
+                      (x) => x.name === hoveredItem.name
                     )) == null ? void 0 : _b.value;
                   }
                   return /* @__PURE__ */ jsx(
@@ -23256,7 +23276,7 @@ const DetailedChart = ({
                   };
                   if (hoveredItem) {
                     const item = filteredData.find(
-                      (x) => x.displayName === hoveredItem
+                      (x) => x.name === hoveredItem.name
                     );
                     const positiveTotal = chartData.reduce((sum, x) => sum + x.value, 0);
                     const value = (_b = item == null ? void 0 : item.value) != null ? _b : 0;
@@ -23281,7 +23301,7 @@ const DetailedChart = ({
         {
           data: [{ name: "Total", value: 1 }],
           dataKey: "value",
-          nameKey: "name",
+          nameKey: "displayName",
           cx: "50%",
           cy: "50%",
           innerRadius: "91%",
@@ -23311,7 +23331,7 @@ const DetailedChart = ({
                   };
                   let text = "Total";
                   if (hoveredItem) {
-                    text = hoveredItem;
+                    text = hoveredItem.displayName;
                   }
                   return /* @__PURE__ */ jsx(
                     Text$2,
@@ -23344,7 +23364,7 @@ const DetailedChart = ({
                   let value = filteredTotal;
                   if (hoveredItem) {
                     value = (_b = filteredData.find(
-                      (x) => x.displayName === hoveredItem
+                      (x) => x.name === hoveredItem.name
                     )) == null ? void 0 : _b.value;
                   }
                   return /* @__PURE__ */ jsx(
@@ -23365,7 +23385,7 @@ const DetailedChart = ({
         {
           data: [{ name: "loading...", value: 1 }],
           dataKey: "value",
-          nameKey: "name",
+          nameKey: "displayName",
           cx: "50%",
           cy: "50%",
           innerRadius: "91%",
@@ -23484,11 +23504,11 @@ const LedgerAccountsContext = createContext({
   fetchMore: () => {
   }
 });
-const CloseButton = (_Ec) => {
-  var _Fc = _Ec, {
+const CloseButton = (_Gc) => {
+  var _Hc = _Gc, {
     className,
     textOnly = false
-  } = _Fc, props = __objRest(_Fc, [
+  } = _Hc, props = __objRest(_Hc, [
     "className",
     "textOnly"
   ]);
@@ -24263,44 +24283,6 @@ function DetailReportModal({
     }
   );
 }
-const Filters = ({
-  filteredData,
-  sidebarScope,
-  filters,
-  setFilterTypes
-}) => {
-  var _a, _b, _c;
-  return /* @__PURE__ */ jsxs("div", { className: "filters", children: [
-    /* @__PURE__ */ jsx(Text, { size: TextSize.sm, className: "Layer__label", children: "Filters" }),
-    /* @__PURE__ */ jsx(
-      Select$1,
-      {
-        className: "Layer__select type-select",
-        classNamePrefix: "Layer__select",
-        value: sidebarScope && ((_a = filters[sidebarScope]) == null ? void 0 : _a.types) ? sidebarScope && ((_c = (_b = filters[sidebarScope]) == null ? void 0 : _b.types) == null ? void 0 : _c.map((x) => ({
-          value: x,
-          label: x
-        }))) : [],
-        isMulti: true,
-        isClearable: false,
-        options: [...new Set(filteredData == null ? void 0 : filteredData.map((x) => x.type))].map((x) => ({
-          label: x,
-          value: x
-        })),
-        onChange: (selected) => {
-          setFilterTypes(
-            sidebarScope != null ? sidebarScope : "expenses",
-            selected.map((x) => x.value)
-          );
-        },
-        components: {
-          DropdownIndicator: (props) => /* @__PURE__ */ jsx(components.DropdownIndicator, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx(ChevronDown, {}) })),
-          Placeholder: (props) => /* @__PURE__ */ jsx(components.Placeholder, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx("div", { className: "Layer__select__multi-all-placeholder-badge", children: "All" }) }))
-        }
-      }
-    )
-  ] });
-};
 const ProfitAndLossDetailedCharts = ({
   scope,
   hideClose = false,
@@ -24318,13 +24300,12 @@ const ProfitAndLossDetailedCharts = ({
     filters,
     dateRange,
     sidebarScope,
-    setSidebarScope,
-    setFilterTypes
+    setSidebarScope
   } = useContext(ProfitAndLossContext);
   const theScope = scope ? scope : sidebarScope;
   const data = theScope === "revenue" ? filteredDataRevenue : filteredDataExpenses;
   const total = theScope === "revenue" ? filteredTotalRevenue : filteredTotalExpenses;
-  const [hoveredItem, setHoveredItem] = useState();
+  const [hoveredItem, setHoveredItem] = useState(void 0);
   const [selectedItem, setSelectedItem] = useState(null);
   const [isModalOpen, setIsModalOpen] = useState(false);
   const handleValueClick = useCallback((item) => {
@@ -24373,31 +24354,20 @@ const ProfitAndLossDetailedCharts = ({
           showDatePicker
         }
       ),
-      /* @__PURE__ */ jsxs("div", { className: "Layer__profit-and-loss-detailed-charts__table-wrapper", children: [
-        /* @__PURE__ */ jsx(
-          Filters,
-          {
-            filteredData: data,
-            sidebarScope: theScope,
-            filters,
-            setFilterTypes
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          DetailedTable,
-          {
-            filteredData: data,
-            sidebarScope: theScope,
-            filters,
-            sortBy,
-            hoveredItem,
-            setHoveredItem,
-            chartColorsList,
-            stringOverrides: stringOverrides == null ? void 0 : stringOverrides.detailedTableStringOverrides,
-            onValueClick: handleValueClick
-          }
-        )
-      ] })
+      /* @__PURE__ */ jsx("div", { className: "Layer__profit-and-loss-detailed-charts__table-wrapper", children: /* @__PURE__ */ jsx(
+        DetailedTable,
+        {
+          filteredData: data,
+          sidebarScope: theScope,
+          filters,
+          sortBy,
+          hoveredItem,
+          setHoveredItem,
+          chartColorsList,
+          stringOverrides: stringOverrides == null ? void 0 : stringOverrides.detailedTableStringOverrides,
+          onValueClick: handleValueClick
+        }
+      ) })
     ] }),
     /* @__PURE__ */ jsx(
       DetailReportModal,
@@ -24660,7 +24630,7 @@ const getProfitAndLossDetailLinesExcel = (apiUrl, accessToken, params) => {
     ({ businessId: businessId2 }) => `/v1/businesses/${businessId2}/reports/profit-and-loss/lines/exports/excel?${queryParams.toString()}`
   )(apiUrl, accessToken, { params: { businessId } });
 };
-function buildKey$x({
+function buildKey$B({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -24699,7 +24669,7 @@ function useProfitAndLossDetailLinesExport({
   const { businessId } = useLayerContext();
   const { apiUrl } = useEnvironment();
   return useSWRMutation(
-    () => buildKey$x(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$B(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       businessId,
       startDate,
@@ -24919,7 +24889,7 @@ const MultiSelect = ({
   const DropdownIndicator = useCallback((props) => /* @__PURE__ */ jsx(components.DropdownIndicator, __spreadProps(__spreadValues({}, props), { children: /* @__PURE__ */ jsx(ChevronDownFill, {}) })), []);
   return /* @__PURE__ */ jsxs(DeprecatedTooltip, { disabled: !isInvalid || !errorMessage, children: [
     /* @__PURE__ */ jsx(DeprecatedTooltipTrigger, { className: "Layer__input-tooltip", children: /* @__PURE__ */ jsx(
-      Select$1,
+      ReactSelect,
       {
         inputId,
         name,
@@ -24934,7 +24904,7 @@ const MultiSelect = ({
         styles: __spreadValues({
           menuPortal: (base) => __spreadProps(__spreadValues({}, base), { zIndex: 9999 })
         }, styles),
-        components: { DropdownIndicator },
+        components: { DropdownIndicator, MenuPortal: SelectMenuPortal },
         isLoading,
         isDisabled: disabled,
         isMulti: true
@@ -25735,7 +25705,13 @@ function ProfitAndLossSummariesMiniChart({
   chartColorsList,
   variants: variants2
 }) {
-  const typeColorMapping = mapTypesToColors(data, chartColorsList);
+  const chartData = useMemo(
+    () => data.map((x) => __spreadProps(__spreadValues({}, x), {
+      value: x.value > 0 ? x.value : 0
+    })),
+    [data]
+  );
+  const typeColorMapping = mapTypesToColors(chartData, chartColorsList);
   let chartDimension = 52;
   let innerRadius = 10;
   let outerRadius = 16;
@@ -25754,9 +25730,9 @@ function ProfitAndLossSummariesMiniChart({
   return /* @__PURE__ */ jsx(PieChart, { width: chartDimension, height: chartDimension, children: /* @__PURE__ */ jsx(
     Pie,
     {
-      data,
+      data: chartData,
       dataKey: "value",
-      nameKey: "name",
+      nameKey: "displayName",
       cx: "50%",
       cy: "50%",
       innerRadius,
@@ -25767,7 +25743,7 @@ function ProfitAndLossSummariesMiniChart({
       height: 36,
       animationDuration: 250,
       animationEasing: "ease-in-out",
-      children: data.map((entry, index) => {
+      children: chartData.map((entry, index) => {
         const colorConfig = typeColorMapping[index];
         return /* @__PURE__ */ jsx(
           Cell$2,
@@ -25804,7 +25780,7 @@ function ProfitAndLossSummariesSummary({
   const showPercentChange = percentChange !== void 0 && percentChange !== null && comparisonMonth;
   const isGoodChange = showPercentChange && (isExpense ? percentChange < 0 : percentChange >= 0);
   const arrow = showPercentChange && percentChange >= 0 ? "↑" : "↓";
-  return /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", children: [
+  return /* @__PURE__ */ jsxs(HStack, { gap: "xs", align: "center", overflow: "hidden", children: [
     Chart && /* @__PURE__ */ jsx(
       HStack,
       {
@@ -26056,10 +26032,10 @@ function Internal_ProfitAndLossSummaries({
     unstable_AdditionalListItems.map((item, index) => /* @__PURE__ */ jsx(ProfitAndLossSummariesListItem, { children: item }, index))
   ] }) });
 }
-function ProfitAndLossSummaries(_Gc) {
-  var _Hc = _Gc, {
+function ProfitAndLossSummaries(_Ic) {
+  var _Jc = _Ic, {
     onTransactionsToReviewClick
-  } = _Hc, restProps = __objRest(_Hc, [
+  } = _Jc, restProps = __objRest(_Jc, [
     "onTransactionsToReviewClick"
   ]);
   return /* @__PURE__ */ jsx(
@@ -26097,7 +26073,7 @@ ProfitAndLoss.Summaries = ProfitAndLossSummaries;
 ProfitAndLoss.DetailedCharts = ProfitAndLossDetailedCharts;
 ProfitAndLoss.Header = ProfitAndLossHeader;
 ProfitAndLoss.Report = ProfitAndLossReport;
-function buildKey$w({
+function buildKey$A({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -26120,7 +26096,7 @@ function useBalanceSheet({
   const { apiUrl } = useEnvironment();
   const { businessId } = useLayerContext();
   return useSWR(
-    () => buildKey$w(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$A(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       businessId,
       effectiveDate
@@ -26186,7 +26162,7 @@ const BALANCE_SHEET_ROWS = [
   }
 ];
 const DOWNLOAD_BALANCE_SHEET_TAG_KEY = "#download-balance-sheet";
-function buildKey$v({
+function buildKey$z({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -26209,7 +26185,7 @@ function useBalanceSheetDownload({
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   return useSWRMutation(
-    () => buildKey$v(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$z(__spreadProps(__spreadValues({}, auth), {
       businessId,
       effectiveDate
     })),
@@ -26259,8 +26235,8 @@ function BalanceSheetDownloadButton({
     /* @__PURE__ */ jsx(InvisibleDownload, { ref: invisibleDownloadRef })
   ] });
 }
-const Collapse = (_Ic) => {
-  var props = __objRest(_Ic, []);
+const Collapse = (_Kc) => {
+  var props = __objRest(_Kc, []);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -26293,8 +26269,8 @@ const Collapse = (_Ic) => {
     })
   );
 };
-const Expand = (_Jc) => {
-  var props = __objRest(_Jc, []);
+const Expand = (_Lc) => {
+  var props = __objRest(_Lc, []);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -26564,7 +26540,7 @@ const BalanceSheetView = ({
     }
   ) });
 };
-function buildKey$u({
+function buildKey$y({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -26590,7 +26566,7 @@ function useStatementOfCashFlow({
   const { apiUrl } = useEnvironment();
   const { businessId } = useLayerContext();
   return useSWR(
-    buildKey$u(__spreadProps(__spreadValues({}, auth), {
+    buildKey$y(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       businessId,
       startDate,
@@ -26654,7 +26630,7 @@ const STATEMENT_OF_CASH_FLOW_ROWS = [
   }
 ];
 const DOWNLOAD_CASHFLOW_STATEMENT_TAG_KEY = "#download-cashflow-statement";
-function buildKey$t({
+function buildKey$x({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -26680,7 +26656,7 @@ function useCashflowStatementDownload({
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   return useSWRMutation(
-    () => buildKey$t(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$x(__spreadProps(__spreadValues({}, auth), {
       businessId,
       startDate,
       endDate
@@ -26884,7 +26860,7 @@ const getLedgerAccountBalances = get(
     return `/v1/businesses/${businessId}/ledger/balances?${parameters}`;
   }
 );
-function buildKey$s({
+function buildKey$w({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -26906,7 +26882,7 @@ function useLedgerBalances(withDates, startDate, endDate) {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const response = useSWR(
-    () => buildKey$s(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$w(__spreadProps(__spreadValues({}, data), {
       businessId,
       startDate: withDates ? startDate : void 0,
       endDate: withDates ? endDate : void 0
@@ -27248,7 +27224,7 @@ const LEDGER_ACCOUNT_SUBTYPES_FOR_TYPE = {
   EXPENSE: EXPENSE_LEDGER_ACCOUNT_SUBTYPES
 };
 const deleteAccountFromLedger = del(({ businessId, accountId }) => `/v1/businesses/${businessId}/ledger/accounts/${accountId}`);
-function buildKey$r({
+function buildKey$v({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -27266,7 +27242,7 @@ function useDeleteAccountFromLedger() {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const mutationResponse = useSWRMutation(
-    () => buildKey$r(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$v(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: { accountId } }) => deleteAccountFromLedger(
@@ -27942,8 +27918,8 @@ const ChartOfAccountsContext = createContext(
     }
   }
 );
-const Plus = (_Kc) => {
-  var _Lc = _Kc, { size = 14 } = _Lc, props = __objRest(_Lc, ["size"]);
+const Plus = (_Mc) => {
+  var _Nc = _Mc, { size = 14 } = _Nc, props = __objRest(_Nc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -27976,7 +27952,7 @@ const Plus = (_Kc) => {
     })
   );
 };
-function buildKey$q({
+function buildKey$u({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -28002,7 +27978,7 @@ function useAccountBalancesDownload({
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   return useSWRMutation(
-    () => buildKey$q(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$u(__spreadProps(__spreadValues({}, auth), {
       businessId,
       startCutoff,
       endCutoff
@@ -28310,8 +28286,8 @@ var LedgerAccountNodeType = /* @__PURE__ */ ((LedgerAccountNodeType2) => {
   LedgerAccountNodeType2["Parent"] = "Parent";
   return LedgerAccountNodeType2;
 })(LedgerAccountNodeType || {});
-const Edit2 = (_Mc) => {
-  var _Nc = _Mc, { size = 18 } = _Nc, props = __objRest(_Nc, ["size"]);
+const Edit2 = (_Oc) => {
+  var _Pc = _Oc, { size = 18 } = _Pc, props = __objRest(_Pc, ["size"]);
   return /* @__PURE__ */ jsx(
     "svg",
     __spreadProps(__spreadValues({
@@ -30034,7 +30010,7 @@ var UpsertJournalEntryMode = /* @__PURE__ */ ((UpsertJournalEntryMode2) => {
   return UpsertJournalEntryMode2;
 })(UpsertJournalEntryMode || {});
 const createJournalEntry = post(({ businessId }) => `/v1/businesses/${businessId}/ledger/journal-entries`);
-function buildKey$p({
+function buildKey$t({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -30061,7 +30037,7 @@ const useUpsertJournalEntry = (props) => {
   const { debouncedInvalidateProfitAndLossSummaries } = useProfitAndLossSummariesCacheActions();
   const { invalidate } = useGlobalCacheActions();
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$p(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$t(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: body }) => {
@@ -30375,7 +30351,7 @@ const JournalEntryDrawerHeader = ({ onSubmit, formState }) => {
     ] })
   ] });
 };
-function buildKey$o({
+function buildKey$s({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -30401,7 +30377,7 @@ function useJournalEntriesDownload({
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
   return useSWRMutation(
-    () => buildKey$o(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$s(__spreadProps(__spreadValues({}, auth), {
       businessId,
       startCutoff,
       endCutoff
@@ -30992,8 +30968,8 @@ function usePaginatedList(list, pageSize) {
     reset
   };
 }
-const SmileIcon = (_Oc) => {
-  var _Pc = _Oc, { size = 12 } = _Pc, props = __objRest(_Pc, ["size"]);
+const SmileIcon = (_Qc) => {
+  var _Rc = _Qc, { size = 12 } = _Rc, props = __objRest(_Rc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -31089,7 +31065,7 @@ function completeTaskWithUpload(baseUrl, accessToken, {
     accessToken
   );
 }
-function buildKey$n({
+function buildKey$r({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -31108,7 +31084,7 @@ function useDeleteUploadsOnTask() {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const mutationResponse = useSWRMutation(
-    () => buildKey$n(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$r(__spreadProps(__spreadValues({}, auth), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: { taskId } }) => deleteUploadsOnTask(
@@ -31147,7 +31123,7 @@ function useDeleteUploadsOnTask() {
     }
   });
 }
-function buildKey$m({
+function buildKey$q({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -31166,7 +31142,7 @@ function useSubmitUserResponseForTask() {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const mutationResponse = useSWRMutation(
-    () => buildKey$m(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$q(__spreadProps(__spreadValues({}, auth), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: { taskId, userResponse } }) => submitUserResponseForTask(
@@ -31212,7 +31188,7 @@ function useSubmitUserResponseForTask() {
     }
   });
 }
-function buildKey$l({
+function buildKey$p({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -31231,7 +31207,7 @@ function useUpdateTaskUploadDescription() {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const mutationResponse = useSWRMutation(
-    () => buildKey$l(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$p(__spreadProps(__spreadValues({}, auth), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: { taskId, description } }) => updateTaskUploadsDescription(
@@ -31274,7 +31250,7 @@ function useUpdateTaskUploadDescription() {
     }
   });
 }
-function buildKey$k({
+function buildKey$o({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -31293,7 +31269,7 @@ function useUploadDocumentsForTask() {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const mutationResponse = useSWRMutation(
-    () => buildKey$k(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$o(__spreadProps(__spreadValues({}, auth), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: { taskId, files, description } }) => completeTaskWithUpload(
@@ -31838,8 +31814,8 @@ const useBookkeepingYearsStatus = () => {
     isLoading
   };
 };
-const ArrowRightCircle = (_Qc) => {
-  var _Rc = _Qc, { size = 18 } = _Rc, props = __objRest(_Rc, ["size"]);
+const ArrowRightCircle = (_Sc) => {
+  var _Tc = _Sc, { size = 18 } = _Tc, props = __objRest(_Tc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -33321,7 +33297,7 @@ class BookkeepingConfigurationSWRResponse {
     return this.swrResponse.mutate;
   }
 }
-function buildKey$j({
+function buildKey$n({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -33342,7 +33318,7 @@ function useBookkeepingConfiguration() {
   const { apiUrl } = useEnvironment();
   const { data: auth } = useAuth();
   const { businessId } = useLayerContext();
-  const queryKey = buildKey$j(__spreadProps(__spreadValues({}, auth), {
+  const queryKey = buildKey$n(__spreadProps(__spreadValues({}, auth), {
     apiUrl,
     businessId
   }));
@@ -33529,7 +33505,7 @@ const BookOnboardingCallStep = ({ title = defaultTitle$3, description = defaultD
   ] });
 };
 const BUSINESS_TAG_KEY = "business";
-function buildKey$i({
+function buildKey$m({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -33548,7 +33524,7 @@ function useUpdateBusiness() {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const mutationResponse = useSWRMutation(
-    () => buildKey$i(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$m(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: body }) => updateBusiness(
@@ -33599,7 +33575,7 @@ function isPersonnelRole(role) {
   return PERSONNEL_ROLES.includes(role);
 }
 const BUSINESS_PERSONNEL_TAG_KEY = "#business-personnel";
-function buildKey$h({
+function buildKey$l({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -33618,7 +33594,7 @@ function useBusinessPersonnel() {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   return useSWR(
-    () => buildKey$h(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$l(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }) => getBusinessPersonnel(
@@ -33656,7 +33632,7 @@ function useBusinessPersonnel() {
   );
 }
 const createBusinessPersonnel = post(({ businessId }) => `/v1/businesses/${businessId}/personnel`);
-function buildKey$g({
+function buildKey$k({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -33675,7 +33651,7 @@ function useCreateBusinessPersonnel() {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const mutationResponse = useSWRMutation(
-    () => buildKey$g(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$k(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }, { arg: body }) => createBusinessPersonnel(
@@ -33718,7 +33694,7 @@ function useCreateBusinessPersonnel() {
 const updateBusinessPersonnel = post(({ businessId, businessPersonnelId }) => {
   return `/v1/businesses/${businessId}/personnel/${businessPersonnelId}/update`;
 });
-function buildKey$f({
+function buildKey$j({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -33739,7 +33715,7 @@ function useUpdateBusinessPersonnel({ businessPersonnelId }) {
   const { businessId } = useLayerContext();
   const { mutate } = useSWRConfig();
   const mutationResponse = useSWRMutation(
-    () => buildKey$f(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$j(__spreadProps(__spreadValues({}, data), {
       businessId,
       businessPersonnelId
     })),
@@ -33887,12 +33863,12 @@ const FormSection = ({ children, title }) => {
     children
   ] });
 };
-const PhoneInput = (_Sc) => {
-  var _Tc = _Sc, {
+const PhoneInput = (_Uc) => {
+  var _Vc = _Uc, {
     value,
     onChange,
     placeholder = "Phone number"
-  } = _Tc, props = __objRest(_Tc, [
+  } = _Vc, props = __objRest(_Vc, [
     "value",
     "onChange",
     "placeholder"
@@ -34184,8 +34160,8 @@ const SummaryStep = ({ onNext, title = defaultTitle$1, description = defaultDesc
     /* @__PURE__ */ jsx(Button$1, { onClick: onNext, children: nextBtnText })
   ] });
 };
-const Document = (_Uc) => {
-  var _Vc = _Uc, { size = 20 } = _Vc, props = __objRest(_Vc, ["size"]);
+const Document = (_Wc) => {
+  var _Xc = _Wc, { size = 20 } = _Xc, props = __objRest(_Xc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -34290,8 +34266,8 @@ const Document = (_Uc) => {
     })
   );
 };
-const TrendingUp = (_Wc) => {
-  var _Xc = _Wc, { size = 20 } = _Xc, props = __objRest(_Xc, ["size"]);
+const TrendingUp = (_Yc) => {
+  var _Zc = _Yc, { size = 20 } = _Zc, props = __objRest(_Zc, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -34548,8 +34524,8 @@ const PlatformOnboarding = ({ onComplete }) => {
     /* @__PURE__ */ jsx("div", { className: "Layer__platform-onboarding-layout__footer", children: renderStepFooter() })
   ] }) });
 };
-const CoffeeIcon = (_Yc) => {
-  var _Zc = _Yc, { size = 11 } = _Zc, props = __objRest(_Zc, ["size"]);
+const CoffeeIcon = (__c) => {
+  var _$c = __c, { size = 11 } = _$c, props = __objRest(_$c, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -34620,8 +34596,8 @@ const CoffeeIcon = (_Yc) => {
     })
   );
 };
-const Link$1 = (__c) => {
-  var _$c = __c, {
+const Link$1 = (_ad) => {
+  var _bd = _ad, {
     className,
     children,
     variant = ButtonVariant.primary,
@@ -34631,7 +34607,7 @@ const Link$1 = (__c) => {
     iconAsPrimary = false,
     justify = "center",
     fullWidth
-  } = _$c, props = __objRest(_$c, [
+  } = _bd, props = __objRest(_bd, [
     "className",
     "children",
     "variant",
@@ -34723,8 +34699,8 @@ const BookkeepingUpsellBar = ({
     onClick ? /* @__PURE__ */ jsx(Button$1, { variant: ButtonVariant.secondary, onClick, children: "Schedule a demo" }) : href ? /* @__PURE__ */ jsx(Link$1, { href, target: "_blank", variant: ButtonVariant.secondary, children: "Schedule a demo" }) : null
   ] });
 };
-const ChevronRightFill = (_ad) => {
-  var _bd = _ad, { size = 18 } = _bd, props = __objRest(_bd, ["size"]);
+const ChevronRightFill = (_cd) => {
+  var _dd = _cd, { size = 18 } = _dd, props = __objRest(_dd, ["size"]);
   return /* @__PURE__ */ jsxs(
     "svg",
     __spreadProps(__spreadValues({
@@ -34751,7 +34727,7 @@ const ChevronRightFill = (_ad) => {
 };
 const DataTableHeader = ({ name, count, slotProps = {}, slots = {} }) => {
   const { showCount, totalCount } = count != null ? count : {};
-  const { Filters: Filters2, HeaderActions, HeaderFilters } = slots;
+  const { Filters, HeaderActions, HeaderFilters } = slots;
   return /* @__PURE__ */ jsxs(VStack, { children: [
     /* @__PURE__ */ jsxs(HStack, { justify: "space-between", align: "center", gap: "xs", className: "Layer__DataTableHeader__Header", children: [
       /* @__PURE__ */ jsxs(HStack, { pis: "md", align: "center", gap: "xl", children: [
@@ -34766,8 +34742,8 @@ const DataTableHeader = ({ name, count, slotProps = {}, slots = {} }) => {
         HeaderActions && /* @__PURE__ */ jsx(HeaderActions, {})
       ] })
     ] }),
-    Filters2 && /* @__PURE__ */ jsxs(HStack, { pis: "md", pie: "md", justify: "space-between", align: "center", className: "Layer__DataTableHeader__Filters", children: [
-      /* @__PURE__ */ jsx(Filters2, {}),
+    Filters && /* @__PURE__ */ jsxs(HStack, { pis: "md", pie: "md", justify: "space-between", align: "center", className: "Layer__DataTableHeader__Filters", children: [
+      /* @__PURE__ */ jsx(Filters, {}),
       slotProps.ClearFiltersButton && /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({ variant: "outlined" }, slotProps.ClearFiltersButton), { children: "Clear All Filters" }))
     ] })
   ] });
@@ -35692,7 +35668,7 @@ class InvoiceSummaryStatsSWRResponse {
     return this.swrResponse.error !== void 0;
   }
 }
-function buildKey$e({
+function buildKey$i({
   access_token: accessToken,
   apiUrl,
   businessId
@@ -35711,7 +35687,7 @@ function useInvoiceSummaryStats() {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const response = useSWR(
-    () => buildKey$e(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$i(__spreadProps(__spreadValues({}, data), {
       businessId
     })),
     ({ accessToken, apiUrl, businessId: businessId2 }) => getInvoiceSummaryStats(
@@ -35742,7 +35718,7 @@ var UpsertInvoiceMode = /* @__PURE__ */ ((UpsertInvoiceMode2) => {
 })(UpsertInvoiceMode || {});
 const createInvoice = post(({ businessId }) => `/v1/businesses/${businessId}/invoices`);
 const updateInvoice = put(({ businessId, invoiceId }) => `/v1/businesses/${businessId}/invoices/${invoiceId}`);
-function buildKey$d({
+function buildKey$h({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -35814,7 +35790,7 @@ const useUpsertInvoice = (props) => {
   const { mode } = props;
   const invoiceId = mode === "Update" ? props.invoiceId : void 0;
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$d(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$h(__spreadProps(__spreadValues({}, data), {
       businessId,
       invoiceId
     })),
@@ -36083,7 +36059,7 @@ const RefundInvoiceReturnSchema = Schema.Struct({
   data: CustomerRefundSchema
 });
 const refundInvoice = post(({ businessId, invoiceId }) => `/v1/businesses/${businessId}/invoices/${invoiceId}/refund`);
-function buildKey$c({
+function buildKey$g({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -36128,7 +36104,7 @@ const useRefundInvoice = ({ invoiceId }) => {
     return updateInvoiceWithRefund(invoice);
   }, [invoiceId]);
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$c(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$g(__spreadProps(__spreadValues({}, data), {
       businessId,
       invoiceId
     })),
@@ -36316,7 +36292,7 @@ const ResetInvoiceReturnSchema = Schema.Struct({
   data: InvoiceSchema
 });
 const resetInvoice = post(({ businessId, invoiceId }) => `/v1/businesses/${businessId}/invoices/${invoiceId}/reset`);
-function buildKey$b({
+function buildKey$f({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -36354,7 +36330,7 @@ const useResetInvoice = ({ invoiceId }) => {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$b(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$f(__spreadProps(__spreadValues({}, data), {
       businessId,
       invoiceId
     })),
@@ -36417,7 +36393,7 @@ const VoidInvoiceReturnSchema = Schema.Struct({
   data: InvoiceSchema
 });
 const voidInvoice = post(({ businessId, invoiceId }) => `/v1/businesses/${businessId}/invoices/${invoiceId}/void`);
-function buildKey$a({
+function buildKey$e({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -36455,7 +36431,7 @@ const useVoidInvoice = ({ invoiceId }) => {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$a(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$e(__spreadProps(__spreadValues({}, data), {
       businessId,
       invoiceId
     })),
@@ -36574,7 +36550,7 @@ const InvoiceWriteoffSchema = Schema.Struct({
 });
 const CREATE_INVOICE_WRITEOFF_TAG_KEY = "#writeoff-invoice";
 const writeoffInvoice = post(({ businessId, invoiceId }) => `/v1/businesses/${businessId}/invoices/${invoiceId}/write-off`);
-function buildKey$9({
+function buildKey$d({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -36625,7 +36601,7 @@ const useWriteoffInvoice = ({ invoiceId }) => {
     return updateInvoiceWithWriteoff(invoice);
   }, [invoiceId]);
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$9(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$d(__spreadProps(__spreadValues({}, data), {
       businessId,
       invoiceId
     })),
@@ -37621,7 +37597,7 @@ var UpsertDedicatedInvoicePaymentMode = /* @__PURE__ */ ((UpsertDedicatedInvoice
 })(UpsertDedicatedInvoicePaymentMode || {});
 const createDedicatedInvoicePayment = post(({ businessId, invoiceId }) => `/v1/businesses/${businessId}/invoices/${invoiceId}/payment/`);
 const updateDedicatedInvoicePayment = put(({ businessId, invoiceId, invoicePaymentId }) => `/v1/businesses/${businessId}/invoices/${invoiceId}/payment/${invoicePaymentId}`);
-function buildKey$8({
+function buildKey$c({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -37706,7 +37682,7 @@ const useUpsertDedicatedInvoicePayment = (props) => {
     return updateInvoiceWithPayment(invoice, invoicePayment);
   }, [invoiceId]);
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$8(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$c(__spreadProps(__spreadValues({}, data), {
       businessId,
       invoiceId,
       invoicePaymentId
@@ -38006,8 +37982,8 @@ const getClassnameForSubComponent = (className, suffix) => {
 };
 const METER_CLASS_NAME = "Layer__Meter";
 const Meter = forwardRef(
-  function Meter2(_cd, ref) {
-    var _dd = _cd, { className, label, meterOnly } = _dd, restProps = __objRest(_dd, ["className", "label", "meterOnly"]);
+  function Meter2(_ed, ref) {
+    var _fd = _ed, { className, label, meterOnly } = _fd, restProps = __objRest(_fd, ["className", "label", "meterOnly"]);
     return /* @__PURE__ */ jsx(Meter$1, __spreadProps(__spreadValues(__spreadProps(__spreadValues({}, restProps), { className: classNames(METER_CLASS_NAME, className), ref }), meterOnly && { "aria-label": label }), { children: ({ percentage, valueText }) => /* @__PURE__ */ jsxs(VStack, { gap: "3xs", fluid: true, children: [
       !meterOnly && /* @__PURE__ */ jsxs(HStack, { justify: "space-between", children: [
         /* @__PURE__ */ jsx(Label, { slot: "label", children: label }),
@@ -38122,11 +38098,11 @@ const ProfitAndLossView = (props) => {
   const containerRef = useRef(null);
   return /* @__PURE__ */ jsx(Container, { name: COMPONENT_NAME$3, ref: containerRef, children: /* @__PURE__ */ jsx(ProfitAndLoss, { children: /* @__PURE__ */ jsx(ProfitAndLossPanel, __spreadValues({ containerRef }, props)) }) });
 };
-const ProfitAndLossPanel = (_ed) => {
-  var _fd = _ed, {
+const ProfitAndLossPanel = (_gd) => {
+  var _hd = _gd, {
     containerRef,
     stringOverrides
-  } = _fd, props = __objRest(_fd, [
+  } = _hd, props = __objRest(_hd, [
     "containerRef",
     "stringOverrides"
   ]);
@@ -38389,13 +38365,13 @@ function ExpandableDataTable({
   );
 }
 const UNIFIED_REPORT_TAG_KEY = "#unified-report";
-function buildKey$7(_gd) {
-  var _hd = _gd, {
+function buildKey$b(_id) {
+  var _jd = _id, {
     access_token: accessToken,
     apiUrl,
     businessId,
     report
-  } = _hd, dateParams = __objRest(_hd, [
+  } = _jd, dateParams = __objRest(_jd, [
     "access_token",
     "apiUrl",
     "businessId",
@@ -38411,8 +38387,8 @@ function buildKey$7(_gd) {
     }, dateParams);
   }
 }
-const getUnifiedReport = get((_id) => {
-  var _jd = _id, { businessId, report } = _jd, dateParams = __objRest(_jd, ["businessId", "report"]);
+const getUnifiedReport = get((_kd) => {
+  var _ld = _kd, { businessId, report } = _ld, dateParams = __objRest(_ld, ["businessId", "report"]);
   const parameters = toDefinedSearchParameters(__spreadValues({}, dateParams));
   return `/v1/businesses/${businessId}/reports/unified/${report}?${parameters}`;
 });
@@ -38441,13 +38417,13 @@ class UnifiedReportSWRResponse {
     return this.swrResponse.mutate;
   }
 }
-function useUnifiedReport(_kd) {
-  var _ld = _kd, { report } = _ld, dateParams = __objRest(_ld, ["report"]);
+function useUnifiedReport(_md) {
+  var _nd = _md, { report } = _nd, dateParams = __objRest(_nd, ["report"]);
   const { data: auth } = useAuth();
   const { apiUrl } = useEnvironment();
   const { businessId } = useLayerContext();
   const swrResponse = useSWR(
-    () => buildKey$7(__spreadValues(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$b(__spreadValues(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       businessId,
       report
@@ -38563,7 +38539,7 @@ class DownloadUnifiedReportSWRResponse {
     return this.swrResponse.error !== void 0;
   }
 }
-function buildKey$6({
+function buildKey$a({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -38614,7 +38590,7 @@ function useUnifiedReportDownload({ onSuccess } = {}) {
   const { businessId } = useLayerContext();
   const reportWithDateParams = useUnifiedReportWithDateParams();
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$6(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$a(__spreadProps(__spreadValues({}, auth), {
       businessId,
       reportWithDateParams
     })),
@@ -38990,7 +38966,7 @@ const useBills = () => {
     refetch
   };
 };
-function buildKey$5({
+function buildKey$9({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -39124,7 +39100,7 @@ const useBillsRecordPayment = ({ refetchAllBills }) => {
     };
   }, [billsToPay, paymentDate, paymentMethod]);
   const createPaymentMutation = useSWRMutation(
-    () => buildKey$5({
+    () => buildKey$9({
       access_token: auth == null ? void 0 : auth.access_token,
       apiUrl: auth == null ? void 0 : auth.apiUrl,
       businessId,
@@ -39453,7 +39429,7 @@ const BillsPaymentRecorded = ({
     ] })
   ] });
 };
-function buildKey$4({
+function buildKey$8({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -39474,7 +39450,7 @@ const useUnpaidBillsByVendor = ({ vendorId }) => {
   const { data: auth } = useAuth();
   const { apiUrl } = useEnvironment();
   return useSWR(
-    () => buildKey$4(__spreadProps(__spreadValues({}, auth), {
+    () => buildKey$8(__spreadProps(__spreadValues({}, auth), {
       apiUrl,
       businessId,
       vendorId
@@ -39972,19 +39948,19 @@ const VendorsProvider = ({ children }) => {
   const vendors = useVendors();
   return /* @__PURE__ */ jsx(VendorsContext.Provider, { value: vendors, children });
 };
-const SelectVendor = (_md) => {
-  var _nd = _md, { withContext = true } = _nd, props = __objRest(_nd, ["withContext"]);
+const SelectVendor = (_od) => {
+  var _pd = _od, { withContext = true } = _pd, props = __objRest(_pd, ["withContext"]);
   if (withContext) {
     return /* @__PURE__ */ jsx(VendorsProvider, { children: /* @__PURE__ */ jsx(SelectVendorContent, __spreadValues({}, props)) });
   }
   return /* @__PURE__ */ jsx(SelectVendorContent, __spreadValues({}, props));
 };
-const SelectVendorContent = (_od) => {
-  var _pd = _od, {
+const SelectVendorContent = (_qd) => {
+  var _rd = _qd, {
     value,
     onChange,
     placeholder = "Select vendor"
-  } = _pd, props = __objRest(_pd, [
+  } = _rd, props = __objRest(_rd, [
     "value",
     "onChange",
     "placeholder"
@@ -40751,8 +40727,8 @@ const BillsTableWithPanel = ({
     }
   );
 };
-const Bills = (_qd) => {
-  var _rd = _qd, { context = true } = _rd, props = __objRest(_rd, ["context"]);
+const Bills = (_sd) => {
+  var _td = _sd, { context = true } = _td, props = __objRest(_td, ["context"]);
   if (context) {
     return /* @__PURE__ */ jsx(BillsProvider, { children: /* @__PURE__ */ jsx(BillsContent, __spreadValues({}, props)) });
   }
@@ -40810,8 +40786,8 @@ const getTimezoneDisplay = (date) => {
 };
 const LINK_CLASS_NAME = "Layer__UI__Link";
 const Link = forwardRef(
-  function Link2(_sd, ref) {
-    var _td = _sd, {
+  function Link2(_ud, ref) {
+    var _vd = _ud, {
       children,
       size = "md",
       ellipsis,
@@ -40820,7 +40796,7 @@ const Link = forwardRef(
       href,
       target,
       rel
-    } = _td, restProps = __objRest(_td, [
+    } = _vd, restProps = __objRest(_vd, [
       "children",
       "size",
       "ellipsis",
@@ -41345,6 +41321,18 @@ const VehicleSchema = Schema.Struct({
   deletedAt: pipe(
     Schema.propertySignature(Schema.NullishOr(Schema.Date)),
     Schema.fromKey("deleted_at")
+  ),
+  archivedAt: pipe(
+    Schema.propertySignature(Schema.NullishOr(Schema.Date)),
+    Schema.fromKey("archived_at")
+  ),
+  isPrimary: pipe(
+    Schema.propertySignature(Schema.Boolean),
+    Schema.fromKey("is_primary")
+  ),
+  isEligibleForDeletion: pipe(
+    Schema.propertySignature(Schema.Boolean),
+    Schema.fromKey("is_eligible_for_deletion")
   )
 });
 Schema.Struct({
@@ -41352,7 +41340,8 @@ Schema.Struct({
   year: Schema.Number,
   licensePlate: Schema.String,
   vin: Schema.String,
-  description: Schema.String
+  description: Schema.String,
+  isPrimary: Schema.Boolean
 });
 const UpsertVehicleSchema = Schema.Struct({
   makeAndModel: pipe(
@@ -41365,7 +41354,11 @@ const UpsertVehicleSchema = Schema.Struct({
     Schema.fromKey("license_plate")
   ),
   vin: Schema.NullishOr(Schema.String),
-  description: Schema.NullishOr(Schema.String)
+  description: Schema.NullishOr(Schema.String),
+  isPrimary: pipe(
+    Schema.propertySignature(Schema.Boolean),
+    Schema.fromKey("is_primary")
+  )
 });
 const CalendarDateFromSelf = Schema.declare(
   (input) => input instanceof CalendarDate
@@ -41512,6 +41505,7 @@ const TripsRouteStoreContext = createContext(
       selectedVehicle: null,
       purposeFilter: TripPurposeFilterValue.All
     },
+    currentTripsPage: 0,
     setTableFilters: () => {
     },
     navigate: {
@@ -41519,6 +41513,10 @@ const TripsRouteStoreContext = createContext(
       },
       toVehicleManagement: () => {
       }
+    },
+    actions: {
+      setCurrentTripsPage: () => {
+      }
     }
   }))
 );
@@ -41536,6 +41534,15 @@ function useTripsNavigation() {
   const store = useContext(TripsRouteStoreContext);
   return useStore(store, (state) => state.navigate);
 }
+function useCurrentTripsPage() {
+  const store = useContext(TripsRouteStoreContext);
+  const currentTripsPage = useStore(store, (state) => state.currentTripsPage);
+  const setCurrentTripsPage = useStore(store, (state) => state.actions.setCurrentTripsPage);
+  return useMemo(
+    () => ({ currentTripsPage, setCurrentTripsPage }),
+    [currentTripsPage, setCurrentTripsPage]
+  );
+}
 function TripsRouteStoreProvider(props) {
   const [store] = useState(
     () => createStore((set2) => ({
@@ -41548,6 +41555,7 @@ function TripsRouteStoreProvider(props) {
         selectedVehicle: null,
         purposeFilter: TripPurposeFilterValue.All
       },
+      currentTripsPage: 0,
       setTableFilters: (patchFilters) => {
         set2((state) => ({
           tableFilters: __spreadValues(__spreadValues({}, state.tableFilters), patchFilters)
@@ -41570,65 +41578,28 @@ function TripsRouteStoreProvider(props) {
             }
           }));
         }
+      },
+      actions: {
+        setCurrentTripsPage: (page) => {
+          set2({ currentTripsPage: page });
+        }
       }
     }))
   );
   return /* @__PURE__ */ jsx(TripsRouteStoreContext.Provider, { value: store, children: props.children });
 }
-const getTripFormDefaultValues = (trip) => {
-  if (trip) {
-    return {
-      vehicle: trip.vehicle,
-      tripDate: trip.tripDate,
-      distance: trip.distance,
-      purpose: trip.purpose,
-      startAddress: trip.startAddress || "",
-      endAddress: trip.endAddress || "",
-      description: trip.description || ""
-    };
-  }
-  return {
-    vehicle: null,
-    tripDate: today(getLocalTimeZone()),
-    distance: BIG_DECIMAL_ZERO,
-    purpose: TripPurpose.Business,
-    startAddress: "",
-    endAddress: "",
-    description: ""
-  };
-};
-const validateTripForm = ({ trip }) => {
-  const { vehicle, tripDate, distance, purpose } = trip;
-  const errors = [];
-  if (tripDate === null) {
-    errors.push({ tripDate: "Trip date is a required field." });
-  }
-  if (tripDate && tripDate.compare(today(getLocalTimeZone())) > 0) {
-    errors.push({ tripDate: "Trip date cannot be in the future." });
-  }
-  if (!BigDecimal.isPositive(distance)) {
-    errors.push({ distance: "Distance must be greater than zero." });
-  }
-  if (!purpose) {
-    errors.push({ purpose: "Purpose is a required field." });
-  }
-  if (vehicle === null) {
-    errors.push({ vehicle: "Vehicle is a required field." });
+function useAutoResetPageIndex(filters, data) {
+  const autoResetPageIndexRef = useRef(false);
+  const prevFiltersRef = useRef(filters);
+  if (prevFiltersRef.current !== filters) {
+    autoResetPageIndexRef.current = true;
+    prevFiltersRef.current = filters;
   }
-  return errors.length > 0 ? errors : null;
-};
-const convertTripFormToUpsertTrip = (form) => {
-  var _a;
-  return {
-    vehicleId: (_a = form.vehicle) == null ? void 0 : _a.id,
-    tripDate: form.tripDate,
-    distance: form.distance,
-    purpose: form.purpose,
-    startAddress: form.startAddress.trim() || null,
-    endAddress: form.endAddress.trim() || null,
-    description: form.description.trim() || null
-  };
-};
+  useEffect(() => {
+    autoResetPageIndexRef.current = false;
+  }, [data]);
+  return autoResetPageIndexRef;
+}
 const LIST_TRIPS_TAG_KEY = "#list-trips";
 const ListTripsResponseSchema = Schema.Struct({
   data: Schema.Array(TripSchema),
@@ -41752,6 +41723,243 @@ function useTripsGlobalCacheActions() {
   );
   return { patchTripByKey, forceReloadTrips };
 }
+const ListVehiclesResponseSchema = Schema.Struct({
+  data: Schema.Array(VehicleSchema)
+});
+const listVehicles = get(({ businessId, allowArchived }) => {
+  const parameters = toDefinedSearchParameters({ allowArchived });
+  return `/v1/businesses/${businessId}/mileage/vehicles?${parameters}`;
+});
+const VEHICLES_TAG_KEY = "#list-vehicles";
+function buildKey$7({
+  access_token: accessToken,
+  apiUrl,
+  businessId,
+  allowArchived
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      allowArchived,
+      tags: [VEHICLES_TAG_KEY]
+    };
+  }
+}
+class ListVehiclesSWRResponse {
+  constructor(swrResponse) {
+    __publicField(this, "swrResponse");
+    this.swrResponse = swrResponse;
+  }
+  get data() {
+    var _a;
+    return (_a = this.swrResponse.data) == null ? void 0 : _a.data;
+  }
+  get isLoading() {
+    return this.swrResponse.isLoading;
+  }
+  get isValidating() {
+    return this.swrResponse.isValidating;
+  }
+  get isError() {
+    return this.swrResponse.error !== void 0;
+  }
+}
+function useListVehicles({ allowArchived } = {}) {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  const response = useSWR(
+    () => buildKey$7(__spreadProps(__spreadValues({}, data), {
+      businessId,
+      allowArchived
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2, allowArchived: allowArchived2 }) => listVehicles(
+      apiUrl,
+      accessToken,
+      {
+        params: {
+          businessId: businessId2,
+          allowArchived: allowArchived2
+        }
+      }
+    )().then(Schema.decodeUnknownPromise(ListVehiclesResponseSchema))
+  );
+  return new ListVehiclesSWRResponse(response);
+}
+const withUpdatedVehicle = (updated) => (vehicle) => vehicle.id === updated.id ? updated : vehicle;
+function useVehiclesGlobalCacheActions() {
+  const { patchCache, forceReload } = useGlobalCacheActions();
+  const patchVehicleByKey = useCallback(
+    (updatedVehicle) => patchCache(
+      (tags) => tags.includes(VEHICLES_TAG_KEY),
+      (currentData) => {
+        if (!currentData) return currentData;
+        return __spreadProps(__spreadValues({}, currentData), {
+          data: currentData.data.map(withUpdatedVehicle(updatedVehicle))
+        });
+      }
+    ),
+    [patchCache]
+  );
+  const forceReloadVehicles = useCallback(
+    () => forceReload((tags) => tags.includes(VEHICLES_TAG_KEY)),
+    [forceReload]
+  );
+  return { patchVehicleByKey, forceReloadVehicles };
+}
+const DELETE_TRIP_TAG_KEY = "#delete-trip";
+const deleteTrip = del(({ businessId, tripId }) => `/v1/businesses/${businessId}/mileage/trips/${tripId}`);
+function buildKey$6({
+  access_token: accessToken,
+  apiUrl,
+  businessId,
+  tripId
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      tripId,
+      tags: [DELETE_TRIP_TAG_KEY]
+    };
+  }
+}
+class DeleteTripSWRResponse {
+  constructor(swrResponse) {
+    __publicField(this, "swrResponse");
+    this.swrResponse = swrResponse;
+  }
+  get trigger() {
+    return this.swrResponse.trigger;
+  }
+  get isMutating() {
+    return this.swrResponse.isMutating;
+  }
+  get isError() {
+    return this.swrResponse.error !== void 0;
+  }
+}
+const useDeleteTrip = ({ tripId }) => {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  const rawMutationResponse = useSWRMutation(
+    () => buildKey$6(__spreadProps(__spreadValues({}, data), {
+      businessId,
+      tripId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2, tripId: tripId2 }) => {
+      return deleteTrip(
+        apiUrl,
+        accessToken,
+        { params: { businessId: businessId2, tripId: tripId2 } }
+      );
+    },
+    {
+      revalidate: false,
+      throwOnError: true
+    }
+  );
+  const mutationResponse = new DeleteTripSWRResponse(rawMutationResponse);
+  const { forceReloadTrips } = useTripsGlobalCacheActions();
+  const { forceReloadVehicles } = useVehiclesGlobalCacheActions();
+  const originalTrigger = mutationResponse.trigger;
+  const stableProxiedTrigger = useCallback(
+    (...triggerParameters) => __async(null, null, function* () {
+      const triggerResult = yield originalTrigger(...triggerParameters);
+      void forceReloadTrips();
+      void forceReloadVehicles();
+      return triggerResult;
+    }),
+    [originalTrigger, forceReloadTrips, forceReloadVehicles]
+  );
+  return new Proxy(mutationResponse, {
+    get(target, prop) {
+      if (prop === "trigger") {
+        return stableProxiedTrigger;
+      }
+      return Reflect.get(target, prop);
+    }
+  });
+};
+function TripDeleteConfirmationModal({
+  isOpen,
+  onOpenChange,
+  trip
+}) {
+  const { trigger: deleteTrip2 } = useDeleteTrip({ tripId: trip.id });
+  const onConfirm = useCallback(() => __async(null, null, function* () {
+    yield deleteTrip2();
+  }), [deleteTrip2]);
+  return /* @__PURE__ */ jsx(
+    BaseConfirmationModal,
+    {
+      isOpen,
+      onOpenChange,
+      title: "Delete this trip?",
+      description: "This trip will be permanently deleted. This action cannot be undone.",
+      onConfirm,
+      confirmLabel: "Delete trip",
+      cancelLabel: "Cancel",
+      errorText: "Failed to delete trip. Please check your connection and try again."
+    }
+  );
+}
+const getTripFormDefaultValues = (trip) => {
+  if (trip) {
+    return {
+      vehicle: trip.vehicle,
+      tripDate: trip.tripDate,
+      distance: trip.distance,
+      purpose: trip.purpose,
+      startAddress: trip.startAddress || "",
+      endAddress: trip.endAddress || "",
+      description: trip.description || ""
+    };
+  }
+  return {
+    vehicle: null,
+    tripDate: today(getLocalTimeZone()),
+    distance: BIG_DECIMAL_ZERO,
+    purpose: TripPurpose.Business,
+    startAddress: "",
+    endAddress: "",
+    description: ""
+  };
+};
+const validateTripForm = ({ trip }) => {
+  const { vehicle, tripDate, distance, purpose } = trip;
+  const errors = [];
+  if (tripDate === null) {
+    errors.push({ tripDate: "Trip date is a required field." });
+  }
+  if (tripDate && tripDate.compare(today(getLocalTimeZone())) > 0) {
+    errors.push({ tripDate: "Trip date cannot be in the future." });
+  }
+  if (!BigDecimal.isPositive(distance)) {
+    errors.push({ distance: "Distance must be greater than zero." });
+  }
+  if (!purpose) {
+    errors.push({ purpose: "Purpose is a required field." });
+  }
+  if (vehicle === null) {
+    errors.push({ vehicle: "Vehicle is a required field." });
+  }
+  return errors.length > 0 ? errors : null;
+};
+const convertTripFormToUpsertTrip = (form) => {
+  var _a;
+  return {
+    vehicleId: (_a = form.vehicle) == null ? void 0 : _a.id,
+    tripDate: form.tripDate,
+    distance: form.distance,
+    purpose: form.purpose,
+    startAddress: form.startAddress.trim() || null,
+    endAddress: form.endAddress.trim() || null,
+    description: form.description.trim() || null
+  };
+};
 const UPSERT_TRIP_TAG_KEY = "#upsert-trip";
 var UpsertTripMode = /* @__PURE__ */ ((UpsertTripMode2) => {
   UpsertTripMode2["Create"] = "Create";
@@ -41760,7 +41968,7 @@ var UpsertTripMode = /* @__PURE__ */ ((UpsertTripMode2) => {
 })(UpsertTripMode || {});
 const createTrip = post(({ businessId }) => `/v1/businesses/${businessId}/mileage/trips`);
 const updateTrip = patch(({ businessId, tripId }) => `/v1/businesses/${businessId}/mileage/trips/${tripId}`);
-function buildKey$3({
+function buildKey$5({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -41832,7 +42040,7 @@ const useUpsertTrip = (props) => {
   const { mode } = props;
   const tripId = mode === "Update" ? props.tripId : void 0;
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$3(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$5(__spreadProps(__spreadValues({}, data), {
       businessId,
       tripId
     })),
@@ -41851,6 +42059,7 @@ const useUpsertTrip = (props) => {
   );
   const mutationResponse = new UpsertTripSWRResponse(rawMutationResponse);
   const { patchTripByKey, forceReloadTrips } = useTripsGlobalCacheActions();
+  const { forceReloadVehicles } = useVehiclesGlobalCacheActions();
   const originalTrigger = mutationResponse.trigger;
   const stableProxiedTrigger = useCallback(
     (...triggerParameters) => __async(null, null, function* () {
@@ -41860,9 +42069,10 @@ const useUpsertTrip = (props) => {
       } else {
         void forceReloadTrips();
       }
+      void forceReloadVehicles();
       return triggerResult;
     }),
-    [originalTrigger, mode, patchTripByKey, forceReloadTrips]
+    [originalTrigger, mode, patchTripByKey, forceReloadTrips, forceReloadVehicles]
   );
   return new Proxy(mutationResponse, {
     get(target, prop) {
@@ -41965,67 +42175,6 @@ const TripPurposeComboBox = ({ value, onValueChange, isReadOnly, className }) =>
     )
   ] });
 };
-const ListVehiclesResponseSchema = Schema.Struct({
-  data: Schema.Array(VehicleSchema)
-});
-const listVehicles = get(({ businessId }) => {
-  return `/v1/businesses/${businessId}/mileage/vehicles`;
-});
-const VEHICLES_TAG_KEY = "#list-vehicles";
-function buildKey$2({
-  access_token: accessToken,
-  apiUrl,
-  businessId,
-  query
-}) {
-  if (accessToken && apiUrl) {
-    return {
-      accessToken,
-      apiUrl,
-      businessId,
-      query,
-      tags: [VEHICLES_TAG_KEY]
-    };
-  }
-}
-class ListVehiclesSWRResponse {
-  constructor(swrResponse) {
-    __publicField(this, "swrResponse");
-    this.swrResponse = swrResponse;
-  }
-  get data() {
-    var _a;
-    return (_a = this.swrResponse.data) == null ? void 0 : _a.data;
-  }
-  get isLoading() {
-    return this.swrResponse.isLoading;
-  }
-  get isValidating() {
-    return this.swrResponse.isValidating;
-  }
-  get isError() {
-    return this.swrResponse.error !== void 0;
-  }
-}
-function useListVehicles() {
-  const { data } = useAuth();
-  const { businessId } = useLayerContext();
-  const response = useSWR(
-    () => buildKey$2(__spreadProps(__spreadValues({}, data), {
-      businessId
-    })),
-    ({ accessToken, apiUrl, businessId: businessId2 }) => listVehicles(
-      apiUrl,
-      accessToken,
-      {
-        params: {
-          businessId: businessId2
-        }
-      }
-    )().then(Schema.decodeUnknownPromise(ListVehiclesResponseSchema))
-  );
-  return new ListVehiclesSWRResponse(response);
-}
 const getVehicleDisplayName = (vehicle) => `${vehicle.year} ${vehicle.makeAndModel}`;
 class VehicleAsOption {
   constructor(vehicle) {
@@ -42244,7 +42393,7 @@ const TripsTableHeaderMenu = () => {
   );
 };
 const COMPONENT_NAME = "TripsTable";
-const getColumnConfig = (onSelectTrip) => ({
+const getColumnConfig = ({ onSelectTrip, onDeleteTrip }) => ({
   [
     "TripDate"
     /* TripDate */
@@ -42308,27 +42457,32 @@ const getColumnConfig = (onSelectTrip) => ({
     cell: (row) => /* @__PURE__ */ jsx(Span, { ellipsis: true, withTooltip: true, children: row.description })
   },
   [
-    "Expand"
-    /* Expand */
+    "Actions"
+    /* Actions */
   ]: {
-    id: "Expand",
-    cell: (row) => /* @__PURE__ */ jsx(Button, { inset: true, icon: true, onPress: () => onSelectTrip(row), "aria-label": "View trip", variant: "ghost", children: /* @__PURE__ */ jsx(ChevronRightFill, {}) })
+    id: "Actions",
+    cell: (row) => /* @__PURE__ */ jsxs(HStack, { gap: "3xs", children: [
+      /* @__PURE__ */ jsx(Button, { inset: true, icon: true, onPress: () => onSelectTrip(row), "aria-label": "View trip", variant: "ghost", children: /* @__PURE__ */ jsx(Edit, { size: 20 }) }),
+      /* @__PURE__ */ jsx(Button, { inset: true, icon: true, onPress: () => onDeleteTrip(row), "aria-label": "Delete trip", variant: "ghost", children: /* @__PURE__ */ jsx(Trash2, { size: 20 }) })
+    ] })
   }
 });
 const TripsTable = () => {
   var _a;
   const [isTripDrawerOpen, setIsTripDrawerOpen] = useState(false);
   const [selectedTrip, setSelectedTrip] = useState(null);
+  const [tripToDelete, setTripToDelete] = useState(null);
   const { tableFilters, setTableFilters } = useTripsTableFilters();
   const { query, selectedVehicle, purposeFilter } = tableFilters;
+  const { currentTripsPage, setCurrentTripsPage } = useCurrentTripsPage();
   const { inputValue, searchQuery, handleInputChange } = useDebouncedSearchInput({ initialInputState: query });
   useEffect(() => {
     setTableFilters({ query: searchQuery });
   }, [searchQuery, setTableFilters]);
   const filterParams = useMemo(() => {
     const params = {};
-    if (searchQuery) {
-      params.query = searchQuery;
+    if (query) {
+      params.query = query;
     }
     if (selectedVehicle) {
       params.vehicleId = selectedVehicle.id;
@@ -42337,9 +42491,10 @@ const TripsTable = () => {
       params.purpose = purposeFilter;
     }
     return params;
-  }, [searchQuery, selectedVehicle, purposeFilter]);
+  }, [query, selectedVehicle, purposeFilter]);
   const { data, isLoading, isError, size, setSize } = useListTrips(filterParams);
   const trips = useMemo(() => data == null ? void 0 : data.flatMap(({ data: data2 }) => data2), [data]);
+  const autoResetPageIndexRef = useAutoResetPageIndex(filterParams, data);
   const paginationMeta = (_a = data == null ? void 0 : data[data.length - 1]) == null ? void 0 : _a.meta.pagination;
   const hasMore = paginationMeta == null ? void 0 : paginationMeta.hasMore;
   const fetchMore = useCallback(() => {
@@ -42351,17 +42506,23 @@ const TripsTable = () => {
     setSelectedTrip(trip);
     setIsTripDrawerOpen(true);
   }, []);
+  const onDeleteTrip = useCallback((trip) => {
+    setTripToDelete(trip);
+  }, []);
   const onRecordTrip = useCallback(() => {
     setSelectedTrip(null);
     setIsTripDrawerOpen(true);
   }, []);
   const paginationProps = useMemo(() => {
     return {
+      initialPage: currentTripsPage,
+      onSetPage: setCurrentTripsPage,
       pageSize: 20,
       hasMore,
-      fetchMore
+      fetchMore,
+      autoResetPageIndexRef
     };
-  }, [fetchMore, hasMore]);
+  }, [currentTripsPage, setCurrentTripsPage, fetchMore, hasMore, autoResetPageIndexRef]);
   const handlePurposeFilterChange = useCallback((newPurposeFilter) => {
     setTableFilters({ purposeFilter: newPurposeFilter });
   }, [setTableFilters]);
@@ -42412,7 +42573,7 @@ const TripsTable = () => {
       spacing: true
     }
   );
-  const columnConfig = useMemo(() => getColumnConfig(onSelectTrip), [onSelectTrip]);
+  const columnConfig = useMemo(() => getColumnConfig({ onSelectTrip, onDeleteTrip }), [onSelectTrip, onDeleteTrip]);
   const HeaderFilters = useCallback(() => /* @__PURE__ */ jsxs(HStack, { gap: "sm", align: "center", children: [
     /* @__PURE__ */ jsx(PurposeToggle, {}),
     /* @__PURE__ */ jsx(VehicleFilter, {})
@@ -42481,6 +42642,18 @@ const TripsTable = () => {
           )
         ] })
       }
+    ),
+    tripToDelete && /* @__PURE__ */ jsx(
+      TripDeleteConfirmationModal,
+      {
+        isOpen: !!tripToDelete,
+        onOpenChange: (isOpen) => {
+          if (!isOpen) {
+            setTripToDelete(null);
+          }
+        },
+        trip: tripToDelete
+      }
     )
   ] });
 };
@@ -42491,7 +42664,8 @@ const getVehicleFormDefaultValues = (vehicle) => {
       year: vehicle.year,
       licensePlate: vehicle.licensePlate || "",
       vin: vehicle.vin || "",
-      description: vehicle.description || ""
+      description: vehicle.description || "",
+      isPrimary: vehicle.isPrimary
     };
   }
   return {
@@ -42499,7 +42673,8 @@ const getVehicleFormDefaultValues = (vehicle) => {
     year: Number.NaN,
     licensePlate: "",
     vin: "",
-    description: ""
+    description: "",
+    isPrimary: false
   };
 };
 const validateVehicleForm = ({ vehicle }) => {
@@ -42523,7 +42698,8 @@ const convertVehicleFormToUpsertVehicle = (form) => {
     year: form.year,
     licensePlate: form.licensePlate.trim() || null,
     vin: form.vin.trim() || null,
-    description: form.description.trim() || null
+    description: form.description.trim() || null,
+    isPrimary: form.isPrimary
   };
 };
 const UPSERT_VEHICLE_TAG_KEY = "#upsert-vehicle";
@@ -42534,7 +42710,7 @@ var UpsertVehicleMode = /* @__PURE__ */ ((UpsertVehicleMode2) => {
 })(UpsertVehicleMode || {});
 const createVehicle = post(({ businessId }) => `/v1/businesses/${businessId}/mileage/vehicles`);
 const updateVehicle = patch(({ businessId, vehicleId }) => `/v1/businesses/${businessId}/mileage/vehicles/${vehicleId}`);
-function buildKey$1({
+function buildKey$4({
   access_token: accessToken,
   apiUrl,
   businessId,
@@ -42553,6 +42729,24 @@ function buildKey$1({
 const UpsertVehicleReturnSchema = Schema.Struct({
   data: VehicleSchema
 });
+class UpsertVehicleSWRResponse {
+  constructor(swrResponse) {
+    __publicField(this, "swrResponse");
+    this.swrResponse = swrResponse;
+  }
+  get trigger() {
+    return this.swrResponse.trigger;
+  }
+  get isMutating() {
+    return this.swrResponse.isMutating;
+  }
+  get data() {
+    return this.swrResponse.data;
+  }
+  get error() {
+    return this.swrResponse.error;
+  }
+}
 const CreateParamsSchema = Schema.Struct({
   businessId: Schema.UUID,
   vehicleId: Schema.Undefined
@@ -42586,11 +42780,10 @@ function getRequestFn(mode, params) {
 const useUpsertVehicle = (props) => {
   const { data } = useAuth();
   const { businessId } = useLayerContext();
-  const { mutate } = useSWRConfig();
   const { mode } = props;
   const vehicleId = mode === "Update" ? props.vehicleId : void 0;
   const rawMutationResponse = useSWRMutation(
-    () => buildKey$1(__spreadProps(__spreadValues({}, data), {
+    () => buildKey$4(__spreadProps(__spreadValues({}, data), {
       businessId,
       vehicleId
     })),
@@ -42608,43 +42801,31 @@ const useUpsertVehicle = (props) => {
     }
   );
   const mutationResponse = new UpsertVehicleSWRResponse(rawMutationResponse);
+  const { patchVehicleByKey, forceReloadVehicles } = useVehiclesGlobalCacheActions();
+  const { forceReloadTrips } = useTripsGlobalCacheActions();
   const originalTrigger = mutationResponse.trigger;
   const stableProxiedTrigger = useCallback(
     (...triggerParameters) => __async(null, null, function* () {
       const triggerResult = yield originalTrigger(...triggerParameters);
-      void mutate((key) => {
-        if (typeof key === "object" && key !== null && "tags" in key) {
-          const tags = key.tags;
-          return tags.includes(VEHICLES_TAG_KEY);
-        }
-        return false;
-      });
+      if (mode === "Update") {
+        void patchVehicleByKey(triggerResult.data);
+        void forceReloadTrips();
+      } else {
+        void forceReloadVehicles();
+      }
       return triggerResult;
     }),
-    [originalTrigger, mutate]
+    [originalTrigger, mode, patchVehicleByKey, forceReloadTrips, forceReloadVehicles]
   );
-  return __spreadProps(__spreadValues({}, mutationResponse), {
-    trigger: stableProxiedTrigger
+  return new Proxy(mutationResponse, {
+    get(target, prop) {
+      if (prop === "trigger") {
+        return stableProxiedTrigger;
+      }
+      return Reflect.get(target, prop);
+    }
   });
 };
-class UpsertVehicleSWRResponse {
-  constructor(swrResponse) {
-    __publicField(this, "swrResponse");
-    this.swrResponse = swrResponse;
-  }
-  get trigger() {
-    return this.swrResponse.trigger;
-  }
-  get isMutating() {
-    return this.swrResponse.isMutating;
-  }
-  get data() {
-    return this.swrResponse.data;
-  }
-  get error() {
-    return this.swrResponse.error;
-  }
-}
 const useVehicleForm = (props) => {
   const [submitError, setSubmitError] = useState(void 0);
   const { onSuccess, vehicle } = props;
@@ -42760,6 +42941,15 @@ const VehicleForm = (props) => {
         className: `${VEHICLE_FORM_FIELD_CSS_PREFIX}__Description`
       }
     ) }),
+    /* @__PURE__ */ jsx(form.AppField, { name: "isPrimary", children: (field) => /* @__PURE__ */ jsx(
+      field.FormSwitchField,
+      {
+        label: "Set as primary vehicle",
+        inline: true,
+        isReadOnly,
+        className: `${VEHICLE_FORM_FIELD_CSS_PREFIX}__IsPrimary`
+      }
+    ) }),
     /* @__PURE__ */ jsx(VStack, { justify: "end", className: `${VEHICLE_FORM_CSS_PREFIX}__Submit`, children: /* @__PURE__ */ jsx(form.Subscribe, { selector: (state) => [state.canSubmit, state.isSubmitting], children: ([canSubmit, isSubmitting]) => /* @__PURE__ */ jsx(
       Button,
       {
@@ -42774,6 +42964,309 @@ const VehicleForm = (props) => {
     ) }) })
   ] });
 };
+const ARCHIVE_VEHICLE_TAG_KEY = "#archive-vehicle";
+const ArchiveVehicleReturnSchema = Schema.Struct({
+  data: VehicleSchema
+});
+const archiveVehicle = post(({ businessId, vehicleId }) => `/v1/businesses/${businessId}/mileage/vehicles/${vehicleId}/archive`);
+function buildKey$3({
+  access_token: accessToken,
+  apiUrl,
+  businessId,
+  vehicleId
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      vehicleId,
+      tags: [ARCHIVE_VEHICLE_TAG_KEY]
+    };
+  }
+}
+class ArchiveVehicleSWRResponse {
+  constructor(swrResponse) {
+    __publicField(this, "swrResponse");
+    this.swrResponse = swrResponse;
+  }
+  get data() {
+    return this.swrResponse.data;
+  }
+  get trigger() {
+    return this.swrResponse.trigger;
+  }
+  get isMutating() {
+    return this.swrResponse.isMutating;
+  }
+  get isError() {
+    return this.swrResponse.error !== void 0;
+  }
+}
+const useArchiveVehicle = ({ vehicleId }) => {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  const rawMutationResponse = useSWRMutation(
+    () => buildKey$3(__spreadProps(__spreadValues({}, data), {
+      businessId,
+      vehicleId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2, vehicleId: vehicleId2 }) => {
+      return archiveVehicle(
+        apiUrl,
+        accessToken,
+        { params: { businessId: businessId2, vehicleId: vehicleId2 } }
+      ).then(Schema.decodeUnknownPromise(ArchiveVehicleReturnSchema));
+    },
+    {
+      revalidate: false,
+      throwOnError: true
+    }
+  );
+  const mutationResponse = new ArchiveVehicleSWRResponse(rawMutationResponse);
+  const { patchVehicleByKey } = useVehiclesGlobalCacheActions();
+  const originalTrigger = mutationResponse.trigger;
+  const stableProxiedTrigger = useCallback(
+    (...triggerParameters) => __async(null, null, function* () {
+      const triggerResult = yield originalTrigger(...triggerParameters);
+      void patchVehicleByKey(triggerResult.data);
+      return triggerResult;
+    }),
+    [originalTrigger, patchVehicleByKey]
+  );
+  return new Proxy(mutationResponse, {
+    get(target, prop) {
+      if (prop === "trigger") {
+        return stableProxiedTrigger;
+      }
+      return Reflect.get(target, prop);
+    }
+  });
+};
+function VehicleArchiveConfirmationModal({
+  isOpen,
+  onOpenChange,
+  vehicle
+}) {
+  const { trigger: archiveVehicle2 } = useArchiveVehicle({ vehicleId: vehicle.id });
+  const onConfirm = useCallback(() => __async(null, null, function* () {
+    yield archiveVehicle2();
+  }), [archiveVehicle2]);
+  const vehicleName = getVehicleDisplayName(vehicle);
+  return /* @__PURE__ */ jsx(
+    BaseConfirmationModal,
+    {
+      isOpen,
+      onOpenChange,
+      title: "Archive this vehicle?",
+      description: `${vehicleName} will be hidden from your active vehicles list. You can reactivate it at any time.`,
+      onConfirm,
+      confirmLabel: "Archive vehicle",
+      cancelLabel: "Cancel",
+      errorText: "Failed to archive vehicle. Please check your connection and try again."
+    }
+  );
+}
+const DELETE_VEHICLE_TAG_KEY = "#delete-vehicle";
+const deleteVehicle = del(({ businessId, vehicleId }) => `/v1/businesses/${businessId}/mileage/vehicles/${vehicleId}`);
+function buildKey$2({
+  access_token: accessToken,
+  apiUrl,
+  businessId,
+  vehicleId
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      vehicleId,
+      tags: [DELETE_VEHICLE_TAG_KEY]
+    };
+  }
+}
+class DeleteVehicleSWRResponse {
+  constructor(swrResponse) {
+    __publicField(this, "swrResponse");
+    this.swrResponse = swrResponse;
+  }
+  get trigger() {
+    return this.swrResponse.trigger;
+  }
+  get isMutating() {
+    return this.swrResponse.isMutating;
+  }
+  get isError() {
+    return this.swrResponse.error !== void 0;
+  }
+}
+const useDeleteVehicle = ({ vehicleId }) => {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  const rawMutationResponse = useSWRMutation(
+    () => buildKey$2(__spreadProps(__spreadValues({}, data), {
+      businessId,
+      vehicleId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2, vehicleId: vehicleId2 }) => {
+      return deleteVehicle(
+        apiUrl,
+        accessToken,
+        { params: { businessId: businessId2, vehicleId: vehicleId2 } }
+      );
+    },
+    {
+      revalidate: false,
+      throwOnError: true
+    }
+  );
+  const mutationResponse = new DeleteVehicleSWRResponse(rawMutationResponse);
+  const { forceReloadVehicles } = useVehiclesGlobalCacheActions();
+  const originalTrigger = mutationResponse.trigger;
+  const stableProxiedTrigger = useCallback(
+    (...triggerParameters) => __async(null, null, function* () {
+      const triggerResult = yield originalTrigger(...triggerParameters);
+      void forceReloadVehicles();
+      return triggerResult;
+    }),
+    [originalTrigger, forceReloadVehicles]
+  );
+  return new Proxy(mutationResponse, {
+    get(target, prop) {
+      if (prop === "trigger") {
+        return stableProxiedTrigger;
+      }
+      return Reflect.get(target, prop);
+    }
+  });
+};
+function VehicleDeleteConfirmationModal({
+  isOpen,
+  onOpenChange,
+  vehicle
+}) {
+  const { trigger: deleteVehicle2 } = useDeleteVehicle({ vehicleId: vehicle.id });
+  const onConfirm = useCallback(() => __async(null, null, function* () {
+    yield deleteVehicle2();
+  }), [deleteVehicle2]);
+  const vehicleName = getVehicleDisplayName(vehicle);
+  return /* @__PURE__ */ jsx(
+    BaseConfirmationModal,
+    {
+      isOpen,
+      onOpenChange,
+      title: "Delete this vehicle?",
+      description: `${vehicleName} will be permanently deleted. This action cannot be undone.`,
+      onConfirm,
+      confirmLabel: "Delete vehicle",
+      cancelLabel: "Cancel",
+      errorText: "Failed to delete vehicle. Please check your connection and try again."
+    }
+  );
+}
+const REACTIVATE_VEHICLE_TAG_KEY = "#reactivate-vehicle";
+const ReactivateVehicleReturnSchema = Schema.Struct({
+  data: VehicleSchema
+});
+const reactivateVehicle = post(({ businessId, vehicleId }) => `/v1/businesses/${businessId}/mileage/vehicles/${vehicleId}/reactivate`);
+function buildKey$1({
+  access_token: accessToken,
+  apiUrl,
+  businessId,
+  vehicleId
+}) {
+  if (accessToken && apiUrl) {
+    return {
+      accessToken,
+      apiUrl,
+      businessId,
+      vehicleId,
+      tags: [REACTIVATE_VEHICLE_TAG_KEY]
+    };
+  }
+}
+class ReactivateVehicleSWRResponse {
+  constructor(swrResponse) {
+    __publicField(this, "swrResponse");
+    this.swrResponse = swrResponse;
+  }
+  get data() {
+    return this.swrResponse.data;
+  }
+  get trigger() {
+    return this.swrResponse.trigger;
+  }
+  get isMutating() {
+    return this.swrResponse.isMutating;
+  }
+  get isError() {
+    return this.swrResponse.error !== void 0;
+  }
+}
+const useReactivateVehicle = ({ vehicleId }) => {
+  const { data } = useAuth();
+  const { businessId } = useLayerContext();
+  const rawMutationResponse = useSWRMutation(
+    () => buildKey$1(__spreadProps(__spreadValues({}, data), {
+      businessId,
+      vehicleId
+    })),
+    ({ accessToken, apiUrl, businessId: businessId2, vehicleId: vehicleId2 }) => {
+      return reactivateVehicle(
+        apiUrl,
+        accessToken,
+        { params: { businessId: businessId2, vehicleId: vehicleId2 } }
+      ).then(Schema.decodeUnknownPromise(ReactivateVehicleReturnSchema));
+    },
+    {
+      revalidate: false,
+      throwOnError: true
+    }
+  );
+  const mutationResponse = new ReactivateVehicleSWRResponse(rawMutationResponse);
+  const { patchVehicleByKey } = useVehiclesGlobalCacheActions();
+  const originalTrigger = mutationResponse.trigger;
+  const stableProxiedTrigger = useCallback(
+    (...triggerParameters) => __async(null, null, function* () {
+      const triggerResult = yield originalTrigger(...triggerParameters);
+      void patchVehicleByKey(triggerResult.data);
+      return triggerResult;
+    }),
+    [originalTrigger, patchVehicleByKey]
+  );
+  return new Proxy(mutationResponse, {
+    get(target, prop) {
+      if (prop === "trigger") {
+        return stableProxiedTrigger;
+      }
+      return Reflect.get(target, prop);
+    }
+  });
+};
+function VehicleReactivateConfirmationModal({
+  isOpen,
+  onOpenChange,
+  vehicle
+}) {
+  const { trigger: reactivateVehicle2 } = useReactivateVehicle({ vehicleId: vehicle.id });
+  const onConfirm = useCallback(() => __async(null, null, function* () {
+    yield reactivateVehicle2();
+  }), [reactivateVehicle2]);
+  const vehicleName = getVehicleDisplayName(vehicle);
+  return /* @__PURE__ */ jsx(
+    BaseConfirmationModal,
+    {
+      isOpen,
+      onOpenChange,
+      title: "Reactivate this vehicle?",
+      description: `${vehicleName} will be restored to your active vehicles list and available for tracking trips.`,
+      onConfirm,
+      confirmLabel: "Reactivate vehicle",
+      cancelLabel: "Cancel",
+      errorText: "Failed to reactivate vehicle. Please check your connection and try again."
+    }
+  );
+}
 const VEHICLE_CARD_FIELDS = [
   { label: "Make and model", key: "makeAndModel" },
   { label: "Year", key: "year" },
@@ -42782,20 +43275,73 @@ const VEHICLE_CARD_FIELDS = [
   { label: "Description", key: "description" }
 ];
 const VehicleCard = ({ vehicle, onEdit }) => {
-  return /* @__PURE__ */ jsx(Card, { className: "Layer__VehicleCard", children: /* @__PURE__ */ jsxs(VStack, { gap: "md", pi: "md", pb: "md", children: [
-    /* @__PURE__ */ jsxs(HStack, { justify: "space-between", align: "center", gap: "md", children: [
-      /* @__PURE__ */ jsx(Heading$1, { size: "sm", ellipsis: true, children: getVehicleDisplayName(vehicle) }),
-      /* @__PURE__ */ jsx(Car, { size: 20, className: "Layer__VehicleCard__icon" })
-    ] }),
-    /* @__PURE__ */ jsx(VStack, { gap: "xs", children: VEHICLE_CARD_FIELDS.map(({ label, key }) => /* @__PURE__ */ jsxs(HStack, { justify: "space-between", gap: "md", children: [
-      /* @__PURE__ */ jsx(Span, { size: "sm", variant: "subtle", children: label }),
-      /* @__PURE__ */ jsx(Span, { size: "sm", weight: "bold", withTooltip: true, children: vehicle[key] || "-" })
-    ] }, key)) }),
-    /* @__PURE__ */ jsx(Button, { variant: "text", onPress: () => onEdit(vehicle), children: "Edit vehicle" })
-  ] }) });
+  const [isDeleteModalOpen, setIsDeleteModalOpen] = useState(false);
+  const [isArchiveModalOpen, setIsArchiveModalOpen] = useState(false);
+  const [isReactivateModalOpen, setIsReactivateModalOpen] = useState(false);
+  const vehicleName = getVehicleDisplayName(vehicle);
+  const isArchived = vehicle.archivedAt !== null && vehicle.archivedAt !== void 0;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(Card, { className: "Layer__VehicleCard", children: /* @__PURE__ */ jsxs(VStack, { pi: "md", pbs: "md", pbe: "xs", children: [
+      /* @__PURE__ */ jsxs(VStack, { gap: "md", children: [
+        /* @__PURE__ */ jsxs(HStack, { justify: "space-between", align: "center", gap: "md", children: [
+          /* @__PURE__ */ jsxs(HStack, { gap: "xs", className: "Layer__VehicleCard__Header", children: [
+            /* @__PURE__ */ jsx(Heading$1, { size: "sm", ellipsis: true, children: vehicleName }),
+            vehicle.isPrimary && /* @__PURE__ */ jsx(Badge, { size: BadgeSize.SMALL, variant: BadgeVariant.INFO, children: "Primary" }),
+            isArchived && /* @__PURE__ */ jsx(Badge, { size: BadgeSize.SMALL, variant: BadgeVariant.WARNING, children: "Archived" })
+          ] }),
+          /* @__PURE__ */ jsx(Car, { size: 20, className: "Layer__VehicleCard__Icon" })
+        ] }),
+        /* @__PURE__ */ jsx(VStack, { gap: "xs", children: VEHICLE_CARD_FIELDS.map(({ label, key }) => /* @__PURE__ */ jsxs(HStack, { justify: "space-between", gap: "md", children: [
+          /* @__PURE__ */ jsx(Span, { size: "sm", variant: "subtle", children: label }),
+          /* @__PURE__ */ jsx(Span, { size: "sm", weight: "bold", withTooltip: true, children: vehicle[key] || "-" })
+        ] }, key)) })
+      ] }),
+      /* @__PURE__ */ jsx(VStack, { pbs: "md", pbe: "xs", children: /* @__PURE__ */ jsx(Separator, {}) }),
+      /* @__PURE__ */ jsxs(HStack, { gap: "3xs", justify: "end", children: [
+        !isArchived && /* @__PURE__ */ jsxs(Button, { variant: "ghost", onPress: () => onEdit(vehicle), children: [
+          /* @__PURE__ */ jsx(Edit, { size: 16 }),
+          "Edit"
+        ] }),
+        isArchived ? /* @__PURE__ */ jsxs(Button, { variant: "ghost", onPress: () => setIsReactivateModalOpen(true), children: [
+          /* @__PURE__ */ jsx(RotateCcw, { size: 16 }),
+          "Reactivate"
+        ] }) : vehicle.isEligibleForDeletion ? /* @__PURE__ */ jsxs(Button, { variant: "ghost", onPress: () => setIsDeleteModalOpen(true), children: [
+          /* @__PURE__ */ jsx(Trash2, { size: 16 }),
+          "Delete"
+        ] }) : /* @__PURE__ */ jsxs(Button, { variant: "ghost", onPress: () => setIsArchiveModalOpen(true), children: [
+          /* @__PURE__ */ jsx(Archive, { size: 16 }),
+          "Archive"
+        ] })
+      ] })
+    ] }) }),
+    /* @__PURE__ */ jsx(
+      VehicleDeleteConfirmationModal,
+      {
+        isOpen: isDeleteModalOpen,
+        onOpenChange: setIsDeleteModalOpen,
+        vehicle
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      VehicleArchiveConfirmationModal,
+      {
+        isOpen: isArchiveModalOpen,
+        onOpenChange: setIsArchiveModalOpen,
+        vehicle
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      VehicleReactivateConfirmationModal,
+      {
+        isOpen: isReactivateModalOpen,
+        onOpenChange: setIsReactivateModalOpen,
+        vehicle
+      }
+    )
+  ] });
 };
-const VehicleManagementGrid = ({ onEditVehicle }) => {
-  const { data, isLoading, isError } = useListVehicles();
+const VehicleManagementGrid = ({ onEditVehicle, showArchived }) => {
+  const { data, isLoading, isError } = useListVehicles({ allowArchived: showArchived });
   const vehicles = useMemo(() => data ? asMutable(data) : void 0, [data]);
   if (isLoading) {
     return /* @__PURE__ */ jsx(VStack, { align: "center", justify: "center", pi: "lg", pb: "lg", children: /* @__PURE__ */ jsx(Loader, {}) });
@@ -42825,9 +43371,12 @@ const VehicleManagementGrid = ({ onEditVehicle }) => {
   }
   return /* @__PURE__ */ jsx(HStack, { className: "Layer__VehicleManagementGrid", children: vehicles.map((vehicle) => /* @__PURE__ */ jsx(VehicleCard, { vehicle, onEdit: onEditVehicle }, vehicle.id)) });
 };
-const VehicleManagementDetailHeader = ({ onAddVehicle }) => {
-  return /* @__PURE__ */ jsxs(HStack, { justify: "space-between", align: "center", fluid: true, pie: "md", children: [
-    /* @__PURE__ */ jsx(Heading$1, { size: "sm", children: "Manage vehicles" }),
+const VehicleManagementDetailHeader = ({ onAddVehicle, showArchived, onShowArchivedChange }) => {
+  return /* @__PURE__ */ jsxs(HStack, { justify: "space-between", align: "center", fluid: true, pie: "md", gap: "3xl", children: [
+    /* @__PURE__ */ jsxs(HStack, { gap: "md", align: "center", children: [
+      /* @__PURE__ */ jsx(Heading$1, { size: "sm", children: "Manage vehicles" }),
+      /* @__PURE__ */ jsx(Switch, { isSelected: showArchived, onChange: onShowArchivedChange, children: /* @__PURE__ */ jsx(Span, { size: "sm", noWrap: true, children: "Show archived" }) })
+    ] }),
     /* @__PURE__ */ jsxs(Button, { variant: "solid", onPress: onAddVehicle, children: [
       "Add Vehicle",
       /* @__PURE__ */ jsx(Plus$1, { size: 14 })
@@ -42838,6 +43387,7 @@ const VehicleManagementDetail = () => {
   const { toTripsTable } = useTripsNavigation();
   const [isVehicleDrawerOpen, setIsVehicleDrawerOpen] = useState(false);
   const [selectedVehicle, setSelectedVehicle] = useState(void 0);
+  const [showArchived, setShowArchived] = useState(false);
   const handleAddVehicle = useCallback(() => {
     setSelectedVehicle(void 0);
     setIsVehicleDrawerOpen(true);
@@ -42850,9 +43400,20 @@ const VehicleManagementDetail = () => {
     setIsVehicleDrawerOpen(false);
     setSelectedVehicle(void 0);
   }, []);
-  const Header3 = useCallback(() => {
-    return /* @__PURE__ */ jsx(VehicleManagementDetailHeader, { onAddVehicle: handleAddVehicle });
-  }, [handleAddVehicle]);
+  const stateRef = useRef({ showArchived, setShowArchived, handleAddVehicle });
+  stateRef.current = { showArchived, setShowArchived, handleAddVehicle };
+  const HeaderRef = useRef(() => {
+    const { showArchived: currentShowArchived, setShowArchived: currentSetShowArchived, handleAddVehicle: currentHandleAddVehicle } = stateRef.current;
+    return /* @__PURE__ */ jsx(
+      VehicleManagementDetailHeader,
+      {
+        onAddVehicle: currentHandleAddVehicle,
+        showArchived: currentShowArchived,
+        onShowArchivedChange: currentSetShowArchived
+      }
+    );
+  });
+  const Header3 = HeaderRef.current;
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(
       BaseDetailView,
@@ -42860,7 +43421,7 @@ const VehicleManagementDetail = () => {
         slots: { Header: Header3, BackIcon: BackArrow },
         name: "VehicleManagementDetail",
         onGoBack: toTripsTable,
-        children: /* @__PURE__ */ jsx(VehicleManagementGrid, { onEditVehicle: handleEditVehicle })
+        children: /* @__PURE__ */ jsx(VehicleManagementGrid, { onEditVehicle: handleEditVehicle, showArchived })
       }
     ),
     /* @__PURE__ */ jsx(Drawer, { isOpen: isVehicleDrawerOpen, onOpenChange: setIsVehicleDrawerOpen, "aria-label": selectedVehicle ? "Vehicle details" : "Add vehicle", children: ({ close: close2 }) => /* @__PURE__ */ jsxs(VStack, { pb: "lg", children: [
@@ -42939,7 +43500,7 @@ const ProjectProfitabilityView = ({
             }
           ) }),
           /* @__PURE__ */ jsx(
-            Select$1,
+            ReactSelect,
             {
               className: "Layer__category-menu Layer__select",
               classNamePrefix: "Layer__select",
@@ -43526,14 +44087,14 @@ const BusinessProvider = ({
     }
   );
 };
-const LayerProvider = (_ud) => {
-  var _vd = _ud, {
+const LayerProvider = (_wd) => {
+  var _xd = _wd, {
     appId,
     appSecret,
     businessAccessToken,
     environment,
     usePlaidSandbox
-  } = _vd, restProps = __objRest(_vd, [
+  } = _xd, restProps = __objRest(_xd, [
     "appId",
     "appSecret",
     "businessAccessToken",