@zeniai/client-epic-state 5.3.22 → 5.3.24-betaAK1

package/lib/esm/view/dashboard/dashboardSelector.js

@@ -22,15 +22,18 @@ import { getReimbursementCardReport } from '../reimbursementCard/reimbursementCa
 import { getRevenueReport } from '../revenue/revenueSelector';
 import { getTasksCardReport } from '../tasksCard/tasksCardSelector';
 import { getTop6Expenses } from '../topEx/topExSelector';
-const getNetBurnOrIncomeForLast4Periods = (state) => {
-    return getNetBurnOrIncomeReport(state.accountState, state.accountGroupState, state.sectionAccountsViewState, state.netBurnOrIncomeState, state.forecastState, state.forecastListState, newBalancesFilter(state.netBurnOrIncomeState.netBurnOrIncome.firstMonthOfFY, state.netBurnOrIncomeState.uiState.timeframe, 4, undefined, 'ascending_date', state.netBurnOrIncomeState.uiState.selectedAdditionalBalances));
-};
-const getOperatingExpensesForLast5Periods = (state) => {
-    return getOperatingExpensesReport(state, newBalancesFilter(state.opExState.opEx.firstMonthOfFY, state.opExState.uiState.timeframe, 5, undefined, 'ascending_date', state.opExState.uiState.selectedAdditionalBalances));
-};
-const getRevenueForLast4Periods = (state) => getRevenueReport(newBalancesFilter(state.revenueState.revenue.firstMonthOfFY, state.revenueState.uiState.timeframe, 4, undefined, 'ascending_date', state.revenueState.uiState.selectedAdditionalBalances), state.accountState, state.accountGroupState, state.sectionAccountsViewState, state.forecastListState, state.revenueState, state.forecastState);
-const getCashPositionLast5Periods = (state) => getCashPosition(state.accountState, state.cashPositionState, newBalancesFilter(state.cashPositionState.firstMonthOfFY, state.cashPositionState.uiState.timeframe, 5, undefined, 'ascending_date', state.cashPositionState.uiState.selectedAdditionalBalances));
-const getCashInCashOutLast4Periods = (state) => getCashInCashOut(state.accountState, state.accountGroupState, state.cashInCashOutState, newBalancesFilter(state.cashInCashOutState.firstMonthOfFY, state.cashInCashOutState.uiState.timeframe, 4, undefined, 'ascending_date', state.cashInCashOutState.uiState.selectedAdditionalBalances));
+// Every input must return the same reference until the slices it reads change, or getDashboard
+// rebuilds every card's balances on each dispatched action.
+const getNetBurnOrIncomeFilter = createSelector((state) => state.netBurnOrIncomeState.netBurnOrIncome.firstMonthOfFY, (state) => state.netBurnOrIncomeState.uiState.timeframe, (state) => state.netBurnOrIncomeState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => newBalancesFilter(firstMonthOfFY, timeframe, 4, undefined, 'ascending_date', selectedAdditionalBalances));
+const getNetBurnOrIncomeForLast4Periods = createSelector((state) => state.accountState, (state) => state.accountGroupState, (state) => state.sectionAccountsViewState, (state) => state.netBurnOrIncomeState, (state) => state.forecastState, (state) => state.forecastListState, getNetBurnOrIncomeFilter, (accountState, accountGroupState, sectionAccountsViewState, netBurnOrIncomeState, forecastState, forecastListState, filter) => getNetBurnOrIncomeReport(accountState, accountGroupState, sectionAccountsViewState, netBurnOrIncomeState, forecastState, forecastListState, filter));
+const getOperatingExpensesFilter = createSelector((state) => state.opExState.opEx.firstMonthOfFY, (state) => state.opExState.uiState.timeframe, (state) => state.opExState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => newBalancesFilter(firstMonthOfFY, timeframe, 5, undefined, 'ascending_date', selectedAdditionalBalances));
+const getOperatingExpensesForLast5Periods = (state) => getOperatingExpensesReport(state, getOperatingExpensesFilter(state));
+const getRevenueFilter = createSelector((state) => state.revenueState.revenue.firstMonthOfFY, (state) => state.revenueState.uiState.timeframe, (state) => state.revenueState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => newBalancesFilter(firstMonthOfFY, timeframe, 4, undefined, 'ascending_date', selectedAdditionalBalances));
+const getRevenueForLast4Periods = createSelector(getRevenueFilter, (state) => state.accountState, (state) => state.accountGroupState, (state) => state.sectionAccountsViewState, (state) => state.forecastListState, (state) => state.revenueState, (state) => state.forecastState, (filter, accountState, accountGroupState, sectionAccountsViewState, forecastListState, revenueState, forecastState) => getRevenueReport(filter, accountState, accountGroupState, sectionAccountsViewState, forecastListState, revenueState, forecastState));
+const getCashPositionFilter = createSelector((state) => state.cashPositionState.firstMonthOfFY, (state) => state.cashPositionState.uiState.timeframe, (state) => state.cashPositionState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => newBalancesFilter(firstMonthOfFY, timeframe, 5, undefined, 'ascending_date', selectedAdditionalBalances));
+const getCashPositionLast5Periods = createSelector((state) => state.accountState, (state) => state.cashPositionState, getCashPositionFilter, (accountState, cashPositionState, filter) => getCashPosition(accountState, cashPositionState, filter));
+const getCashInCashOutFilter = createSelector((state) => state.cashInCashOutState.firstMonthOfFY, (state) => state.cashInCashOutState.uiState.timeframe, (state) => state.cashInCashOutState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => newBalancesFilter(firstMonthOfFY, timeframe, 4, undefined, 'ascending_date', selectedAdditionalBalances));
+const getCashInCashOutLast4Periods = createSelector((state) => state.accountState, (state) => state.accountGroupState, (state) => state.cashInCashOutState, getCashInCashOutFilter, (accountState, accountGroupState, cashInCashOutState, filter) => getCashInCashOut(accountState, accountGroupState, cashInCashOutState, filter));
 const getNetBurnOrIncomeStoryCard = (state) => getNetBurnOrIncomeStoryCardReport(state);
 const apAgingSelector = (state) => getApAgingReport(state);
 const arAgingSelector = (state) => getArAgingReport(state);

package/lib/esm/view/invoicing/createInvoice/createInvoiceSelector.js

@@ -3,7 +3,7 @@ import { getAddressByAddressId } from '../../../entity/address/addressSelector';
 import { invoicingPricePointDisplayAmount } from '../../../entity/invoicing/invoicingCatalog/invoicingCatalogSelector';
 import { getInvoicingCatalogListView, getInvoicingCatalogPrices, } from '../invoicingCatalogListView/invoicingCatalogListViewSelector';
 import { invoicingFieldHelpForGroup } from '../invoicingConfigView/invoicingConfigViewSelector';
-import { getInvoicingAllCustomers } from '../invoicingCustomerListView/invoicingCustomerListViewSelector';
+import { getInvoicingAllCustomers, isInvoicingAllCustomersLoading, } from '../invoicingCustomerListView/invoicingCustomerListViewSelector';
 import { getInvoicingSettings } from '../settingsView/settingsViewSelector';
 /**
  * Pricing models whose single-unit amount is a true per-unit rate — the only
@@ -89,6 +89,7 @@ export const getCreateInvoiceFormView = (state) => {
             id: customer.id,
             name: customerDisplayName(customer),
         })),
+        isCustomerListLoading: isInvoicingAllCustomersLoading(state),
         localData: createInvoiceState.formDraft,
         planNames: getCreateInvoicePlanNames(state),
         products: getInvoicingCatalogPrices(catalogListView.products),

package/lib/esm/view/invoicing/createInvoice/epics/fetchCreateInvoiceFormPageEpic.js

@@ -24,13 +24,20 @@ const PICKER_PRODUCT_FILTERS = { type: 'addon|charge' };
 export const fetchCreateInvoiceFormPageEpic = (actions$, state$) => actions$.pipe(filter(fetchCreateInvoiceFormPage.match), mergeMap((action) => {
     const { cacheOverride } = action.payload;
     const state = state$.value;
-    // The customer picker reads the unfiltered `all` cache.
-    const customerTab = getInvoicingListTab(state.invoicingCustomerListViewState.byTab, INVOICING_LIST_ALL_TAB);
+    // The customer picker filters the unfiltered `all` cache client-side.
+    const customerListState = state.invoicingCustomerListViewState;
+    const customerTab = getInvoicingListTab(customerListState.byTab, INVOICING_LIST_ALL_TAB);
     const catalogState = state.invoicingCatalogListViewState;
     const settingsState = state.invoicingSettingsViewState;
     const pageActions = [];
-    if (shouldFetch({ fetchState: customerTab.fetchState, error: customerTab.error }, cacheOverride)) {
+    if (shouldFetchFullInvoicingList({
+        fetchState: customerTab.fetchState,
+        filters: customerListState.filters,
+        nextCursor: customerTab.nextCursor,
+        sort: customerListState.sort,
+    }, {}, cacheOverride)) {
         pageActions.push(fetchInvoicingCustomerList({
+            fetchAll: true,
             filters: {},
             keepExistingListItems: false,
             tabId: INVOICING_LIST_ALL_TAB,

package/lib/esm/view/invoicing/editInvoicingSubscriptionDetailView/editInvoicingSubscriptionDetailViewSelector.js

@@ -5,7 +5,7 @@ import { getFormattedAddress } from '../../addressView/addressViewSelector';
 import { getInvoicingCouponListItems } from '../couponView/couponViewSelector';
 import { getInvoicingCatalogListView, getInvoicingCatalogPrices, } from '../invoicingCatalogListView/invoicingCatalogListViewSelector';
 import { getInvoicingConfigView, invoicingFieldHelpForGroup, } from '../invoicingConfigView/invoicingConfigViewSelector';
-import { getInvoicingAllCustomers } from '../invoicingCustomerListView/invoicingCustomerListViewSelector';
+import { getInvoicingAllCustomers, isInvoicingAllCustomersLoading, } from '../invoicingCustomerListView/invoicingCustomerListViewSelector';
 import { getInvoicingFormDraftLocalData, isInvoicingFormDraftPending, } from '../invoicingFormDraft';
 import { initialInvoicingSubscriptionFormLocalData, invoicingPriceHasQuantity, } from './invoicingSubscriptionFormConfig';
 import { INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE } from './invoicingSubscriptionFormConfig';
@@ -283,6 +283,7 @@ export const getInvoicingSubscriptionFormView = (state, invoicingSubscriptionID)
         charges: catalogItemOptionsOfType('charge'),
         coupons: getInvoicingCouponListItems(state).map(toInvoicingCouponOption),
         customers: getInvoicingAllCustomers(state).map(toInvoicingCustomerOption),
+        isCustomerListLoading: isInvoicingAllCustomersLoading(state),
         localData,
         mode,
         plans: planPrices.map(toInvoicingPlanOption),

package/lib/esm/view/invoicing/editInvoicingSubscriptionDetailView/fetchInvoicingSubscriptionFormPageEpic.js

@@ -3,6 +3,7 @@ import { filter, mergeMap } from 'rxjs/operators';
 import { fetchInvoicingCouponList } from '../couponView/couponViewReducer';
 import { fetchInvoicingCatalogPlanList } from '../invoicingCatalogListView/invoicingCatalogListViewReducer';
 import { fetchInvoicingCustomerList } from '../invoicingCustomerListView/invoicingCustomerListViewReducer';
+import { INVOICING_LIST_ALL_TAB } from '../invoicingListTabCache';
 import { fetchInvoicingSubscriptionDetail } from './editInvoicingSubscriptionDetailViewReducer';
 import { fetchInvoicingSubscriptionFormPage } from './editInvoicingSubscriptionDetailViewReducer';
 /**
@@ -15,7 +16,13 @@ import { fetchInvoicingSubscriptionFormPage } from './editInvoicingSubscriptionD
 export const fetchInvoicingSubscriptionFormPageEpic = (actions$) => actions$.pipe(filter(fetchInvoicingSubscriptionFormPage.match), mergeMap((action) => {
     const { subscriptionId } = action.payload;
     const pageActions = [
-        fetchInvoicingCustomerList({ filters: {}, keepExistingListItems: false }),
+        // The customer picker filters the unfiltered `all` cache client-side.
+        fetchInvoicingCustomerList({
+            fetchAll: true,
+            filters: {},
+            keepExistingListItems: false,
+            tabId: INVOICING_LIST_ALL_TAB,
+        }),
         // Plans only: the form's plan picker is the one consumer, and an
         // unfiltered list would replace the store's plans with every catalog
         // item.

package/lib/esm/view/invoicing/invoicingCustomerListView/epics/fetchInvoicingCustomerListEpic.js

@@ -30,21 +30,33 @@ export const fetchInvoicingCustomerListEpic = (actions$, state$, zeniAPI) => act
 // Per tab: a newer fetch of the same tab replaces its in-flight one, while
 // another tab's request keeps running and lands in its own cache.
 groupBy(({ tabId }) => tabId), mergeMap((tabFetches$) => tabFetches$.pipe(switchMap(({ action, tabId }) => {
-    const { filters, cursor, keepExistingListItems, sort } = action.payload;
+    const { filters, cursor, fetchAll, keepExistingListItems, sort } = action.payload;
     const apiUrl = withQuery(`${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0/customers`, buildQuery(filters, cursor, sort, invoicingListStatusParam(tabId)));
     return zeniAPI.getJSON(apiUrl).pipe(switchMap((response) => {
         if (isSuccessResponse(response)) {
             const items = response.data?.items ?? [];
-            return [
+            const nextCursor = response.data?.next_cursor ?? null;
+            const pageActions = [
                 updateInvoicingCustomers(items, 'merge'),
                 updateAddresses(extractInvoicingCustomerAddresses(items)),
                 updateInvoicingCustomerList({
                     ids: items.map((item) => item.id),
-                    nextCursor: response.data?.next_cursor ?? null,
+                    nextCursor,
                     keepExistingListItems,
                     tabId,
                 }),
             ];
+            if (fetchAll && nextCursor != null && nextCursor !== cursor) {
+                pageActions.push(fetchInvoicingCustomerList({
+                    cursor: nextCursor,
+                    fetchAll,
+                    filters,
+                    keepExistingListItems: true,
+                    sort,
+                    tabId,
+                }));
+            }
+            return pageActions;
         }
         return of(updateInvoicingCustomerListFailure({
             status: response.status,

package/lib/esm/view/invoicing/invoicingCustomerListView/invoicingCustomerListViewReducer.js

@@ -24,6 +24,7 @@ const invoicingCustomerListView = createSlice({
                     payload: {
                         filters: payload.filters ?? {},
                         cursor: payload.cursor,
+                        fetchAll: payload.fetchAll ?? false,
                         keepExistingListItems: payload.keepExistingListItems ?? false,
                         sort: payload.sort,
                         tabId: payload.tabId,

package/lib/esm/view/invoicing/invoicingCustomerListView/invoicingCustomerListViewSelector.js

@@ -41,3 +41,5 @@ export const getInvoicingCustomerListView = createSelector((state) => state.invo
  * view so they never narrow to whichever tab the customers list was left on.
  */
 export const getInvoicingAllCustomers = (state) => getInvoicingCustomersByIds(state.invoicingCustomerState, getInvoicingListTab(state.invoicingCustomerListViewState.byTab, INVOICING_LIST_ALL_TAB).ids);
+/** True while the pickers' customer list is still loading pages. */
+export const isInvoicingAllCustomersLoading = (state) => getInvoicingListTab(state.invoicingCustomerListViewState.byTab, INVOICING_LIST_ALL_TAB).fetchState === 'In-Progress';

package/lib/esm/view/netBurnOrIncomeStoryCard/netBurnOrIncomeStoryCardSelector.js

@@ -5,12 +5,9 @@ import { getCurrentTenant } from '../../entity/tenant/tenantSelector';
 import { defaultPeriods } from '../netBurnOrIncome/netBurnOrIncomeReducer';
 import { ALL_ACCOUNTING_METHODS, toAccountingMethod, } from './netBurnOrIncomeStoryCardSelectorTypes';
 import { ALL_TIME_SPAN_IDS_FOR_AVERAGE, } from './netBurnOrIncomeStoryCardState';
-export const getNetBurnOrIncomeStoryCardReport = createSelector((state) => state, (rootState) => {
-    const { netBurnOrIncomeStoryCardState, netBurnOrIncomeState } = rootState;
+export const getNetBurnOrIncomeStoryCardReport = createSelector((state) => state.netBurnOrIncomeStoryCardState, (state) => state.netBurnOrIncomeState.netBurnOrIncome.firstMonthOfFY, getCurrentTenant, (netBurnOrIncomeStoryCardState, firstMonthOfFY, currentTenant) => {
     const { opExCash, ebitda, netIncome, runwayCash, runwayEbitda, runwayNetIncome, reportId, reportTitle, version, status, fetchState, error, updateStatus, } = netBurnOrIncomeStoryCardState;
-    const { firstMonthOfFY } = netBurnOrIncomeState.netBurnOrIncome;
     const filter = newBalancesFilter(firstMonthOfFY, 'month', defaultPeriods.numberOfPeriods, undefined, 'ascending_date');
-    const currentTenant = getCurrentTenant(rootState);
     const selectedAccountingMethod = currentTenant?.netBurnSettings?.accountingMethod;
     const timeSpanIdForAverage = currentTenant?.netBurnSettings?.timeSpanIdForAverage;
     let netBurnOrIncomeBalances;

package/lib/esm/view/opEx/opExSelector.js

@@ -58,7 +58,7 @@ export const getOperatingExpensesUIState = createSelector((state) => state.opExS
         reportFormat,
     };
 });
-const getOpExBalancesInTimeFrame = createSelector((state) => state.opExState, (state) => state.sectionAccountsViewState, (_state, readCustomRangeSlot) => readCustomRangeSlot === true, (opExState, sectionState, readCustomRangeSlot) => {
+function getOpExBalancesInTimeFrame(opExState, sectionState, readCustomRangeSlot) {
     // Custom detail reads its own section-accounts slot so a default fetch can't
     // overwrite the partial-period data; the dashboard reads the default slot.
     const reportId = reportIdUniqueKey(undefined, readCustomRangeSlot && opExState.uiState.customTimeframe != null);
@@ -73,8 +73,8 @@ const getOpExBalancesInTimeFrame = createSelector((state) => state.opExState, (s
         return incomeOrExpenseBalances.balances;
     }
     return [];
-});
-export const getOperatingExpensesReport = createSelector((state) => state, (state) => state.accountState, (state) => state.accountGroupState, (state) => state.sectionAccountsViewState, (state) => state.opExState, (state) => state.forecastState, (state) => state.forecastListState, (_state, filter) => filter, (_state, _filter, forecastId) => forecastId, (_state, _filter, _forecastId, readCustomRangeSlot) => readCustomRangeSlot === true, (state, accountState, accountGroupState, sectionsState, opExState, forecastState, forecastListState, filter, forecastId, readCustomRangeSlot) => {
+}
+export const getOperatingExpensesReport = createSelector((state) => state.accountState, (state) => state.accountGroupState, (state) => state.sectionAccountsViewState, (state) => state.opExState, (state) => state.forecastState, (state) => state.forecastListState, (_state, filter) => filter, (_state, _filter, forecastId) => forecastId, (_state, _filter, _forecastId, readCustomRangeSlot) => readCustomRangeSlot === true, (accountState, accountGroupState, sectionsState, opExState, forecastState, forecastListState, filter, forecastId, readCustomRangeSlot) => {
     const opEx = getState(opExState, opExState.uiState.isForecastModeOn, forecastId);
     // The detail screen opts into customFetchState so its Completed check fires
     // off the custom fetch; the dashboard (no flag) reads the shared fetchState,
@@ -103,7 +103,7 @@ export const getOperatingExpensesReport = createSelector((state) => state, (stat
             }, filter);
         });
     }
-    const balancesInTimeframe = getOpExBalancesInTimeFrame(state, useCustomRange);
+    const balancesInTimeframe = getOpExBalancesInTimeFrame(opExState, sectionsState, useCustomRange);
     const allTimeframeTicks = balancesInTimeframe.map((balance) => toTimeframeTick(balance));
     const forecast = opEx.forecastId != null
         ? getForecast(forecastState, opEx.forecastId)

package/lib/view/dashboard/dashboardSelector.js

@@ -25,15 +25,18 @@ const reimbursementCardSelector_1 = require("../reimbursementCard/reimbursementC
 const revenueSelector_1 = require("../revenue/revenueSelector");
 const tasksCardSelector_1 = require("../tasksCard/tasksCardSelector");
 const topExSelector_1 = require("../topEx/topExSelector");
-const getNetBurnOrIncomeForLast4Periods = (state) => {
-    return (0, netBurnOrIncomeSelector_1.getNetBurnOrIncomeReport)(state.accountState, state.accountGroupState, state.sectionAccountsViewState, state.netBurnOrIncomeState, state.forecastState, state.forecastListState, (0, coaBalancesFilter_1.newBalancesFilter)(state.netBurnOrIncomeState.netBurnOrIncome.firstMonthOfFY, state.netBurnOrIncomeState.uiState.timeframe, 4, undefined, 'ascending_date', state.netBurnOrIncomeState.uiState.selectedAdditionalBalances));
-};
-const getOperatingExpensesForLast5Periods = (state) => {
-    return (0, opExSelector_1.getOperatingExpensesReport)(state, (0, coaBalancesFilter_1.newBalancesFilter)(state.opExState.opEx.firstMonthOfFY, state.opExState.uiState.timeframe, 5, undefined, 'ascending_date', state.opExState.uiState.selectedAdditionalBalances));
-};
-const getRevenueForLast4Periods = (state) => (0, revenueSelector_1.getRevenueReport)((0, coaBalancesFilter_1.newBalancesFilter)(state.revenueState.revenue.firstMonthOfFY, state.revenueState.uiState.timeframe, 4, undefined, 'ascending_date', state.revenueState.uiState.selectedAdditionalBalances), state.accountState, state.accountGroupState, state.sectionAccountsViewState, state.forecastListState, state.revenueState, state.forecastState);
-const getCashPositionLast5Periods = (state) => (0, cashPositionSelector_1.getCashPosition)(state.accountState, state.cashPositionState, (0, coaBalancesFilter_1.newBalancesFilter)(state.cashPositionState.firstMonthOfFY, state.cashPositionState.uiState.timeframe, 5, undefined, 'ascending_date', state.cashPositionState.uiState.selectedAdditionalBalances));
-const getCashInCashOutLast4Periods = (state) => (0, cashInCashOutSelector_1.getCashInCashOut)(state.accountState, state.accountGroupState, state.cashInCashOutState, (0, coaBalancesFilter_1.newBalancesFilter)(state.cashInCashOutState.firstMonthOfFY, state.cashInCashOutState.uiState.timeframe, 4, undefined, 'ascending_date', state.cashInCashOutState.uiState.selectedAdditionalBalances));
+// Every input must return the same reference until the slices it reads change, or getDashboard
+// rebuilds every card's balances on each dispatched action.
+const getNetBurnOrIncomeFilter = (0, toolkit_1.createSelector)((state) => state.netBurnOrIncomeState.netBurnOrIncome.firstMonthOfFY, (state) => state.netBurnOrIncomeState.uiState.timeframe, (state) => state.netBurnOrIncomeState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => (0, coaBalancesFilter_1.newBalancesFilter)(firstMonthOfFY, timeframe, 4, undefined, 'ascending_date', selectedAdditionalBalances));
+const getNetBurnOrIncomeForLast4Periods = (0, toolkit_1.createSelector)((state) => state.accountState, (state) => state.accountGroupState, (state) => state.sectionAccountsViewState, (state) => state.netBurnOrIncomeState, (state) => state.forecastState, (state) => state.forecastListState, getNetBurnOrIncomeFilter, (accountState, accountGroupState, sectionAccountsViewState, netBurnOrIncomeState, forecastState, forecastListState, filter) => (0, netBurnOrIncomeSelector_1.getNetBurnOrIncomeReport)(accountState, accountGroupState, sectionAccountsViewState, netBurnOrIncomeState, forecastState, forecastListState, filter));
+const getOperatingExpensesFilter = (0, toolkit_1.createSelector)((state) => state.opExState.opEx.firstMonthOfFY, (state) => state.opExState.uiState.timeframe, (state) => state.opExState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => (0, coaBalancesFilter_1.newBalancesFilter)(firstMonthOfFY, timeframe, 5, undefined, 'ascending_date', selectedAdditionalBalances));
+const getOperatingExpensesForLast5Periods = (state) => (0, opExSelector_1.getOperatingExpensesReport)(state, getOperatingExpensesFilter(state));
+const getRevenueFilter = (0, toolkit_1.createSelector)((state) => state.revenueState.revenue.firstMonthOfFY, (state) => state.revenueState.uiState.timeframe, (state) => state.revenueState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => (0, coaBalancesFilter_1.newBalancesFilter)(firstMonthOfFY, timeframe, 4, undefined, 'ascending_date', selectedAdditionalBalances));
+const getRevenueForLast4Periods = (0, toolkit_1.createSelector)(getRevenueFilter, (state) => state.accountState, (state) => state.accountGroupState, (state) => state.sectionAccountsViewState, (state) => state.forecastListState, (state) => state.revenueState, (state) => state.forecastState, (filter, accountState, accountGroupState, sectionAccountsViewState, forecastListState, revenueState, forecastState) => (0, revenueSelector_1.getRevenueReport)(filter, accountState, accountGroupState, sectionAccountsViewState, forecastListState, revenueState, forecastState));
+const getCashPositionFilter = (0, toolkit_1.createSelector)((state) => state.cashPositionState.firstMonthOfFY, (state) => state.cashPositionState.uiState.timeframe, (state) => state.cashPositionState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => (0, coaBalancesFilter_1.newBalancesFilter)(firstMonthOfFY, timeframe, 5, undefined, 'ascending_date', selectedAdditionalBalances));
+const getCashPositionLast5Periods = (0, toolkit_1.createSelector)((state) => state.accountState, (state) => state.cashPositionState, getCashPositionFilter, (accountState, cashPositionState, filter) => (0, cashPositionSelector_1.getCashPosition)(accountState, cashPositionState, filter));
+const getCashInCashOutFilter = (0, toolkit_1.createSelector)((state) => state.cashInCashOutState.firstMonthOfFY, (state) => state.cashInCashOutState.uiState.timeframe, (state) => state.cashInCashOutState.uiState.selectedAdditionalBalances, (firstMonthOfFY, timeframe, selectedAdditionalBalances) => (0, coaBalancesFilter_1.newBalancesFilter)(firstMonthOfFY, timeframe, 4, undefined, 'ascending_date', selectedAdditionalBalances));
+const getCashInCashOutLast4Periods = (0, toolkit_1.createSelector)((state) => state.accountState, (state) => state.accountGroupState, (state) => state.cashInCashOutState, getCashInCashOutFilter, (accountState, accountGroupState, cashInCashOutState, filter) => (0, cashInCashOutSelector_1.getCashInCashOut)(accountState, accountGroupState, cashInCashOutState, filter));
 const getNetBurnOrIncomeStoryCard = (state) => (0, netBurnOrIncomeStoryCardSelector_1.getNetBurnOrIncomeStoryCardReport)(state);
 const apAgingSelector = (state) => (0, apAgingSelector_1.getApAgingReport)(state);
 const arAgingSelector = (state) => (0, arAgingSelector_1.getArAgingReport)(state);

package/lib/view/invoicing/createInvoice/createInvoiceSelector.d.ts

@@ -37,6 +37,8 @@ export interface CreateInvoiceFormView extends SelectorView {
      * Folded in here so the screen never reaches for the config view itself.
      */
     fieldHelp: InvoicingFieldHelpByCode;
+    /** More customer pages are still on their way; `customers` is partial. */
+    isCustomerListLoading: boolean;
     localData: InvoicingCreateInvoiceFormLocalData;
     planNames: InvoicingPlanNameOption[];
     products: InvoicingCatalogPricePoint[];

package/lib/view/invoicing/createInvoice/createInvoiceSelector.js

@@ -92,6 +92,7 @@ const getCreateInvoiceFormView = (state) => {
             id: customer.id,
             name: customerDisplayName(customer),
         })),
+        isCustomerListLoading: (0, invoicingCustomerListViewSelector_1.isInvoicingAllCustomersLoading)(state),
         localData: createInvoiceState.formDraft,
         planNames: getCreateInvoicePlanNames(state),
         products: (0, invoicingCatalogListViewSelector_1.getInvoicingCatalogPrices)(catalogListView.products),

package/lib/view/invoicing/createInvoice/epics/fetchCreateInvoiceFormPageEpic.js

@@ -27,13 +27,20 @@ const PICKER_PRODUCT_FILTERS = { type: 'addon|charge' };
 const fetchCreateInvoiceFormPageEpic = (actions$, state$) => actions$.pipe((0, operators_1.filter)(createInvoiceReducer_1.fetchCreateInvoiceFormPage.match), (0, operators_1.mergeMap)((action) => {
     const { cacheOverride } = action.payload;
     const state = state$.value;
-    // The customer picker reads the unfiltered `all` cache.
-    const customerTab = (0, invoicingListTabCache_1.getInvoicingListTab)(state.invoicingCustomerListViewState.byTab, invoicingListTabCache_1.INVOICING_LIST_ALL_TAB);
+    // The customer picker filters the unfiltered `all` cache client-side.
+    const customerListState = state.invoicingCustomerListViewState;
+    const customerTab = (0, invoicingListTabCache_1.getInvoicingListTab)(customerListState.byTab, invoicingListTabCache_1.INVOICING_LIST_ALL_TAB);
     const catalogState = state.invoicingCatalogListViewState;
     const settingsState = state.invoicingSettingsViewState;
     const pageActions = [];
-    if (shouldFetch({ fetchState: customerTab.fetchState, error: customerTab.error }, cacheOverride)) {
+    if ((0, invoicingListTabCache_1.shouldFetchFullInvoicingList)({
+        fetchState: customerTab.fetchState,
+        filters: customerListState.filters,
+        nextCursor: customerTab.nextCursor,
+        sort: customerListState.sort,
+    }, {}, cacheOverride)) {
         pageActions.push((0, invoicingCustomerListViewReducer_1.fetchInvoicingCustomerList)({
+            fetchAll: true,
             filters: {},
             keepExistingListItems: false,
             tabId: invoicingListTabCache_1.INVOICING_LIST_ALL_TAB,

package/lib/view/invoicing/editInvoicingSubscriptionDetailView/editInvoicingSubscriptionDetailViewSelector.d.ts

@@ -63,6 +63,8 @@ export interface InvoicingSubscriptionFormView extends SelectorView {
     /** The review dialog's cost estimate for saving this draft. */
     estimate: InvoicingSubscriptionEstimateView;
     fieldHelp: InvoicingFieldHelpByCode;
+    /** More customer pages are still on their way; `customers` is partial. */
+    isCustomerListLoading: boolean;
     /**
      * True while the subscription being edited is still on its way to the form.
      * The form holds a skeleton on this rather than mount: it seeds

package/lib/view/invoicing/editInvoicingSubscriptionDetailView/editInvoicingSubscriptionDetailViewSelector.js

@@ -290,6 +290,7 @@ const getInvoicingSubscriptionFormView = (state, invoicingSubscriptionID) => {
         charges: catalogItemOptionsOfType('charge'),
         coupons: (0, couponViewSelector_1.getInvoicingCouponListItems)(state).map(toInvoicingCouponOption),
         customers: (0, invoicingCustomerListViewSelector_1.getInvoicingAllCustomers)(state).map(toInvoicingCustomerOption),
+        isCustomerListLoading: (0, invoicingCustomerListViewSelector_1.isInvoicingAllCustomersLoading)(state),
         localData,
         mode,
         plans: planPrices.map(toInvoicingPlanOption),

package/lib/view/invoicing/editInvoicingSubscriptionDetailView/fetchInvoicingSubscriptionFormPageEpic.js

@@ -6,6 +6,7 @@ const operators_1 = require("rxjs/operators");
 const couponViewReducer_1 = require("../couponView/couponViewReducer");
 const invoicingCatalogListViewReducer_1 = require("../invoicingCatalogListView/invoicingCatalogListViewReducer");
 const invoicingCustomerListViewReducer_1 = require("../invoicingCustomerListView/invoicingCustomerListViewReducer");
+const invoicingListTabCache_1 = require("../invoicingListTabCache");
 const editInvoicingSubscriptionDetailViewReducer_1 = require("./editInvoicingSubscriptionDetailViewReducer");
 const editInvoicingSubscriptionDetailViewReducer_2 = require("./editInvoicingSubscriptionDetailViewReducer");
 /**
@@ -18,7 +19,13 @@ const editInvoicingSubscriptionDetailViewReducer_2 = require("./editInvoicingSub
 const fetchInvoicingSubscriptionFormPageEpic = (actions$) => actions$.pipe((0, operators_1.filter)(editInvoicingSubscriptionDetailViewReducer_2.fetchInvoicingSubscriptionFormPage.match), (0, operators_1.mergeMap)((action) => {
     const { subscriptionId } = action.payload;
     const pageActions = [
-        (0, invoicingCustomerListViewReducer_1.fetchInvoicingCustomerList)({ filters: {}, keepExistingListItems: false }),
+        // The customer picker filters the unfiltered `all` cache client-side.
+        (0, invoicingCustomerListViewReducer_1.fetchInvoicingCustomerList)({
+            fetchAll: true,
+            filters: {},
+            keepExistingListItems: false,
+            tabId: invoicingListTabCache_1.INVOICING_LIST_ALL_TAB,
+        }),
         // Plans only: the form's plan picker is the one consumer, and an
         // unfiltered list would replace the store's plans with every catalog
         // item.

package/lib/view/invoicing/invoicingCustomerListView/epics/fetchInvoicingCustomerListEpic.js

@@ -33,21 +33,33 @@ const fetchInvoicingCustomerListEpic = (actions$, state$, zeniAPI) => actions$.p
 // Per tab: a newer fetch of the same tab replaces its in-flight one, while
 // another tab's request keeps running and lands in its own cache.
 (0, operators_1.groupBy)(({ tabId }) => tabId), (0, operators_1.mergeMap)((tabFetches$) => tabFetches$.pipe((0, operators_1.switchMap)(({ action, tabId }) => {
-    const { filters, cursor, keepExistingListItems, sort } = action.payload;
+    const { filters, cursor, fetchAll, keepExistingListItems, sort } = action.payload;
     const apiUrl = (0, invoicingApiHelper_1.withQuery)(`${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0/customers`, buildQuery(filters, cursor, sort, (0, invoicingListTabCache_1.invoicingListStatusParam)(tabId)));
     return zeniAPI.getJSON(apiUrl).pipe((0, operators_1.switchMap)((response) => {
         if ((0, responsePayload_1.isSuccessResponse)(response)) {
             const items = response.data?.items ?? [];
-            return [
+            const nextCursor = response.data?.next_cursor ?? null;
+            const pageActions = [
                 (0, invoicingCustomerReducer_1.updateInvoicingCustomers)(items, 'merge'),
                 (0, addressReducer_1.updateAddresses)((0, invoicingCustomerPayload_1.extractInvoicingCustomerAddresses)(items)),
                 (0, invoicingCustomerListViewReducer_1.updateInvoicingCustomerList)({
                     ids: items.map((item) => item.id),
-                    nextCursor: response.data?.next_cursor ?? null,
+                    nextCursor,
                     keepExistingListItems,
                     tabId,
                 }),
             ];
+            if (fetchAll && nextCursor != null && nextCursor !== cursor) {
+                pageActions.push((0, invoicingCustomerListViewReducer_1.fetchInvoicingCustomerList)({
+                    cursor: nextCursor,
+                    fetchAll,
+                    filters,
+                    keepExistingListItems: true,
+                    sort,
+                    tabId,
+                }));
+            }
+            return pageActions;
         }
         return (0, rxjs_1.of)((0, invoicingCustomerListViewReducer_1.updateInvoicingCustomerListFailure)({
             status: response.status,

package/lib/view/invoicing/invoicingCustomerListView/invoicingCustomerListViewReducer.d.ts

@@ -6,6 +6,8 @@ import { InvoicingCustomerFilters, InvoicingCustomerListViewState } from './invo
 export declare const initialState: InvoicingCustomerListViewState;
 export declare const fetchInvoicingCustomerList: import("@reduxjs/toolkit").ActionCreatorWithPreparedPayload<[payload: {
     cursor?: string;
+    /** Keep requesting the next page until the list is complete. */
+    fetchAll?: boolean;
     filters?: InvoicingCustomerFilters;
     keepExistingListItems?: boolean;
     sort?: InvoicingListSort;
@@ -14,6 +16,7 @@ export declare const fetchInvoicingCustomerList: import("@reduxjs/toolkit").Acti
 }], {
     filters: InvoicingCustomerFilters;
     cursor: string | undefined;
+    fetchAll: boolean;
     keepExistingListItems: boolean;
     sort: InvoicingListSort | undefined;
     tabId: string | undefined;

package/lib/view/invoicing/invoicingCustomerListView/invoicingCustomerListViewReducer.js

@@ -28,6 +28,7 @@ const invoicingCustomerListView = (0, toolkit_1.createSlice)({
                     payload: {
                         filters: payload.filters ?? {},
                         cursor: payload.cursor,
+                        fetchAll: payload.fetchAll ?? false,
                         keepExistingListItems: payload.keepExistingListItems ?? false,
                         sort: payload.sort,
                         tabId: payload.tabId,

package/lib/view/invoicing/invoicingCustomerListView/invoicingCustomerListViewSelector.d.ts

@@ -30,3 +30,5 @@ export declare const getInvoicingCustomerListView: (state: RootState) => Invoici
  * view so they never narrow to whichever tab the customers list was left on.
  */
 export declare const getInvoicingAllCustomers: (state: RootState) => InvoicingCustomer[];
+/** True while the pickers' customer list is still loading pages. */
+export declare const isInvoicingAllCustomersLoading: (state: RootState) => boolean;

package/lib/view/invoicing/invoicingCustomerListView/invoicingCustomerListViewSelector.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getInvoicingAllCustomers = exports.getInvoicingCustomerListView = void 0;
+exports.isInvoicingAllCustomersLoading = exports.getInvoicingAllCustomers = exports.getInvoicingCustomerListView = void 0;
 const toolkit_1 = require("@reduxjs/toolkit");
 const invoicingCustomerSelector_1 = require("../../../entity/invoicing/invoicingCustomer/invoicingCustomerSelector");
 const invoicingListTabCache_1 = require("../invoicingListTabCache");
@@ -45,3 +45,6 @@ exports.getInvoicingCustomerListView = (0, toolkit_1.createSelector)((state) =>
  */
 const getInvoicingAllCustomers = (state) => (0, invoicingCustomerSelector_1.getInvoicingCustomersByIds)(state.invoicingCustomerState, (0, invoicingListTabCache_1.getInvoicingListTab)(state.invoicingCustomerListViewState.byTab, invoicingListTabCache_1.INVOICING_LIST_ALL_TAB).ids);
 exports.getInvoicingAllCustomers = getInvoicingAllCustomers;
+/** True while the pickers' customer list is still loading pages. */
+const isInvoicingAllCustomersLoading = (state) => (0, invoicingListTabCache_1.getInvoicingListTab)(state.invoicingCustomerListViewState.byTab, invoicingListTabCache_1.INVOICING_LIST_ALL_TAB).fetchState === 'In-Progress';
+exports.isInvoicingAllCustomersLoading = isInvoicingAllCustomersLoading;

package/lib/view/netBurnOrIncomeStoryCard/netBurnOrIncomeStoryCardSelector.js

@@ -8,12 +8,9 @@ const tenantSelector_1 = require("../../entity/tenant/tenantSelector");
 const netBurnOrIncomeReducer_1 = require("../netBurnOrIncome/netBurnOrIncomeReducer");
 const netBurnOrIncomeStoryCardSelectorTypes_1 = require("./netBurnOrIncomeStoryCardSelectorTypes");
 const netBurnOrIncomeStoryCardState_1 = require("./netBurnOrIncomeStoryCardState");
-exports.getNetBurnOrIncomeStoryCardReport = (0, toolkit_1.createSelector)((state) => state, (rootState) => {
-    const { netBurnOrIncomeStoryCardState, netBurnOrIncomeState } = rootState;
+exports.getNetBurnOrIncomeStoryCardReport = (0, toolkit_1.createSelector)((state) => state.netBurnOrIncomeStoryCardState, (state) => state.netBurnOrIncomeState.netBurnOrIncome.firstMonthOfFY, tenantSelector_1.getCurrentTenant, (netBurnOrIncomeStoryCardState, firstMonthOfFY, currentTenant) => {
     const { opExCash, ebitda, netIncome, runwayCash, runwayEbitda, runwayNetIncome, reportId, reportTitle, version, status, fetchState, error, updateStatus, } = netBurnOrIncomeStoryCardState;
-    const { firstMonthOfFY } = netBurnOrIncomeState.netBurnOrIncome;
     const filter = (0, coaBalancesFilter_1.newBalancesFilter)(firstMonthOfFY, 'month', netBurnOrIncomeReducer_1.defaultPeriods.numberOfPeriods, undefined, 'ascending_date');
-    const currentTenant = (0, tenantSelector_1.getCurrentTenant)(rootState);
     const selectedAccountingMethod = currentTenant?.netBurnSettings?.accountingMethod;
     const timeSpanIdForAverage = currentTenant?.netBurnSettings?.timeSpanIdForAverage;
     let netBurnOrIncomeBalances;

package/lib/view/opEx/opExSelector.js

@@ -61,7 +61,7 @@ exports.getOperatingExpensesUIState = (0, toolkit_1.createSelector)((state) => s
         reportFormat,
     };
 });
-const getOpExBalancesInTimeFrame = (0, toolkit_1.createSelector)((state) => state.opExState, (state) => state.sectionAccountsViewState, (_state, readCustomRangeSlot) => readCustomRangeSlot === true, (opExState, sectionState, readCustomRangeSlot) => {
+function getOpExBalancesInTimeFrame(opExState, sectionState, readCustomRangeSlot) {
     // Custom detail reads its own section-accounts slot so a default fetch can't
     // overwrite the partial-period data; the dashboard reads the default slot.
     const reportId = (0, opExForTimeFrameEpic_1.reportIdUniqueKey)(undefined, readCustomRangeSlot && opExState.uiState.customTimeframe != null);
@@ -76,8 +76,8 @@ const getOpExBalancesInTimeFrame = (0, toolkit_1.createSelector)((state) => stat
         return incomeOrExpenseBalances.balances;
     }
     return [];
-});
-exports.getOperatingExpensesReport = (0, toolkit_1.createSelector)((state) => state, (state) => state.accountState, (state) => state.accountGroupState, (state) => state.sectionAccountsViewState, (state) => state.opExState, (state) => state.forecastState, (state) => state.forecastListState, (_state, filter) => filter, (_state, _filter, forecastId) => forecastId, (_state, _filter, _forecastId, readCustomRangeSlot) => readCustomRangeSlot === true, (state, accountState, accountGroupState, sectionsState, opExState, forecastState, forecastListState, filter, forecastId, readCustomRangeSlot) => {
+}
+exports.getOperatingExpensesReport = (0, toolkit_1.createSelector)((state) => state.accountState, (state) => state.accountGroupState, (state) => state.sectionAccountsViewState, (state) => state.opExState, (state) => state.forecastState, (state) => state.forecastListState, (_state, filter) => filter, (_state, _filter, forecastId) => forecastId, (_state, _filter, _forecastId, readCustomRangeSlot) => readCustomRangeSlot === true, (accountState, accountGroupState, sectionsState, opExState, forecastState, forecastListState, filter, forecastId, readCustomRangeSlot) => {
     const opEx = (0, opExReducer_1.getState)(opExState, opExState.uiState.isForecastModeOn, forecastId);
     // The detail screen opts into customFetchState so its Completed check fires
     // off the custom fetch; the dashboard (no flag) reads the shared fetchState,
@@ -106,7 +106,7 @@ exports.getOperatingExpensesReport = (0, toolkit_1.createSelector)((state) => st
             }, filter);
         });
     }
-    const balancesInTimeframe = getOpExBalancesInTimeFrame(state, useCustomRange);
+    const balancesInTimeframe = getOpExBalancesInTimeFrame(opExState, sectionsState, useCustomRange);
     const allTimeframeTicks = balancesInTimeframe.map((balance) => (0, timeframeTick_1.toTimeframeTick)(balance));
     const forecast = opEx.forecastId != null
         ? (0, forecastSelector_1.getForecast)(forecastState, opEx.forecastId)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeniai/client-epic-state",
-  "version": "5.3.22",
+  "version": "5.3.24-betaAK1",
   "description": "Shared module between Web & Mobile containing required abstractions for state management, async network communication. ",
   "main": "lib/index.js",
   "module": "lib/esm/index.js",