@zeniai/client-epic-state 5.1.60 → 5.1.61

package/lib/esm/view/invoicing/editInvoicingCouponDetailView/editInvoicingCouponDetailViewReducer.js

@@ -0,0 +1,65 @@
+import { createSlice } from '@reduxjs/toolkit';
+import { initialInvoicingCouponFormLocalData } from './invoicingCouponFormConfig';
+export const initialState = {
+    fetchState: 'Not-Started',
+    error: undefined,
+    editDraftById: {},
+    newCouponDraft: { ...initialInvoicingCouponFormLocalData },
+    savedCouponId: undefined,
+    hasValidState() {
+        return this.fetchState === 'Completed';
+    },
+};
+const editInvoicingCouponDetailView = createSlice({
+    name: 'editInvoicingCouponDetailView',
+    initialState,
+    reducers: {
+        updateInvoicingCouponFormDraft(draft, action) {
+            const { id, localData } = action.payload;
+            if (id != null) {
+                draft.editDraftById[id] = localData;
+            }
+            else {
+                draft.newCouponDraft = localData;
+            }
+        },
+        submitInvoicingCouponForm: {
+            reducer(draft) {
+                draft.fetchState = 'In-Progress';
+                draft.error = undefined;
+                draft.savedCouponId = undefined;
+            },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+        saveInvoicingCoupon: {
+            reducer(draft) {
+                draft.fetchState = 'In-Progress';
+                draft.error = undefined;
+                draft.savedCouponId = undefined;
+            },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+        submitInvoicingCouponFormSuccess(draft, action) {
+            draft.fetchState = 'Completed';
+            draft.error = undefined;
+            draft.savedCouponId = action.payload.couponId;
+        },
+        submitInvoicingCouponFormFailure(draft, action) {
+            draft.fetchState = 'Error';
+            draft.error = action.payload;
+        },
+        resetEditInvoicingCouponDetailView(draft) {
+            draft.fetchState = 'Not-Started';
+            draft.error = undefined;
+            draft.savedCouponId = undefined;
+            draft.editDraftById = {};
+            draft.newCouponDraft = { ...initialInvoicingCouponFormLocalData };
+        },
+    },
+});
+export const { updateInvoicingCouponFormDraft, submitInvoicingCouponForm, saveInvoicingCoupon, submitInvoicingCouponFormSuccess, submitInvoicingCouponFormFailure, resetEditInvoicingCouponDetailView, } = editInvoicingCouponDetailView.actions;
+export default editInvoicingCouponDetailView.reducer;

package/lib/esm/view/invoicing/editInvoicingCouponDetailView/editInvoicingCouponDetailViewSelector.js

@@ -0,0 +1,43 @@
+import { INVOICING_COUPON_APPLY_ON_OPTIONS, INVOICING_COUPON_DURATION_TYPE_OPTIONS, INVOICING_COUPON_PERIOD_UNIT_OPTIONS, INVOICING_DISCOUNT_TYPE_OPTIONS, } from '../../../entity/invoicing/coupon/couponConstants';
+import { getInvoicingCouponById } from '../../../entity/invoicing/coupon/couponSelector';
+import { entityToInvoicingCouponFormLocalData } from './invoicingCouponFormConfig';
+/**
+ * Bundled view for the discount create/edit form: the save fetch state/error,
+ * the id of the coupon last saved, and — when a `couponId` is passed (edit
+ * mode) — the existing coupon entity to prefill the form.
+ */
+export const getEditInvoicingCouponDetailViewState = (state, couponId) => {
+    const { error, fetchState, savedCouponId } = state.editInvoicingCouponDetailViewState;
+    return {
+        coupon: couponId != null
+            ? getInvoicingCouponById(state.invoicingCouponState, couponId)
+            : undefined,
+        savedCouponId,
+        fetchState,
+        error,
+        version: 1.0,
+    };
+};
+/**
+ * Bundled view for the discount form screen: the edit view (save state + the
+ * coupon to prefill in edit mode), the draft `localData` (seeded from the
+ * existing coupon in edit mode until the user edits), and the CES-owned
+ * select-option lists the form renders.
+ */
+export const getInvoicingCouponFormView = (state, couponId) => {
+    const base = getEditInvoicingCouponDetailViewState(state, couponId);
+    const { editDraftById, newCouponDraft } = state.editInvoicingCouponDetailViewState;
+    const localData = couponId != null
+        ? (editDraftById[couponId] ??
+            entityToInvoicingCouponFormLocalData(base.coupon))
+        : newCouponDraft;
+    return {
+        ...base,
+        applyOnOptions: INVOICING_COUPON_APPLY_ON_OPTIONS,
+        discountTypeOptions: INVOICING_DISCOUNT_TYPE_OPTIONS,
+        durationTypeOptions: INVOICING_COUPON_DURATION_TYPE_OPTIONS,
+        localData,
+        mode: couponId != null ? 'edit' : 'create',
+        periodUnitOptions: INVOICING_COUPON_PERIOD_UNIT_OPTIONS,
+    };
+};

package/lib/esm/view/invoicing/editInvoicingCouponDetailView/editInvoicingCouponDetailViewState.js

@@ -0,0 +1 @@
+export {};

package/lib/esm/view/invoicing/editInvoicingCouponDetailView/invoicingCouponFormConfig.js

@@ -0,0 +1,44 @@
+export const initialInvoicingCouponFormLocalData = {
+    applyOn: 'invoice_amount',
+    couponCode: '',
+    couponId: '',
+    discountAmount: '',
+    discountPercentage: '',
+    discountQuantity: '',
+    discountType: 'percentage',
+    durationType: 'one_time',
+    invoiceName: '',
+    invoiceNotes: '',
+    maxRedemptions: '',
+    name: '',
+    period: '',
+    periodUnit: 'month',
+    validFrom: '',
+    validTill: '',
+};
+/** Seed the form draft from an existing coupon entity (edit mode). */
+export const entityToInvoicingCouponFormLocalData = (coupon) => {
+    if (coupon == null) {
+        return { ...initialInvoicingCouponFormLocalData };
+    }
+    return {
+        applyOn: coupon.applyOn ?? 'invoice_amount',
+        couponCode: coupon.couponCode ?? '',
+        couponId: coupon.id ?? '',
+        discountAmount: coupon.discountAmount != null ? String(coupon.discountAmount.amount) : '',
+        discountPercentage: coupon.discountPercentage != null
+            ? String(coupon.discountPercentage)
+            : '',
+        discountQuantity: coupon.discountQuantity != null ? String(coupon.discountQuantity) : '',
+        discountType: coupon.discountType ?? 'percentage',
+        durationType: coupon.durationType ?? 'one_time',
+        invoiceName: coupon.invoiceName ?? '',
+        invoiceNotes: coupon.invoiceNotes ?? '',
+        maxRedemptions: coupon.maxRedemptions != null ? String(coupon.maxRedemptions) : '',
+        name: coupon.name ?? '',
+        period: coupon.period != null ? String(coupon.period) : '',
+        periodUnit: coupon.periodUnit ?? 'month',
+        validFrom: coupon.validFrom != null ? coupon.validFrom.format('YYYY-MM-DD') : '',
+        validTill: coupon.validTill != null ? coupon.validTill.format('YYYY-MM-DD') : '',
+    };
+};

package/lib/esm/view/invoicing/editInvoicingCouponDetailView/saveInvoicingCouponEpic.js

@@ -0,0 +1,50 @@
+import { of } from 'rxjs';
+import { catchError, filter, mergeMap } from 'rxjs/operators';
+import { updateInvoicingCoupons } from '../../../entity/invoicing/coupon/couponReducer';
+import { createZeniAPIStatus, isSuccessResponse } from '../../../responsePayload';
+import { addInvoicingCouponToList } from '../couponView/couponViewReducer';
+import { localDataToSaveInvoicingCouponPayload, } from './editInvoicingCouponDetailViewPayload';
+import { saveInvoicingCoupon, submitInvoicingCouponForm, submitInvoicingCouponFormFailure, submitInvoicingCouponFormSuccess, } from './editInvoicingCouponDetailViewReducer';
+export const saveInvoicingCouponEpic = (actions$, state$, zeniAPI) => actions$.pipe(filter((action) => submitInvoicingCouponForm.match(action) ||
+    saveInvoicingCoupon.match(action)), mergeMap((action) => {
+    const { id } = action.payload;
+    // Draft-based create/edit form vs. detail-page inline edit (raw data).
+    const data = saveInvoicingCoupon.match(action)
+        ? action.payload.data
+        : (() => {
+            const viewState = state$.value.editInvoicingCouponDetailViewState;
+            const localData = (id != null
+                ? viewState.editDraftById[id]
+                : viewState.newCouponDraft) ?? viewState.newCouponDraft;
+            return localDataToSaveInvoicingCouponPayload(localData, id == null);
+        })();
+    const baseUrl = `${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0`;
+    const path = id != null
+        ? `${baseUrl}/discounts/${encodeURIComponent(id)}`
+        : `${baseUrl}/discounts`;
+    const request$ = id != null
+        ? zeniAPI.putAndGetJSON(path, { ...data })
+        : zeniAPI.postAndGetJSON(path, {
+            ...data,
+        });
+    return request$.pipe(mergeMap((response) => {
+        if (isSuccessResponse(response) && response.data != null) {
+            const couponPayload = response.data;
+            const resultActions = [
+                updateInvoicingCoupons([couponPayload], 'merge'),
+                submitInvoicingCouponFormSuccess({ couponId: couponPayload.id }),
+            ];
+            // Create (no id): reflect the new row + tab counts in the cached
+            // discounts list so it shows without a refetch. Edits keep the same
+            // id/counts, so the entity merge above is enough.
+            if (id == null) {
+                resultActions.push(addInvoicingCouponToList({
+                    id: couponPayload.id,
+                    status: couponPayload.status,
+                }));
+            }
+            return resultActions;
+        }
+        return of(submitInvoicingCouponFormFailure(response.status));
+    }), catchError((error) => of(submitInvoicingCouponFormFailure(createZeniAPIStatus('Unexpected Error', 'Save coupon REST API call errored out ' + JSON.stringify(error))))));
+}));

package/lib/esm/view/invoicing/editInvoicingCustomerDetailView/editInvoicingCustomerDetailViewPayload.js

@@ -0,0 +1,32 @@
+import { toAddressUpdatableInfoPayload } from '../../addressView/addressViewPayload';
+const trimOrUndefined = (value) => value.trim() !== '' ? value.trim() : undefined;
+/**
+ * Build the create/update customer request body from the form draft. The
+ * billing address is sent as an object (captured via the shared Address
+ * screen); the backend creates it and returns its id — same pattern as the
+ * vendor save flow.
+ */
+export const localDataToSaveInvoicingCustomerPayload = (localData, billingAddress) => {
+    const firstName = trimOrUndefined(localData.firstName);
+    const lastName = trimOrUndefined(localData.lastName);
+    const company = trimOrUndefined(localData.company);
+    const netTerm = localData.netTermDays.trim();
+    return {
+        auto_collection: localData.autoCollection ? 'on' : 'off',
+        company,
+        customer_type: localData.customerType,
+        email: trimOrUndefined(localData.email),
+        first_name: firstName,
+        invoice_notes: trimOrUndefined(localData.invoiceNotes),
+        last_name: lastName,
+        notes: localData.notes.trim(),
+        phone: trimOrUndefined(localData.phone),
+        preferred_currency_code: localData.preferredCurrencyCode,
+        taxability: localData.taxability,
+        vat_number: trimOrUndefined(localData.vatNumber),
+        ...(netTerm !== '' ? { net_term_days: Number(netTerm) } : {}),
+        ...(billingAddress != null
+            ? { billing_address: toAddressUpdatableInfoPayload(billingAddress) }
+            : {}),
+    };
+};

package/lib/esm/view/invoicing/editInvoicingCustomerDetailView/editInvoicingCustomerDetailViewReducer.js

@@ -0,0 +1,62 @@
+import { createSlice } from '@reduxjs/toolkit';
+import { initialInvoicingCustomerFormLocalData } from './invoicingCustomerFormConfig';
+export const initialState = {
+    fetchState: 'Not-Started',
+    error: undefined,
+    editDraftById: {},
+    newCustomerDraft: { ...initialInvoicingCustomerFormLocalData },
+    savedCustomerId: undefined,
+    hasValidState() {
+        return this.fetchState === 'Completed';
+    },
+};
+const editInvoicingCustomerDetailView = createSlice({
+    name: 'editInvoicingCustomerDetailView',
+    initialState,
+    reducers: {
+        updateInvoicingCustomerFormDraft(draft, action) {
+            const { id, localData } = action.payload;
+            if (id != null) {
+                draft.editDraftById[id] = localData;
+            }
+            else {
+                draft.newCustomerDraft = localData;
+            }
+        },
+        submitInvoicingCustomerForm: {
+            reducer(draft) {
+                draft.fetchState = 'In-Progress';
+                draft.error = undefined;
+                draft.savedCustomerId = undefined;
+            },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+        submitInvoicingCustomerFormSuccess(draft, action) {
+            draft.fetchState = 'Completed';
+            draft.error = undefined;
+            draft.savedCustomerId = action.payload.customerId;
+        },
+        submitInvoicingCustomerFormFailure(draft, action) {
+            draft.fetchState = 'Error';
+            draft.error = action.payload;
+        },
+        resetEditInvoicingCustomerDetailView(draft) {
+            draft.fetchState = 'Not-Started';
+            draft.error = undefined;
+            draft.savedCustomerId = undefined;
+            draft.editDraftById = {};
+            draft.newCustomerDraft = { ...initialInvoicingCustomerFormLocalData };
+        },
+        // Trigger only — handled by initializeInvoicingCustomerAddressEpic.
+        initializeInvoicingCustomerAddress: {
+            reducer() { },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+    },
+});
+export const { updateInvoicingCustomerFormDraft, submitInvoicingCustomerForm, submitInvoicingCustomerFormSuccess, submitInvoicingCustomerFormFailure, resetEditInvoicingCustomerDetailView, initializeInvoicingCustomerAddress, } = editInvoicingCustomerDetailView.actions;
+export default editInvoicingCustomerDetailView.reducer;

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

@@ -0,0 +1,42 @@
+import { getInvoicingCustomerById } from '../../../entity/invoicing/invoicingCustomer/invoicingCustomerSelector';
+import { getFormattedAddress } from '../../addressView/addressViewSelector';
+import { INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE, INVOICING_CUSTOMER_TYPE_VALUES, INVOICING_NET_TERM_DAY_VALUES, INVOICING_TAXABILITY_VALUES, entityToInvoicingCustomerFormLocalData, } from './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.
+ */
+export const getInvoicingCustomerFormView = (state, invoicingCustomerID) => {
+    const { editDraftById, error, fetchState, newCustomerDraft, savedCustomerId } = state.editInvoicingCustomerDetailViewState;
+    const mode = invoicingCustomerID != null ? 'edit' : 'create';
+    const customer = invoicingCustomerID != null
+        ? getInvoicingCustomerById(state.invoicingCustomerState, invoicingCustomerID)
+        : undefined;
+    const localData = invoicingCustomerID != null
+        ? (editDraftById[invoicingCustomerID] ??
+            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?.[INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE];
+    const billingAddressId = newAddress?.newAddressId ?? customer?.billingAddressId;
+    const billingAddressLabel = newAddress?.addressToCreate != null
+        ? getFormattedAddress(newAddress.addressToCreate)
+        : undefined;
+    return {
+        customerTypeValues: [...INVOICING_CUSTOMER_TYPE_VALUES],
+        localData,
+        mode,
+        netTermDayValues: [...INVOICING_NET_TERM_DAY_VALUES],
+        taxabilityValues: [...INVOICING_TAXABILITY_VALUES],
+        billingAddressId,
+        billingAddressLabel,
+        savedCustomerId,
+        fetchState,
+        error,
+        version: 1.0,
+    };
+};

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

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,35 @@
+import { EMPTY, of } from 'rxjs';
+import { filter, mergeMap } from 'rxjs/operators';
+import { getAddressByAddressId } from '../../../entity/address/addressSelector';
+import { getInvoicingCustomerById } from '../../../entity/invoicing/invoicingCustomer/invoicingCustomerSelector';
+import { newAddressInLocalStore } from '../../addressView/addressViewReducer';
+import { updateInvoicingCustomerDetail } from '../invoicingCustomerDetailView/invoicingCustomerDetailViewReducer';
+import { initializeInvoicingCustomerAddress } from './editInvoicingCustomerDetailViewReducer';
+import { INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE } from './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`.
+ */
+export const initializeInvoicingCustomerAddressEpic = (actions$, state$) => actions$.pipe(filter((action) => initializeInvoicingCustomerAddress.match(action) ||
+    updateInvoicingCustomerDetail.match(action)), mergeMap((action) => {
+    const { id } = action.payload;
+    const rootState = state$.value;
+    const existingDraft = rootState.addressViewState.newAddressState?.[INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE]?.addressToCreate;
+    if (existingDraft != null || id == null) {
+        return EMPTY;
+    }
+    const customer = getInvoicingCustomerById(rootState.invoicingCustomerState, id);
+    const address = customer?.billingAddressId != null
+        ? getAddressByAddressId(rootState.addressState, customer.billingAddressId)
+        : undefined;
+    return address != null
+        ? of(newAddressInLocalStore({
+            addressType: INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE,
+            addressToCreate: address,
+        }))
+        : EMPTY;
+}));

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

@@ -0,0 +1,55 @@
+/** `AddressType` key used when the customer form opens the shared Address screen. */
+export 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 const INVOICING_CUSTOMER_TYPE_VALUES = [
+    'business',
+    'residential',
+];
+export const INVOICING_TAXABILITY_VALUES = ['taxable', 'exempt'];
+export const INVOICING_NET_TERM_DAY_VALUES = [
+    '0',
+    '15',
+    '30',
+    '45',
+    '60',
+];
+export const 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). */
+export const entityToInvoicingCustomerFormLocalData = (customer) => {
+    if (customer == null) {
+        return { ...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 ?? '',
+    };
+};

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

@@ -0,0 +1,53 @@
+import { of } from 'rxjs';
+import { catchError, filter, mergeMap } from 'rxjs/operators';
+import { updateAddresses } from '../../../entity/address/addressReducer';
+import { extractInvoicingCustomerAddresses } from '../../../entity/invoicing/invoicingCustomer/invoicingCustomerPayload';
+import { updateInvoicingCustomers } from '../../../entity/invoicing/invoicingCustomer/invoicingCustomerReducer';
+import { createZeniAPIStatus, isSuccessResponse } from '../../../responsePayload';
+import { resetNewAddressDataInLocalStore } from '../../addressView/addressViewReducer';
+import { addInvoicingCustomerToList } from '../invoicingCustomerListView/invoicingCustomerListViewReducer';
+import { localDataToSaveInvoicingCustomerPayload, } from './editInvoicingCustomerDetailViewPayload';
+import { submitInvoicingCustomerForm, submitInvoicingCustomerFormFailure, submitInvoicingCustomerFormSuccess, } from './editInvoicingCustomerDetailViewReducer';
+import { INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE } from './invoicingCustomerFormConfig';
+export const saveInvoicingCustomerEpic = (actions$, state$, zeniAPI) => actions$.pipe(filter(submitInvoicingCustomerForm.match), 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?.[INVOICING_CUSTOMER_BILLING_ADDRESS_TYPE]?.addressToCreate;
+    const data = 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(mergeMap((response) => {
+        if (isSuccessResponse(response) && response.data != null) {
+            const resultActions = [
+                updateInvoicingCustomers([response.data], 'merge'),
+                updateAddresses(extractInvoicingCustomerAddresses([response.data])),
+                submitInvoicingCustomerFormSuccess({
+                    customerId: response.data.id,
+                }),
+                // Clear the stashed address so the next customer starts fresh.
+                resetNewAddressDataInLocalStore(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(addInvoicingCustomerToList({
+                    id: response.data.id,
+                    status: response.data.status,
+                }));
+            }
+            return resultActions;
+        }
+        return of(submitInvoicingCustomerFormFailure(response.status));
+    }), catchError((error) => of(submitInvoicingCustomerFormFailure(createZeniAPIStatus('Unexpected Error', 'Save customer REST API call errored out ' +
+        JSON.stringify(error))))));
+}));

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

@@ -0,0 +1,48 @@
+import { toAddressUpdatableInfoPayload } from '../../addressView/addressViewPayload';
+import { billingFrequencyToPeriod } from './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.
+ */
+export const localDataToSaveInvoicingSubscriptionPayload = (localData, shippingAddress) => {
+    const frequency = 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: toAddressUpdatableInfoPayload(shippingAddress) }
+            : {}),
+    };
+};

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

@@ -0,0 +1,80 @@
+import { createSlice } from '@reduxjs/toolkit';
+import { initialInvoicingSubscriptionFormLocalData } from './invoicingSubscriptionFormConfig';
+export const initialState = {
+    fetchState: 'Not-Started',
+    error: undefined,
+    editDraftById: {},
+    newSubscriptionDraft: { ...initialInvoicingSubscriptionFormLocalData },
+    savedSubscriptionId: undefined,
+    hasValidState() {
+        return this.fetchState === 'Completed';
+    },
+};
+const editInvoicingSubscriptionDetailView = createSlice({
+    name: 'editInvoicingSubscriptionDetailView',
+    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 = {
+                ...initialInvoicingSubscriptionFormLocalData,
+            };
+        },
+        // Trigger only — handled by initializeInvoicingSubscriptionAddressEpic.
+        initializeInvoicingSubscriptionAddress: {
+            reducer() { },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+        // Trigger only — handled by syncInvoicingSubscriptionCouponsEpic.
+        syncInvoicingSubscriptionCoupons: {
+            reducer() { },
+            prepare(payload) {
+                return { payload };
+            },
+        },
+    },
+});
+export const { fetchInvoicingSubscriptionFormPage, updateInvoicingSubscriptionFormDraft, submitInvoicingSubscriptionForm, submitInvoicingSubscriptionFormSuccess, submitInvoicingSubscriptionFormFailure, resetEditInvoicingSubscriptionDetailView, initializeInvoicingSubscriptionAddress, syncInvoicingSubscriptionCoupons, } = editInvoicingSubscriptionDetailView.actions;
+export default editInvoicingSubscriptionDetailView.reducer;