@zeniai/client-epic-state 5.0.90-beta0ND → 5.0.90-betaAR2

package/lib/view/spendManagement/billPay/billPaySetupApproverView/billPaySetupApproverViewReducer.js

@@ -1,7 +1,7 @@
 "use strict";
 var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.clearBillPaySetupApproverView = exports.setListeningToPusherEvent = exports.clearBillPaySetupApproverViewUpdateData = exports.saveBillPaySetupApproverViewUpdateData = exports.initializeBillPaySetupApproverViewUpdateData = exports.saveBillPaySetupApproverViewUpdatesFailure = exports.saveBillPaySetupApproverViewUpdatesSuccess = exports.saveBillPaySetupApproverViewUpdates = exports.deleteBillPayApprovalRuleFailure = exports.deleteBillPayApprovalRuleSuccess = exports.deleteBillPayApprovalRule = exports.fetchBillPayApproversListFailure = exports.fetchBillPayApproversListSuccess = exports.fetchBillPayApproversList = exports.fetchBillPayApproversDetails = exports.fetchBillPaySetupApproverViewFailure = exports.fetchBillPaySetupApproverViewSuccess = exports.fetchBillPaySetupApproverView = exports.initialState = void 0;
+exports.clearBillPaySetupApproverView = exports.setListeningToPusherEvent = exports.clearBillPaySetupApproverViewUpdateData = exports.saveBillPaySetupApproverViewUpdateData = exports.initializeBillPaySetupApproverViewUpdateData = exports.saveBillPaySetupApproverViewUpdatesFailure = exports.saveBillPaySetupApproverViewUpdatesSuccess = exports.saveBillPaySetupApproverViewUpdates = exports.reorderBillPayApprovalRulesFailure = exports.reorderBillPayApprovalRulesSuccess = exports.reorderBillPayApprovalRules = exports.deleteBillPayApprovalRuleFailure = exports.deleteBillPayApprovalRuleSuccess = exports.deleteBillPayApprovalRule = exports.fetchBillPayApproversListFailure = exports.fetchBillPayApproversListSuccess = exports.fetchBillPayApproversList = exports.fetchBillPayApproversDetails = exports.fetchBillPaySetupApproverViewFailure = exports.fetchBillPaySetupApproverViewSuccess = exports.fetchBillPaySetupApproverView = exports.initialState = void 0;
 const toolkit_1 = require("@reduxjs/toolkit");
 exports.initialState = {
     fetchState: 'Not-Started',
@@ -17,6 +17,7 @@ exports.initialState = {
     newApprovalRuleId: undefined,
     approvalRulesDeleteStatusById: {},
     billPaySetupApproverViewUpdateData: undefined,
+    reorderStatus: { fetchState: 'Not-Started', error: undefined },
     hasValidState() {
         return this.fetchState === 'Completed';
     },
@@ -30,8 +31,11 @@ const billPaySetupApproverView = (0, toolkit_1.createSlice)({
                 draft.fetchState = 'In-Progress';
                 draft.error = undefined;
             },
-            prepare(cacheOverride = false, includeUserRoles = true) {
-                return { payload: { cacheOverride, includeUserRoles } };
+            // Approval Rules 3.0 — `useV3` arrives from the screen connector
+            // (`approval_rule_v3_config` dynamic config) and picks the v1 vs
+            // v2 endpoint in the fetch epic.
+            prepare(cacheOverride = false, includeUserRoles = true, useV3 = false) {
+                return { payload: { cacheOverride, includeUserRoles, useV3 } };
             },
         },
         fetchBillPaySetupApproverViewSuccess: {
@@ -116,8 +120,11 @@ const billPaySetupApproverView = (0, toolkit_1.createSlice)({
                     error: undefined,
                 };
             },
-            prepare(approvalRuleId) {
-                return { payload: { approvalRuleId } };
+            // Approval Rules 3.0 — `useV3` flows from the screen connector
+            // (`approval_rule_v3_config` dynamic config) so the delete epic
+            // can pick the v1 vs v2 endpoint.
+            prepare(approvalRuleId, useV3 = false) {
+                return { payload: { approvalRuleId, useV3 } };
             },
         },
         deleteBillPayApprovalRuleSuccess: {
@@ -149,13 +156,86 @@ const billPaySetupApproverView = (0, toolkit_1.createSlice)({
                 };
             },
         },
-        saveBillPaySetupApproverViewUpdates(draft) {
-            if (draft.billPaySetupApproverViewUpdateData != null) {
-                draft.billPaySetupApproverViewUpdateData.updateStatus = {
-                    fetchState: 'In-Progress',
-                    error: undefined,
-                };
-            }
+        /**
+         * Approval Rules 3.0 — list-page drag-and-drop reorder.
+         *
+         * The trigger action carries the desired ordering as an ID list.
+         * The reducer optimistically replaces 'approvalRuleIds' so the
+         * list page renders the new order immediately; the epic then
+         * fires the PUT and either confirms (success — pulls updated
+         * priorities from the response) or recovers (failure — refetches
+         * the view so we don't strand a stale local order).
+         */
+        reorderBillPayApprovalRules: {
+            reducer(draft, action) {
+                const { approvalRuleIds } = action.payload;
+                draft.reorderStatus = { fetchState: 'In-Progress', error: undefined };
+                // Stash the pre-reorder order so 'Failure' can restore it
+                // synchronously. The epic's refetch on failure remains as a
+                // safety net (covers cases where the server's truth has
+                // drifted from the local snapshot), but the snappy UX path
+                // is the in-memory rollback.
+                draft.reorderRollbackIds = draft.approvalRuleIds;
+                // Optimistic: render new order immediately. On failure, the
+                // reducer restores 'reorderRollbackIds' and the epic refetch
+                // reconciles any drift.
+                draft.approvalRuleIds = approvalRuleIds;
+            },
+            prepare(approvalRuleIds, useV3 = false) {
+                return { payload: { approvalRuleIds, useV3 } };
+            },
+        },
+        reorderBillPayApprovalRulesSuccess: {
+            reducer(draft, action) {
+                const { approvalRuleIds } = action.payload;
+                draft.reorderStatus = { fetchState: 'Completed', error: undefined };
+                // The API response is authoritative — overwrite with the
+                // server's reported order in case it normalised anything.
+                draft.approvalRuleIds = approvalRuleIds;
+                // Reorder succeeded — discard the snapshot so the next
+                // reorder starts from this committed order.
+                draft.reorderRollbackIds = undefined;
+            },
+            prepare(approvalRuleIds) {
+                return { payload: { approvalRuleIds } };
+            },
+        },
+        reorderBillPayApprovalRulesFailure: {
+            reducer(draft, action) {
+                const { status } = action.payload;
+                draft.reorderStatus = { fetchState: 'Error', error: status };
+                // Restore the snapshot taken on the trigger reducer before
+                // the optimistic mutation. The epic still fires a refetch
+                // alongside the failure action for cross-tab drift recovery,
+                // but locally the user sees their last good order instantly.
+                if (draft.reorderRollbackIds != null) {
+                    draft.approvalRuleIds = draft.reorderRollbackIds;
+                    draft.reorderRollbackIds = undefined;
+                }
+            },
+            prepare(status) {
+                return { payload: { status } };
+            },
+        },
+        saveBillPaySetupApproverViewUpdates: {
+            // Approval Rules 3.0 — `useV3` is sourced from the
+            // `approval_rule_v3_config` dynamic config in the screen
+            // connector. The reducer doesn't read it (the field only
+            // matters in the save epic), but it must be declared so the
+            // action's payload type is correctly inferred for downstream
+            // consumers.
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            reducer(draft, _action) {
+                if (draft.billPaySetupApproverViewUpdateData != null) {
+                    draft.billPaySetupApproverViewUpdateData.updateStatus = {
+                        fetchState: 'In-Progress',
+                        error: undefined,
+                    };
+                }
+            },
+            prepare(useV3) {
+                return { payload: { useV3 } };
+            },
         },
         saveBillPaySetupApproverViewUpdatesSuccess: {
             reducer(draft, action) {
@@ -244,5 +324,5 @@ const billPaySetupApproverView = (0, toolkit_1.createSlice)({
         },
     },
 });
-_a = billPaySetupApproverView.actions, exports.fetchBillPaySetupApproverView = _a.fetchBillPaySetupApproverView, exports.fetchBillPaySetupApproverViewSuccess = _a.fetchBillPaySetupApproverViewSuccess, exports.fetchBillPaySetupApproverViewFailure = _a.fetchBillPaySetupApproverViewFailure, exports.fetchBillPayApproversDetails = _a.fetchBillPayApproversDetails, exports.fetchBillPayApproversList = _a.fetchBillPayApproversList, exports.fetchBillPayApproversListSuccess = _a.fetchBillPayApproversListSuccess, exports.fetchBillPayApproversListFailure = _a.fetchBillPayApproversListFailure, exports.deleteBillPayApprovalRule = _a.deleteBillPayApprovalRule, exports.deleteBillPayApprovalRuleSuccess = _a.deleteBillPayApprovalRuleSuccess, exports.deleteBillPayApprovalRuleFailure = _a.deleteBillPayApprovalRuleFailure, exports.saveBillPaySetupApproverViewUpdates = _a.saveBillPaySetupApproverViewUpdates, exports.saveBillPaySetupApproverViewUpdatesSuccess = _a.saveBillPaySetupApproverViewUpdatesSuccess, exports.saveBillPaySetupApproverViewUpdatesFailure = _a.saveBillPaySetupApproverViewUpdatesFailure, exports.initializeBillPaySetupApproverViewUpdateData = _a.initializeBillPaySetupApproverViewUpdateData, exports.saveBillPaySetupApproverViewUpdateData = _a.saveBillPaySetupApproverViewUpdateData, exports.clearBillPaySetupApproverViewUpdateData = _a.clearBillPaySetupApproverViewUpdateData, exports.setListeningToPusherEvent = _a.setListeningToPusherEvent, exports.clearBillPaySetupApproverView = _a.clearBillPaySetupApproverView;
+_a = billPaySetupApproverView.actions, exports.fetchBillPaySetupApproverView = _a.fetchBillPaySetupApproverView, exports.fetchBillPaySetupApproverViewSuccess = _a.fetchBillPaySetupApproverViewSuccess, exports.fetchBillPaySetupApproverViewFailure = _a.fetchBillPaySetupApproverViewFailure, exports.fetchBillPayApproversDetails = _a.fetchBillPayApproversDetails, exports.fetchBillPayApproversList = _a.fetchBillPayApproversList, exports.fetchBillPayApproversListSuccess = _a.fetchBillPayApproversListSuccess, exports.fetchBillPayApproversListFailure = _a.fetchBillPayApproversListFailure, exports.deleteBillPayApprovalRule = _a.deleteBillPayApprovalRule, exports.deleteBillPayApprovalRuleSuccess = _a.deleteBillPayApprovalRuleSuccess, exports.deleteBillPayApprovalRuleFailure = _a.deleteBillPayApprovalRuleFailure, exports.reorderBillPayApprovalRules = _a.reorderBillPayApprovalRules, exports.reorderBillPayApprovalRulesSuccess = _a.reorderBillPayApprovalRulesSuccess, exports.reorderBillPayApprovalRulesFailure = _a.reorderBillPayApprovalRulesFailure, exports.saveBillPaySetupApproverViewUpdates = _a.saveBillPaySetupApproverViewUpdates, exports.saveBillPaySetupApproverViewUpdatesSuccess = _a.saveBillPaySetupApproverViewUpdatesSuccess, exports.saveBillPaySetupApproverViewUpdatesFailure = _a.saveBillPaySetupApproverViewUpdatesFailure, exports.initializeBillPaySetupApproverViewUpdateData = _a.initializeBillPaySetupApproverViewUpdateData, exports.saveBillPaySetupApproverViewUpdateData = _a.saveBillPaySetupApproverViewUpdateData, exports.clearBillPaySetupApproverViewUpdateData = _a.clearBillPaySetupApproverViewUpdateData, exports.setListeningToPusherEvent = _a.setListeningToPusherEvent, exports.clearBillPaySetupApproverView = _a.clearBillPaySetupApproverView;
 exports.default = billPaySetupApproverView.reducer;

package/lib/view/spendManagement/billPay/billPaySetupApproverView/billPaySetupApproverViewState.d.ts

@@ -9,8 +9,24 @@ export interface BillPaySetupApproverViewState extends FetchedState {
         attributes: AttributeType[];
         fetchStatus: FetchStateAndError;
     };
+    /**
+     * Tracks the in-flight status of the list-page reorder PUT
+     * (approval-rules-v2/reorder). The reducer optimistically updates
+     * 'approvalRuleIds' on the trigger action. On Failure the reducer
+     * restores the snapshot below before the epic's safety-net refetch
+     * fires, so the UI bounces back to the user's last good order
+     * without waiting for a network roundtrip.
+     */
+    reorderStatus: FetchStateAndError;
     affectedEntityIds?: ID[];
     billPaySetupApproverViewUpdateData?: ApproverViewUpdateData;
     listeningToPusherEvent?: boolean;
     newApprovalRuleId?: ID;
+    /**
+     * Pre-reorder snapshot of 'approvalRuleIds'. Stashed on the trigger
+     * reducer right before the optimistic mutation and consumed on
+     * Failure to restore the previous order. Cleared on Success so the
+     * next reorder starts from a clean slate.
+     */
+    reorderRollbackIds?: ID[];
 }

package/lib/view/spendManagement/billPay/billPaySetupApproverView/epic/deleteBillPayApprovalRuleEpic.js

@@ -9,9 +9,17 @@ const userReducer_1 = require("../../../../../entity/user/userReducer");
 const responsePayload_1 = require("../../../../../responsePayload");
 const billPaySetupApproverViewReducer_1 = require("../billPaySetupApproverViewReducer");
 const deleteBillPayApprovalRuleEpic = (actions$, _state$, zeniAPI) => actions$.pipe((0, operators_1.filter)(billPaySetupApproverViewReducer_1.deleteBillPayApprovalRule.match), (0, operators_1.switchMap)((action) => {
-    const { approvalRuleId } = action.payload;
+    const { approvalRuleId, useV3 } = action.payload;
+    // Approval Rules 3.0 — flag-gated endpoint selection.
+    // Explicit `=== true` keeps `strict-boolean-expressions` happy
+    // when RTK's payload type widens to `any` in some configs.
+    const endpoint = useV3 === true
+        ? `${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules-v2`
+        : `${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules`;
     return zeniAPI
-        .deleteAndGetJSON(`${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules`, { approval_rule_id: approvalRuleId })
+        .deleteAndGetJSON(endpoint, {
+        approval_rule_id: approvalRuleId,
+    })
         .pipe((0, operators_1.mergeMap)((response) => {
         if ((0, responsePayload_1.isSuccessResponse)(response) && response.data != null) {
             const approvalRuleIds = response.data.approval_rules.map((approvalRule) => approvalRule.approval_rule_id);

package/lib/view/spendManagement/billPay/billPaySetupApproverView/epic/fetchBillPaySetupApproverViewEpic.js

@@ -9,7 +9,7 @@ const userReducer_1 = require("../../../../../entity/user/userReducer");
 const responsePayload_1 = require("../../../../../responsePayload");
 const billPaySetupApproverViewReducer_1 = require("../billPaySetupApproverViewReducer");
 const fetchBillPaySetupApproverViewEpic = (actions$, state$, zeniAPI) => actions$.pipe((0, operators_1.filter)(billPaySetupApproverViewReducer_1.fetchBillPaySetupApproverView.match), (0, operators_1.switchMap)((action) => {
-    const { cacheOverride } = action.payload;
+    const { cacheOverride, useV3 } = action.payload;
     const { billPaySetupApproverViewState, approvalRuleState } = state$.value;
     const approvalRules = (0, approvalRuleSelector_1.getApprovalRulesByIds)(approvalRuleState, billPaySetupApproverViewState.approvalRuleIds);
     if (cacheOverride === true ||
@@ -17,9 +17,13 @@ const fetchBillPaySetupApproverViewEpic = (actions$, state$, zeniAPI) => actions
             billPaySetupApproverViewState.approvalRuleIds.length ||
         (billPaySetupApproverViewState.hasValidState() === false &&
             billPaySetupApproverViewState.fetchState !== 'In-Progress')) {
-        return zeniAPI
-            .getJSON(`${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules`)
-            .pipe((0, operators_1.mergeMap)((response) => {
+        // Approval Rules 3.0 — flag-gated endpoint selection.
+        // Explicit `=== true` keeps `strict-boolean-expressions` happy
+        // when RTK's payload type widens to `any` in some configs.
+        const endpoint = useV3 === true
+            ? `${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules-v2`
+            : `${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules`;
+        return zeniAPI.getJSON(endpoint).pipe((0, operators_1.mergeMap)((response) => {
             if ((0, responsePayload_1.isSuccessResponse)(response) && response.data != null) {
                 const approvalRuleIds = response.data.approval_rules.map((approvalRule) => approvalRule.approval_rule_id);
                 const actions = [

package/lib/view/spendManagement/billPay/billPaySetupApproverView/epic/initializeBillPaySetupApproverViewUpdateDataEpic.js

@@ -11,16 +11,20 @@ const initializeBillPaySetupApproverViewUpdateDataEpic = (actions$, state$) => a
     if (approvalRuleId != null) {
         const approvalRule = (0, approvalRuleSelector_1.getApprovalRuleById)(state$.value.approvalRuleState, approvalRuleId);
         if (approvalRule != null) {
-            const criteria = approvalRule.criteria[0];
-            const range = criteria?.range;
             const billPaySetupApproverViewUpdateData = {
                 approvalRuleId,
                 steps: approvalRule.steps,
                 criteria: {
-                    rangeType: criteria?.rangeType,
-                    rangeEntity: criteria?.rangeEntity,
-                    range,
+                    amount: (0, approvalRuleSelector_1.getAmountCriteria)(approvalRule.criteria),
+                    vendor: (0, approvalRuleSelector_1.getVendorCriteria)(approvalRule.criteria),
+                    department: (0, approvalRuleSelector_1.getDepartmentCriteria)(approvalRule.criteria),
                 },
+                // Approval Rules 3.0 — seed rule-level fields so the form can
+                // round-trip them on edit. Each may be undefined on legacy rules.
+                name: approvalRule.name,
+                description: approvalRule.description,
+                separationOfDuties: approvalRule.separationOfDuties,
+                isFallback: approvalRule.isFallback,
             };
             fetchActions.push((0, billPaySetupApproverViewReducer_1.clearBillPaySetupApproverViewUpdateData)(), (0, billPaySetupApproverViewReducer_1.saveBillPaySetupApproverViewUpdateData)(billPaySetupApproverViewUpdateData));
         }
@@ -28,7 +32,7 @@ const initializeBillPaySetupApproverViewUpdateDataEpic = (actions$, state$) => a
     else {
         const billPaySetupApproverViewCreateData = {
             steps: [],
-            criteria: undefined,
+            criteria: {},
         };
         fetchActions.push((0, billPaySetupApproverViewReducer_1.clearBillPaySetupApproverViewUpdateData)(), (0, billPaySetupApproverViewReducer_1.saveBillPaySetupApproverViewUpdateData)(billPaySetupApproverViewCreateData));
     }

package/lib/view/spendManagement/billPay/billPaySetupApproverView/epic/reorderBillPayApprovalRulesEpic.d.ts

@@ -0,0 +1,23 @@
+import { ActionsObservable, StateObservable } from 'redux-observable';
+import { Observable } from 'rxjs';
+import { updateApprovalRules } from '../../../../../entity/approvalRule/approvalRuleReducer';
+import { openSnackbar } from '../../../../../entity/snackbar/snackbarReducer';
+import { RootState } from '../../../../../reducer';
+import { ZeniAPI } from '../../../../../zeniAPI';
+import { fetchBillPaySetupApproverView, reorderBillPayApprovalRules, reorderBillPayApprovalRulesFailure, reorderBillPayApprovalRulesSuccess } from '../billPaySetupApproverViewReducer';
+/**
+ * Approval Rules 3.0 — list-page drag-and-drop reorder.
+ *
+ * PUT /bill-pay/approval-rules-v2/reorder with the new ID order in
+ * 'rule_ids'. Returns the updated 'approval_rules' (with refreshed
+ * priorities). The reducer optimistically updated 'approvalRuleIds'
+ * on the trigger action, so:
+ *   - on success: dispatch the updated approval rule payloads into
+ *     the entity slice, then 'Success' to normalise the slice's
+ *     ordered ID list to whatever the server returned.
+ *   - on failure: snackbar + dispatch 'fetchBillPaySetupApproverView'
+ *     with cacheOverride to roll the optimistic state back to server
+ *     truth.
+ */
+export type ActionType = ReturnType<typeof reorderBillPayApprovalRules> | ReturnType<typeof reorderBillPayApprovalRulesSuccess> | ReturnType<typeof reorderBillPayApprovalRulesFailure> | ReturnType<typeof updateApprovalRules> | ReturnType<typeof fetchBillPaySetupApproverView> | ReturnType<typeof openSnackbar>;
+export declare const reorderBillPayApprovalRulesEpic: (actions$: ActionsObservable<ActionType>, _state$: StateObservable<RootState>, zeniAPI: ZeniAPI) => Observable<ActionType>;

package/lib/view/spendManagement/billPay/billPaySetupApproverView/epic/reorderBillPayApprovalRulesEpic.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.reorderBillPayApprovalRulesEpic = void 0;
+const rxjs_1 = require("rxjs");
+const operators_1 = require("rxjs/operators");
+const approvalRuleReducer_1 = require("../../../../../entity/approvalRule/approvalRuleReducer");
+const snackbarReducer_1 = require("../../../../../entity/snackbar/snackbarReducer");
+const responsePayload_1 = require("../../../../../responsePayload");
+const billPaySetupApproverViewReducer_1 = require("../billPaySetupApproverViewReducer");
+const reorderBillPayApprovalRulesEpic = (actions$, _state$, zeniAPI) => actions$.pipe((0, operators_1.filter)(billPaySetupApproverViewReducer_1.reorderBillPayApprovalRules.match), (0, operators_1.switchMap)((action) => {
+    const { approvalRuleIds, useV3 } = action.payload;
+    // Approval Rules 3.0 — flag-gated endpoint selection. Mirrors
+    // the pattern used by delete + fetch epics: the v3 dev host
+    // until the production base URL ships the v2 reorder route.
+    const endpoint = `${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules-v2/reorder`;
+    return zeniAPI
+        .putAndGetJSON(endpoint, {
+        rule_ids: approvalRuleIds,
+    })
+        .pipe((0, operators_1.mergeMap)((response) => {
+        if ((0, responsePayload_1.isSuccessResponse)(response) && response.data != null) {
+            const serverOrderedIds = response.data.approval_rules.map((approvalRule) => approvalRule.approval_rule_id);
+            const actions = [
+                (0, approvalRuleReducer_1.updateApprovalRules)(response.data.approval_rules),
+                (0, billPaySetupApproverViewReducer_1.reorderBillPayApprovalRulesSuccess)(serverOrderedIds),
+                (0, snackbarReducer_1.openSnackbar)({
+                    messageSection: `bill_pay_approval_reorder`,
+                    messageText: 'success',
+                    type: 'success',
+                }),
+            ];
+            return (0, rxjs_1.from)(actions);
+        }
+        else {
+            const recovery = [
+                (0, billPaySetupApproverViewReducer_1.reorderBillPayApprovalRulesFailure)(response.status),
+                (0, snackbarReducer_1.openSnackbar)({
+                    messageSection: `bill_pay_approval_reorder`,
+                    messageText: 'failed',
+                    type: 'error',
+                }),
+                // Refetch to revert the optimistic order to server truth.
+                (0, billPaySetupApproverViewReducer_1.fetchBillPaySetupApproverView)(true, true, useV3),
+            ];
+            return (0, rxjs_1.from)(recovery);
+        }
+    }), (0, operators_1.catchError)((error) => (0, rxjs_1.from)([
+        (0, billPaySetupApproverViewReducer_1.reorderBillPayApprovalRulesFailure)((0, responsePayload_1.createZeniAPIStatus)('Unexpected Error', 'Reorder Bill Pay Approval Rules errored out' +
+            JSON.stringify(error))),
+        (0, snackbarReducer_1.openSnackbar)({
+            messageSection: `bill_pay_approval_reorder`,
+            messageText: 'failed',
+            type: 'error',
+        }),
+        (0, billPaySetupApproverViewReducer_1.fetchBillPaySetupApproverView)(true, true, useV3),
+    ])));
+}));
+exports.reorderBillPayApprovalRulesEpic = reorderBillPayApprovalRulesEpic;

package/lib/view/spendManagement/billPay/billPaySetupApproverView/epic/saveBillPaySetupApproverViewUpdatesEpic.js

@@ -9,14 +9,23 @@ const userReducer_1 = require("../../../../../entity/user/userReducer");
 const responsePayload_1 = require("../../../../../responsePayload");
 const billPaySetupApproverViewReducer_1 = require("../billPaySetupApproverViewReducer");
 const commonPayload_1 = require("../types/commonPayload");
-const saveBillPaySetupApproverViewUpdatesEpic = (actions$, state$, zeniAPI) => actions$.pipe((0, operators_1.filter)(billPaySetupApproverViewReducer_1.saveBillPaySetupApproverViewUpdates.match), (0, operators_1.switchMap)(() => {
+const saveBillPaySetupApproverViewUpdatesEpic = (actions$, state$, zeniAPI) => actions$.pipe((0, operators_1.filter)(billPaySetupApproverViewReducer_1.saveBillPaySetupApproverViewUpdates.match), (0, operators_1.switchMap)((action) => {
     const { billPaySetupApproverViewState } = state$.value;
     const billPaySetupApproverViewUpdateData = billPaySetupApproverViewState.billPaySetupApproverViewUpdateData;
     if (billPaySetupApproverViewUpdateData != null &&
         billPaySetupApproverViewUpdateData.data != null) {
-        const payload = (0, commonPayload_1.toApprovalChangableInfoPayload)(billPaySetupApproverViewUpdateData.data);
+        // Approval Rules 3.0 — gate URL + write-side payload mapper on
+        // the `approval_rule_v3_config` dynamic config. `useV3` arrives
+        // on the action payload from the screen connector.
+        const { useV3 } = action.payload;
+        const payload = useV3
+            ? (0, commonPayload_1.toApprovalChangableInfoPayload)(billPaySetupApproverViewUpdateData.data)
+            : (0, commonPayload_1.toApprovalChangableInfoPayloadV1)(billPaySetupApproverViewUpdateData.data);
+        const endpoint = useV3
+            ? `${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules-v2`
+            : `${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules`;
         return zeniAPI
-            .postAndGetJSON(`${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/bill-pay/approval-rules`, payload)
+            .postAndGetJSON(endpoint, payload)
             .pipe((0, operators_1.mergeMap)((response) => {
             if ((0, responsePayload_1.isSuccessResponse)(response) && response.data != null) {
                 const approvalRuleIds = response.data.approval_rules.map((approvalRule) => approvalRule.approval_rule_id);

package/lib/view/spendManagement/billPay/billPaySetupApproverView/types/commonPayload.d.ts

@@ -14,9 +14,58 @@ interface ApproverViewStepPayload extends Omit<StepPayload, 'actors'> {
 }
 interface ApprovalUpdatableInfoPayload {
     approval_rule_id: ID;
-    criteria: CriteriaPayload[];
+    criteria: CriteriaPayload;
     is_applicable_on_pending_approval_entity: boolean;
     steps: ApproverViewStepPayload[];
+    description?: string;
+    is_fallback?: boolean;
+    is_separation_of_duty_enabled?: boolean;
+    /**
+     * Approval Rules 3.0 — rule-level wire fields. The backend accepts these
+     * as optional today; once 3.0 ships they become first-class. The SoD
+     * field name matches the GET response shape (confirmed with backend),
+     * so the same identifier flows both directions on the wire.
+     */
+    name?: string;
+}
+/**
+ * V1 / pre-3.0 wire shape. Kept so the rollback flag (gated by
+ * `approval_rule_v3_config` dynamic config) can target the original
+ * `/approval-rules` endpoint with the legacy `{rangeType, rangeEntity, range}`
+ * criteria. None of the 3.0 rule-level fields are sent.
+ */
+interface ApprovalUpdatableInfoPayloadV1 {
+    criteria: {
+        range: {
+            max: {
+                amount: number;
+                currencyCode: string;
+                currencySymbol: string;
+            };
+            min: {
+                amount: number;
+                currencyCode: string;
+                currencySymbol: string;
+            };
+        };
+        rangeEntity: 'currency';
+        rangeType: 'range';
+    };
+    is_applicable_on_pending_approval_entity: boolean;
+    steps: ApproverViewStepPayload[];
+    approval_rule_id?: ID;
 }
 export declare const toApprovalChangableInfoPayload: (approverViewUpdateData: ApprovalRuleUpdateData | ApprovalRuleCreateData) => Partial<ApprovalUpdatableInfoPayload>;
+/**
+ * V1 wire mapper — used when `approval_rule_v3_config` resolves to OFF
+ * for the current tenant. Translates the form-side amount criteria into
+ * the legacy `{rangeType, rangeEntity, range: {min, max}}` shape. The
+ * V1 backend does not understand vendor / department criteria or the
+ * rule-level 3.0 fields, so those are dropped on the wire.
+ *
+ * The form-side amount slot is always read as a `range`-style criteria
+ * here: V1 schemas only supported ranges, so an absent `min` or `max`
+ * falls back to `0` / `Number.MAX_SAFE_INTEGER`.
+ */
+export declare const toApprovalChangableInfoPayloadV1: (approverViewUpdateData: ApprovalRuleUpdateData | ApprovalRuleCreateData) => Partial<ApprovalUpdatableInfoPayloadV1>;
 export {};

package/lib/view/spendManagement/billPay/billPaySetupApproverView/types/commonPayload.js

@@ -1,23 +1,51 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.toApprovalChangableInfoPayload = void 0;
+exports.toApprovalChangableInfoPayloadV1 = exports.toApprovalChangableInfoPayload = void 0;
 const toApprovalChangableInfoPayload = (approverViewUpdateData) => {
-    let criteriaPayload = [];
+    // Form-side criteria is a structured object with optional slots for
+    // amount / vendor / department; flatten it into the wire format's
+    // `conditions[]` array.
+    let criteriaPayload;
     if (approverViewUpdateData.criteria != null) {
-        const criteria = approverViewUpdateData.criteria;
-        const { rangeType, rangeEntity, range } = criteria;
-        const { min, max } = range;
-        const { currencyCode, currencySymbol } = min;
-        criteriaPayload = [
-            {
-                type: rangeType,
-                range_entity: rangeEntity,
-                min: min.amount,
-                max: max?.amount ?? null,
-                currency_code: currencyCode,
-                currency_symbol: currencySymbol,
-            },
-        ];
+        const { amount, vendor, department } = approverViewUpdateData.criteria;
+        const conditions = [];
+        if (amount?.min != null) {
+            conditions.push({
+                field: 'amount',
+                type: 'gte',
+                value: amount.min.amount,
+            });
+        }
+        if (amount?.max != null) {
+            conditions.push({
+                field: 'amount',
+                type: 'lte',
+                value: amount.max.amount,
+            });
+        }
+        if (vendor != null && vendor.vendorIds.length > 0) {
+            conditions.push({
+                field: 'vendor_id',
+                type: vendor.operator === 'is_not' ? 'not_in' : 'in',
+                value: vendor.vendorIds,
+            });
+        }
+        if (department != null && department.departmentIds.length > 0) {
+            conditions.push({
+                field: 'department_id',
+                type: department.operator === 'is_not' ? 'not_in' : 'in',
+                value: department.departmentIds,
+            });
+        }
+        if (conditions.length > 0) {
+            const currency = amount?.min ?? amount?.max ?? null;
+            criteriaPayload = {
+                conditions,
+                criteria_operator: 'and',
+                currency_code: currency?.currencyCode ?? 'USD',
+                currency_symbol: currency?.currencySymbol ?? '$',
+            };
+        }
     }
     const steps = approverViewUpdateData.steps.map((step) => {
         return {
@@ -38,13 +66,92 @@ const toApprovalChangableInfoPayload = (approverViewUpdateData) => {
     });
     const isUpdate = approverViewUpdateData.approvalRuleId != null;
     const payload = {
-        criteria: criteriaPayload,
         steps,
         is_applicable_on_pending_approval_entity: approverViewUpdateData.isApplicableOnPendingApprovalEntity ?? true,
     };
+    if (criteriaPayload != null) {
+        payload.criteria = criteriaPayload;
+    }
+    // Approval Rules 3.0 — surface rule-level fields when the form set them.
+    // Send only what the user actually entered: an undefined value means
+    // "no opinion" and stays off the wire.
+    if (approverViewUpdateData.name != null) {
+        payload.name = approverViewUpdateData.name;
+    }
+    if (approverViewUpdateData.description != null) {
+        payload.description = approverViewUpdateData.description;
+    }
+    if (approverViewUpdateData.separationOfDuties != null) {
+        payload.is_separation_of_duty_enabled =
+            approverViewUpdateData.separationOfDuties;
+    }
+    if (approverViewUpdateData.isFallback != null) {
+        payload.is_fallback = approverViewUpdateData.isFallback;
+    }
     if (isUpdate) {
         payload.approval_rule_id = approverViewUpdateData.approvalRuleId;
     }
     return payload;
 };
 exports.toApprovalChangableInfoPayload = toApprovalChangableInfoPayload;
+/**
+ * V1 wire mapper — used when `approval_rule_v3_config` resolves to OFF
+ * for the current tenant. Translates the form-side amount criteria into
+ * the legacy `{rangeType, rangeEntity, range: {min, max}}` shape. The
+ * V1 backend does not understand vendor / department criteria or the
+ * rule-level 3.0 fields, so those are dropped on the wire.
+ *
+ * The form-side amount slot is always read as a `range`-style criteria
+ * here: V1 schemas only supported ranges, so an absent `min` or `max`
+ * falls back to `0` / `Number.MAX_SAFE_INTEGER`.
+ */
+const toApprovalChangableInfoPayloadV1 = (approverViewUpdateData) => {
+    const amount = approverViewUpdateData.criteria?.amount;
+    const minAmount = amount?.min;
+    const maxAmount = amount?.max;
+    const currencyCode = minAmount?.currencyCode ?? maxAmount?.currencyCode ?? 'USD';
+    const currencySymbol = minAmount?.currencySymbol ?? maxAmount?.currencySymbol ?? '$';
+    const steps = approverViewUpdateData.steps.map((step) => {
+        return {
+            action: step.action,
+            operator: step.operator,
+            actors: step.actors
+                .filter((actor) => actor.subType !== 'admin')
+                .map((actor) => {
+                return {
+                    type: actor.type,
+                    id: actor.userId ?? null,
+                    sub_type: actor.subType ?? null,
+                    id_type: actor.idType ?? null,
+                    is_implicit_actor: actor.isImplicitActor ?? false,
+                };
+            }),
+        };
+    });
+    const isUpdate = approverViewUpdateData.approvalRuleId != null;
+    const payload = {
+        steps,
+        is_applicable_on_pending_approval_entity: approverViewUpdateData.isApplicableOnPendingApprovalEntity ?? true,
+        criteria: {
+            rangeType: 'range',
+            rangeEntity: 'currency',
+            range: {
+                min: {
+                    amount: minAmount?.amount ?? 0,
+                    currencyCode,
+                    currencySymbol,
+                },
+                max: {
+                    amount: maxAmount?.amount ?? Number.MAX_SAFE_INTEGER,
+                    currencyCode,
+                    currencySymbol,
+                },
+            },
+        },
+    };
+    if (isUpdate) {
+        payload.approval_rule_id = approverViewUpdateData.approvalRuleId;
+    }
+    return payload;
+};
+exports.toApprovalChangableInfoPayloadV1 = toApprovalChangableInfoPayloadV1;

package/lib/view/spendManagement/billPay/billPaySetupApproverView/types/commonState.d.ts

@@ -1,19 +1,45 @@
 import { FetchStateAndError, ID } from '../../../../../commonStateTypes/common';
-import { Criteria, Step } from '../../../../../entity/approvalRule/approvalRuleState';
+import { AmountCriteria, DepartmentCriteria, Step, VendorCriteria } from '../../../../../entity/approvalRule/approvalRuleState';
 export type ApprovalUpdateActionType = 'approval_create' | 'approval_update';
 export interface ApproverViewUpdateData {
     type: ApprovalUpdateActionType;
     updateStatus: FetchStateAndError;
     data?: ApprovalRuleUpdateData | ApprovalRuleCreateData;
 }
-export interface ApprovalRuleUpdateData {
+/**
+ * Form-side criteria shape used by the rule create/edit form.
+ *
+ * Each condition kind gets its own optional slot, mirroring how the UI
+ * edits them as distinct rows. At most one of each kind is present; this
+ * matches the design constraint that each condition type can be added once.
+ */
+export interface ApprovalRuleFormCriteria {
+    amount?: AmountCriteria;
+    department?: DepartmentCriteria;
+    vendor?: VendorCriteria;
+}
+/**
+ * Rule-level fields shared by both create and update flows.
+ *
+ * These come from the 3.0 design: the form now owns a name, an optional
+ * description, an optional Separation-of-Duties toggle, and a flag that
+ * marks the rule as the org-wide fallback rule. They live alongside
+ * criteria/steps but are not part of either.
+ */
+export interface ApprovalRuleFormBase {
+    description?: string;
+    isFallback?: boolean;
+    name?: string;
+    separationOfDuties?: boolean;
+}
+export interface ApprovalRuleUpdateData extends ApprovalRuleFormBase {
     approvalRuleId: ID;
-    criteria: Criteria;
+    criteria: ApprovalRuleFormCriteria;
     steps: Step[];
     isApplicableOnPendingApprovalEntity?: boolean;
 }
-export interface ApprovalRuleCreateData {
-    criteria: Criteria;
+export interface ApprovalRuleCreateData extends ApprovalRuleFormBase {
+    criteria: ApprovalRuleFormCriteria;
     steps: Step[];
     isApplicableOnPendingApprovalEntity?: boolean;
 }