@zeniai/client-epic-state 5.1.60-betaDI1 → 5.1.61-betaDI0

package/lib/view/invoicing/editInvoicingCustomerDetailView/editInvoicingCustomerDetailViewSelector.d.ts

@@ -0,0 +1,22 @@
+import { ID } from '../../../commonStateTypes/common';
+import { SelectorView } from '../../../commonStateTypes/viewAndReport/viewAndReport';
+import { RootState } from '../../../reducer';
+import { InvoicingCustomerFormLocalData } from './editInvoicingCustomerDetailViewState';
+export interface InvoicingCustomerFormView extends SelectorView {
+    customerTypeValues: string[];
+    localData: InvoicingCustomerFormLocalData;
+    mode: 'create' | 'edit';
+    netTermDayValues: string[];
+    taxabilityValues: string[];
+    billingAddressId?: ID;
+    billingAddressLabel?: string;
+    savedCustomerId?: ID;
+}
+/**
+ * Bundled view for the customer create/edit form. Exposes the draft `localData`
+ * (seeded from the existing customer entity in edit mode until the user edits),
+ * the canonical option value sets (labels resolved in web-components), the save
+ * fetch state/error, and the id of the customer last saved — so the form screen
+ * depends on this single selector.
+ */
+export declare const getInvoicingCustomerFormView: (state: RootState, invoicingCustomerID?: ID) => InvoicingCustomerFormView;

package/lib/view/invoicing/editInvoicingCustomerDetailView/editInvoicingCustomerDetailViewSelector.js

@@ -0,0 +1,46 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getInvoicingCustomerFormView = void 0;
+const invoicingCustomerSelector_1 = require("../../../entity/invoicing/invoicingCustomer/invoicingCustomerSelector");
+const addressViewSelector_1 = require("../../addressView/addressViewSelector");
+const invoicingCustomerFormConfig_1 = require("./invoicingCustomerFormConfig");
+/**
+ * Bundled view for the customer create/edit form. Exposes the draft `localData`
+ * (seeded from the existing customer entity in edit mode until the user edits),
+ * the canonical option value sets (labels resolved in web-components), the save
+ * fetch state/error, and the id of the customer last saved — so the form screen
+ * depends on this single selector.
+ */
+const getInvoicingCustomerFormView = (state, invoicingCustomerID) => {
+    const { editDraftById, error, fetchState, newCustomerDraft, savedCustomerId } = state.editInvoicingCustomerDetailViewState;
+    const mode = invoicingCustomerID != null ? 'edit' : 'create';
+    const customer = invoicingCustomerID != null
+        ? (0, invoicingCustomerSelector_1.getInvoicingCustomerById)(state.invoicingCustomerState, invoicingCustomerID)
+        : undefined;
+    const localData = invoicingCustomerID != null
+        ? (editDraftById[invoicingCustomerID] ??
+            (0, invoicingCustomerFormConfig_1.entityToInvoicingCustomerFormLocalData)(customer))
+        : newCustomerDraft;
+    // Billing address is captured via the shared Address screen and seeded there
+    // (from the address entity) on detail load, so the formatted label comes from
+    // that draft via the shared `getFormattedAddress`.
+    const newAddress = state.addressViewState.newAddressState?.[invoicingCustomerFormConfig_1.INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE];
+    const billingAddressId = newAddress?.newAddressId ?? customer?.billingAddressId;
+    const billingAddressLabel = newAddress?.addressToCreate != null
+        ? (0, addressViewSelector_1.getFormattedAddress)(newAddress.addressToCreate)
+        : undefined;
+    return {
+        customerTypeValues: [...invoicingCustomerFormConfig_1.INVOICING_CUSTOMER_TYPE_VALUES],
+        localData,
+        mode,
+        netTermDayValues: [...invoicingCustomerFormConfig_1.INVOICING_NET_TERM_DAY_VALUES],
+        taxabilityValues: [...invoicingCustomerFormConfig_1.INVOICING_TAXABILITY_VALUES],
+        billingAddressId,
+        billingAddressLabel,
+        savedCustomerId,
+        fetchState,
+        error,
+        version: 1.0,
+    };
+};
+exports.getInvoicingCustomerFormView = getInvoicingCustomerFormView;

package/lib/view/invoicing/editInvoicingCustomerDetailView/editInvoicingCustomerDetailViewState.d.ts

@@ -0,0 +1,28 @@
+import { FetchedState, ID } from '../../../commonStateTypes/common';
+/**
+ * Draft form state for the create/edit customer form. Held in CES so the form
+ * flows its data from here (mirrors the bill-pay / reimbursement pattern). The
+ * billing address is NOT part of this draft — it is captured via the shared
+ * Address screen (`addressView`) and threaded into the save payload as
+ * `billing_address_id` by the save epic.
+ */
+export interface InvoicingCustomerFormLocalData {
+    autoCollection: boolean;
+    company: string;
+    customerType: string;
+    email: string;
+    firstName: string;
+    invoiceNotes: string;
+    lastName: string;
+    netTermDays: string;
+    notes: string;
+    phone: string;
+    preferredCurrencyCode: string;
+    taxability: string;
+    vatNumber: string;
+}
+export interface EditInvoicingCustomerDetailViewState extends FetchedState {
+    editDraftById: Record<ID, InvoicingCustomerFormLocalData>;
+    newCustomerDraft: InvoicingCustomerFormLocalData;
+    savedCustomerId?: ID;
+}

package/lib/view/invoicing/editInvoicingCustomerDetailView/editInvoicingCustomerDetailViewState.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/lib/view/invoicing/editInvoicingCustomerDetailView/initializeInvoicingCustomerAddressEpic.d.ts

@@ -0,0 +1,16 @@
+import { ActionsObservable, StateObservable } from 'redux-observable';
+import { Observable } from 'rxjs';
+import { RootState } from '../../../reducer';
+import { newAddressInLocalStore } from '../../addressView/addressViewReducer';
+import { updateInvoicingCustomerDetail } from '../invoicingCustomerDetailView/invoicingCustomerDetailViewReducer';
+import { initializeInvoicingCustomerAddress } from './editInvoicingCustomerDetailViewReducer';
+export type ActionType = ReturnType<typeof initializeInvoicingCustomerAddress> | ReturnType<typeof updateInvoicingCustomerDetail> | ReturnType<typeof newAddressInLocalStore>;
+/**
+ * Seed the shared Address screen with an existing customer's saved billing
+ * address (looked up in the address entity store by `billingAddressId`). Runs
+ * both when the customer 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
+ * `initializeVendorAddressEpic`.
+ */
+export declare const initializeInvoicingCustomerAddressEpic: (actions$: ActionsObservable<ActionType>, state$: StateObservable<RootState>) => Observable<ActionType>;

package/lib/view/invoicing/editInvoicingCustomerDetailView/initializeInvoicingCustomerAddressEpic.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initializeInvoicingCustomerAddressEpic = void 0;
+const rxjs_1 = require("rxjs");
+const operators_1 = require("rxjs/operators");
+const addressSelector_1 = require("../../../entity/address/addressSelector");
+const invoicingCustomerSelector_1 = require("../../../entity/invoicing/invoicingCustomer/invoicingCustomerSelector");
+const addressViewReducer_1 = require("../../addressView/addressViewReducer");
+const invoicingCustomerDetailViewReducer_1 = require("../invoicingCustomerDetailView/invoicingCustomerDetailViewReducer");
+const editInvoicingCustomerDetailViewReducer_1 = require("./editInvoicingCustomerDetailViewReducer");
+const invoicingCustomerFormConfig_1 = require("./invoicingCustomerFormConfig");
+/**
+ * Seed the shared Address screen with an existing customer's saved billing
+ * address (looked up in the address entity store by `billingAddressId`). Runs
+ * both when the customer 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
+ * `initializeVendorAddressEpic`.
+ */
+const initializeInvoicingCustomerAddressEpic = (actions$, state$) => actions$.pipe((0, operators_1.filter)((action) => editInvoicingCustomerDetailViewReducer_1.initializeInvoicingCustomerAddress.match(action) ||
+    invoicingCustomerDetailViewReducer_1.updateInvoicingCustomerDetail.match(action)), (0, operators_1.mergeMap)((action) => {
+    const { id } = action.payload;
+    const rootState = state$.value;
+    const existingDraft = rootState.addressViewState.newAddressState?.[invoicingCustomerFormConfig_1.INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE]?.addressToCreate;
+    if (existingDraft != null || id == null) {
+        return rxjs_1.EMPTY;
+    }
+    const customer = (0, invoicingCustomerSelector_1.getInvoicingCustomerById)(rootState.invoicingCustomerState, id);
+    const address = customer?.billingAddressId != null
+        ? (0, addressSelector_1.getAddressByAddressId)(rootState.addressState, customer.billingAddressId)
+        : undefined;
+    return address != null
+        ? (0, rxjs_1.of)((0, addressViewReducer_1.newAddressInLocalStore)({
+            addressType: invoicingCustomerFormConfig_1.INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE,
+            addressToCreate: address,
+        }))
+        : rxjs_1.EMPTY;
+}));
+exports.initializeInvoicingCustomerAddressEpic = initializeInvoicingCustomerAddressEpic;

package/lib/view/invoicing/editInvoicingCustomerDetailView/invoicingCustomerFormConfig.d.ts

@@ -0,0 +1,15 @@
+import { InvoicingCustomer } from '../../../entity/invoicing/invoicingCustomer/invoicingCustomerState';
+import { InvoicingCustomerFormLocalData } from './editInvoicingCustomerDetailViewState';
+/** `AddressType` key used when the customer form opens the shared Address screen. */
+export declare const INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE: "invoicing_customer_billing_address";
+/**
+ * Canonical option value sets for the customer form. CES owns the values;
+ * web-components maps each value to a localized label (same split as the
+ * invoicing list column/tab config).
+ */
+export declare const INVOICING_CUSTOMER_TYPE_VALUES: readonly ["business", "residential"];
+export declare const INVOICING_TAXABILITY_VALUES: readonly ["taxable", "exempt"];
+export declare const INVOICING_NET_TERM_DAY_VALUES: readonly ["0", "15", "30", "45", "60"];
+export declare const initialInvoicingCustomerFormLocalData: InvoicingCustomerFormLocalData;
+/** Seed the form draft from an existing customer entity (edit mode). */
+export declare const entityToInvoicingCustomerFormLocalData: (customer?: InvoicingCustomer) => InvoicingCustomerFormLocalData;

package/lib/view/invoicing/editInvoicingCustomerDetailView/invoicingCustomerFormConfig.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.entityToInvoicingCustomerFormLocalData = exports.initialInvoicingCustomerFormLocalData = exports.INVOICING_NET_TERM_DAY_VALUES = exports.INVOICING_TAXABILITY_VALUES = exports.INVOICING_CUSTOMER_TYPE_VALUES = exports.INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE = void 0;
+/** `AddressType` key used when the customer form opens the shared Address screen. */
+exports.INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE = 'invoicing_customer_billing_address';
+/**
+ * Canonical option value sets for the customer form. CES owns the values;
+ * web-components maps each value to a localized label (same split as the
+ * invoicing list column/tab config).
+ */
+exports.INVOICING_CUSTOMER_TYPE_VALUES = [
+    'business',
+    'residential',
+];
+exports.INVOICING_TAXABILITY_VALUES = ['taxable', 'exempt'];
+exports.INVOICING_NET_TERM_DAY_VALUES = [
+    '0',
+    '15',
+    '30',
+    '45',
+    '60',
+];
+exports.initialInvoicingCustomerFormLocalData = {
+    autoCollection: true,
+    company: '',
+    customerType: 'business',
+    email: '',
+    firstName: '',
+    invoiceNotes: '',
+    lastName: '',
+    netTermDays: '30',
+    notes: '',
+    phone: '',
+    preferredCurrencyCode: 'USD',
+    taxability: 'taxable',
+    vatNumber: '',
+};
+/** Seed the form draft from an existing customer entity (edit mode). */
+const entityToInvoicingCustomerFormLocalData = (customer) => {
+    if (customer == null) {
+        return { ...exports.initialInvoicingCustomerFormLocalData };
+    }
+    return {
+        autoCollection: (customer.autoCollection ?? 'on') === 'on',
+        company: customer.company ?? '',
+        customerType: customer.customerType ?? 'business',
+        email: customer.email ?? '',
+        firstName: customer.firstName ?? '',
+        invoiceNotes: customer.invoiceNotes ?? '',
+        lastName: customer.lastName ?? '',
+        netTermDays: customer.netTermDays != null ? String(customer.netTermDays) : '30',
+        notes: customer.notes ?? '',
+        phone: customer.phone ?? '',
+        preferredCurrencyCode: customer.preferredCurrencyCode ?? 'USD',
+        taxability: customer.taxability ?? 'taxable',
+        vatNumber: customer.vatNumber ?? '',
+    };
+};
+exports.entityToInvoicingCustomerFormLocalData = entityToInvoicingCustomerFormLocalData;

package/lib/view/invoicing/editInvoicingCustomerDetailView/saveInvoicingCustomerEpic.d.ts

@@ -0,0 +1,11 @@
+import { ActionsObservable, StateObservable } from 'redux-observable';
+import { Observable } from 'rxjs';
+import { updateAddresses } from '../../../entity/address/addressReducer';
+import { updateInvoicingCustomers } from '../../../entity/invoicing/invoicingCustomer/invoicingCustomerReducer';
+import { RootState } from '../../../reducer';
+import { ZeniAPI } from '../../../zeniAPI';
+import { resetNewAddressDataInLocalStore } from '../../addressView/addressViewReducer';
+import { addInvoicingCustomerToList } from '../invoicingCustomerListView/invoicingCustomerListViewReducer';
+import { submitInvoicingCustomerForm, submitInvoicingCustomerFormFailure, submitInvoicingCustomerFormSuccess } from './editInvoicingCustomerDetailViewReducer';
+export type ActionType = ReturnType<typeof submitInvoicingCustomerForm> | ReturnType<typeof submitInvoicingCustomerFormSuccess> | ReturnType<typeof submitInvoicingCustomerFormFailure> | ReturnType<typeof resetNewAddressDataInLocalStore> | ReturnType<typeof updateAddresses> | ReturnType<typeof updateInvoicingCustomers> | ReturnType<typeof addInvoicingCustomerToList>;
+export declare const saveInvoicingCustomerEpic: (actions$: ActionsObservable<ActionType>, state$: StateObservable<RootState>, zeniAPI: ZeniAPI) => Observable<ActionType>;

package/lib/view/invoicing/editInvoicingCustomerDetailView/saveInvoicingCustomerEpic.js

@@ -0,0 +1,57 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.saveInvoicingCustomerEpic = void 0;
+const rxjs_1 = require("rxjs");
+const operators_1 = require("rxjs/operators");
+const addressReducer_1 = require("../../../entity/address/addressReducer");
+const invoicingCustomerPayload_1 = require("../../../entity/invoicing/invoicingCustomer/invoicingCustomerPayload");
+const invoicingCustomerReducer_1 = require("../../../entity/invoicing/invoicingCustomer/invoicingCustomerReducer");
+const responsePayload_1 = require("../../../responsePayload");
+const addressViewReducer_1 = require("../../addressView/addressViewReducer");
+const invoicingCustomerListViewReducer_1 = require("../invoicingCustomerListView/invoicingCustomerListViewReducer");
+const editInvoicingCustomerDetailViewPayload_1 = require("./editInvoicingCustomerDetailViewPayload");
+const editInvoicingCustomerDetailViewReducer_1 = require("./editInvoicingCustomerDetailViewReducer");
+const invoicingCustomerFormConfig_1 = require("./invoicingCustomerFormConfig");
+const saveInvoicingCustomerEpic = (actions$, state$, zeniAPI) => actions$.pipe((0, operators_1.filter)(editInvoicingCustomerDetailViewReducer_1.submitInvoicingCustomerForm.match), (0, operators_1.mergeMap)((action) => {
+    const { id } = action.payload;
+    const rootState = state$.value;
+    const viewState = rootState.editInvoicingCustomerDetailViewState;
+    const localData = (id != null
+        ? viewState.editDraftById[id]
+        : viewState.newCustomerDraft) ?? viewState.newCustomerDraft;
+    // Billing address captured via the shared Address screen is sent as an
+    // object in the payload; the backend creates it and returns its id
+    // (same pattern as the vendor save flow).
+    const billingAddress = rootState.addressViewState.newAddressState?.[invoicingCustomerFormConfig_1.INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE]?.addressToCreate;
+    const data = (0, editInvoicingCustomerDetailViewPayload_1.localDataToSaveInvoicingCustomerPayload)(localData, billingAddress);
+    const baseUrl = `${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0`;
+    const request$ = id != null
+        ? zeniAPI.putAndGetJSON(`${baseUrl}/customers/${encodeURIComponent(id)}`, { ...data })
+        : zeniAPI.postAndGetJSON(`${baseUrl}/customers`, { ...data });
+    return request$.pipe((0, operators_1.mergeMap)((response) => {
+        if ((0, responsePayload_1.isSuccessResponse)(response) && response.data != null) {
+            const resultActions = [
+                (0, invoicingCustomerReducer_1.updateInvoicingCustomers)([response.data], 'merge'),
+                (0, addressReducer_1.updateAddresses)((0, invoicingCustomerPayload_1.extractInvoicingCustomerAddresses)([response.data])),
+                (0, editInvoicingCustomerDetailViewReducer_1.submitInvoicingCustomerFormSuccess)({
+                    customerId: response.data.id,
+                }),
+                // Clear the stashed address so the next customer starts fresh.
+                (0, addressViewReducer_1.resetNewAddressDataInLocalStore)(invoicingCustomerFormConfig_1.INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE),
+            ];
+            // Create (no id): reflect the new row + tab counts in the cached
+            // customer list so the list page shows it without a refetch. Edits
+            // keep the same id/counts, so the entity merge above is enough.
+            if (id == null) {
+                resultActions.push((0, invoicingCustomerListViewReducer_1.addInvoicingCustomerToList)({
+                    id: response.data.id,
+                    status: response.data.status,
+                }));
+            }
+            return resultActions;
+        }
+        return (0, rxjs_1.of)((0, editInvoicingCustomerDetailViewReducer_1.submitInvoicingCustomerFormFailure)(response.status));
+    }), (0, operators_1.catchError)((error) => (0, rxjs_1.of)((0, editInvoicingCustomerDetailViewReducer_1.submitInvoicingCustomerFormFailure)((0, responsePayload_1.createZeniAPIStatus)('Unexpected Error', 'Save customer REST API call errored out ' +
+        JSON.stringify(error))))));
+}));
+exports.saveInvoicingCustomerEpic = saveInvoicingCustomerEpic;

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

@@ -0,0 +1,11 @@
+import { InvoicingSubscriptionPayload } from '../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionPayload';
+import { ZeniAPIResponse } from '../../../responsePayload';
+import { AddressUpdatableInfo } from '../../addressView/addressViewState';
+import { InvoicingSubscriptionFormLocalData } from './editInvoicingSubscriptionDetailViewState';
+export type SaveInvoicingSubscriptionResponse = ZeniAPIResponse<InvoicingSubscriptionPayload>;
+/**
+ * Build the create/update subscription request body from the form draft. The
+ * shipping address is sent as an object (captured via the shared Address
+ * screen); the backend persists it — same pattern as the customer save flow.
+ */
+export declare const localDataToSaveInvoicingSubscriptionPayload: (localData: InvoicingSubscriptionFormLocalData, shippingAddress?: AddressUpdatableInfo) => Record<string, unknown>;

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

@@ -0,0 +1,52 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.localDataToSaveInvoicingSubscriptionPayload = void 0;
+const addressViewPayload_1 = require("../../addressView/addressViewPayload");
+const invoicingSubscriptionFormConfig_1 = require("./invoicingSubscriptionFormConfig");
+/**
+ * Build the create/update subscription request body from the form draft. The
+ * shipping address is sent as an object (captured via the shared Address
+ * screen); the backend persists it — same pattern as the customer save flow.
+ */
+const localDataToSaveInvoicingSubscriptionPayload = (localData, shippingAddress) => {
+    const frequency = (0, invoicingSubscriptionFormConfig_1.billingFrequencyToPeriod)(localData.billingFrequency);
+    const items = [
+        {
+            item_price_code: localData.planPriceCode,
+            item_type: 'plan',
+            quantity: Math.max(1, localData.planQuantity || 1),
+        },
+        ...localData.addonPriceCodes.map((priceCode) => ({
+            item_price_code: priceCode,
+            item_type: 'addon',
+            quantity: 1,
+        })),
+        ...localData.chargePriceCodes.map((priceCode) => ({
+            item_price_code: priceCode,
+            item_type: 'charge',
+            quantity: 1,
+        })),
+    ];
+    const setupFee = localData.setupFee.trim();
+    const parsedSetupFee = Number.parseFloat(setupFee);
+    const poNumber = localData.poNumber.trim();
+    const trialEnd = localData.trialEnd.trim();
+    return {
+        auto_collection: localData.autoCollection ? 'on' : 'off',
+        billing_period: frequency.period,
+        billing_period_unit: frequency.unit,
+        currency_code: localData.preferredCurrencyCode,
+        customer_id: localData.customerId,
+        subscription_items: items,
+        ...(setupFee !== '' && !Number.isNaN(parsedSetupFee)
+            ? { setup_fee: parsedSetupFee }
+            : {}),
+        ...(poNumber !== '' ? { po_number: poNumber } : {}),
+        ...(trialEnd !== '' ? { trial_end: trialEnd } : {}),
+        ...(localData.couponId !== '' ? { coupon_ids: [localData.couponId] } : {}),
+        ...(shippingAddress != null
+            ? { shipping_address: (0, addressViewPayload_1.toAddressUpdatableInfoPayload)(shippingAddress) }
+            : {}),
+    };
+};
+exports.localDataToSaveInvoicingSubscriptionPayload = localDataToSaveInvoicingSubscriptionPayload;

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

@@ -0,0 +1,32 @@
+import { ID } from '../../../commonStateTypes/common';
+import { ZeniAPIStatus } from '../../../responsePayload';
+import { EditInvoicingSubscriptionDetailViewState, InvoicingSubscriptionFormLocalData } from './editInvoicingSubscriptionDetailViewState';
+/** Push the full form draft into CES (edit tree when `id` is present). */
+export interface UpdateInvoicingSubscriptionFormDraftPayload {
+    localData: InvoicingSubscriptionFormLocalData;
+    id?: ID;
+}
+/** Trigger create (no id) / update (with id) from the stored draft. */
+export interface SubmitInvoicingSubscriptionFormPayload {
+    id?: ID;
+}
+/** Trigger seeding the Address screen from an existing subscription (edit mode). */
+export interface InitializeInvoicingSubscriptionAddressPayload {
+    id?: ID;
+}
+/** Trigger the post-save coupon attach/detach sync via dedicated endpoints. */
+export interface SyncInvoicingSubscriptionCouponsPayload {
+    nextCouponCode: string;
+    previousCouponCode: string;
+    subscriptionId: string;
+}
+export declare const initialState: EditInvoicingSubscriptionDetailViewState;
+export declare const fetchInvoicingSubscriptionFormPage: import("@reduxjs/toolkit").ActionCreatorWithPreparedPayload<[payload: {
+    subscriptionId?: ID;
+}], {
+    subscriptionId: string | undefined;
+}, "editInvoicingSubscriptionDetailView/fetchInvoicingSubscriptionFormPage", never, never>, updateInvoicingSubscriptionFormDraft: import("@reduxjs/toolkit").ActionCreatorWithPayload<UpdateInvoicingSubscriptionFormDraftPayload, "editInvoicingSubscriptionDetailView/updateInvoicingSubscriptionFormDraft">, submitInvoicingSubscriptionForm: import("@reduxjs/toolkit").ActionCreatorWithPreparedPayload<[payload: SubmitInvoicingSubscriptionFormPayload], SubmitInvoicingSubscriptionFormPayload, "editInvoicingSubscriptionDetailView/submitInvoicingSubscriptionForm", never, never>, submitInvoicingSubscriptionFormSuccess: import("@reduxjs/toolkit").ActionCreatorWithPayload<{
+    subscriptionId: ID;
+}, "editInvoicingSubscriptionDetailView/submitInvoicingSubscriptionFormSuccess">, submitInvoicingSubscriptionFormFailure: import("@reduxjs/toolkit").ActionCreatorWithPayload<ZeniAPIStatus<Record<string, unknown>>, "editInvoicingSubscriptionDetailView/submitInvoicingSubscriptionFormFailure">, resetEditInvoicingSubscriptionDetailView: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<"editInvoicingSubscriptionDetailView/resetEditInvoicingSubscriptionDetailView">, initializeInvoicingSubscriptionAddress: import("@reduxjs/toolkit").ActionCreatorWithPreparedPayload<[payload: InitializeInvoicingSubscriptionAddressPayload], InitializeInvoicingSubscriptionAddressPayload, "editInvoicingSubscriptionDetailView/initializeInvoicingSubscriptionAddress", never, never>, syncInvoicingSubscriptionCoupons: import("@reduxjs/toolkit").ActionCreatorWithPreparedPayload<[payload: SyncInvoicingSubscriptionCouponsPayload], SyncInvoicingSubscriptionCouponsPayload, "editInvoicingSubscriptionDetailView/syncInvoicingSubscriptionCoupons", never, never>;
+declare const _default: import("redux").Reducer<EditInvoicingSubscriptionDetailViewState>;
+export default _default;

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

@@ -0,0 +1,84 @@
+"use strict";
+var _a;
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.syncInvoicingSubscriptionCoupons = exports.initializeInvoicingSubscriptionAddress = exports.resetEditInvoicingSubscriptionDetailView = exports.submitInvoicingSubscriptionFormFailure = exports.submitInvoicingSubscriptionFormSuccess = exports.submitInvoicingSubscriptionForm = exports.updateInvoicingSubscriptionFormDraft = exports.fetchInvoicingSubscriptionFormPage = exports.initialState = void 0;
+const toolkit_1 = require("@reduxjs/toolkit");
+const invoicingSubscriptionFormConfig_1 = require("./invoicingSubscriptionFormConfig");
+exports.initialState = {
+    fetchState: 'Not-Started',
+    error: undefined,
+    editDraftById: {},
+    newSubscriptionDraft: { ...invoicingSubscriptionFormConfig_1.initialInvoicingSubscriptionFormLocalData },
+    savedSubscriptionId: undefined,
+    hasValidState() {
+        return this.fetchState === 'Completed';
+    },
+};
+const editInvoicingSubscriptionDetailView = (0, toolkit_1.createSlice)({
+    name: 'editInvoicingSubscriptionDetailView',
+    initialState: exports.initialState,
+    reducers: {
+        fetchInvoicingSubscriptionFormPage: {
+            reducer() {
+                // No state mutation; the aggregator epic fans out the option-list
+                // and subscription-detail fetches in response to this action.
+            },
+            prepare(payload) {
+                return { payload: { subscriptionId: payload.subscriptionId } };
+            },
+        },
+        updateInvoicingSubscriptionFormDraft(draft, action) {
+            const { id, localData } = action.payload;
+            if (id != null) {
+                draft.editDraftById[id] = localData;
+            }
+            else {
+                draft.newSubscriptionDraft = localData;
+            }
+        },
+        submitInvoicingSubscriptionForm: {
+            reducer(draft) {
+                draft.fetchState = 'In-Progress';
+                draft.error = undefined;
+                draft.savedSubscriptionId = undefined;
+            },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+        submitInvoicingSubscriptionFormSuccess(draft, action) {
+            draft.fetchState = 'Completed';
+            draft.error = undefined;
+            draft.savedSubscriptionId = action.payload.subscriptionId;
+        },
+        submitInvoicingSubscriptionFormFailure(draft, action) {
+            draft.fetchState = 'Error';
+            draft.error = action.payload;
+        },
+        resetEditInvoicingSubscriptionDetailView(draft) {
+            draft.fetchState = 'Not-Started';
+            draft.error = undefined;
+            draft.savedSubscriptionId = undefined;
+            draft.editDraftById = {};
+            draft.newSubscriptionDraft = {
+                ...invoicingSubscriptionFormConfig_1.initialInvoicingSubscriptionFormLocalData,
+            };
+        },
+        // Trigger only — handled by initializeInvoicingSubscriptionAddressEpic.
+        initializeInvoicingSubscriptionAddress: {
+            reducer() { },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+        // Trigger only — handled by syncInvoicingSubscriptionCouponsEpic.
+        syncInvoicingSubscriptionCoupons: {
+            reducer() { },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+    },
+});
+_a = editInvoicingSubscriptionDetailView.actions, exports.fetchInvoicingSubscriptionFormPage = _a.fetchInvoicingSubscriptionFormPage, exports.updateInvoicingSubscriptionFormDraft = _a.updateInvoicingSubscriptionFormDraft, exports.submitInvoicingSubscriptionForm = _a.submitInvoicingSubscriptionForm, exports.submitInvoicingSubscriptionFormSuccess = _a.submitInvoicingSubscriptionFormSuccess, exports.submitInvoicingSubscriptionFormFailure = _a.submitInvoicingSubscriptionFormFailure, exports.resetEditInvoicingSubscriptionDetailView = _a.resetEditInvoicingSubscriptionDetailView, exports.initializeInvoicingSubscriptionAddress = _a.initializeInvoicingSubscriptionAddress, exports.syncInvoicingSubscriptionCoupons = _a.syncInvoicingSubscriptionCoupons;
+exports.default = editInvoicingSubscriptionDetailView.reducer;

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

@@ -0,0 +1,40 @@
+import { ID } from '../../../commonStateTypes/common';
+import { SelectorView } from '../../../commonStateTypes/viewAndReport/viewAndReport';
+import { InvoicingCoupon } from '../../../entity/invoicing/coupon/couponState';
+import { InvoicingCustomer } from '../../../entity/invoicing/invoicingCustomer/invoicingCustomerState';
+import { InvoicingSubscription } from '../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionState';
+import { InvoicingProduct } from '../../../entity/invoicing/product/productState';
+import { RootState } from '../../../reducer';
+import { InvoicingSubscriptionFormLocalData } from './editInvoicingSubscriptionDetailViewState';
+/**
+ * Bundled view for the subscription create/edit form's save concern: the save
+ * fetch state/error, the id of the subscription last saved, and — when an
+ * `invoicingSubscriptionID` is passed (edit mode) — the existing subscription to
+ * prefill the form.
+ */
+export interface EditInvoicingSubscriptionDetailView extends SelectorView {
+    savedSubscriptionId?: ID;
+    subscription?: InvoicingSubscription;
+}
+/**
+ * The full data the subscription form screen needs in one selector: the draft
+ * `localData` (seeded from the existing subscription in edit mode until the user
+ * edits), the shipping-address label (from the shared Address screen), the
+ * canonical billing-frequency value set, the raw option lists (customers, plans,
+ * products, coupons), and the save state. The screen maps the raw lists/values
+ * to its own option shapes, so this stays free of any web-components dependency.
+ */
+export interface InvoicingSubscriptionFormView extends SelectorView {
+    billingFrequencyValues: string[];
+    coupons: InvoicingCoupon[];
+    customers: InvoicingCustomer[];
+    localData: InvoicingSubscriptionFormLocalData;
+    mode: 'create' | 'edit';
+    plans: InvoicingProduct[];
+    products: InvoicingProduct[];
+    savedSubscriptionId?: ID;
+    shippingAddressLabel?: string;
+    subscription?: InvoicingSubscription;
+}
+export declare const getEditInvoicingSubscriptionDetailViewState: (state: RootState, invoicingSubscriptionID?: ID) => EditInvoicingSubscriptionDetailView;
+export declare const getInvoicingSubscriptionFormView: (state: RootState, invoicingSubscriptionID?: ID) => InvoicingSubscriptionFormView;

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

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getInvoicingSubscriptionFormView = exports.getEditInvoicingSubscriptionDetailViewState = void 0;
+const invoicingSubscriptionSelector_1 = require("../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionSelector");
+const addressViewSelector_1 = require("../../addressView/addressViewSelector");
+const couponViewSelector_1 = require("../couponView/couponViewSelector");
+const invoicingCatalogListViewSelector_1 = require("../invoicingCatalogListView/invoicingCatalogListViewSelector");
+const invoicingCustomerListViewSelector_1 = require("../invoicingCustomerListView/invoicingCustomerListViewSelector");
+const invoicingSubscriptionFormConfig_1 = require("./invoicingSubscriptionFormConfig");
+const getEditInvoicingSubscriptionDetailViewState = (state, invoicingSubscriptionID) => {
+    const { error, fetchState, savedSubscriptionId } = state.editInvoicingSubscriptionDetailViewState;
+    return {
+        subscription: invoicingSubscriptionID != null
+            ? (0, invoicingSubscriptionSelector_1.getInvoicingSubscriptionById)(state.invoicingSubscriptionState, invoicingSubscriptionID)
+            : undefined,
+        savedSubscriptionId,
+        fetchState,
+        error,
+        version: 1.0,
+    };
+};
+exports.getEditInvoicingSubscriptionDetailViewState = getEditInvoicingSubscriptionDetailViewState;
+const getInvoicingSubscriptionFormView = (state, invoicingSubscriptionID) => {
+    const { editDraftById, error, fetchState, newSubscriptionDraft, savedSubscriptionId, } = state.editInvoicingSubscriptionDetailViewState;
+    const mode = invoicingSubscriptionID != null ? 'edit' : 'create';
+    const subscription = invoicingSubscriptionID != null
+        ? (0, invoicingSubscriptionSelector_1.getInvoicingSubscriptionById)(state.invoicingSubscriptionState, invoicingSubscriptionID)
+        : undefined;
+    const localData = invoicingSubscriptionID != null
+        ? (editDraftById[invoicingSubscriptionID] ??
+            (0, invoicingSubscriptionFormConfig_1.entityToInvoicingSubscriptionFormLocalData)(subscription))
+        : newSubscriptionDraft;
+    // Shipping address is captured via the shared Address screen and seeded there
+    // (looked up in the shared address store by `shippingAddressId`) on detail
+    // load, so the formatted label comes from that draft via `getFormattedAddress`.
+    const newAddress = state.addressViewState.newAddressState?.[invoicingSubscriptionFormConfig_1.INVOICING_SUBSCRIPTION_SHIPPING_ADDRESS_TYPE];
+    const shippingAddressLabel = newAddress?.addressToCreate != null
+        ? (0, addressViewSelector_1.getFormattedAddress)(newAddress.addressToCreate)
+        : undefined;
+    const catalogListView = (0, invoicingCatalogListViewSelector_1.getInvoicingCatalogListView)(state);
+    const planPrices = (0, invoicingCatalogListViewSelector_1.getInvoicingCatalogPrices)(catalogListView.plans);
+    const addonAndChargePrices = (0, invoicingCatalogListViewSelector_1.getInvoicingCatalogPrices)(catalogListView.products);
+    return {
+        billingFrequencyValues: [
+            ...invoicingSubscriptionFormConfig_1.INVOICING_SUBSCRIPTION_BILLING_FREQUENCY_VALUES,
+        ],
+        coupons: (0, couponViewSelector_1.getInvoicingCouponListItems)(state),
+        customers: (0, invoicingCustomerListViewSelector_1.getInvoicingCustomerListView)(state).customers,
+        localData,
+        mode,
+        plans: planPrices,
+        products: addonAndChargePrices,
+        savedSubscriptionId,
+        shippingAddressLabel,
+        subscription,
+        fetchState,
+        error,
+        version: 1.0,
+    };
+};
+exports.getInvoicingSubscriptionFormView = getInvoicingSubscriptionFormView;

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

@@ -0,0 +1,27 @@
+import { FetchedState, ID } from '../../../commonStateTypes/common';
+/**
+ * Draft form state for the create/edit subscription form. Held in CES so the
+ * form flows its data from here (mirrors the customer form / bill-pay pattern).
+ * The shipping address is NOT part of this draft — it is captured via the shared
+ * Address screen (`addressView`) and threaded into the save payload as
+ * `shipping_address` by the save epic.
+ */
+export interface InvoicingSubscriptionFormLocalData {
+    addonPriceCodes: string[];
+    autoCollection: boolean;
+    billingFrequency: string;
+    chargePriceCodes: string[];
+    couponId: string;
+    customerId: string;
+    planPriceCode: string;
+    planQuantity: number;
+    poNumber: string;
+    preferredCurrencyCode: string;
+    setupFee: string;
+    trialEnd: string;
+}
+export interface EditInvoicingSubscriptionDetailViewState extends FetchedState {
+    editDraftById: Record<ID, InvoicingSubscriptionFormLocalData>;
+    newSubscriptionDraft: InvoicingSubscriptionFormLocalData;
+    savedSubscriptionId?: ID;
+}

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

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });