@zeniai/client-epic-state 5.2.41-beta5MM → 5.2.41-beta7MM

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

@@ -1,10 +1,12 @@
 import { reduceAllFetchState } from '../../../commonStateTypes/reduceFetchState';
+import { getAddressByAddressId } from '../../../entity/address/addressSelector';
 import { getInvoicingSubscriptionById } from '../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionSelector';
 import { getFormattedAddress } from '../../addressView/addressViewSelector';
 import { getInvoicingCouponListItems } from '../couponView/couponViewSelector';
 import { getInvoicingCatalogListView, getInvoicingCatalogPrices, } from '../invoicingCatalogListView/invoicingCatalogListViewSelector';
 import { getInvoicingConfigView, invoicingFieldHelpForGroup, } from '../invoicingConfigView/invoicingConfigViewSelector';
 import { getInvoicingCustomerListView } from '../invoicingCustomerListView/invoicingCustomerListViewSelector';
+import { getInvoicingFormDraftLocalData, isInvoicingFormDraftPending, } from '../invoicingFormDraft';
 import { initialInvoicingSubscriptionFormLocalData } from './invoicingSubscriptionFormConfig';
 import { INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE } from './invoicingSubscriptionFormConfig';
 export const getEditInvoicingSubscriptionDetailViewState = (state, invoicingSubscriptionID) => {
@@ -23,6 +25,129 @@ export const getEditInvoicingSubscriptionDetailViewState = (state, invoicingSubs
         version: 1.0,
     };
 };
+/**
+ * Whether the shipping address entered on the Address screen is a change the
+ * subscription has not saved. Presence alone cannot say so: the detail page seeds
+ * the address store with the saved address on load so the Address screen opens
+ * prefilled. Only a pending address that differs from the saved one — or one
+ * where nothing is saved yet — is an unsaved change. Compared on what the user
+ * enters; a saved address's coordinates and timestamps are left out.
+ */
+const isShippingAddressUnsaved = (state, id, savedShippingAddressId) => {
+    // The slot is keyed by address type alone; only a draft this subscription owns counts.
+    if (id == null ||
+        state.editInvoicingSubscriptionDetailViewState.shippingAddressOwnerId !== id) {
+        return false;
+    }
+    const pending = state.addressViewState.newAddressState?.[INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE]?.addressToCreate;
+    if (pending == null) {
+        return false;
+    }
+    const saved = savedShippingAddressId != null
+        ? getAddressByAddressId(state.addressState, savedShippingAddressId)
+        : undefined;
+    if (saved == null) {
+        return true;
+    }
+    return !(pending.street.join('\u0000') === saved.street.join('\u0000') &&
+        pending.city === saved.city &&
+        pending.state === saved.state &&
+        pending.postalCode === saved.postalCode &&
+        pending.country === saved.country &&
+        (pending.countryCode ?? '') === (saved.countryCode ?? ''));
+};
+/**
+ * The add-ons / one-time charges a plan actually accepts.
+ *
+ * A catalog item is either `restricted` — it names the item ids it may be
+ * subscribed alongside in `applicableItems` — or unrestricted, in which case
+ * every item is fair game. Matching is on `itemID` (the catalog item the price
+ * row was flattened from), not the price code, because applicability is
+ * declared item-to-item.
+ *
+ * Fails open where the rule is unknown: no plan selected yet, a plan that is
+ * not `restricted`, or a `restricted` plan whose allow-list never came down all
+ * return the full list. The create/update endpoint rejects a disallowed item
+ * with a 422 regardless, so offering one too many costs a server error the user
+ * already gets today, where hiding one too few makes a legitimate add-on
+ * unreachable with nothing on screen to explain why.
+ *
+ * An allow-list that arrived *empty* is not unknown — a restricted item is
+ * saved with `applicable_items: []` when nothing was picked — so that narrows
+ * to nothing, as the server does.
+ *
+ * Lives here rather than in a screen so the create/edit form and the detail
+ * page's inline edit narrow their pickers by the same rule.
+ */
+export const getInvoicingItemsAllowedForPlan = (products, plan) => {
+    const allowedItemIDs = plan?.applicableItems;
+    if (plan?.itemApplicability !== 'restricted' || allowedItemIDs == null) {
+        return products;
+    }
+    return products.filter((product) => product.itemID != null && allowedItemIDs.includes(product.itemID));
+};
+/**
+ * A price row can only be subscribed by its price code, so one without a code
+ * is not an option the form can offer.
+ */
+const hasInvoicingPriceCode = (product) => product.priceCode != null && product.priceCode.trim() !== '';
+/**
+ * `displayPrice` is the service-computed single-unit amount. Tiered, volume and
+ * stairstep price points store `price` as `0` because the money lives in their
+ * tiers, so `price` is only a fallback for responses predating `displayPrice`.
+ */
+const invoicingUnitPrice = (product) => product.displayPrice ?? product.price;
+const toInvoicingPlanOption = (plan) => ({
+    billingCycles: plan.billingCycles,
+    // The price point's own cadence: the backend derives billing period from the
+    // price point and rejects a subscription that claims a different one.
+    billingPeriod: plan.period,
+    billingPeriodUnit: plan.periodUnit,
+    label: plan.name ?? plan.id,
+    price: invoicingUnitPrice(plan),
+    productCode: plan.productCode,
+    trialPeriod: plan.trialPeriod,
+    trialPeriodUnit: plan.trialPeriodUnit,
+    value: plan.priceCode,
+});
+const toInvoicingCatalogItemOption = (product) => ({
+    // A one-time charge has no cadence, so its price is quoted flat rather than
+    // per period.
+    billingPeriodUnit: product.itemType === 'charge' ? undefined : product.periodUnit,
+    label: product.name ?? product.id,
+    price: invoicingUnitPrice(product),
+    productCode: product.productCode,
+    value: product.priceCode,
+});
+const toInvoicingCouponOption = (coupon) => ({
+    label: coupon.name ?? coupon.couponCode ?? coupon.id,
+    // Create/apply/remove coupon APIs resolve by coupon_code.
+    value: coupon.couponCode ?? coupon.id,
+});
+/**
+ * Company first, then the person's name, then the email — whichever the
+ * customer actually has. The id is the last resort so a record with no
+ * identifying field at all is still selectable rather than a blank row.
+ */
+const invoicingCustomerDisplayName = (customer) => {
+    const fullName = [customer.firstName, customer.lastName]
+        .filter((part) => part != null && part.trim() !== '')
+        .join(' ')
+        .trim();
+    const company = customer.company?.trim() ?? '';
+    const email = customer.email?.trim() ?? '';
+    return company !== ''
+        ? company
+        : fullName !== ''
+            ? fullName
+            : email !== ''
+                ? email
+                : customer.id;
+};
+const toInvoicingCustomerOption = (customer) => ({
+    label: invoicingCustomerDisplayName(customer),
+    value: customer.id,
+});
 export const getInvoicingSubscriptionFormView = (state, invoicingSubscriptionID) => {
     const { editDraftById, error, fetchState, newSubscriptionDraft, savedSubscriptionId, } = state.editInvoicingSubscriptionDetailViewState;
     const mode = invoicingSubscriptionID != null ? 'edit' : 'create';
@@ -33,8 +158,7 @@ export const getInvoicingSubscriptionFormView = (state, invoicingSubscriptionID)
     // `seedInvoicingSubscriptionFormDraftEpic` when the detail load lands. Until
     // then the page is showing its skeleton.
     const localData = invoicingSubscriptionID != null
-        ? (editDraftById[invoicingSubscriptionID] ??
-            initialInvoicingSubscriptionFormLocalData)
+        ? getInvoicingFormDraftLocalData(editDraftById, invoicingSubscriptionID, initialInvoicingSubscriptionFormLocalData)
         : newSubscriptionDraft;
     // Shipping address is captured via the shared Address screen and seeded there
     // (looked up in the shared address store by `shippingAddressId`) on detail
@@ -43,9 +167,17 @@ export const getInvoicingSubscriptionFormView = (state, invoicingSubscriptionID)
     const shippingAddressLabel = newAddress?.addressToCreate != null
         ? getFormattedAddress(newAddress.addressToCreate)
         : undefined;
+    const hasUnsavedShippingAddress = isShippingAddressUnsaved(state, invoicingSubscriptionID, subscription?.shippingAddressId);
     const catalogListView = getInvoicingCatalogListView(state);
-    const planPrices = getInvoicingCatalogPrices(catalogListView.plans);
-    const addonAndChargePrices = getInvoicingCatalogPrices(catalogListView.products);
+    const planPrices = getInvoicingCatalogPrices(catalogListView.plans).filter(hasInvoicingPriceCode);
+    // A restricted plan names the catalog items it may be sold with, so the
+    // pickers offer only those: subscription create rejects the rest with a 422,
+    // and an option that can only fail is not a choice. The applicability rides
+    // on the price rows already in the store, so this is a join, not a refetch.
+    const allowedCatalogPrices = getInvoicingItemsAllowedForPlan(getInvoicingCatalogPrices(catalogListView.products), planPrices.find((plan) => plan.priceCode === localData.planPriceCode)).filter(hasInvoicingPriceCode);
+    const catalogItemOptionsOfType = (itemType) => allowedCatalogPrices
+        .filter((product) => product.itemType === itemType)
+        .map(toInvoicingCatalogItemOption);
     // In create mode there is nothing to load, so the record state only applies
     // when editing an existing subscription.
     const recordState = invoicingSubscriptionID != null
@@ -65,15 +197,18 @@ export const getInvoicingSubscriptionFormView = (state, invoicingSubscriptionID)
         subscriptionLifecycleActionOptions: configState.subscriptionLifecycleActionOptions,
         subscriptionMetadataEditAllowedFromStatuses: configState.subscriptionMetadataEditAllowedFromStatuses,
         recordState,
+        isFormLoading: isInvoicingFormDraftPending(editDraftById, invoicingSubscriptionID),
         fieldHelp: invoicingFieldHelpForGroup(state, 'subscription'),
-        coupons: getInvoicingCouponListItems(state),
-        customers: getInvoicingCustomerListView(state).customers,
+        addons: catalogItemOptionsOfType('addon'),
+        charges: catalogItemOptionsOfType('charge'),
+        coupons: getInvoicingCouponListItems(state).map(toInvoicingCouponOption),
+        customers: getInvoicingCustomerListView(state).customers.map(toInvoicingCustomerOption),
         localData,
         mode,
-        plans: planPrices,
-        products: addonAndChargePrices,
+        plans: planPrices.map(toInvoicingPlanOption),
         savedSubscriptionId,
         shippingAddressLabel,
+        hasUnsavedShippingAddress,
         subscription,
         fetchState,
         error,

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

@@ -16,8 +16,11 @@ export const fetchInvoicingSubscriptionFormPageEpic = (actions$) => actions$.pip
     const { subscriptionId } = action.payload;
     const pageActions = [
         fetchInvoicingCustomerList({ filters: {}, keepExistingListItems: false }),
+        // 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.
         fetchInvoicingCatalogPlanList({
-            filters: {},
+            filters: { type: 'plan' },
             keepExistingListItems: false,
         }),
         fetchInvoicingCouponList({ filters: {}, keepExistingListItems: false }),

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

@@ -1,36 +1,62 @@
-import { EMPTY, of } from 'rxjs';
+import { EMPTY, from } from 'rxjs';
 import { filter, mergeMap } from 'rxjs/operators';
 import { getAddressByAddressId } from '../../../entity/address/addressSelector';
 import { getInvoicingSubscriptionById } from '../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionSelector';
-import { newAddressInLocalStore } from '../../addressView/addressViewReducer';
-import { updateInvoicingSubscriptionDetail } from './editInvoicingSubscriptionDetailViewReducer';
-import { initializeInvoicingSubscriptionAddress } from './editInvoicingSubscriptionDetailViewReducer';
+import { newAddressInLocalStore, removeNewAddressDataInLocalStore, } from '../../addressView/addressViewReducer';
+import { claimInvoicingSubscriptionShippingAddress, fetchInvoicingSubscriptionDetail, fetchInvoicingSubscriptionDetailPage, initializeInvoicingSubscriptionAddress, updateInvoicingSubscriptionDetail, } from './editInvoicingSubscriptionDetailViewReducer';
 import { INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE } from './invoicingSubscriptionFormConfig';
 /**
- * Seed the shared Address screen with an existing subscription's saved shipping
- * address (looked up in the shared address store by `shippingAddressId`, same as
- * the customer billing-address flow).
- * Runs both when the subscription detail loads and on an explicit initialize
- * trigger. Skips when an in-progress draft already exists, so an address the
- * user just entered survives navigating between the form and the Address screen.
- * Mirrors `initializeInvoicingCustomerAddressEpic`.
+ * Seed the shared Address screen with the subscription's saved shipping address, and
+ * record that the slot is this subscription's. Runs when a detail request is issued
+ * (every path that loads a record issues one — the detail page when not cached,
+ * the create/edit form always), when the page opens, when the detail load
+ * lands, and on an explicit initialize trigger.
+ *
+ * The address store slot is keyed by address type alone, so it can still hold
+ * another subscription's draft. Only a draft this subscription owns is left alone —
+ * that is what lets an address the user just entered survive a trip to the
+ * Address screen. Anything else is replaced by this subscription's saved address,
+ * or cleared when it has none. Opening the page counts as a trigger because a
+ * record already loaded this session issues no detail request at all.
  */
 export const initializeInvoicingSubscriptionAddressEpic = (actions$, state$) => actions$.pipe(filter((action) => initializeInvoicingSubscriptionAddress.match(action) ||
-    updateInvoicingSubscriptionDetail.match(action)), mergeMap((action) => {
+    updateInvoicingSubscriptionDetail.match(action) ||
+    fetchInvoicingSubscriptionDetailPage.match(action) ||
+    fetchInvoicingSubscriptionDetail.match(action)), mergeMap((action) => {
     const { id } = action.payload;
+    if (id == null) {
+        return EMPTY;
+    }
     const rootState = state$.value;
-    const existingDraft = rootState.addressViewState.newAddressState?.[INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE]?.addressToCreate;
-    if (existingDraft != null || id == null) {
+    const pending = rootState.addressViewState.newAddressState?.[INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE]?.addressToCreate;
+    const ownerId = rootState.editInvoicingSubscriptionDetailViewState
+        .shippingAddressOwnerId;
+    // A detail response speaks for the record it loaded, which may no longer
+    // be the one on screen: its request keeps running when the user moves on
+    // to a cached record, which issues no request of its own to cancel it.
+    // Only the page-open and explicit triggers define the current record.
+    if (updateInvoicingSubscriptionDetail.match(action) &&
+        ownerId != null &&
+        ownerId !== id) {
+        return EMPTY;
+    }
+    if (pending != null && ownerId === id) {
         return EMPTY;
     }
     const subscription = getInvoicingSubscriptionById(rootState.invoicingSubscriptionState, id);
     const address = subscription?.shippingAddressId != null
         ? getAddressByAddressId(rootState.addressState, subscription.shippingAddressId)
         : undefined;
-    return address != null
-        ? of(newAddressInLocalStore({
+    const actions = [];
+    if (address != null) {
+        actions.push(newAddressInLocalStore({
             addressType: INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE,
             addressToCreate: address,
-        }))
-        : EMPTY;
+        }));
+    }
+    else if (pending != null) {
+        actions.push(removeNewAddressDataInLocalStore(INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE));
+    }
+    actions.push(claimInvoicingSubscriptionShippingAddress({ id }));
+    return from(actions);
 }));

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

@@ -17,7 +17,7 @@ export const saveInvoicingSubscriptionEpic = (actions$, state$, zeniAPI) => acti
     const rootState = state$.value;
     const viewState = rootState.editInvoicingSubscriptionDetailViewState;
     const localData = (id != null
-        ? viewState.editDraftById[id]
+        ? viewState.editDraftById[id]?.localData
         : viewState.newSubscriptionDraft) ?? viewState.newSubscriptionDraft;
     // Shipping address captured via the shared Address screen is sent as an
     // object in the payload (same pattern as the customer save flow).

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

@@ -1,17 +1,38 @@
 import { EMPTY, of } from 'rxjs';
 import { filter, mergeMap, withLatestFrom } from 'rxjs/operators';
-import { seedInvoicingSubscriptionFormDraft, updateInvoicingSubscriptionDetail, } from './editInvoicingSubscriptionDetailViewReducer';
+import { fetchInvoicingSubscriptionFormPage, seedInvoicingSubscriptionFormDraft, updateInvoicingSubscriptionDetail, } from './editInvoicingSubscriptionDetailViewReducer';
 import { getInvoicingSubscriptionById } from './invoicingSubscriptionDetailHelper';
 import { entityToInvoicingSubscriptionFormLocalData } from './invoicingSubscriptionFormConfig';
 /**
- * Seeds the edit draft from the record the moment the detail fetch lands, so
- * the form has its values before it mounts. The reducer ignores the seed when a
- * draft already exists, which is what stops a background refetch from
- * overwriting edits in progress.
+ * Seeds the edit draft from the record, so the form has its values before it
+ * mounts. The reducer ignores a seed once the draft holds the record, which is
+ * what stops a background refetch from overwriting edits in progress.
+ *
+ * Opening the page counts as a trigger, not just the detail response: the page
+ * fetch is cache-guarded, so re-opening a form for a record already loaded this
+ * session issues no request at all — and a draft cleared in between (by a save
+ * or a cancel) would have nothing left to seed it.
  */
-export const seedInvoicingSubscriptionFormDraftEpic = (actions$, state$) => actions$.pipe(filter(updateInvoicingSubscriptionDetail.match), withLatestFrom(state$), mergeMap(([action, state]) => {
-    const { id } = action.payload;
-    const subscription = getInvoicingSubscriptionById(state, id);
+export const seedInvoicingSubscriptionFormDraftEpic = (actions$, state$) => actions$.pipe(filter((action) => updateInvoicingSubscriptionDetail.match(action) ||
+    fetchInvoicingSubscriptionFormPage.match(action)), withLatestFrom(state$), mergeMap(([action, state]) => {
+    const id = updateInvoicingSubscriptionDetail.match(action)
+        ? action.payload.id
+        : action.payload.subscriptionId;
+    if (id == null) {
+        return EMPTY;
+    }
+    // The entity alone does not say the whole record is loaded — the list
+    // endpoints merge their own list-shaped rows into the same store. Only a
+    // completed detail load does, which is also exactly when the page's
+    // cache-guarded fetch issues no request and this is the sole seed.
+    if (fetchInvoicingSubscriptionFormPage.match(action) &&
+        state.editInvoicingSubscriptionDetailViewState.recordStateById[id]
+            ?.fetchState !== 'Completed') {
+        return EMPTY;
+    }
+    // Nothing to seed from on a cold open; the detail response triggers this
+    // again once it lands.
+    const subscription = id != null ? getInvoicingSubscriptionById(state, id) : undefined;
     if (subscription == null) {
         return EMPTY;
     }

package/lib/esm/view/invoicing/invoicingCatalogListView/invoicingCatalogListViewSelector.js

@@ -2,8 +2,20 @@ import { createSelector } from '@reduxjs/toolkit';
 import { getInvoicingPlansByIds } from '../../../entity/invoicing/plan/planSelector';
 import { runningInvoicingActionId } from '../runningInvoicingActionId';
 import { INVOICING_PRODUCT_COLUMNS, } from './invoicingCatalogListViewState';
+/**
+ * Flatten catalog items into the price rows the pickers render.
+ *
+ * The parent item's `applicableItems` / `itemApplicability` are carried onto
+ * every row it produces: applicability is a property of the catalog item, not
+ * of its price points, and a row that has lost it cannot be matched against the
+ * selected plan's allow-list (see `getInvoicingItemsAllowedForPlan`). Both are
+ * written after the spread so the item's own rule wins over any stale copy a
+ * price point payload may carry.
+ */
 export const getInvoicingCatalogPrices = (items) => items.flatMap((item) => (item.subFamilies ?? []).map((subFamily) => ({
     ...subFamily,
+    applicableItems: item.applicableItems,
+    itemApplicability: item.itemApplicability,
     itemID: item.id,
     itemType: item.type ?? item.itemType,
     name: subFamily.name,

package/lib/esm/view/invoicing/invoicingDunningCaseListView/invoicingDunningCaseListViewState.js

@@ -22,11 +22,11 @@ export const INVOICING_DUNNING_CASE_COLUMNS = [
 ];
 export const ALL_INVOICING_DUNNING_CASE_TAB_IDS = [
     'all',
-    'Retrying',
-    'Scheduled',
-    'Manual Review',
-    'Paused',
-    'Resolved',
-    'Cancelled',
+    'retrying',
+    'scheduled',
+    'manual_review',
+    'paused',
+    'resolved',
+    'cancelled',
 ];
 export const toInvoicingDunningCaseTabId = (v) => stringToUnion(v, ALL_INVOICING_DUNNING_CASE_TAB_IDS);

package/lib/esm/view/invoicing/invoicingFormDraft.js

@@ -0,0 +1,78 @@
+/**
+ * The form's own write. Keeps the status: an edit on top of a seeded draft is
+ * still the record's draft, and an edit made before the record arrived must not
+ * pass for one.
+ */
+export function applyInvoicingFormDraftEdit(draftById, id, localData) {
+    draftById[id] = {
+        fetchState: draftById[id]?.fetchState ?? 'Not-Started',
+        localData,
+    };
+}
+/**
+ * Fill the draft from the loaded record, once. A second seed is ignored so a
+ * late refetch cannot overwrite edits in progress — but a draft the form wrote
+ * before the record landed is replaced, since it was never the record's.
+ */
+export function applyInvoicingFormDraftSeed(draftById, id, localData) {
+    if (draftById[id]?.fetchState === 'Completed') {
+        return;
+    }
+    draftById[id] = { fetchState: 'Completed', localData };
+}
+/**
+ * Record that the fetch failed, so the form renders instead of waiting behind a
+ * skeleton that will never resolve.
+ *
+ * Mirrors the seed: a draft holding the record is left alone, since a
+ * background refetch failing is no reason to discard it, and anything else is
+ * marked failed. A draft the form wrote before the record landed keeps its
+ * values — there is no reason to throw away what the user typed — but stops
+ * counting as still loading, and a later successful fetch can still seed it.
+ */
+export function applyInvoicingFormDraftFailure(draftById, id, blankLocalData) {
+    const existing = draftById[id];
+    if (existing == null) {
+        draftById[id] = { fetchState: 'Error', localData: blankLocalData };
+        return;
+    }
+    if (existing.fetchState === 'Completed') {
+        return;
+    }
+    existing.fetchState = 'Error';
+}
+/**
+ * The record behind this draft was just saved and is about to be refetched.
+ * Keep the values on screen — dropping them would blank the form for the round
+ * trip, and the form remounts on the response anyway — but stop counting them
+ * as the loaded record's, so that response is allowed to replace them.
+ */
+export function applyInvoicingFormDraftSaved(draftById, id) {
+    const existing = draftById[id];
+    if (existing == null) {
+        return;
+    }
+    existing.fetchState = 'Not-Started';
+}
+/** The draft's values, or the blank form when nothing is drafted yet. */
+export function getInvoicingFormDraftLocalData(draftById, id, blankLocalData) {
+    if (id == null) {
+        return blankLocalData;
+    }
+    return draftById[id]?.localData ?? blankLocalData;
+}
+/**
+ * Whether the form should still be showing its skeleton — the record has
+ * neither reached the draft nor failed trying.
+ *
+ * Settles once and stays settled, which is what keeps a later refetch from
+ * swapping a form the user is typing into back for a skeleton. Create mode
+ * (no id) has no record to wait for.
+ */
+export function isInvoicingFormDraftPending(draftById, id) {
+    if (id == null) {
+        return false;
+    }
+    const fetchState = draftById[id]?.fetchState;
+    return fetchState !== 'Completed' && fetchState !== 'Error';
+}

package/lib/esm/view/invoicing/invoicingQboView/invoicingQboViewSelector.js

@@ -1,3 +1,5 @@
+import { createSelector } from '@reduxjs/toolkit';
+import { toInvoicingQboAccountMappingSlot, } from '../../../entity/invoicing/invoicingCommonPayload';
 import { getAccountList, getNestedAccountListHierarchy, } from '../../accountList/accountListSelector';
 import { getClassList, getNestedClassListHierarchy, } from '../../classList/classListSelector';
 // The shared bucket, fetched with the same arguments as the other consumers so
@@ -82,14 +84,20 @@ export const getInvoicingCatalogAccountingLookup = (state) => ({
     classByQboId: (qboId) => invoicingQboClassByQboId(state, qboId),
 });
 /**
- * Accounts and classes as the invoicing pickers need them. Both come from the
- * shared accounting-service lists, so whatever another screen already loaded
- * is reused. `qboId` is the submitted value because that is what the invoicing
- * API stores; an account without one cannot be posted, so it is dropped rather
- * than offered.
+ * Accounts as the invoicing pickers need them, from the shared
+ * accounting-service list, so whatever another screen already loaded is reused.
+ * `qboId` is the submitted value because that is what the invoicing API stores;
+ * an account without one cannot be posted, so it is dropped rather than offered.
+ *
+ * Memoized on the two slices it reads: the pickers and the lists derived from
+ * them are handed straight to forms, and a fresh array on every store change
+ * re-seeds a form the user is editing.
  */
-const invoicingAccountingOptions = (state) => {
-    const { accounts } = getAccountList(state.accountState, state.accountListState, INVOICING_ACCOUNT_LIST_KEY);
+export const getInvoicingQboAccountOptions = createSelector([
+    (state) => state.accountState,
+    (state) => state.accountListState,
+], (accountState, accountListState) => {
+    const { accounts } = getAccountList(accountState, accountListState, INVOICING_ACCOUNT_LIST_KEY);
     return accounts.flatMap((account) => {
         if (account.qboId == null || account.isDeleted === true) {
             return [];
@@ -102,7 +110,7 @@ const invoicingAccountingOptions = (state) => {
             },
         ];
     });
-};
+});
 /**
  * Normalises an account-type name for comparison. The config's mapping kinds
  * name QuickBooks types the way QuickBooks displays them ("Other Current
@@ -138,6 +146,46 @@ export const invoicingAccountsForQboAccountTypes = (accounts, accountTypes) => {
     return accounts.filter((account) => account.accountType != null &&
         wanted.has(normalizeAccountTypeName(account.accountType)));
 };
+/**
+ * The account-mapping slot a catalog price point's income account shares with
+ * the settings page, and the one a discount's account shares with it.
+ */
+export const INVOICING_INCOME_ACCOUNT_MAPPING_SLOT = 'default_income_account';
+export const INVOICING_DISCOUNTS_ACCOUNT_MAPPING_SLOT = 'discounts_account';
+/**
+ * The account types a slot falls back to when the config carries no kind for
+ * it. QuickBooks posts a product, a price and a discount line to an income
+ * account; offering every account instead would let a save be rejected.
+ */
+export const INVOICING_DEFAULT_INCOME_ACCOUNT_TYPES = 'Income';
+/**
+ * The QuickBooks ids a mapping slot's picker may offer, from the account types
+ * the config gives that slot — so every picker filling the same slot offers the
+ * same accounts, and widening one stays a config change.
+ *
+ * Ids rather than a filtered tree: the pickers flatten the tree into options by
+ * walking each node's children, so dropping a parent that is not itself of the
+ * wanted type would drop its matching descendants with it.
+ *
+ * Matched on the slot rather than the code as written, since a config naming
+ * the kind `discounts_account_id` means the same slot. A slot the config does
+ * not carry falls back to `defaultAccountTypes` rather than to every account.
+ */
+export const invoicingQboAccountIdsForMappingSlot = (accounts, accountMappingKindOptions, mappingSlot, defaultAccountTypes) => {
+    const accountTypes = accountMappingKindOptions.find((kindOption) => toInvoicingQboAccountMappingSlot(kindOption.code) === mappingSlot)?.accountTypes ?? defaultAccountTypes;
+    return invoicingAccountsForQboAccountTypes(accounts, accountTypes).map((account) => account.id);
+};
+/**
+ * Stable empties for a tenant with no QBO connection.
+ *
+ * `?? []` builds a fresh array per call, and the invoicing forms re-seed their
+ * fields whenever their option lists change identity — so a form open against a
+ * disconnected tenant would reset itself on every unrelated store change, until
+ * the first edit disarms the re-seed.
+ */
+export const NO_INVOICING_ACCOUNT_HIERARCHY = [];
+export const NO_INVOICING_CLASS_HIERARCHY = [];
+export const NO_INVOICING_ACCOUNT_IDS = [];
 /** Classes as the invoicing pickers need them, from the shared class list. */
 const invoicingAccountingClassOptions = (state) => {
     const { classes } = getClassList(state.classState, state.classListState);
@@ -159,7 +207,7 @@ export const getInvoicingQboView = (state) => {
     const qboState = state.invoicingQboViewState;
     const accountList = state.accountListState.byReportId[INVOICING_ACCOUNT_LIST_KEY];
     return {
-        accounts: invoicingAccountingOptions(state),
+        accounts: getInvoicingQboAccountOptions(state),
         accountsFetchState: {
             fetchState: accountList.fetchState,
             error: accountList.error,

package/lib/esm/view/recommendation/recommendationPayload.js

@@ -1 +1,3 @@
-export {};
+// Only an override opens the feedback popup. Silent accepts and retractions post
+// in the background, so they must not drive the popup's loader or its toast.
+export const isPromptedRecommendationFeedback = (outcome) => outcome === 'override_outside' || outcome === 'override_ranked';

package/lib/esm/view/recommendation/recommendationReducer.js

@@ -1,7 +1,9 @@
 import { createSlice } from '@reduxjs/toolkit';
 import { clearAll } from '../../rootActions';
+import { isPromptedRecommendationFeedback, } from './recommendationPayload';
 import { getEntityRecommendationKey, initialEntityRecommendationState, } from './recommendationState';
 export const initialState = {
+    feedbackSubmitState: { fetchState: 'Not-Started', error: undefined },
     recommendationByEntity: {},
 };
 const recommendation = createSlice({
@@ -131,13 +133,31 @@ const recommendation = createSlice({
                 };
             },
         },
-        // Fire-and-forget human feedback on a recommendation (accept, ranked
-        // override or outside override). Handled by submitRecommendationFeedbackEpic
-        // which POSTs to the accounting recommendation-feedback endpoint. No state
-        // mutation: the categorization UX must not depend on the feedback round-trip.
+        // Human feedback on a recommendation (accept, ranked override or outside
+        // override). Handled by submitRecommendationFeedbackEpic, which POSTs to the
+        // accounting recommendation-feedback endpoint. The categorization itself
+        // never waits on this: only the feedback popup reads the submit state.
         submitRecommendationFeedback: {
-            reducer() {
-                // Fire-and-forget: no state mutation; the epic performs the POST.
+            reducer(draft, action) {
+                if (!isPromptedRecommendationFeedback(action.payload.outcome)) {
+                    return;
+                }
+                draft.feedbackSubmitState = {
+                    fetchState: 'In-Progress',
+                    error: undefined,
+                };
+            },
+            prepare(args) {
+                return { payload: args };
+            },
+        },
+        submitRecommendationFeedbackCompleted: {
+            reducer(draft, action) {
+                const { succeeded, error } = action.payload;
+                draft.feedbackSubmitState = {
+                    fetchState: succeeded ? 'Completed' : 'Error',
+                    error,
+                };
             },
             prepare(args) {
                 return { payload: args };
@@ -150,7 +170,7 @@ const recommendation = createSlice({
         });
     },
 });
-export const { fetchEntityRecommendationsByTransactionId, fetchEntityRecommendationsForLineUpdate, fetchRecommendationByEntityName, fetchRecommendationByEntityId, updateRecommendationForEntity, updateRecommendationForEntityFailure, indicateReadyToInitializeRecommendation, submitRecommendationFeedback, } = recommendation.actions;
+export const { fetchEntityRecommendationsByTransactionId, fetchEntityRecommendationsForLineUpdate, fetchRecommendationByEntityName, fetchRecommendationByEntityId, updateRecommendationForEntity, updateRecommendationForEntityFailure, indicateReadyToInitializeRecommendation, submitRecommendationFeedback, submitRecommendationFeedbackCompleted, } = recommendation.actions;
 export default recommendation.reducer;
 const doUpdateRecommendationForEntity = (draft, entityId, entityType, payload) => {
     const key = getEntityRecommendationKey(entityType, entityId);

package/lib/esm/view/recommendation/recommendationSelector.js

@@ -11,3 +11,4 @@ export const getRecommendationsForEntity = (state, entityId, entityType) => {
         recommendations,
     };
 };
+export const getRecommendationFeedbackSubmitState = (state) => state.entityRecommendationState.feedbackSubmitState;