Merge branch 'main' into fix/account-selector-transition

Author: DostoevskysPiano

app/components/Views/confirmations/hooks/pay/useFiatPaymentHighlightedActions.test.ts

@@ -1,5 +1,6 @@
 import { renderHook } from '@testing-library/react-hooks';
 import { type PaymentMethod } from '@metamask/ramps-controller';
+import { TransactionType } from '@metamask/transaction-controller';
 import { useFiatPaymentHighlightedActions } from './useFiatPaymentHighlightedActions';
 import { useMMPayFiatConfig } from './useMMPayFiatConfig';
 import { useTransactionPayFiatPayment } from './useTransactionPayData';
@@ -29,6 +30,7 @@ const PAYMENT_METHOD_MOCK: PaymentMethod = {
 } as PaymentMethod;
 
 const TRANSACTION_ID_MOCK = 'tx-123';
+const TRANSACTION_TYPE_MOCK = TransactionType.simpleSend;
 
 describe('useFiatPaymentHighlightedActions', () => {
   const useMMPayFiatConfigMock = jest.mocked(useMMPayFiatConfig);
@@ -46,18 +48,47 @@ describe('useFiatPaymentHighlightedActions', () => {
   beforeEach(() => {
     jest.resetAllMocks();
 
-    useMMPayFiatConfigMock.mockReturnValue({ enabled: true });
+    useMMPayFiatConfigMock.mockReturnValue({
+      enabledTransactionTypes: [TRANSACTION_TYPE_MOCK],
+      maxDelayMinutesForPaymentMethods: 10,
+    });
     useTransactionPayFiatPaymentMock.mockReturnValue(undefined);
     useRampsPaymentMethodsMock.mockReturnValue({
       paymentMethods: [PAYMENT_METHOD_MOCK],
     } as ReturnType<typeof useRampsPaymentMethods>);
     useTransactionMetadataRequestMock.mockReturnValue({
       id: TRANSACTION_ID_MOCK,
+      type: TRANSACTION_TYPE_MOCK,
     } as ReturnType<typeof useTransactionMetadataRequest>);
   });
 
-  it('returns empty array when feature flag is off', () => {
-    useMMPayFiatConfigMock.mockReturnValue({ enabled: false });
+  it('returns empty array when transaction type is not in enabledTransactionTypes', () => {
+    useMMPayFiatConfigMock.mockReturnValue({
+      enabledTransactionTypes: [TransactionType.swap],
+      maxDelayMinutesForPaymentMethods: 10,
+    });
+
+    const { result } = renderHook(() => useFiatPaymentHighlightedActions());
+
+    expect(result.current).toEqual([]);
+  });
+
+  it('returns empty array when enabledTransactionTypes is empty', () => {
+    useMMPayFiatConfigMock.mockReturnValue({
+      enabledTransactionTypes: [],
+      maxDelayMinutesForPaymentMethods: 10,
+    });
+
+    const { result } = renderHook(() => useFiatPaymentHighlightedActions());
+
+    expect(result.current).toEqual([]);
+  });
+
+  it('filters out payment methods whose upper delay exceeds maxDelayMinutesForPaymentMethods', () => {
+    useMMPayFiatConfigMock.mockReturnValue({
+      enabledTransactionTypes: [TRANSACTION_TYPE_MOCK],
+      maxDelayMinutesForPaymentMethods: 5,
+    });
 
     const { result } = renderHook(() => useFiatPaymentHighlightedActions());
 

app/components/Views/confirmations/hooks/pay/useFiatPaymentHighlightedActions.ts

@@ -7,6 +7,7 @@ import { useMMPayFiatConfig } from './useMMPayFiatConfig';
 import { useTransactionPayFiatPayment } from './useTransactionPayData';
 import { useTransactionMetadataRequest } from '../transactions/useTransactionMetadataRequest';
 import { HighlightedItem } from '../../types/token';
+import { hasTransactionType } from '../../utils/transaction';
 
 /**
  * Converts available Ramps payment methods into {@link HighlightedItem}s for
@@ -15,22 +16,35 @@ import { HighlightedItem } from '../../types/token';
  * `fiatPayment.selectedPaymentMethodId` on the current transaction.
  */
 export function useFiatPaymentHighlightedActions(): HighlightedItem[] {
-  const { enabled } = useMMPayFiatConfig();
+  const { enabledTransactionTypes, maxDelayMinutesForPaymentMethods } =
+    useMMPayFiatConfig();
   const { paymentMethods } = useRampsPaymentMethods();
   const fiatPayment = useTransactionPayFiatPayment();
   const transactionMeta = useTransactionMetadataRequest();
   const transactionId = transactionMeta?.id ?? '';
   const selectedPaymentMethodId = fiatPayment?.selectedPaymentMethodId;
+  const isFiatEnabled = hasTransactionType(
+    transactionMeta,
+    enabledTransactionTypes,
+  );
 
   return useMemo(() => {
-    if (!enabled || paymentMethods.length === 0) {
+    if (!isFiatEnabled || paymentMethods.length === 0) {
       return [];
     }
 
-    return paymentMethods.map((pm) =>
-      toHighlightedItem(pm, transactionId, selectedPaymentMethodId),
-    );
-  }, [enabled, paymentMethods, transactionId, selectedPaymentMethodId]);
+    return paymentMethods
+      .filter((pm) => isWithinDelayLimit(pm, maxDelayMinutesForPaymentMethods))
+      .map((pm) =>
+        toHighlightedItem(pm, transactionId, selectedPaymentMethodId),
+      );
+  }, [
+    isFiatEnabled,
+    maxDelayMinutesForPaymentMethods,
+    paymentMethods,
+    transactionId,
+    selectedPaymentMethodId,
+  ]);
 }
 
 function toHighlightedItem(
@@ -61,3 +75,10 @@ function toHighlightedItem(
     isSelected,
   };
 }
+
+function isWithinDelayLimit(
+  pm: PaymentMethod,
+  maxDelayMinutesForPaymentMethods: number,
+): boolean {
+  return !pm.delay || pm.delay[1] <= maxDelayMinutesForPaymentMethods;
+}

app/components/Views/confirmations/hooks/pay/useMMPayFiatConfig.test.ts

@@ -8,11 +8,17 @@ describe('useMMPayFiatConfig', () => {
     const state = cloneDeep(mockedEmptyFlagsState);
     state.engine.backgroundState.RemoteFeatureFlagController.remoteFeatureFlags =
       {
-        confirmations_pay_fiat: { enabled: true },
+        confirmations_pay_fiat: {
+          enabledTransactionTypes: ['simpleSend', 'swap'],
+          maxDelayMinutesForPaymentMethods: 15,
+        },
       };
 
     const { result } = renderHookWithProvider(useMMPayFiatConfig, { state });
 
-    expect(result.current).toEqual({ enabled: true });
+    expect(result.current).toEqual({
+      enabledTransactionTypes: ['simpleSend', 'swap'],
+      maxDelayMinutesForPaymentMethods: 15,
+    });
   });
 });

app/selectors/featureFlagController/confirmations/index.test.ts

@@ -13,7 +13,8 @@ import {
   GasFeeTokenFlags,
   selectPayQuoteConfig,
   selectMetaMaskPayFiatFlags,
-  PAY_FIAT_ENABLED_DEFAULT,
+  PAY_FIAT_ENABLED_TRANSACTION_TYPES,
+  PAY_FIAT_MAX_DELAY_MINUTES_FOR_PAYMENT_METHODS,
   selectMetaMaskPayHardwareFlags,
   PAY_HARDWARE_ENABLED_DEFAULT,
   PreferredToken,
@@ -505,20 +506,43 @@ describe('getPreferredTokensForTransactionType', () => {
 });
 
 describe('selectMetaMaskPayFiatFlags', () => {
-  it('returns default when flag is absent', () => {
+  it('returns defaults when flag is absent', () => {
     expect(selectMetaMaskPayFiatFlags(mockedEmptyFlagsState)).toEqual({
-      enabled: PAY_FIAT_ENABLED_DEFAULT,
+      enabledTransactionTypes: PAY_FIAT_ENABLED_TRANSACTION_TYPES,
+      maxDelayMinutesForPaymentMethods:
+        PAY_FIAT_MAX_DELAY_MINUTES_FOR_PAYMENT_METHODS,
     });
   });
 
-  it('returns enabled from flag value', () => {
+  it('returns enabledTransactionTypes from flag value', () => {
     const state = cloneDeep(mockedEmptyFlagsState);
     state.engine.backgroundState.RemoteFeatureFlagController.remoteFeatureFlags =
       {
-        confirmations_pay_fiat: { enabled: true },
+        confirmations_pay_fiat: {
+          enabledTransactionTypes: ['simpleSend', 'swap'],
+        },
       };
 
-    expect(selectMetaMaskPayFiatFlags(state)).toEqual({ enabled: true });
+    expect(selectMetaMaskPayFiatFlags(state)).toEqual({
+      enabledTransactionTypes: ['simpleSend', 'swap'],
+      maxDelayMinutesForPaymentMethods:
+        PAY_FIAT_MAX_DELAY_MINUTES_FOR_PAYMENT_METHODS,
+    });
+  });
+
+  it('returns maxDelayMinutesForPaymentMethods from flag value', () => {
+    const state = cloneDeep(mockedEmptyFlagsState);
+    state.engine.backgroundState.RemoteFeatureFlagController.remoteFeatureFlags =
+      {
+        confirmations_pay_fiat: {
+          maxDelayMinutesForPaymentMethods: 30,
+        },
+      };
+
+    expect(selectMetaMaskPayFiatFlags(state)).toEqual({
+      enabledTransactionTypes: PAY_FIAT_ENABLED_TRANSACTION_TYPES,
+      maxDelayMinutesForPaymentMethods: 30,
+    });
   });
 });
 

app/selectors/featureFlagController/confirmations/index.ts

@@ -2,12 +2,14 @@ import { createSelector } from 'reselect';
 import { selectRemoteFeatureFlags } from '..';
 import { Hex, Json } from '@metamask/utils';
 import { RootState } from '../../../reducers';
+import { TransactionType } from '@metamask/transaction-controller';
 
 export const ATTEMPTS_MAX_DEFAULT = 2;
 export const BUFFER_INITIAL_DEFAULT = 0.025;
 export const BUFFER_STEP_DEFAULT = 0.025;
 export const BUFFER_SUBSEQUENT_DEFAULT = 0.05;
-export const PAY_FIAT_ENABLED_DEFAULT = false;
+export const PAY_FIAT_ENABLED_TRANSACTION_TYPES = [];
+export const PAY_FIAT_MAX_DELAY_MINUTES_FOR_PAYMENT_METHODS = 10;
 export const PAY_HARDWARE_ENABLED_DEFAULT = false;
 export const SLIPPAGE_DEFAULT = 0.005;
 export const STX_DISABLED_DEFAULT = false;
@@ -76,7 +78,8 @@ export interface GasFeeTokenFlags {
 }
 
 export interface MetaMaskPayFiatFlags {
-  enabled: boolean;
+  enabledTransactionTypes: TransactionType[];
+  maxDelayMinutesForPaymentMethods: number;
 }
 
 export interface MetaMaskPayHardwareFlags {
@@ -251,7 +254,12 @@ export const selectMetaMaskPayFiatFlags = createSelector(
       | undefined;
 
     return {
-      enabled: (raw?.enabled as boolean) ?? PAY_FIAT_ENABLED_DEFAULT,
+      enabledTransactionTypes:
+        (raw?.enabledTransactionTypes as TransactionType[]) ??
+        PAY_FIAT_ENABLED_TRANSACTION_TYPES,
+      maxDelayMinutesForPaymentMethods:
+        (raw?.maxDelayMinutesForPaymentMethods as number) ??
+        PAY_FIAT_MAX_DELAY_MINUTES_FOR_PAYMENT_METHODS,
     };
   },
 );