chore: change send transaction popup title/button (#1672)

- Closes FE-970

Author: LuizAsFight

.changeset/sour-emus-train.md

@@ -0,0 +1,5 @@
+---
+"fuels-wallet": patch
+---
+
+chore: change title/button text of Approve transaction screen

.github/workflows/pr.yaml

@@ -45,7 +45,7 @@ jobs:
           fetch-depth: 0
 
       - name: CI Setup
-        uses: FuelLabs/github-actions/setups/node@master
+        uses: FuelLabs/github-actions/setups/node@58bcd91d7246e40938e1971be0b0fe35b253dff0
         with:
           node-version: 20.11.0
           pnpm-version: 9.5.0

packages/app/playwright/crx/crx.test.ts

@@ -704,7 +704,7 @@ test.describe('FuelWallet Extension', () => {
         );
 
         await hasAriaLabel(approveTransactionPage, 'Confirm Transaction');
-        await getButtonByText(approveTransactionPage, /Approve/i).click();
+        await getButtonByText(approveTransactionPage, /Submit/i).click();
 
         await expect(transferStatus).resolves.toBe('success');
         const balance = await receiverWallet.getBalance();

packages/app/playwright/e2e/SendTransaction.test.ts

@@ -64,7 +64,7 @@ test.describe('SendTransaction', () => {
     await expectButtonToBeEnabled(btnLocator);
     await btnLocator.click();
 
-    await getButtonByText(page, 'Approve').click();
+    await getButtonByText(page, 'Submit').click();
     await hasText(page, '0.001 ETH');
 
     // Wait for transaction to be confirmed
@@ -102,7 +102,7 @@ test.describe('SendTransaction', () => {
 
     // Approve transaction
     await hasText(page, '0.001 ETH');
-    await getButtonByText(page, 'Approve').click();
+    await getButtonByText(page, 'Submit').click();
 
     // Wait for transaction to be confirmed
     await hasText(page, 'success');
@@ -147,7 +147,7 @@ test.describe('SendTransaction', () => {
 
     // Approve transaction
     await hasText(page, `0.01 ${ALT_ASSET.symbol}`);
-    await getButtonByText(page, 'Approve').click();
+    await getButtonByText(page, 'Submit').click();
 
     // Wait for transaction to be confirmed
     await hasText(page, 'success');
@@ -184,7 +184,7 @@ test.describe('SendTransaction', () => {
 
     await hasText(page, '0.001 ETH');
 
-    await getButtonByText(page, 'Approve').click();
+    await getButtonByText(page, 'Submit').click();
     await hasText(page, '0.001 ETH');
 
     // Wait for transaction to be confirmed
@@ -226,7 +226,7 @@ test.describe('SendTransaction', () => {
 
     await hasText(page, '0.001 ETH');
 
-    await getButtonByText(page, 'Approve').click();
+    await getButtonByText(page, 'Submit').click();
     await hasText(page, '0.001 ETH');
 
     // Wait for transaction to be confirmed
@@ -271,7 +271,7 @@ test.describe('SendTransaction', () => {
     await btnLocatorBeforeApprv.click();
 
     // Waiting button change to Approve in order to get updated fee amount
-    await page.waitForSelector('button:has-text("Approve")');
+    await page.waitForSelector('button:has-text("Submit")');
     await page.waitForTimeout(1000);
 
     // Going back to select other fee value
@@ -293,13 +293,13 @@ test.describe('SendTransaction', () => {
     await btnLocator.click();
 
     // Waiting button change to Approve in order to get updated fee amount
-    await page.waitForSelector('button:has-text("Approve")');
+    await page.waitForSelector('button:has-text("Submit")');
     await page.waitForTimeout(1000);
 
     await hasText(page, '0.001 ETH');
 
     await page.waitForTimeout(1000);
-    await getButtonByText(page, 'Approve').click();
+    await getButtonByText(page, 'Submit').click();
     await hasText(page, '0.001 ETH');
 
     // Wait for transaction to be confirmed
@@ -350,7 +350,7 @@ test.describe('SendTransaction', () => {
 
     // Approve transaction
     await hasText(page, `${maxAmountAfterFee} ETH`);
-    await getButtonByText(page, 'Approve').click();
+    await getButtonByText(page, 'Submit').click();
     await hasText(page, `${maxAmountAfterFee} ETH`);
 
     // Wait for transaction to be confirmed

packages/app/src/systems/DApp/hooks/useTransactionRequest.tsx

@@ -57,7 +57,7 @@ const selectors = {
     if (state.matches('txSuccess')) return 'Transaction sent';
     if (state.matches('txFailed')) return 'Transaction failed';
     if (state.matches('sendingTx')) return 'Sending transaction';
-    return 'Approve Transaction';
+    return 'Review Transaction';
   },
   origin: (state: TransactionRequestState) => state.context.input.origin,
   originTitle: (state: TransactionRequestState) => state.context.input.title,

packages/app/src/systems/DApp/pages/TransactionRequest/TransactionRequest.tsx

@@ -130,7 +130,7 @@ export function TransactionRequest() {
               isLoading={isLoading || status('sending')}
               isDisabled={shouldDisableApproveBtn}
             >
-              Approve
+              Submit
             </Button>
           </Layout.BottomBar>
         )}

packages/app/src/systems/Transaction/pages/TxApprove/TxApprove.tsx

@@ -75,7 +75,7 @@ export const TxApprove = () => {
               isDisabled={ctx.shouldDisableApproveBtn}
               onPress={ctx.handlers.approve}
             >
-              Approve
+              Submit
             </Button>
           </>
         )}

packages/playwright-utils/src/playwright-utils/fuelWalletTestHelper.ts

@@ -129,7 +129,7 @@ export class FuelWalletTestHelper {
   async walletApprove() {
     const walletPage = await this.getWalletPopupPage();
 
-    const approveButton = getButtonByText(walletPage, 'Approve');
+    const approveButton = getButtonByText(walletPage, 'Submit');
     await approveButton.click();
   }