feat: clear transaction quotes action

packages/transaction-pay-controller/src/TransactionPayController.test.ts

@@ -12,8 +12,10 @@
 import { updateQuotes } from './utils/quotes';
 import { updateSourceAmounts } from './utils/source-amounts';
 import { pollTransactionChanges } from './utils/transaction';
+import { clearQuotes } from './actions/clear-quotes';
 
 jest.mock('./actions/update-payment-token');
+jest.mock('./actions/clear-quotes');
 jest.mock('./utils/source-amounts');
 jest.mock('./utils/quotes');
 jest.mock('./utils/transaction');
@@ -28,6 +30,7 @@
   const updateSourceAmountsMock = jest.mocked(updateSourceAmounts);
   const updateQuotesMock = jest.mocked(updateQuotes);
   const pollTransactionChangesMock = jest.mocked(pollTransactionChanges);
+  const clearQuotesMock = jest.mocked(clearQuotes);
   let messenger: TransactionPayControllerMessenger;
 
   /**
@@ -195,4 +198,21 @@
       ).toBeUndefined();
     });
   });
+
+  describe('messenger', () => {
+    it('clear quotes', () => {
+      createController();
+
+      messenger.call('TransactionPayController:clearQuotes', {
+        transactionId: TRANSACTION_ID_MOCK,
+      });
+
+      expect(clearQuotesMock).toHaveBeenCalledWith(
+        {
+          transactionId: TRANSACTION_ID_MOCK,
+        },
+        expect.anything(),
+      );
+    });
+  });
 });

packages/transaction-pay-controller/src/TransactionPayController.ts

@@ -4,10 +4,12 @@ import type { TransactionMeta } from '@metamask/transaction-controller';
 import type { Draft } from 'immer';
 import { noop } from 'lodash';
 
+import { clearQuotes, getAbortSignal } from './actions/clear-quotes';
 import { updatePaymentToken } from './actions/update-payment-token';
 import { CONTROLLER_NAME, TransactionPayStrategy } from './constants';
 import { QuoteRefresher } from './helpers/QuoteRefresher';
 import type {
+  ClearQuotesRequest,
   GetDelegationTransactionCallback,
   TransactionData,
   TransactionPayControllerMessenger,
@@ -73,6 +75,13 @@ export class TransactionPayController extends BaseController<
     });
   }
 
+  clearQuotes(request: ClearQuotesRequest) {
+    clearQuotes(request, {
+      messenger: this.messenger,
+      updateTransactionData: this.#updateTransactionData.bind(this),
+    });
+  }
+
   updatePaymentToken(request: UpdatePaymentTokenRequest) {
     updatePaymentToken(request, {
       messenger: this.messenger,
@@ -122,7 +131,10 @@ export class TransactionPayController extends BaseController<
     });
 
     if (shouldUpdateQuotes) {
+      const abortSignal = getAbortSignal(transactionId);
+
       updateQuotes({
+        abortSignal,
         messenger: this.messenger,
         transactionData: this.state.transactionData[transactionId],
         transactionId,
@@ -132,6 +144,11 @@ export class TransactionPayController extends BaseController<
   }
 
   #registerActionHandlers() {
+    this.messenger.registerActionHandler(
+      'TransactionPayController:clearQuotes',
+      this.clearQuotes.bind(this),
+    );
+
     this.messenger.registerActionHandler(
       'TransactionPayController:getDelegationTransaction',
       this.#getDelegationTransaction.bind(this),

packages/transaction-pay-controller/src/actions/clear-quotes.test.ts

@@ -0,0 +1,88 @@
+import { clearQuotes, getAbortSignal } from './clear-quotes';
+import type { TransactionData } from '../types';
+
+const TRANSACTION_ID_MOCK = '123-456';
+const REASON_MOCK = 'Test reason';
+
+describe('Clear Quotes Action', () => {
+  it('removes quotes from state', () => {
+    const updateTransactionDataMock = jest.fn();
+
+    clearQuotes(
+      {
+        transactionId: TRANSACTION_ID_MOCK,
+        reason: 'User requested clear',
+      },
+      {
+        messenger: {} as never,
+        updateTransactionData: updateTransactionDataMock,
+      },
+    );
+
+    expect(updateTransactionDataMock).toHaveBeenCalledTimes(1);
+
+    const transactionDataMock = {
+      isLoading: true,
+      quotes: [{}],
+      sourceAmounts: {},
+      totals: {},
+    } as TransactionData;
+
+    updateTransactionDataMock.mock.calls[0][1](transactionDataMock);
+
+    expect(transactionDataMock).toStrictEqual({
+      isLoading: false,
+      quotes: undefined,
+      sourceAmounts: undefined,
+      totals: undefined,
+    });
+  });
+
+  it('aborts signal for the transaction with default reason', () => {
+    const abortMock = jest.fn();
+
+    jest
+      .spyOn(AbortController.prototype, 'abort')
+      .mockImplementation(abortMock);
+
+    clearQuotes(
+      {
+        transactionId: TRANSACTION_ID_MOCK,
+      },
+      {
+        messenger: {} as never,
+        updateTransactionData: jest.fn(),
+      },
+    );
+
+    expect(abortMock).toHaveBeenCalledWith('Clear quotes action');
+  });
+
+  it('aborts signal for the transaction with provided reason', () => {
+    const abortMock = jest.fn();
+
+    jest
+      .spyOn(AbortController.prototype, 'abort')
+      .mockImplementation(abortMock);
+
+    clearQuotes(
+      {
+        transactionId: TRANSACTION_ID_MOCK,
+        reason: REASON_MOCK,
+      },
+      {
+        messenger: {} as never,
+        updateTransactionData: jest.fn(),
+      },
+    );
+
+    expect(abortMock).toHaveBeenCalledWith(REASON_MOCK);
+  });
+
+  describe('getAbortSignal', () => {
+    it('returns an AbortSignal instance', () => {
+      const signal = getAbortSignal(TRANSACTION_ID_MOCK);
+      expect(signal).toBeInstanceOf(AbortSignal);
+    });
+  });
+});

packages/transaction-pay-controller/src/actions/clear-quotes.ts

@@ -0,0 +1,71 @@
+import { createModuleLogger } from '@metamask/utils';
+
+import type { TransactionPayControllerMessenger } from '..';
+import { projectLogger } from '../logger';
+import type {
+  ClearQuotesRequest,
+  UpdateTransactionDataCallback,
+} from '../types';
+
+const log = createModuleLogger(projectLogger, 'clear-quotes');
+
+const abortControllersByTransactionId: Record<string, AbortController> = {};
+
+export type ClearQuotesOptions = {
+  messenger: TransactionPayControllerMessenger;
+  updateTransactionData: UpdateTransactionDataCallback;
+};
+
+/**
+ * Clear the quotes for a specific transaction.
+ *
+ * @param request  - Request parameters.
+ * @param options - Options bag.
+ */
+export function clearQuotes(
+  request: ClearQuotesRequest,
+  options: ClearQuotesOptions,
+) {
+  const { reason: requestReason, transactionId } = request;
+  const { updateTransactionData } = options;
+  const reason = requestReason ?? 'Clear quotes action';
+
+  getAbortController(transactionId).abort(reason);
+  delete abortControllersByTransactionId[transactionId];
+
+  updateTransactionData(transactionId, (data) => {
+    data.isLoading = false;
+    data.quotes = undefined;
+    data.sourceAmounts = undefined;
+    data.totals = undefined;
+  });
+
+  log('Cleared quotes', { transactionId, reason });
+}
+
+/**
+ * Get the AbortSignal for a specific transaction.
+ *
+ * @param transactionId - ID of the transaction.
+ * @returns AbortSignal instance.
+ */
+export function getAbortSignal(transactionId: string) {
+  return getAbortController(transactionId).signal;
+}
+
+/**
+ * Get or create an AbortController for a specific transaction.
+ *
+ * @param transactionId  - ID of the transaction.
+ * @returns - AbortController instance.
+ */
+function getAbortController(transactionId: string) {
+  let abortController = abortControllersByTransactionId[transactionId];
+
+  if (!abortController) {
+    abortController = new AbortController();
+    abortControllersByTransactionId[transactionId] = abortController;
+  }
+
+  return abortController;
+}

packages/transaction-pay-controller/src/helpers/QuoteRefresher.ts

@@ -14,6 +14,8 @@ const CHECK_INTERVAL = 1000; // 1 Second
 const log = createModuleLogger(projectLogger, 'quote-refresh');
 
 export class QuoteRefresher {
+  #abortController: AbortController;
+
   #isRunning: boolean;
 
   #isUpdating: boolean;
@@ -31,6 +33,7 @@ export class QuoteRefresher {
     messenger: TransactionPayControllerMessenger;
     updateTransactionData: UpdateTransactionDataCallback;
   }) {
+    this.#abortController = new AbortController();
     this.#messenger = messenger;
     this.#isRunning = false;
     this.#isUpdating = false;
@@ -61,14 +64,21 @@ export class QuoteRefresher {
 
     this.#isRunning = false;
 
+    this.#abortController.abort();
+    this.#abortController = new AbortController();
+
     log('Stopped');
   }
 
   async #onInterval() {
     this.#isUpdating = true;
 
     try {
-      await refreshQuotes(this.#messenger, this.#updateTransactionData);
+      await refreshQuotes(
+        this.#messenger,
+        this.#updateTransactionData,
+        this.#abortController.signal,
+      );
     } catch (error) {
       log('Error refreshing quotes', error);
     } finally {

packages/transaction-pay-controller/src/index.ts

@@ -1,6 +1,7 @@
 export type {
   TransactionPayControllerActions,
   TransactionPayControllerEvents,
+  TransactionPayControllerClearQuotesAction,
   TransactionPayControllerGetDelegationTransactionAction,
   TransactionPayControllerGetStateAction,
   TransactionPayControllerGetStrategyAction,

packages/transaction-pay-controller/src/strategy/relay/relay-quotes.ts

@@ -77,7 +77,7 @@ async function getSingleQuote(
   request: QuoteRequest,
   fullRequest: PayStrategyGetQuotesRequest,
 ): Promise<TransactionPayQuote<RelayQuote>> {
-  const { messenger, transaction } = fullRequest;
+  const { abortSignal, messenger, transaction } = fullRequest;
 
   try {
     const body = {
@@ -101,6 +101,7 @@ async function getSingleQuote(
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify(body),
+      signal: abortSignal,
     });
 
     const quote = (await response.json()) as RelayQuote;

packages/transaction-pay-controller/src/types.ts

@@ -59,6 +59,11 @@ export type AllowedEvents =
   | TransactionControllerStateChangeEvent
   | TransactionControllerUnapprovedTransactionAddedEvent;
 
+export type TransactionPayControllerClearQuotesAction = {
+  type: `${typeof CONTROLLER_NAME}:clearQuotes`;
+  handler: (request: ClearQuotesRequest) => void;
+};
+
 export type TransactionPayControllerGetStateAction = ControllerGetStateAction<
   typeof CONTROLLER_NAME,
   TransactionPayControllerState
@@ -88,6 +93,7 @@ export type TransactionPayControllerStateChangeEvent =
   >;
 
 export type TransactionPayControllerActions =
+  | TransactionPayControllerClearQuotesAction
   | TransactionPayControllerGetDelegationTransactionAction
   | TransactionPayControllerGetStateAction
   | TransactionPayControllerGetStrategyAction
@@ -322,6 +328,9 @@ export type TransactionPayQuote<OriginalQuote> = {
 
 /** Request to get quotes for a transaction. */
 export type PayStrategyGetQuotesRequest = {
+  /** Optional abort signal to cancel the quote retrieval. */
+  abortSignal?: AbortSignal;
+
   /** Controller messenger. */
   messenger: TransactionPayControllerMessenger;
 
@@ -447,3 +456,8 @@ export type Amount = FiatValue & {
   /** Amount in atomic format without factoring token decimals. */
   raw: string;
 };
+
+export type ClearQuotesRequest = {
+  reason?: string;
+  transactionId: string;
+};