feat: add event listener for fee token selection

packages/starknet-snap/src/__tests__/helper.ts

@@ -324,6 +324,7 @@ export function generateTransactionRequests({
       type: TransactionType.INVOKE,
       networkName: 'Sepolia',
       signer: address,
+      addressIndex: 0,
       maxFee: '100',
       selectedFeeToken:
         feeTokens[Math.floor(generateRandomValue() * feeTokens.length)].symbol,
@@ -341,6 +342,18 @@ export function generateTransactionRequests({
         },
       ],
       includeDeploy: false,
+      resourceBounds: [
+        {
+          l1_gas: {
+            max_amount: '0',
+            max_price_per_unit: '0',
+          },
+          l2_gas: {
+            max_amount: '0',
+            max_price_per_unit: '0',
+          },
+        },
+      ],
     });
   }
 

packages/starknet-snap/src/index.tsx

@@ -3,6 +3,9 @@ import type {
   OnHomePageHandler,
   OnInstallHandler,
   OnUpdateHandler,
+  OnUserInputHandler,
+  UserInputEvent,
+  InterfaceContext,
 } from '@metamask/snaps-sdk';
 import { MethodNotFoundError } from '@metamask/snaps-sdk';
 import { Box, Link, Text } from '@metamask/snaps-sdk/jsx';
@@ -59,6 +62,7 @@ import type {
   ApiRequestParams,
 } from './types/snapApi';
 import type { SnapState } from './types/snapState';
+import { UserInputEventController } from './ui/controllers/user-input-event-controller';
 import { upgradeAccContract } from './upgradeAccContract';
 import {
   ensureJsxSupport,
@@ -329,3 +333,26 @@ export const onUpdate: OnUpdateHandler = async () => {
 export const onHomePage: OnHomePageHandler = async () => {
   return await homePageController.execute();
 };
+
+/**
+ * Handle incoming user events coming from the MetaMask clients open interfaces.
+ *
+ * @param params - The event parameters.
+ * @param params.id - The Snap interface ID where the event was fired.
+ * @param params.event - The event object containing the event type, name, and
+ * value.
+ * @param params.context
+ * @see https://docs.metamask.io/snaps/reference/exports/#onuserinput
+ */
+export const onUserInput: OnUserInputHandler = async ({
+  id,
+  event,
+  context,
+}: {
+  id: string;
+  event: UserInputEvent;
+  context: InterfaceContext | null;
+}): Promise<void> => {
+  const controller = new UserInputEventController(id, event, context);
+  await controller.handleEvent();
+};

packages/starknet-snap/src/rpcs/__tests__/helper.ts

@@ -3,12 +3,34 @@ import type { constants } from 'starknet';
 
 import type { StarknetAccount } from '../../__tests__/helper';
 import { generateAccounts, generateRandomValue } from '../../__tests__/helper';
+import { TransactionRequestStateManager } from '../../state/request-state-manager';
 import type { SnapState } from '../../types/snapState';
 import { getExplorerUrl, shortenAddress, toJson } from '../../utils';
 import * as snapHelper from '../../utils/snap';
 import * as snapUtils from '../../utils/snapUtils';
 import * as starknetUtils from '../../utils/starknetUtils';
 
+export const mockTransactionRequestStateManager = () => {
+  const upsertTransactionRequestSpy = jest.spyOn(
+    TransactionRequestStateManager.prototype,
+    'upsertTransactionRequest',
+  );
+  const getTransactionRequestSpy = jest.spyOn(
+    TransactionRequestStateManager.prototype,
+    'getTransactionRequest',
+  );
+  const removeTransactionRequestSpy = jest.spyOn(
+    TransactionRequestStateManager.prototype,
+    'removeTransactionRequest',
+  );
+
+  return {
+    upsertTransactionRequestSpy,
+    getTransactionRequestSpy,
+    removeTransactionRequestSpy,
+  };
+};
+
 /**
  *
  * @param chainId

packages/starknet-snap/src/rpcs/execute-txn.test.ts

@@ -14,6 +14,7 @@ import { executeTxn as executeTxnUtil } from '../utils/starknetUtils';
 import {
   generateRandomFee,
   mockAccount,
+  mockTransactionRequestStateManager,
   prepareConfirmDialogInteractiveUI,
   prepareMockAccount,
 } from './__tests__/helper';
@@ -88,6 +89,7 @@ const prepareMockExecuteTxn = async (
     executeTxnUtilSpy,
     getEstimatedFeesSpy,
     getEstimatedFeesRepsMock,
+    ...mockTransactionRequestStateManager(),
   };
 };
 
@@ -100,6 +102,8 @@ describe('ExecuteTxn', () => {
       executeTxnRespMock,
       getEstimatedFeesSpy,
       getEstimatedFeesRepsMock,
+      upsertTransactionRequestSpy,
+      getTransactionRequestSpy,
       request,
     } = await prepareMockExecuteTxn(
       calls.hash,
@@ -126,6 +130,8 @@ describe('ExecuteTxn', () => {
     );
     expect(getEstimatedFeesSpy).toHaveBeenCalled();
     expect(createAccountSpy).not.toHaveBeenCalled();
+    expect(upsertTransactionRequestSpy).toHaveBeenCalled();
+    expect(getTransactionRequestSpy).toHaveBeenCalled();
   });
 
   it.each([
@@ -235,6 +241,60 @@ describe('ExecuteTxn', () => {
     },
   );
 
+  it('throws `Failed to retrieve the updated transaction request` error the transaction request can not retrieve after confirmation', async () => {
+    const calls = callsExamples.multipleCalls;
+    const { getTransactionRequestSpy, request } = await prepareMockExecuteTxn(
+      calls.hash,
+      calls.calls,
+      calls.details,
+      true,
+    );
+
+    getTransactionRequestSpy.mockResolvedValue(null);
+
+    await expect(executeTxn.execute(request)).rejects.toThrow(
+      'Failed to retrieve the updated transaction request',
+    );
+  });
+
+  it.each([
+    {
+      executeTxnResult: callsExamples.multipleCalls.hash,
+      testCase: 'the transaction executed successfully',
+    },
+    {
+      // Simulate the case where the transaction execution failed and does not return a transaction hash
+      // An error `Failed to execute transaction` will be thrown in this case
+      executeTxnResult: '',
+      testCase: 'the transaction failed to execute',
+    },
+  ])(
+    'removes the transaction request from state if $testCase.',
+    async ({ executeTxnResult }) => {
+      const calls = callsExamples.multipleCalls;
+      const { executeTxnUtilSpy, removeTransactionRequestSpy, request } =
+        await prepareMockExecuteTxn(
+          executeTxnResult,
+          calls.calls,
+          calls.details,
+          true,
+        );
+
+      executeTxnUtilSpy.mockResolvedValue({
+        // eslint-disable-next-line @typescript-eslint/naming-convention
+        transaction_hash: executeTxnResult,
+      });
+
+      try {
+        await executeTxn.execute(request);
+      } catch (error) {
+        // eslint-disable-next-line no-empty
+      } finally {
+        expect(removeTransactionRequestSpy).toHaveBeenCalled();
+      }
+    },
+  );
+
   it('throws UserRejectedOpError if user cancels execution', async () => {
     const calls = callsExamples.multipleCalls;
     const { request, confirmDialogSpy } = await prepareMockExecuteTxn(