feat: Add transaction alert when sending data to EOA

[pedronfigueiredo]

Description

Adds new alert for when the user sends a "simple send" native asset transaction with hex data to an EOA account.

This intends to alert the user when they think they are doing a contract interaction but perhaps trigger the confirmation on the wrong network, in which the recipient address is in fact an EOA.

Related issues

Fixes: https://github.com/MetaMask/MetaMask-planning/issues/2926

Manual testing steps

// 1. Switch to the chain you want to broadcast the message on.
// 2. Open the browser console, paste this code and execute it.
// 3. Confirm the transaction on MetaMask.

const ON_CHAIN_MESSAGE = `Why, let the stricken deer go weep,
The hart ungallèd play.
For some must watch while some must sleep.
So runs the world away.`;

async function connectMetaMask() {
  try {
    const accounts = await window.ethereum.request({
      method: 'eth_requestAccounts',
    });
    console.log('Connected account:', accounts[0]);
    return accounts[0];
  } catch (error) {
    console.error('User rejected the request:', error);
    throw error;
  }
}

function stringToHex(str) {
  const encoder = new TextEncoder();
  const bytes = encoder.encode(str);
  return '0x' + Array.from(bytes).map(byte => byte.toString(16).padStart(2, '0')).join('');
}

async function createTransactionWithHexData() {
  try {
    const fromAddress = await connectMetaMask();
    const hexData = stringToHex(ON_CHAIN_MESSAGE);

    const transactionParameters = {
      to: fromAddress,
      from: fromAddress,
      value: '0x0', // Optional: Amount of ETH to send
      data: hexData,
    };

    const txHash = await window.ethereum.request({
      method: 'eth_sendTransaction',
      params: [transactionParameters],
    });

    console.log('Transaction hash:', txHash);
    return txHash;
  } catch (error) {
    console.error('Error creating transaction:', error);
  }
}

createTransactionWithHexData();

Screenshots/Recordings

Before

After

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Extension Coding Standards.
• I've completed the PR template to the best of my ability
• I’ve included tests if applicable
• I’ve documented my code using JSDoc format if applicable
• I’ve applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.

[github-actions]

CLA Signature Action: All authors have signed the CLA. You may need to manually re-run the blocking PR check if it doesn't pass in a few minutes.

[metamaskbot]

Builds ready [7e91a59]

• builds: chrome, firefox
• builds (flask): chrome, firefox
• builds (MMI): chrome
• builds (test): chrome, firefox
• builds (test-flask): chrome, firefox
• build viz: Build System
• mv3: Bundle Size Stats
• mv2: E2e Actions Stats
• storybook: Storybook
• typescript migration: Dashboard
• all artifacts
• bundle viz:

  • background: 0, 1, 2, 3, 4, 5, 6, 7
  • common: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13
  • ui: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12
  • content-script: 0
  • offscreen: 0

Page Load Metrics (1654 ± 79 ms)

Platform	Page	Metric	Min (ms)	Max (ms)	Average (ms)	StandardDeviation (ms)	MarginOfError (ms)
Chrome	Home	firstPaint	1443	2052	1661	174	83
		domContentLoaded	1426	2000	1630	156	75
		load	1439	2015	1654	165	79
		domInteractive	19	90	48	25	12
		backgroundConnect	10	80	29	21	10
		firstReactRender	15	98	43	30	14
		getState	5	47	13	14	7
		initialActions	0	0	0	0	0
		loadScripts	1016	1473	1191	132	63
		setupStore	8	93	21	25	12
		uiStartup	1671	2653	1910	251	121

Bundle size diffs [🚨 Warning! Bundle size has increased!]

• background: 0 Bytes (0.00%)
• ui: 4.81 KiB (0.06%)
• common: 271 Bytes (0.00%)

[jpuri]

Changes look good 👍