@zeniai/client-epic-state 5.3.27 → 5.3.28

package/lib/entity/approvalRule/approvalRuleSelector.d.ts

@@ -1,6 +1,6 @@
 import { ID } from '../../commonStateTypes/common';
 import { EntityType } from '../entityApprovalStatus/entityApprovalStatusState';
-import { AmountCriteria, ApprovalRule, ApprovalRuleState, Criteria, DepartmentCriteria, VendorCriteria } from './approvalRuleState';
+import { Actor, AmountCriteria, ApprovalRule, ApprovalRuleState, Criteria, DepartmentCriteria, Step, VendorCriteria } from './approvalRuleState';
 export declare function getApprovalRuleById(approvalRuleState: ApprovalRuleState, approvalRuleId: ID): ApprovalRule | undefined;
 export declare function getApprovalRulesByIds(approvalRuleState: ApprovalRuleState, approvalRuleIds: ID[]): ApprovalRule[];
 /**
@@ -26,3 +26,10 @@ export declare function getApprovalRulesByEntityType(approvalRuleState: Approval
  * list page and is used to handle bills/reimbursements that match no other rule.
  */
 export declare function getFallbackApprovalRule(approvalRuleState: ApprovalRuleState, entityType: EntityType): ApprovalRule | undefined;
+/**
+ * Non-user approvers to show for a fallback-rule step in the draft approval
+ * preview. Implicit actors (e.g. the Admin the platform adds) are shown only
+ * when the step has no explicit approver, so the step always has someone to
+ * approve it without listing Admin next to an explicit approver.
+ */
+export declare function getFallbackStepNonUserActors(step: Step): Actor[];

package/lib/entity/approvalRule/approvalRuleSelector.js

@@ -7,6 +7,7 @@ exports.getVendorCriteria = getVendorCriteria;
 exports.getDepartmentCriteria = getDepartmentCriteria;
 exports.getApprovalRulesByEntityType = getApprovalRulesByEntityType;
 exports.getFallbackApprovalRule = getFallbackApprovalRule;
+exports.getFallbackStepNonUserActors = getFallbackStepNonUserActors;
 function getApprovalRuleById(approvalRuleState, approvalRuleId) {
     return approvalRuleState.approvalRuleById[approvalRuleId] ?? undefined;
 }
@@ -51,3 +52,14 @@ function getApprovalRulesByEntityType(approvalRuleState, entityType) {
 function getFallbackApprovalRule(approvalRuleState, entityType) {
     return Object.values(approvalRuleState.approvalRuleById).find((rule) => rule.entityType === entityType && rule.isFallback === true);
 }
+/**
+ * Non-user approvers to show for a fallback-rule step in the draft approval
+ * preview. Implicit actors (e.g. the Admin the platform adds) are shown only
+ * when the step has no explicit approver, so the step always has someone to
+ * approve it without listing Admin next to an explicit approver.
+ */
+function getFallbackStepNonUserActors(step) {
+    const hasExplicitApprover = step.actors.some((actor) => actor.isImplicitActor === false);
+    return step.actors.filter((actor) => actor.type !== 'user' &&
+        (!hasExplicitApprover || actor.isImplicitActor === false));
+}

package/lib/entity/approvalRule/attributeApprovers.d.ts

@@ -0,0 +1,26 @@
+import { ID } from '../../commonStateTypes/common';
+import { User, UserState } from '../user/userState';
+import { AttributeType } from './approvalRuleState';
+/**
+ * Who a user-attribute approver role (vendor owner, manager, manager's
+ * manager) resolves to, for the draft approval preview.
+ *
+ * Per role:
+ *   - `User`  → resolves to this person.
+ *   - `null`  → known to resolve to no one; the backend routes the step to
+ *               Admin, so the preview shows "Admin".
+ *   - absent  → not known yet (e.g. no vendor picked, or the mapping was not
+ *               fetched); the preview keeps the role label.
+ */
+export type AttributeApprovers = Partial<Record<AttributeType, User | null>>;
+/**
+ * @param vendorOwnerId `undefined` = no vendor selected (unknown),
+ *   `null` = vendor selected but it has no owner, otherwise the owner's id.
+ * @param attributeUserIdMapping backend `attribute_sub_type_to_user_id_mapping`
+ *   for the submitter; `undefined` when it was not fetched (unknown). When
+ *   present, a missing manager / manager_of_manager key means "no one".
+ */
+export declare const getAttributeApprovers: (userState: UserState, { vendorOwnerId, attributeUserIdMapping, }: {
+    attributeUserIdMapping?: Partial<Record<AttributeType, ID>>;
+    vendorOwnerId?: ID | null;
+}) => AttributeApprovers;

package/lib/entity/approvalRule/attributeApprovers.js

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getAttributeApprovers = void 0;
+const userSelector_1 = require("../user/userSelector");
+const toApprover = (userState, userId) => {
+    if (userId === undefined) {
+        return undefined;
+    }
+    if (userId === null || userId === '') {
+        return null;
+    }
+    // An id we can't find in user state is treated as unknown rather than
+    // "no one" — the backend still routes to that user.
+    return (0, userSelector_1.getUserByUserId)(userState, userId) ?? undefined;
+};
+/**
+ * @param vendorOwnerId `undefined` = no vendor selected (unknown),
+ *   `null` = vendor selected but it has no owner, otherwise the owner's id.
+ * @param attributeUserIdMapping backend `attribute_sub_type_to_user_id_mapping`
+ *   for the submitter; `undefined` when it was not fetched (unknown). When
+ *   present, a missing manager / manager_of_manager key means "no one".
+ */
+const getAttributeApprovers = (userState, { vendorOwnerId, attributeUserIdMapping, }) => {
+    const approvers = {};
+    const vendorOwner = toApprover(userState, vendorOwnerId);
+    if (vendorOwner !== undefined) {
+        approvers.vendor_owner = vendorOwner;
+    }
+    if (attributeUserIdMapping != null) {
+        ['manager', 'manager_of_manager'].forEach((attribute) => {
+            const approver = toApprover(userState, attributeUserIdMapping[attribute] ?? null);
+            if (approver !== undefined) {
+                approvers[attribute] = approver;
+            }
+        });
+    }
+    return approvers;
+};
+exports.getAttributeApprovers = getAttributeApprovers;

package/lib/entity/vendor/vendorPayload.js

@@ -75,7 +75,7 @@ const mapVendorPayloadToVendor = (payload) => {
             : undefined,
         bankAccountIds: payload.bank_accounts?.map((bankAcc) => bankAcc.bank_account_id) ?? [],
         paymentInstrumentIds: payload.payment_instruments?.map((piAcc) => piAcc.zeni_payment_instrument_id) ?? [],
-        ownerId: payload.owner?.user_id ?? undefined,
+        ownerId: payload.owner === null ? null : payload.owner?.user_id,
         balance: payload.balance ?? 0,
         matchScore: payload.match_score?.value != null ? payload.match_score.value : 0,
         isVendor1099: payload.is_vendor_1099 ?? false,

package/lib/entity/vendor/vendorState.d.ts

@@ -67,7 +67,12 @@ export interface Vendor extends VendorBase {
     last90DaysSpend?: number;
     lastMonthSpend?: number;
     legalName?: string;
-    ownerId?: ID;
+    /**
+     * `null` = the vendor explicitly has no owner; `undefined` = not known (the
+     * payload didn't include `owner`). The approval preview only shows Admin for
+     * `null`.
+     */
+    ownerId?: ID | null;
     preferredInternationalTransferFeeBearerPaymentMethod?: InternationalTransferFeeBearerPaymentMethod;
     previousYearSpend?: number;
     shippingAddressId?: ID;

package/lib/esm/entity/approvalRule/approvalRuleSelector.js

@@ -42,3 +42,14 @@ export function getApprovalRulesByEntityType(approvalRuleState, entityType) {
 export function getFallbackApprovalRule(approvalRuleState, entityType) {
     return Object.values(approvalRuleState.approvalRuleById).find((rule) => rule.entityType === entityType && rule.isFallback === true);
 }
+/**
+ * Non-user approvers to show for a fallback-rule step in the draft approval
+ * preview. Implicit actors (e.g. the Admin the platform adds) are shown only
+ * when the step has no explicit approver, so the step always has someone to
+ * approve it without listing Admin next to an explicit approver.
+ */
+export function getFallbackStepNonUserActors(step) {
+    const hasExplicitApprover = step.actors.some((actor) => actor.isImplicitActor === false);
+    return step.actors.filter((actor) => actor.type !== 'user' &&
+        (!hasExplicitApprover || actor.isImplicitActor === false));
+}

package/lib/esm/entity/approvalRule/attributeApprovers.js

@@ -0,0 +1,35 @@
+import { getUserByUserId } from '../user/userSelector';
+const toApprover = (userState, userId) => {
+    if (userId === undefined) {
+        return undefined;
+    }
+    if (userId === null || userId === '') {
+        return null;
+    }
+    // An id we can't find in user state is treated as unknown rather than
+    // "no one" — the backend still routes to that user.
+    return getUserByUserId(userState, userId) ?? undefined;
+};
+/**
+ * @param vendorOwnerId `undefined` = no vendor selected (unknown),
+ *   `null` = vendor selected but it has no owner, otherwise the owner's id.
+ * @param attributeUserIdMapping backend `attribute_sub_type_to_user_id_mapping`
+ *   for the submitter; `undefined` when it was not fetched (unknown). When
+ *   present, a missing manager / manager_of_manager key means "no one".
+ */
+export const getAttributeApprovers = (userState, { vendorOwnerId, attributeUserIdMapping, }) => {
+    const approvers = {};
+    const vendorOwner = toApprover(userState, vendorOwnerId);
+    if (vendorOwner !== undefined) {
+        approvers.vendor_owner = vendorOwner;
+    }
+    if (attributeUserIdMapping != null) {
+        ['manager', 'manager_of_manager'].forEach((attribute) => {
+            const approver = toApprover(userState, attributeUserIdMapping[attribute] ?? null);
+            if (approver !== undefined) {
+                approvers[attribute] = approver;
+            }
+        });
+    }
+    return approvers;
+};

package/lib/esm/entity/vendor/vendorPayload.js

@@ -69,7 +69,7 @@ export const mapVendorPayloadToVendor = (payload) => {
             : undefined,
         bankAccountIds: payload.bank_accounts?.map((bankAcc) => bankAcc.bank_account_id) ?? [],
         paymentInstrumentIds: payload.payment_instruments?.map((piAcc) => piAcc.zeni_payment_instrument_id) ?? [],
-        ownerId: payload.owner?.user_id ?? undefined,
+        ownerId: payload.owner === null ? null : payload.owner?.user_id,
         balance: payload.balance ?? 0,
         matchScore: payload.match_score?.value != null ? payload.match_score.value : 0,
         isVendor1099: payload.is_vendor_1099 ?? false,

package/lib/esm/index.js

@@ -37,6 +37,7 @@ import { getAddressByAddressId } from './entity/address/addressSelector';
 import { detectRuleOverlap, } from './entity/approvalRule/approvalRuleConflict';
 import { getAmountCriteria, getApprovalRulesByEntityType, getDepartmentCriteria, getFallbackApprovalRule, getVendorCriteria, } from './entity/approvalRule/approvalRuleSelector';
 import { toAttributeOrRoleTypeStrict, toAttributeTypeStrict, toRoleTypeStrict, } from './entity/approvalRule/approvalRuleState';
+import { getAttributeApprovers, } from './entity/approvalRule/attributeApprovers';
 import { toOutsideZeniPaymentModeType, } from './entity/billPay/billTransaction/billTransactionState';
 import { toRecurringBillFrequency, toRecurringBillFrequencyStrict, } from './entity/billPay/recurringBills/recurringBillsState';
 import { toCardAddressType, toCreditLimitFrequencyCodeType, toShippingAddressType, } from './entity/chargeCard/chargeCard';
@@ -630,7 +631,7 @@ export { getUserFinancialAccount };
 export { fetchRemiSetupView, updateMileageDetails, saveRemiSetupViewDataInLocalStore, acceptRemiTerms, acceptEmployeeRemiTerms, getRemiSetupViewDetails, getRemiBusinessVerificationDetails, };
 export { VERIFIED_PAYMENT_ACCOUNT_PROVIDER_VERIFICATION_STATUS, };
 export { isSuccessResponse, isInvalidSessionError, isAccessDeniedError, };
-export { getAmountCriteria, getApprovalRulesByEntityType, getDepartmentCriteria, getFallbackApprovalRule, getVendorCriteria, toAttributeTypeStrict, toAttributeOrRoleTypeStrict, toRoleTypeStrict, detectRuleOverlap, };
+export { getAmountCriteria, getApprovalRulesByEntityType, getDepartmentCriteria, getAttributeApprovers, getFallbackApprovalRule, getVendorCriteria, toAttributeTypeStrict, toAttributeOrRoleTypeStrict, toRoleTypeStrict, detectRuleOverlap, };
 export { getBillPaySetupApproverView, getBillPaySetupApproverUpdateDataView, fetchBillPaySetupApproverView, fetchBillPayApproversDetails, fetchBillPayApproversList, deleteBillPayApprovalRule, reorderBillPayApprovalRules, saveBillPaySetupApproverViewUpdateData, saveBillPaySetupApproverViewUpdates, setBillsSetupApproverViewListeningToPusherEvent, initializeBillPaySetupApproverViewUpdateData, clearBillPaySetupApproverViewUpdateData, };
 export { getRemiSetupApproverView, getRemiSetupApproverUpdateDataView, fetchRemiSetupApproverView, fetchRemiApproversList, fetchRemiApproversDetails, deleteRemiApprovalRule, reorderRemiApprovalRules, saveRemiSetupApproverViewUpdateData, saveRemiSetupApproverViewUpdates, initializeRemiSetupApproverViewUpdateData, setRemiSetupApproverViewListeningToPusherEvent, clearRemiSetupApproverViewUpdateData, };
 export { getRemiDetailView, checkApproveRejectBtnShowForRemi, };

package/lib/esm/view/commonVendorView/transactionVendorView/transactionVendorLocalDataHelper.js

@@ -3,7 +3,7 @@ export const getInitializedTransactionVendorLocalData = (vendorData) => {
         vendorName: vendorData.name,
         vendorCategory: vendorData.accountId,
         vendorClass: vendorData.classId,
-        vendorOwner: vendorData.ownerId,
+        vendorOwner: vendorData.ownerId ?? undefined,
         vendorId: vendorData.id,
     };
 };

package/lib/esm/view/commonVendorView/vendorView/epics/vendorDetailLocalDataHelpers.js

@@ -21,7 +21,7 @@ export const getInitializedVendorDetailLocalData = (vendorData, state, vendorPay
         vendorCategory: vendorData.accountId,
         vendorClass: vendorData.classId,
         vendorType: vendorData.vendorType,
-        vendorOwner: vendorData.ownerId,
+        vendorOwner: vendorData.ownerId ?? undefined,
         vendorId: vendorData.id,
         isVendor1099: vendorData.isVendor1099,
         documentIds: vendorData.documentIds,

package/lib/esm/view/commonVendorView/vendorsTabVendorView/epics/vendorsTabVendorDetailLocalDataHelpers.js

@@ -16,7 +16,7 @@ export const getInitializedVendorTabDetailLocalData = (vendorData, state, vendor
             : getContactsByIds(contactState, vendorData.contactIds ?? []),
         vendorCategory: vendorData.accountId,
         vendorClass: vendorData.classId,
-        vendorOwner: vendorData.ownerId,
+        vendorOwner: vendorData.ownerId ?? undefined,
         vendorId: vendorData.id,
         recommendations: vendorData.recommendations,
         recommendedCategory: recommendedAccount,

package/lib/esm/view/spendManagement/billPay/billDetailView/billDetailViewSelector.js

@@ -236,7 +236,7 @@ export const getBillDetailView = (state, billId) => {
         filteredAttributes,
         approverListFetchState: approverListState.fetchStatus,
         vendorCurrency: currentVendorDetails?.vendorCurrencyCode,
-        vendorOwnerId: currentVendorDetails?.ownerId,
+        vendorOwnerId: currentVendorDetails?.ownerId ?? undefined,
         billHistory: getActivityHistory(commonHistoryState, billId, 'bill_pay'),
         realTimeApproval: getActivityRealTimeApproval(realTimeApprovalState, billId, 'bill_pay'),
         allAccountingClasses,

package/lib/esm/view/spendManagement/billPay/billPaySetupApproverView/billPaySetupApproverViewSelector.js

@@ -1,7 +1,7 @@
 import { createSelector } from '@reduxjs/toolkit';
 import cloneDeep from 'lodash/cloneDeep';
 import { reduceAllFetchState, reduceAnyFetchState, } from '../../../../commonStateTypes/reduceFetchState';
-import { getApprovalRulesByIds } from '../../../../entity/approvalRule/approvalRuleSelector';
+import { getApprovalRulesByIds, getFallbackApprovalRule, getFallbackStepNonUserActors, } from '../../../../entity/approvalRule/approvalRuleSelector';
 import { getClassesByIds } from '../../../../entity/class/classSelector';
 import { getIsAccountingClassesEnabled } from '../../../../entity/tenant/tenantSelector';
 import { getUserByUserId } from '../../../../entity/user/userSelector';
@@ -10,22 +10,35 @@ export const getBillPaySetupApproverView = createSelector((state) => state.billP
     const { approvalRulesDeleteStatusById, approvalRuleIds, approverListState, fetchState, error, listeningToPusherEvent, newApprovalRuleId, } = billPaySetupApproverViewState;
     const deleteStateList = Object.values(approvalRulesDeleteStatusById);
     const approvalRules = getApprovalRulesByIds(approvalRuleState, approvalRuleIds);
-    const allApprovalRules = approvalRules.map((approvalRule) => {
-        const approvalRuleWithUser = {
-            ...approvalRule,
-            steps: approvalRule.steps.map((step) => {
-                return {
-                    ...step,
-                    actors: step.actors
-                        .filter((actor) => actor.userId != null)
-                        .map((actor) => getUserByUserId(userState, actor.userId))
-                        .filter((user) => user != null),
-                    nonUserActors: step.actors.filter((actor) => actor.type !== 'user' && actor.isImplicitActor === false),
-                };
-            }),
-        };
-        return approvalRuleWithUser;
+    const toStepWithUser = (step) => ({
+        ...step,
+        actors: step.actors
+            .filter((actor) => actor.userId != null)
+            .map((actor) => getUserByUserId(userState, actor.userId))
+            .filter((user) => user != null),
+        nonUserActors: step.actors.filter((actor) => actor.type !== 'user' && actor.isImplicitActor === false),
+    });
+    const toApprovalRuleWithUser = (approvalRule) => ({
+        ...approvalRule,
+        steps: approvalRule.steps.map(toStepWithUser),
+    });
+    // Unlike the rules page, a fallback step keeps its implicit Admin when it
+    // has no explicit approver (see getFallbackStepNonUserActors).
+    const toFallbackStepWithUser = (step) => ({
+        ...toStepWithUser(step),
+        nonUserActors: getFallbackStepNonUserActors(step),
     });
+    const allApprovalRules = approvalRules.map(toApprovalRuleWithUser);
+    // Exposed separately so the new-bill preview can show it when no other
+    // rule matches. (It is also in allApprovalRules; the rules pages filter it
+    // out by `isFallback`.)
+    const fallbackApprovalRule = getFallbackApprovalRule(approvalRuleState, 'bill_pay');
+    const fallbackRule = fallbackApprovalRule != null
+        ? {
+            ...fallbackApprovalRule,
+            steps: fallbackApprovalRule.steps.map(toFallbackStepWithUser),
+        }
+        : undefined;
     const approvalRulesStatus = allApprovalRules.length > 0
         ? {
             code: 'created',
@@ -40,6 +53,7 @@ export const getBillPaySetupApproverView = createSelector((state) => state.billP
     const inactiveApproverIds = Array.from(referencedApproverIds).filter((userId) => !activeApproverIds.has(userId));
     return {
         allApprovalRules,
+        fallbackRule,
         deleteStatus: reduceAnyFetchState(deleteStateList),
         approvalRulesStatus,
         approverListFetchStatus: approverListState.fetchStatus,

package/lib/esm/view/spendManagement/billPay/editBillView/editBillViewSelector.js

@@ -2,6 +2,7 @@ import recordGet from 'lodash/get';
 import has from 'lodash/has';
 import { reduceFetchState } from '../../../../commonStateTypes/reduceFetchState';
 import { getAmountCriteria, getDepartmentCriteria, getVendorCriteria, } from '../../../../entity/approvalRule/approvalRuleSelector';
+import { getAttributeApprovers, } from '../../../../entity/approvalRule/attributeApprovers';
 import { getBankAccountByBankAccountId, getBankAccountsByBankAccountIds, } from '../../../../entity/bankAccount/bankAccountSelector';
 import { getContactById, getContactsByIds, } from '../../../../entity/billPay/contact/contactSelector';
 import { getCompanyByCompanyId } from '../../../../entity/company/companySelector';
@@ -371,6 +372,11 @@ export const getEditBillDetail = (state, isVendorRecommendationFeatureEnabled, i
         qboId,
         payNowCutOffTime,
         approvalRules: getBillPaySetupApproverView(state),
+        attributeApprovers: getAttributeApprovers(userState, {
+            // Only an explicit "no owner" (null) becomes Admin; an owner that wasn't
+            // in the vendor payload stays unknown and keeps the role label.
+            vendorOwnerId: vendorDetails?.ownerId,
+        }),
         billPayInfo,
         billHistory,
         toAccountVendorEmail,

package/lib/esm/view/spendManagement/reimbursement/editRemiView/editRemiViewSelector.js

@@ -1,5 +1,6 @@
 import recordGet from 'lodash/get';
 import { reduceFetchState } from '../../../../commonStateTypes/reduceFetchState';
+import { getAttributeApprovers, } from '../../../../entity/approvalRule/attributeApprovers';
 import { getBankAccountByBankAccountId } from '../../../../entity/bankAccount/bankAccountSelector';
 import { getAllCurrencies } from '../../../../entity/currency/currencySelector';
 import { getCurrentTenant, getIsAccountingClassesEnabled, } from '../../../../entity/tenant/tenantSelector';
@@ -16,7 +17,7 @@ import { REIMBURSEMENT_PAYMENT_NUMBER_OF_DAYS } from '../reimbursementConfig/rei
 import { getRemiActivities } from '../remiDetailView/remiDetailViewSelector';
 import { getRemiSetupApproverView } from '../remiSetupApproverView/remiSetupApproverViewSelector';
 export const getEditRemiDetail = (state, reimbursementId) => {
-    const { accountListState, accountState, remiDetailViewState, reimbursementState, currencyState, classListState, classState, editRemiDetailViewState, reimbursementConfigState, merchantListState, merchantState, userState, bankAccountState, commonHistoryState, } = state;
+    const { accountListState, accountState, remiDetailViewState, reimbursementState, currencyState, classListState, classState, editRemiDetailViewState, reimbursementConfigState, merchantListState, merchantState, userState, bankAccountState, commonHistoryState, remiSetupApproverViewState, } = state;
     const achSameDayMaxDays = getReimbursementConfigByKey(reimbursementConfigState, 'reimbursement_ach_same-day')?.maxPeriod.value ?? REIMBURSEMENT_PAYMENT_NUMBER_OF_DAYS;
     const sourceRemiDetail = reimbursementId != null
         ? editRemiDetailViewState.editRemiStateById?.[reimbursementId]
@@ -187,6 +188,10 @@ export const getEditRemiDetail = (state, reimbursementId) => {
         classHierarchyList,
         createTime,
         approvalRules: getRemiSetupApproverView(state, false),
+        attributeApprovers: getAttributeApprovers(userState, {
+            attributeUserIdMapping: remiSetupApproverViewState.approverListState
+                .attributeSubTypeToUserIdMapping,
+        }),
         reimbursementInfo,
         paymentToBankAccountDetail,
         remiHistory: getActivityHistory(commonHistoryState, reimbursementId ?? '', 'reimbursement'),

package/lib/esm/view/spendManagement/reimbursement/editRemiView/epics/fetchEditRemiDetailPageEpic.js

@@ -6,6 +6,7 @@ import { fetchUserFinancialAccount } from '../../../../userFinancialAccount/user
 import { getLatestCreatedUserBankAccount } from '../../../../userFinancialAccount/userFinancialAccountSelector';
 import { fetchMerchantList } from '../../../merchantList/merchantListReducer';
 import { fetchReimbursementConfig } from '../../reimbursementConfig/reimbursementConfigReducer';
+import { fetchRemiApproversList } from '../../remiSetupApproverView/remiSetupApproverViewReducer';
 import { fetchEditRemiDetailPage, fetchRemiAndInitializeLocalStore, updatesPaymentToInLocalStore, } from '../editRemiViewReducer';
 export const fetchEditRemiDetailPageEpic = (actions$, state$) => actions$.pipe(filter(fetchEditRemiDetailPage.match), mergeMap((action) => {
     const { cacheOverride, isLimitedCategoryEnabled, reimbursementId, isShowDeletedReimbursementEnabled, } = action.payload;
@@ -59,5 +60,10 @@ export const fetchEditRemiDetailPageEpic = (actions$, state$) => actions$.pipe(f
             remiDetailActions.push(fetchRemiAndInitializeLocalStore(reimbursementId, false, isShowDeletedReimbursementEnabled));
         }
     }
+    // New reimbursement: resolve the submitter's manager / manager's manager
+    // so the approval preview can name them (or show Admin when there is none).
+    if (reimbursementId == null && userId !== '') {
+        remiDetailActions.push(fetchRemiApproversList(true, false, true, userId));
+    }
     return concat(from(remiDetailActions));
 }));

package/lib/esm/view/spendManagement/reimbursement/remiSetupApproverView/epic/fetchRemiApproversListEpic.js

@@ -8,7 +8,11 @@ export const fetchRemiApproversListEpic = (actions$, state$, zeniAPI) => actions
     const { cacheOverride, includeUserRoles, includeAttributesUserIds, lastUpdatedByUserId, } = action.payload;
     const { remiSetupApproverViewState } = state$.value;
     const approverIds = remiSetupApproverViewState.approverListState.approverIds;
-    if (cacheOverride === true || approverIds.length === 0) {
+    // The attribute mapping depends on `lastUpdatedByUserId`, so it can't be
+    // served from the cache.
+    if (cacheOverride === true ||
+        approverIds.length === 0 ||
+        includeAttributesUserIds === true) {
         return zeniAPI
             .getJSON(`${zeniAPI.apiEndPoints.approvalMicroServiceBaseUrl}/1.0/reimbursements/approvers?query={"is_include_user_roles_info":${includeUserRoles},"is_include_attribute_user_ids":${includeAttributesUserIds},"last_updated_by_user_id":"${lastUpdatedByUserId}"}`)
             .pipe(mergeMap((response) => {
@@ -30,7 +34,7 @@ export const fetchRemiApproversListEpic = (actions$, state$, zeniAPI) => actions
     }
     else {
         const { approverListState } = remiSetupApproverViewState;
-        const { approverIds, attributes } = approverListState;
-        return of(fetchRemiApproversListSuccess(approverIds, attributes));
+        const { approverIds, attributes, attributeSubTypeToUserIdMapping } = approverListState;
+        return of(fetchRemiApproversListSuccess(approverIds, attributes, attributeSubTypeToUserIdMapping));
     }
 }));

package/lib/esm/view/spendManagement/reimbursement/remiSetupApproverView/remiSetupApproverViewReducer.js

@@ -84,11 +84,17 @@ const remiSetupApproverView = createSlice({
             },
         },
         fetchRemiApproversList: {
-            reducer(draft) {
+            reducer(draft, action) {
                 draft.approverListState.fetchStatus = {
                     fetchState: 'In-Progress',
                     error: undefined,
                 };
+                // The attribute mapping is specific to `lastUpdatedByUserId`; drop the
+                // previous user's mapping so it is never shown for someone else while
+                // the new one loads.
+                if (action.payload.includeAttributesUserIds === true) {
+                    draft.approverListState.attributeSubTypeToUserIdMapping = undefined;
+                }
             },
             prepare(cacheOverride = false, includeUserRoles = true, includeAttributesUserIds = false, lastUpdatedByUserId = undefined) {
                 return {

package/lib/esm/view/spendManagement/reimbursement/remiSetupApproverView/remiSetupApproverViewSelector.js

@@ -1,7 +1,7 @@
 import { createSelector } from '@reduxjs/toolkit';
 import cloneDeep from 'lodash/cloneDeep';
 import { reduceAllFetchState, reduceAnyFetchState, } from '../../../../commonStateTypes/reduceFetchState';
-import { getApprovalRulesByIds } from '../../../../entity/approvalRule/approvalRuleSelector';
+import { getApprovalRulesByIds, getFallbackApprovalRule, getFallbackStepNonUserActors, } from '../../../../entity/approvalRule/approvalRuleSelector';
 import { getClassesByIds } from '../../../../entity/class/classSelector';
 import { getUserByUserId } from '../../../../entity/user/userSelector';
 import { getUserRoleByUserId } from '../../../../entity/userRole/userRoleSelector';
@@ -10,23 +10,36 @@ export const getRemiSetupApproverView = (state, filterAdmins = true) => {
     const { approvalRulesDeleteStatusById, approvalRuleIds, approverListState, fetchState, error, listeningToPusherEvent, newApprovalRuleId, } = remiSetupApproverViewState;
     const deleteStateList = Object.values(approvalRulesDeleteStatusById);
     const approvalRules = getApprovalRulesByIds(approvalRuleState, approvalRuleIds);
-    const allApprovalRules = approvalRules.map((approvalRule) => {
-        const approvalRuleWithUser = {
-            ...approvalRule,
-            steps: approvalRule.steps.map((step) => {
-                return {
-                    ...step,
-                    actors: step.actors
-                        .filter((actor) => actor.userId != null)
-                        .map((actor) => getUserByUserId(userState, actor.userId))
-                        .filter((user) => user != null),
-                    nonUserActors: step.actors.filter((actor) => actor.type !== 'user' &&
-                        (filterAdmins ? actor.isImplicitActor === false : true)),
-                };
-            }),
-        };
-        return approvalRuleWithUser;
+    const toStepWithUser = (step) => ({
+        ...step,
+        actors: step.actors
+            .filter((actor) => actor.userId != null)
+            .map((actor) => getUserByUserId(userState, actor.userId))
+            .filter((user) => user != null),
+        nonUserActors: step.actors.filter((actor) => actor.type !== 'user' &&
+            (filterAdmins ? actor.isImplicitActor === false : true)),
+    });
+    const toApprovalRuleWithUser = (approvalRule) => ({
+        ...approvalRule,
+        steps: approvalRule.steps.map(toStepWithUser),
     });
+    const allApprovalRules = approvalRules.map(toApprovalRuleWithUser);
+    // Exposed separately so the new-reimbursement preview can show it when no other
+    // rule matches. (It is also in allApprovalRules; the rules pages filter it
+    // out by `isFallback`.)
+    const fallbackApprovalRule = getFallbackApprovalRule(approvalRuleState, 'reimbursement');
+    // A fallback step shows its implicit Admin only when it has no explicit
+    // approver, regardless of `filterAdmins` (same as bills; see
+    // getFallbackStepNonUserActors).
+    const fallbackRule = fallbackApprovalRule != null
+        ? {
+            ...fallbackApprovalRule,
+            steps: fallbackApprovalRule.steps.map((step) => ({
+                ...toStepWithUser(step),
+                nonUserActors: getFallbackStepNonUserActors(step),
+            })),
+        }
+        : undefined;
     const approvalRulesStatus = allApprovalRules.length > 0
         ? {
             code: 'created',
@@ -41,6 +54,7 @@ export const getRemiSetupApproverView = (state, filterAdmins = true) => {
     const inactiveApproverIds = Array.from(referencedApproverIds).filter((userId) => !activeApproverIds.has(userId));
     return {
         allApprovalRules,
+        fallbackRule,
         deleteStatus: reduceAnyFetchState(deleteStateList),
         approvalRulesStatus,
         approverListFetchStatus: approverListState.fetchStatus,

package/lib/index.d.ts

@@ -62,6 +62,7 @@ import { DetectRuleOverlapInput, RuleForOverlapCheck, RuleOverlap, detectRuleOve
 import { getAmountCriteria, getApprovalRulesByEntityType, getDepartmentCriteria, getFallbackApprovalRule, getVendorCriteria } from './entity/approvalRule/approvalRuleSelector';
 import { Actor, ActorType, AmountComparator, AmountCriteria, ApprovalRule, ApprovalRuleState, Approvers, AttributeType, ConditionType, Criteria, DepartmentCriteria, RoleType, Step, VendorCriteria, toAttributeOrRoleTypeStrict, toAttributeTypeStrict, toRoleTypeStrict } from './entity/approvalRule/approvalRuleState';
 import { ApprovalActionType, StepOperatorType } from './entity/approvalRule/approvalStepTypes';
+import { AttributeApprovers, getAttributeApprovers } from './entity/approvalRule/attributeApprovers';
 import { BankAccount } from './entity/bankAccount/bankAccount';
 import { BillPayInfo, BillPaymentRefundStatus, BillPaymentRefundStatusCodeType, BillPaymentStatus, BillPaymentStatusCodeType, BillStage, BillStageCodeType, BillStatus, BillStatusCodeType, BillTransaction, DeletionSourceType, toOutsideZeniPaymentModeType } from './entity/billPay/billTransaction/billTransactionState';
 import { InternationalTransferFeeBearerPaymentMethod } from './entity/billPay/billTransaction/internationalTransferFeeBearerPaymentMethod';
@@ -901,7 +902,7 @@ export { RemiSetupViewState, RemiSetupViewLocalData, MileageDetailsLocalData, Mi
 export { PaymentAccount, Logo, VERIFIED_PAYMENT_ACCOUNT_PROVIDER_VERIFICATION_STATUS, };
 export { SubscriptionPaymentAccount };
 export { PreviousBillsSelectorView, InvoiceProcessingPayload, InvoiceProcessingResponse, isSuccessResponse, isInvalidSessionError, isAccessDeniedError, };
-export { Step, Actor as ApprovalRuleActor, ActorType, ApprovalActionType, StepOperatorType, ApprovalRuleState, ApprovalRule, AmountComparator, AmountCriteria, ConditionType, Criteria, DepartmentCriteria, VendorCriteria, AttributeType, Approvers, RoleType, EntityApprovalStatusState, EntityApprovalStatus, SpendManagementEntityType, SpendManagementEntityTypeWithOtherConnection, getAmountCriteria, getApprovalRulesByEntityType, getDepartmentCriteria, getFallbackApprovalRule, getVendorCriteria, toAttributeTypeStrict, toAttributeOrRoleTypeStrict, toRoleTypeStrict, DetectRuleOverlapInput, RuleForOverlapCheck, RuleOverlap, detectRuleOverlap, };
+export { Step, Actor as ApprovalRuleActor, ActorType, ApprovalActionType, StepOperatorType, ApprovalRuleState, ApprovalRule, AmountComparator, AmountCriteria, ConditionType, Criteria, DepartmentCriteria, VendorCriteria, AttributeType, Approvers, RoleType, EntityApprovalStatusState, EntityApprovalStatus, SpendManagementEntityType, SpendManagementEntityTypeWithOtherConnection, getAmountCriteria, getApprovalRulesByEntityType, getDepartmentCriteria, AttributeApprovers, getAttributeApprovers, getFallbackApprovalRule, getVendorCriteria, toAttributeTypeStrict, toAttributeOrRoleTypeStrict, toRoleTypeStrict, DetectRuleOverlapInput, RuleForOverlapCheck, RuleOverlap, detectRuleOverlap, };
 export { ApprovalRuleUpdateData, ApprovalRuleCreateData, BillPayApprovalRuleWithUser, ApprovalUpdateActionType, ApproverViewUpdateData, BillPaySetupApproverViewState, BillPaySetupApproverView, BillPaySetupApproverUpdateDataView, getBillPaySetupApproverView, getBillPaySetupApproverUpdateDataView, fetchBillPaySetupApproverView, fetchBillPayApproversDetails, fetchBillPayApproversList, deleteBillPayApprovalRule, reorderBillPayApprovalRules, saveBillPaySetupApproverViewUpdateData, saveBillPaySetupApproverViewUpdates, setBillsSetupApproverViewListeningToPusherEvent, initializeBillPaySetupApproverViewUpdateData, clearBillPaySetupApproverViewUpdateData, };
 export { RemiApprovalRuleWithUser, RemiSetupApproverViewState, RemiSetupApproverView, RemiSetupApproverUpdateDataView, getRemiSetupApproverView, getRemiSetupApproverUpdateDataView, fetchRemiSetupApproverView, fetchRemiApproversList, fetchRemiApproversDetails, deleteRemiApprovalRule, reorderRemiApprovalRules, saveRemiSetupApproverViewUpdateData, saveRemiSetupApproverViewUpdates, initializeRemiSetupApproverViewUpdateData, setRemiSetupApproverViewListeningToPusherEvent, clearRemiSetupApproverViewUpdateData, };
 export { RemiDetailViewSelector, getRemiDetailView, RemiActivity, RemiDetails, checkApproveRejectBtnShowForRemi, };