Merge pull request #4 from okx/feat-provider-request

chore: update provider.request

packages/dex-widget/CHANGELOG.md

@@ -2,6 +2,8 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [1.3.1-beta.0](https://github.com/okx/dex-widget/compare/v1.3.0...v1.3.1-beta.0) (2024-09-20)
+
 ## 1.3.0 (2024-09-18)
 
 ## [1.3.0-beta.0](https://gitlab.okg.com/okfe/tests/dex-widget/compare/v1.2.1-beta.3...v1.3.0-beta.0) (2024-09-11)

packages/dex-widget/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@okxweb3/dex-widget",
-    "version": "1.3.0",
+    "version": "1.3.1-beta.0",
     "description": "## Prequilification",
     "main": "lib/index.cjs",
     "module": "lib/index.mjs",
@@ -25,7 +25,6 @@
         "@types/node": "^22.1.0",
         "@types/react": "^18.3.3",
         "@types/react-dom": "^18.3.0",
-        "standard-version": "^9.5.0",
         "@typescript-eslint/eslint-plugin": "5.53.0",
         "@typescript-eslint/parser": "5.53.0",
         "eslint": "^7.29.0",
@@ -35,6 +34,7 @@
         "eslint-plugin-prettier": "3.4.0",
         "less": "^4.2.0",
         "prettier": "2.4.1",
+        "standard-version": "^9.5.0",
         "typescript": "~4.7.4",
         "vite": "^5.3.1",
         "vite-plugin-dts": "^4.0.1"
@@ -43,7 +43,7 @@
         "@solana/web3.js": "^1.44.1",
         "bs58": "5.0.0",
         "wagmi": "^2.12.2",
-        "web3": "1.8.1"
+        "web3-utils": "^4.3.1"
     },
     "peerDependencies": {
         "react": "^18.3.1",

packages/dex-widget/src/transactions/EvmStrategy.ts

@@ -1,7 +1,6 @@
-import Web3 from 'web3';
-
+import { txInputParamsFormatter } from '../verifyParamsUtils';
 import { postMessageToWindow } from '../messages';
-import { WidgetMethodsListen, EthereumProvider } from '../types';
+import { WidgetMethodsListen, EthereumProvider, TransactionInput } from '../types';
 
 import { BlockchainStrategy } from './IBlockchainStrategy';
 
@@ -33,18 +32,24 @@ export class EvmStrategy implements BlockchainStrategy {
             }
 
             if (method === 'eth_sendTransaction') {
-                const web3Provider = new Web3(provider as unknown as Web3['currentProvider']);
-                web3Provider.eth.sendTransaction(requestPara.params[0], (error, hash) => {
-                    console.log('evm eth_sendTransaction:', hash);
-                    postMessageToWindow(this.iframeWindow, WidgetMethodsListen.PROVIDER_ON_EVENT, {
-                        id,
-                        mode: 'iframe',
-                        data: hash,
-                        path,
-                        type,
-                        error: error && JSON.stringify(error),
-                        success: !!error,
-                    });
+                const payload = txInputParamsFormatter(requestArgs[0] as unknown as TransactionInput);
+
+                const requestPayload = { method, id: Number(id), params: [payload] };
+
+                console.log('eth_sendTransaction requestPara.params[0]', { requestPara, requestPayload });
+
+                const hash = await provider?.request?.(requestPayload as any);
+
+                console.log('provider.request===>', hash);
+
+                postMessageToWindow(this.iframeWindow, WidgetMethodsListen.PROVIDER_ON_EVENT, {
+                    id,
+                    mode: 'iframe',
+                    data: hash,
+                    path,
+                    type,
+                    error: null,
+                    success: true,
                 });
             } else {
                 const data = await provider.request(requestPara);

packages/dex-widget/src/types.ts

@@ -431,3 +431,49 @@ export interface IWidgetConfig {
 export interface UpdateParamsPayload {
     appParams: IWidgetProps;
 }
+
+export interface TransactionInput {
+    readonly [key: string]: unknown;
+    readonly to?: string; // If its a contract creation tx then no address wil be specified.
+    readonly from?: string;
+    readonly data?: string;
+    readonly input?: string;
+    readonly gas: string;
+    readonly gasLimit?: string;
+    readonly gasPrice?: string;
+    readonly maxPriorityFeePerGas?: string;
+    readonly maxFeePerGas?: string;
+    readonly nonce: string;
+    readonly value: string;
+    readonly blockNumber?: string;
+    readonly transactionIndex?: string;
+    readonly type?: string;
+    readonly chainId?: string;
+}
+
+// Make each attribute mutable by removing `readonly`
+export type Mutable<T> = {
+    -readonly [P in keyof T]: T[P];
+};
+
+export type HexString = string;
+export type Numbers = number | bigint | string | HexString;
+
+export type TransactionOutput = {
+    readonly [key: string]: unknown;
+    readonly to?: HexString; // If its a contract creation tx then no address wil be specified.
+    readonly from?: HexString;
+    readonly input: string;
+    readonly gas?: Numbers;
+    readonly gasLimit?: string;
+    readonly nonce: Numbers;
+    readonly value: Numbers;
+    readonly blockNumber?: Numbers;
+    readonly transactionIndex?: Numbers;
+} & (
+        | { maxPriorityFeePerGas: Numbers; maxFeePerGas: Numbers; gasPrice?: never }
+        | { maxPriorityFeePerGas?: never; maxFeePerGas?: never; gasPrice: Numbers }
+    );
+
+
+export type ValidInputTypes = Uint8Array | bigint | string | number | boolean;

packages/dex-widget/src/verifyParamsUtils.ts

@@ -1,5 +1,7 @@
+import { isNullish, numberToHex, toNumber } from 'web3-utils';
+
 import { WALLET_TYPE } from './widgetHelp';
-import { IFeeConfig, ITokenPair } from './types';
+import { IFeeConfig, ITokenPair, Mutable, Numbers, TransactionInput, TransactionOutput } from './types';
 
 export const ERROR_MSG = {
     INVALID_FEE_CONFIG: 'FeeConfig MUST be an object',
@@ -84,3 +86,24 @@ export const verifyWidgetParams = ({ widgetVersion, feeConfig = {}, tokenPair, p
     }
     return true;
 };
+
+export function txInputParamsFormatter(options: TransactionInput): Mutable<TransactionOutput> {
+    const modifiedOptions = { ...options } as unknown as Mutable<TransactionOutput>;
+
+    // allow both
+    if (options.gas || options.gasLimit) {
+        modifiedOptions.gas = toNumber(options.gas ?? options.gasLimit);
+    }
+
+    if (options.maxPriorityFeePerGas || options.maxFeePerGas) {
+        delete modifiedOptions.gasPrice;
+    }
+
+    ['gasPrice', 'gas', 'value', 'maxPriorityFeePerGas', 'maxFeePerGas', 'nonce', 'chainId']
+        .filter(key => !isNullish(modifiedOptions[key]))
+        .forEach(key => {
+            modifiedOptions[key] = numberToHex(modifiedOptions[key] as Numbers);
+        });
+
+    return modifiedOptions as TransactionOutput;
+}

packages/dex-widget/vite.config.ts

@@ -37,12 +37,11 @@ export default defineConfig(({ mode }) => {
                 },
             },
             rollupOptions: {
-                external: ['react', 'react-dom', 'web3', '@solana/web3.js'],
+                external: ['react', 'react-dom', '@solana/web3.js'],
                 output: {
                     globals: {
                         react: 'React',
                         'react-dom': 'ReactDOM',
-                        web3: 'Web3',
                         '@solana/web3.js': 'Web3',
                     },
                     chunkFileNames: info => {
@@ -54,7 +53,7 @@ export default defineConfig(({ mode }) => {
             },
         },
         optimizeDeps: {
-            include: ['react', 'react-dom', 'web3', '@solana/web3.js'],
+            include: ['react', 'react-dom', '@solana/web3.js'],
         },
         plugins: [
             dts({