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

package/lib/esm/view/invoicing/invoicingSubscriptionDetailView/invoicingSubscriptionDetailViewSelector.js

@@ -0,0 +1,13 @@
+import { getInvoicingSubscriptionById as getInvoicingSubscriptionByIdFromState } from '../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionSelector';
+import { getInvoicingSubscriptionActionState } from '../subscriptionAction/subscriptionActionSelector';
+export const getInvoicingSubscriptionById = (state, id) => getInvoicingSubscriptionByIdFromState(state.invoicingSubscriptionState, id);
+export const getInvoicingSubscriptionDetail = (state, invoicingSubscriptionID) => {
+    const { error, fetchState } = state.invoicingSubscriptionDetailViewState;
+    return {
+        actionState: getInvoicingSubscriptionActionState(invoicingSubscriptionID)(state),
+        subscription: getInvoicingSubscriptionById(state, invoicingSubscriptionID),
+        fetchState,
+        error,
+        version: 1.0,
+    };
+};

package/lib/esm/view/invoicing/invoicingSubscriptionDetailView/invoicingSubscriptionDetailViewState.js

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

package/lib/esm/view/invoicing/invoicingSubscriptionListView/epics/fetchInvoicingSubscriptionCountsEpic.js

@@ -0,0 +1,23 @@
+import { of } from 'rxjs';
+import { catchError, filter, switchMap } from 'rxjs/operators';
+import { createZeniAPIStatus, isSuccessResponse, } from '../../../../responsePayload';
+import { withQuery } from '../../invoicingApiHelper';
+import { fetchInvoicingSubscriptionCounts, updateInvoicingSubscriptionCounts, updateInvoicingSubscriptionCountsFailure, } from '../invoicingSubscriptionListViewReducer';
+export const fetchInvoicingSubscriptionCountsEpic = (actions$, state$, zeniAPI) => actions$.pipe(filter(fetchInvoicingSubscriptionCounts.match), switchMap(() => {
+    const { filters } = state$.value.invoicingSubscriptionListViewState;
+    const params = new URLSearchParams();
+    if (filters.search != null && filters.search.length > 0) {
+        params.set('search', filters.search);
+    }
+    if (filters.customerId != null) {
+        params.set('customer_id', filters.customerId);
+    }
+    const apiUrl = withQuery(`${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0/subscriptions/counts`, params);
+    return zeniAPI.getJSON(apiUrl).pipe(switchMap((response) => {
+        if (isSuccessResponse(response) && response.data != null) {
+            return of(updateInvoicingSubscriptionCounts(response.data));
+        }
+        return of(updateInvoicingSubscriptionCountsFailure(response.status));
+    }), catchError((error) => of(updateInvoicingSubscriptionCountsFailure(createZeniAPIStatus('Unexpected Error', 'Fetch subscription counts REST API call errored out ' +
+        JSON.stringify(error))))));
+}));

package/lib/esm/view/invoicing/invoicingSubscriptionListView/epics/fetchInvoicingSubscriptionListEpic.js

@@ -0,0 +1,52 @@
+import { of } from 'rxjs';
+import { catchError, filter, switchMap } from 'rxjs/operators';
+import { updateAddresses } from '../../../../entity/address/addressReducer';
+import { extractInvoicingSubscriptionAddresses } from '../../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionPayload';
+import { updateInvoicingSubscriptions } from '../../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionReducer';
+import { createZeniAPIStatus, isSuccessResponse, } from '../../../../responsePayload';
+import { INVOICING_LIST_PAGE_SIZE, applyListSortParams, withQuery, } from '../../invoicingApiHelper';
+import { fetchInvoicingSubscriptionList, updateInvoicingSubscriptionList, updateInvoicingSubscriptionListFailure, } from '../invoicingSubscriptionListViewReducer';
+const buildQuery = (filters, cursor, sort) => {
+    const params = new URLSearchParams();
+    if (filters.status != null && filters.status.length > 0) {
+        params.set('status', filters.status);
+    }
+    if (filters.customerId != null) {
+        params.set('customer_id', filters.customerId);
+    }
+    if (filters.search != null && filters.search.length > 0) {
+        params.set('search', filters.search);
+    }
+    if (filters.startedFrom != null) {
+        params.set('started_from', filters.startedFrom);
+    }
+    if (filters.startedTo != null) {
+        params.set('started_to', filters.startedTo);
+    }
+    params.set('limit', String(INVOICING_LIST_PAGE_SIZE));
+    if (cursor != null) {
+        params.set('cursor', cursor);
+    }
+    applyListSortParams(params, sort);
+    return params;
+};
+export const fetchInvoicingSubscriptionListEpic = (actions$, _state$, zeniAPI) => actions$.pipe(filter(fetchInvoicingSubscriptionList.match), switchMap((action) => {
+    const { filters, cursor, keepExistingListItems, sort } = action.payload;
+    const apiUrl = withQuery(`${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0/subscriptions`, buildQuery(filters, cursor, sort));
+    return zeniAPI.getJSON(apiUrl).pipe(switchMap((response) => {
+        if (isSuccessResponse(response)) {
+            const items = response.data?.items ?? [];
+            return [
+                updateInvoicingSubscriptions(items, 'merge'),
+                updateAddresses(extractInvoicingSubscriptionAddresses(items)),
+                updateInvoicingSubscriptionList({
+                    ids: items.map((item) => item.id),
+                    nextCursor: response.data?.next_cursor ?? null,
+                    keepExistingListItems,
+                }),
+            ];
+        }
+        return of(updateInvoicingSubscriptionListFailure(response.status));
+    }), catchError((error) => of(updateInvoicingSubscriptionListFailure(createZeniAPIStatus('Unexpected Error', 'Fetch subscription list REST API call errored out ' +
+        JSON.stringify(error))))));
+}));

package/lib/esm/view/invoicing/invoicingSubscriptionListView/epics/fetchInvoicingSubscriptionListPageEpic.js

@@ -0,0 +1,27 @@
+import { concat, from } from 'rxjs';
+import { filter, mergeMap } from 'rxjs/operators';
+import { fetchInvoicingSubscriptionCounts, fetchInvoicingSubscriptionList, fetchInvoicingSubscriptionListPage, } from '../invoicingSubscriptionListViewReducer';
+/**
+ * Fetch unless the endpoint is already loaded or in flight — or always when the
+ * caller forces a refresh via `cacheOverride` (e.g. on a filter/sort change).
+ */
+const shouldFetch = (fetchStateAndError, cacheOverride) => cacheOverride ||
+    (fetchStateAndError.fetchState !== 'Completed' &&
+        fetchStateAndError.fetchState !== 'In-Progress');
+/**
+ * Orchestrates the subscriptions list page: on `fetchInvoicingSubscriptionListPage`,
+ * fans out to the list and counts fetches, skipping either one whose data is
+ * already cached unless `cacheOverride` is set (e.g. on a filter/sort change).
+ */
+export const fetchInvoicingSubscriptionListPageEpic = (actions$, state$) => actions$.pipe(filter(fetchInvoicingSubscriptionListPage.match), mergeMap((action) => {
+    const { cacheOverride, filters, sort } = action.payload;
+    const state = state$.value.invoicingSubscriptionListViewState;
+    const pageActions = [];
+    if (shouldFetch({ fetchState: state.fetchState, error: state.error }, cacheOverride)) {
+        pageActions.push(fetchInvoicingSubscriptionList({ filters, sort }));
+    }
+    if (shouldFetch(state.countsFetchState, cacheOverride)) {
+        pageActions.push(fetchInvoicingSubscriptionCounts());
+    }
+    return concat(from(pageActions));
+}));

package/lib/esm/view/invoicing/invoicingSubscriptionListView/invoicingSubscriptionListViewPayload.js

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

package/lib/esm/view/invoicing/invoicingSubscriptionListView/invoicingSubscriptionListViewReducer.js

@@ -0,0 +1,103 @@
+import { createSlice } from '@reduxjs/toolkit';
+export const initialState = {
+    fetchState: 'Not-Started',
+    error: undefined,
+    ids: [],
+    nextCursor: null,
+    filters: {},
+    counts: { all: 0 },
+    countsFetchState: { fetchState: 'Not-Started', error: undefined },
+    hasValidState() {
+        return this.fetchState === 'Completed';
+    },
+};
+const invoicingSubscriptionListView = createSlice({
+    name: 'invoicingSubscriptionListView',
+    initialState,
+    reducers: {
+        fetchInvoicingSubscriptionList: {
+            reducer(draft, action) {
+                if (!action.payload.keepExistingListItems) {
+                    draft.ids = [];
+                    draft.nextCursor = null;
+                }
+                draft.filters = action.payload.filters;
+                draft.sort = action.payload.sort;
+                draft.fetchState = 'In-Progress';
+                draft.error = undefined;
+            },
+            prepare(payload) {
+                return {
+                    payload: {
+                        filters: payload.filters ?? {},
+                        cursor: payload.cursor,
+                        keepExistingListItems: payload.keepExistingListItems ?? false,
+                        sort: payload.sort,
+                    },
+                };
+            },
+        },
+        fetchInvoicingSubscriptionListPage: {
+            reducer(draft, action) {
+                draft.filters = action.payload.filters;
+                draft.sort = action.payload.sort;
+            },
+            prepare(payload) {
+                return {
+                    payload: {
+                        cacheOverride: payload.cacheOverride ?? false,
+                        filters: payload.filters ?? {},
+                        sort: payload.sort,
+                    },
+                };
+            },
+        },
+        updateInvoicingSubscriptionList(draft, action) {
+            draft.ids = action.payload.keepExistingListItems
+                ? [...new Set([...draft.ids, ...action.payload.ids])]
+                : action.payload.ids;
+            draft.nextCursor = action.payload.nextCursor;
+            draft.fetchState = 'Completed';
+            draft.error = undefined;
+        },
+        updateInvoicingSubscriptionListFailure(draft, action) {
+            draft.fetchState = 'Error';
+            draft.error = action.payload;
+        },
+        fetchInvoicingSubscriptionCounts(draft) {
+            draft.countsFetchState.fetchState = 'In-Progress';
+            draft.countsFetchState.error = undefined;
+        },
+        updateInvoicingSubscriptionCounts(draft, action) {
+            draft.counts = action.payload;
+            draft.countsFetchState.fetchState = 'Completed';
+            draft.countsFetchState.error = undefined;
+        },
+        updateInvoicingSubscriptionCountsFailure(draft, action) {
+            draft.countsFetchState.fetchState = 'Error';
+            draft.countsFetchState.error = action.payload;
+        },
+        updateInvoicingSubscriptionFilters(draft, action) {
+            draft.filters = action.payload;
+        },
+        // Reflect a newly created subscription in the cached list + tab counts so the
+        // subscription page shows it without refetching from the server. The status
+        // doubles as the per-tab count key (tab ids mirror InvoicingSubscriptionStatus).
+        addInvoicingSubscriptionToList(draft, action) {
+            const { id, status } = action.payload;
+            if (draft.ids.includes(id)) {
+                return;
+            }
+            draft.ids = [id, ...draft.ids];
+            draft.counts.all += 1;
+            if (status != null) {
+                draft.counts[status] = (draft.counts[status] ?? 0) + 1;
+            }
+        },
+        clearInvoicingSubscriptionListView(draft) {
+            Object.assign(draft, initialState);
+        },
+    },
+});
+export const { fetchInvoicingSubscriptionList, fetchInvoicingSubscriptionListPage, updateInvoicingSubscriptionList, updateInvoicingSubscriptionListFailure, fetchInvoicingSubscriptionCounts, updateInvoicingSubscriptionCounts, updateInvoicingSubscriptionCountsFailure, updateInvoicingSubscriptionFilters, addInvoicingSubscriptionToList, clearInvoicingSubscriptionListView, } = invoicingSubscriptionListView.actions;
+export default invoicingSubscriptionListView.reducer;

package/lib/esm/view/invoicing/invoicingSubscriptionListView/invoicingSubscriptionListViewSelector.js

@@ -0,0 +1,22 @@
+import { createSelector } from '@reduxjs/toolkit';
+import { getInvoicingSubscriptionsByIds } from '../../../entity/invoicing/invoicingSubscription/invoicingSubscriptionSelector';
+import { INVOICING_SUBSCRIPTION_COLUMNS, INVOICING_SUBSCRIPTION_TABS, } from './invoicingSubscriptionListViewState';
+/**
+ * Memoized so the denormalized `subscriptions` array (and the wrapping view
+ * object) keep referential identity until the subscription entity slice or the
+ * list-view slice actually change. Without this, the connected list page
+ * re-rendered on every unrelated redux action because a fresh array was built
+ * each call.
+ */
+export const getInvoicingSubscriptionListView = createSelector((state) => state.invoicingSubscriptionState, (state) => state.invoicingSubscriptionListViewState, (subscriptionState, listViewState) => ({
+    columns: INVOICING_SUBSCRIPTION_COLUMNS,
+    subscriptions: getInvoicingSubscriptionsByIds(subscriptionState, listViewState.ids),
+    fetchState: listViewState.fetchState,
+    error: listViewState.error,
+    nextCursor: listViewState.nextCursor,
+    filters: listViewState.filters,
+    count: listViewState.counts,
+    countsFetchState: listViewState.countsFetchState,
+    tabIds: INVOICING_SUBSCRIPTION_TABS,
+    sort: listViewState.sort,
+}));

package/lib/esm/view/invoicing/invoicingSubscriptionListView/invoicingSubscriptionListViewState.js

@@ -0,0 +1,43 @@
+import { stringToUnion } from '../../../commonStateTypes/stringToUnion';
+export const ALL_INVOICING_SUBSCRIPTION_SORT_KEYS = [
+    'subscription',
+    'customer',
+    'plan',
+    'product_code',
+    'term_end',
+    'next_billing',
+    'auto_collect',
+    'status',
+    'mrr',
+];
+export const toInvoicingSubscriptionSortKey = (v) => stringToUnion(v, ALL_INVOICING_SUBSCRIPTION_SORT_KEYS);
+export const INVOICING_SUBSCRIPTION_COLUMNS = [
+    { key: 'subscription', sortable: true },
+    { key: 'customer', sortable: false },
+    { key: 'plan', sortable: true },
+    { key: 'product_code', sortable: true },
+    { key: 'term_end', sortable: true },
+    { key: 'next_billing', sortable: true },
+    { key: 'auto_collect', sortable: true },
+    { key: 'status', sortable: true },
+    { key: 'mrr', sortable: true },
+];
+export const ALL_INVOICING_SUBSCRIPTION_TAB_IDS = [
+    'all',
+    'active',
+    'in_trial',
+    'future',
+    'non_renewing',
+    'paused',
+    'cancelled',
+];
+export const toInvoicingSubscriptionTabId = (v) => stringToUnion(v, ALL_INVOICING_SUBSCRIPTION_TAB_IDS);
+/**
+ * Ordered filter-tab id set owned by CES so the subscription-list tabs live next
+ * to the model rather than being hardcoded in web-components. Tab labels and the
+ * per-tab count lookup stay in the view layer; this only carries the id set and
+ * display order.
+ */
+export const INVOICING_SUBSCRIPTION_TABS = [
+    ...ALL_INVOICING_SUBSCRIPTION_TAB_IDS,
+];

package/lib/esm/view/invoicing/invoicingTransactionDetailView/invoicingTransactionDetailViewEpics.js

@@ -0,0 +1,19 @@
+import { of } from 'rxjs';
+import { catchError, filter, switchMap } from 'rxjs/operators';
+import { updateInvoicingTransactions } from '../../../entity/invoicing/invoicingTransaction/invoicingTransactionReducer';
+import { createZeniAPIStatus, isSuccessResponse } from '../../../responsePayload';
+import { fetchInvoicingTransactionDetail, updateInvoicingTransactionDetail, updateInvoicingTransactionDetailFailure, } from './invoicingTransactionDetailViewReducer';
+export const fetchInvoicingTransactionDetailEpic = (actions$, _state$, zeniAPI) => actions$.pipe(filter(fetchInvoicingTransactionDetail.match), switchMap((action) => {
+    const { id } = action.payload;
+    const apiUrl = `${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0/payments/${id}`;
+    return zeniAPI.getJSON(apiUrl).pipe(switchMap((response) => {
+        if (isSuccessResponse(response) && response.data != null) {
+            return [
+                updateInvoicingTransactions([response.data], 'merge'),
+                updateInvoicingTransactionDetail({ id: response.data.id }),
+            ];
+        }
+        return of(updateInvoicingTransactionDetailFailure(response.status));
+    }), catchError((error) => of(updateInvoicingTransactionDetailFailure(createZeniAPIStatus('Unexpected Error', 'Fetch payment detail REST API call errored out ' +
+        JSON.stringify(error))))));
+}));

package/lib/esm/view/invoicing/invoicingTransactionDetailView/invoicingTransactionDetailViewPayload.js

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

package/lib/esm/view/invoicing/invoicingTransactionDetailView/invoicingTransactionDetailViewReducer.js

@@ -0,0 +1,31 @@
+import { createSlice } from '@reduxjs/toolkit';
+export const initialState = {
+    fetchState: 'Not-Started',
+    error: undefined,
+    id: undefined,
+};
+const invoicingTransactionDetailView = createSlice({
+    name: 'invoicingTransactionDetailView',
+    initialState,
+    reducers: {
+        fetchInvoicingTransactionDetail(draft, action) {
+            draft.id = action.payload.id;
+            draft.fetchState = 'In-Progress';
+            draft.error = undefined;
+        },
+        updateInvoicingTransactionDetail(draft, action) {
+            draft.id = action.payload.id;
+            draft.fetchState = 'Completed';
+            draft.error = undefined;
+        },
+        updateInvoicingTransactionDetailFailure(draft, action) {
+            draft.fetchState = 'Error';
+            draft.error = action.payload;
+        },
+        clearInvoicingTransactionDetailView(draft) {
+            Object.assign(draft, initialState);
+        },
+    },
+});
+export const { fetchInvoicingTransactionDetail, updateInvoicingTransactionDetail, updateInvoicingTransactionDetailFailure, clearInvoicingTransactionDetailView, } = invoicingTransactionDetailView.actions;
+export default invoicingTransactionDetailView.reducer;

package/lib/esm/view/invoicing/invoicingTransactionDetailView/invoicingTransactionDetailViewSelector.js

@@ -0,0 +1,13 @@
+import { getInvoicingTransactionById as getInvoicingTransactionByIdFromState } from '../../../entity/invoicing/invoicingTransaction/invoicingTransactionSelector';
+import { getInvoicingPaymentActionState } from '../paymentAction/paymentActionSelector';
+export const getInvoicingTransactionById = (state, id) => getInvoicingTransactionByIdFromState(state.invoicingTransactionState, id);
+export const getInvoicingTransactionDetail = (state, invoicingTransactionID) => {
+    const { error, fetchState } = state.invoicingTransactionDetailViewState;
+    return {
+        actionState: getInvoicingPaymentActionState(invoicingTransactionID)(state),
+        transaction: getInvoicingTransactionById(state, invoicingTransactionID),
+        fetchState,
+        error,
+        version: 1.0,
+    };
+};

package/lib/esm/view/invoicing/invoicingTransactionDetailView/invoicingTransactionDetailViewState.js

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

package/lib/esm/view/invoicing/invoicingTransactionListView/epics/fetchInvoicingTransactionListEpic.js

@@ -0,0 +1,46 @@
+import { of } from 'rxjs';
+import { catchError, filter, switchMap } from 'rxjs/operators';
+import { updateInvoicingTransactions } from '../../../../entity/invoicing/invoicingTransaction/invoicingTransactionReducer';
+import { createZeniAPIStatus, isSuccessResponse, } from '../../../../responsePayload';
+import { INVOICING_LIST_PAGE_SIZE, applyListSortParams, withQuery, } from '../../invoicingApiHelper';
+import { fetchInvoicingTransactionList, updateInvoicingTransactionList, updateInvoicingTransactionListFailure, } from '../invoicingTransactionListViewReducer';
+const buildQuery = (filters, cursor, sort) => {
+    const params = new URLSearchParams();
+    if (filters.status != null && filters.status.length > 0) {
+        params.set('status', filters.status);
+    }
+    if (filters.type != null && filters.type.length > 0) {
+        params.set('type', filters.type);
+    }
+    if (filters.customerId != null) {
+        params.set('customer_id', filters.customerId);
+    }
+    if (filters.search != null && filters.search.length > 0) {
+        params.set('search', filters.search);
+    }
+    params.set('limit', String(INVOICING_LIST_PAGE_SIZE));
+    if (cursor != null) {
+        params.set('cursor', cursor);
+    }
+    applyListSortParams(params, sort);
+    return params;
+};
+export const fetchInvoicingTransactionListEpic = (actions$, _state$, zeniAPI) => actions$.pipe(filter(fetchInvoicingTransactionList.match), switchMap((action) => {
+    const { filters, cursor, keepExistingListItems, sort } = action.payload;
+    const apiUrl = withQuery(`${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0/payments`, buildQuery(filters, cursor, sort));
+    return zeniAPI.getJSON(apiUrl).pipe(switchMap((response) => {
+        if (isSuccessResponse(response)) {
+            const items = response.data?.items ?? [];
+            return [
+                updateInvoicingTransactions(items, 'merge'),
+                updateInvoicingTransactionList({
+                    ids: items.map((item) => item.id),
+                    nextCursor: response.data?.next_cursor ?? null,
+                    keepExistingListItems,
+                }),
+            ];
+        }
+        return of(updateInvoicingTransactionListFailure(response.status));
+    }), catchError((error) => of(updateInvoicingTransactionListFailure(createZeniAPIStatus('Unexpected Error', 'Fetch payment list REST API call errored out ' +
+        JSON.stringify(error))))));
+}));

package/lib/esm/view/invoicing/invoicingTransactionListView/epics/fetchInvoicingTransactionListPageEpic.js

@@ -0,0 +1,24 @@
+import { concat, from } from 'rxjs';
+import { filter, mergeMap } from 'rxjs/operators';
+import { fetchInvoicingTransactionList, fetchInvoicingTransactionListPage, } from '../invoicingTransactionListViewReducer';
+/**
+ * Fetch unless the endpoint is already loaded or in flight — or always when the
+ * caller forces a refresh via `cacheOverride` (e.g. on a filter/sort change).
+ */
+const shouldFetch = (fetchStateAndError, cacheOverride) => cacheOverride ||
+    (fetchStateAndError.fetchState !== 'Completed' &&
+        fetchStateAndError.fetchState !== 'In-Progress');
+/**
+ * Orchestrates the payments list page: on `fetchInvoicingTransactionListPage`,
+ * fans out to the list fetch, skipping it when data is already cached unless
+ * `cacheOverride` is set (e.g. on a filter/sort change).
+ */
+export const fetchInvoicingTransactionListPageEpic = (actions$, state$) => actions$.pipe(filter(fetchInvoicingTransactionListPage.match), mergeMap((action) => {
+    const { cacheOverride, filters, sort } = action.payload;
+    const state = state$.value.invoicingTransactionListViewState;
+    const pageActions = [];
+    if (shouldFetch({ fetchState: state.fetchState, error: state.error }, cacheOverride)) {
+        pageActions.push(fetchInvoicingTransactionList({ filters, sort }));
+    }
+    return concat(from(pageActions));
+}));

package/lib/esm/view/invoicing/invoicingTransactionListView/invoicingTransactionListViewPayload.js

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

package/lib/esm/view/invoicing/invoicingTransactionListView/invoicingTransactionListViewReducer.js

@@ -0,0 +1,84 @@
+import { createSlice } from '@reduxjs/toolkit';
+export const initialState = {
+    fetchState: 'Not-Started',
+    error: undefined,
+    ids: [],
+    nextCursor: null,
+    filters: {},
+    hasValidState() {
+        return this.fetchState === 'Completed';
+    },
+};
+const invoicingTransactionListView = createSlice({
+    name: 'invoicingTransactionListView',
+    initialState,
+    reducers: {
+        fetchInvoicingTransactionList: {
+            reducer(draft, action) {
+                if (!action.payload.keepExistingListItems) {
+                    draft.ids = [];
+                    draft.nextCursor = null;
+                }
+                draft.filters = action.payload.filters;
+                draft.sort = action.payload.sort;
+                draft.fetchState = 'In-Progress';
+                draft.error = undefined;
+            },
+            prepare(payload) {
+                return {
+                    payload: {
+                        filters: payload.filters ?? {},
+                        cursor: payload.cursor,
+                        keepExistingListItems: payload.keepExistingListItems ?? false,
+                        sort: payload.sort,
+                    },
+                };
+            },
+        },
+        fetchInvoicingTransactionListPage: {
+            reducer(draft, action) {
+                draft.filters = action.payload.filters;
+                draft.sort = action.payload.sort;
+            },
+            prepare(payload) {
+                return {
+                    payload: {
+                        cacheOverride: payload.cacheOverride ?? false,
+                        filters: payload.filters ?? {},
+                        sort: payload.sort,
+                    },
+                };
+            },
+        },
+        updateInvoicingTransactionList(draft, action) {
+            draft.ids = action.payload.keepExistingListItems
+                ? [...new Set([...draft.ids, ...action.payload.ids])]
+                : action.payload.ids;
+            draft.nextCursor = action.payload.nextCursor;
+            draft.fetchState = 'Completed';
+            draft.error = undefined;
+        },
+        updateInvoicingTransactionListFailure(draft, action) {
+            draft.fetchState = 'Error';
+            draft.error = action.payload;
+        },
+        updateInvoicingTransactionFilters(draft, action) {
+            draft.filters = action.payload;
+        },
+        // Reflect a newly recorded payment's transaction in the cached list so the
+        // payments page shows it without refetching. The list view has no counts
+        // slice, so we only prepend the id (dedup/no-op if already present).
+        addInvoicingTransactionToList(draft, action) {
+            const id = action.payload;
+            if (draft.ids.includes(id)) {
+                return;
+            }
+            draft.ids = [id, ...draft.ids];
+        },
+        clearInvoicingTransactionListView(draft) {
+            Object.assign(draft, initialState);
+        },
+    },
+});
+export const { fetchInvoicingTransactionList, fetchInvoicingTransactionListPage, updateInvoicingTransactionList, updateInvoicingTransactionListFailure, updateInvoicingTransactionFilters, addInvoicingTransactionToList, clearInvoicingTransactionListView, } = invoicingTransactionListView.actions;
+export default invoicingTransactionListView.reducer;

package/lib/esm/view/invoicing/invoicingTransactionListView/invoicingTransactionListViewSelector.js

@@ -0,0 +1,19 @@
+import { createSelector } from '@reduxjs/toolkit';
+import { getInvoicingTransactionsByIds } from '../../../entity/invoicing/invoicingTransaction/invoicingTransactionSelector';
+import { INVOICING_TRANSACTION_COLUMNS, INVOICING_TRANSACTION_TABS, } from './invoicingTransactionListViewState';
+/**
+ * Memoized so the denormalized `transactions` array (and the wrapping view
+ * object) keep referential identity until the transaction entity slice or the
+ * list-view slice actually change.
+ */
+export const getInvoicingTransactionListView = createSelector((state) => state.invoicingTransactionState, (state) => state.invoicingTransactionListViewState, (transactionState, listViewState) => ({
+    columns: INVOICING_TRANSACTION_COLUMNS,
+    transactions: getInvoicingTransactionsByIds(transactionState, listViewState.ids),
+    filters: listViewState.filters,
+    nextCursor: listViewState.nextCursor,
+    fetchState: listViewState.fetchState,
+    error: listViewState.error,
+    tabIds: INVOICING_TRANSACTION_TABS,
+    sort: listViewState.sort,
+    version: 1.0,
+}));

package/lib/esm/view/invoicing/invoicingTransactionListView/invoicingTransactionListViewState.js

@@ -0,0 +1,39 @@
+import { stringToUnion } from '../../../commonStateTypes/stringToUnion';
+export const ALL_INVOICING_TRANSACTION_SORT_KEYS = [
+    'transaction',
+    'customer',
+    'method',
+    'date',
+    'type',
+    'gateway',
+    'status',
+    'amount',
+];
+export const toInvoicingTransactionSortKey = (v) => stringToUnion(v, ALL_INVOICING_TRANSACTION_SORT_KEYS);
+export const INVOICING_TRANSACTION_COLUMNS = [
+    { key: 'transaction', sortable: true },
+    { key: 'customer', sortable: true },
+    { key: 'method', sortable: true },
+    { key: 'date', sortable: true },
+    { key: 'type', sortable: true },
+    { key: 'gateway', sortable: true },
+    { key: 'status', sortable: true },
+    { key: 'amount', sortable: true },
+];
+export const ALL_INVOICING_TRANSACTION_TAB_IDS = [
+    'all',
+    'payment',
+    'refund',
+    'authorization',
+    'payment_reversal',
+];
+export const toInvoicingTransactionTabId = (v) => stringToUnion(v, ALL_INVOICING_TRANSACTION_TAB_IDS);
+/**
+ * Ordered filter-tab id set owned by CES so the transaction-list tabs live next
+ * to the model rather than being hardcoded in web-components. Tab labels and the
+ * per-tab count lookup stay in the view layer; this only carries the id set and
+ * display order.
+ */
+export const INVOICING_TRANSACTION_TABS = [
+    ...ALL_INVOICING_TRANSACTION_TAB_IDS,
+];

package/lib/esm/view/invoicing/issueCreditNote/issueCreditNoteEpic.js

@@ -0,0 +1,26 @@
+import { of } from 'rxjs';
+import { catchError, filter, mergeMap } from 'rxjs/operators';
+import { updateInvoicingCreditNotes } from '../../../entity/invoicing/creditNote/creditNoteReducer';
+import { createZeniAPIStatus, isSuccessResponse } from '../../../responsePayload';
+import { fetchInvoiceDetail } from '../invoiceDetail/invoiceDetailReducer';
+import { localDataToIssueCreditNotePayload, } from './issueCreditNotePayload';
+import { issueCreditNoteFailure, issueCreditNoteSuccess, submitIssueCreditNote, } from './issueCreditNoteReducer';
+export const issueCreditNoteEpic = (actions$, state$, zeniAPI) => actions$.pipe(filter(submitIssueCreditNote.match), mergeMap(() => {
+    const { draft } = state$.value.invoicingIssueCreditNoteState;
+    const { invoiceId } = draft;
+    const apiUrl = `${zeniAPI.apiEndPoints.invoicingMicroServiceBaseUrl}/1.0/invoices/${encodeURIComponent(invoiceId)}/issue-credit-note`;
+    const body = localDataToIssueCreditNotePayload(draft);
+    return zeniAPI
+        .postAndGetJSON(apiUrl, body)
+        .pipe(mergeMap((response) => {
+        if (isSuccessResponse(response) && response.data != null) {
+            return [
+                updateInvoicingCreditNotes([response.data], 'merge'),
+                fetchInvoiceDetail({ invoiceId }),
+                issueCreditNoteSuccess({ creditNoteId: response.data.id }),
+            ];
+        }
+        return of(issueCreditNoteFailure(response.status));
+    }), catchError((error) => of(issueCreditNoteFailure(createZeniAPIStatus('Unexpected Error', 'Issue credit note REST API call errored out ' +
+        JSON.stringify(error))))));
+}));

package/lib/esm/view/invoicing/issueCreditNote/issueCreditNoteFormConfig.js

@@ -0,0 +1,13 @@
+export const INVOICING_CREDIT_NOTE_REASON_CODES = [
+    'service_credit',
+    'billing_error',
+    'duplicate_charge',
+    'pricing_correction',
+    'goodwill',
+    'other',
+];
+export const initialIssueCreditNoteFormLocalData = (invoiceId = '') => ({
+    invoiceId,
+    lineItems: [],
+    reasonCode: '',
+});