diff --git a/stubs/userOps.ts b/stubs/userOps.ts index 267673e2f6..af26c7c653 100644 --- a/stubs/userOps.ts +++ b/stubs/userOps.ts @@ -5,7 +5,7 @@ export const USER_OPS_ITEM: UserOpsItem = { block_number: '10356381', transaction_hash: '0xffcef406eb73986e25666ecfbe03b9dd19d19f28af7477923a5d2979f7b06a43', address: '0x749abd4A31CC4B005526A5F288BEB27f3e239067', - timestamp: '1704964728', + timestamp: '2023-12-18T10:48:49.000000Z', status: true, fee: '48285720012071430', }; @@ -14,7 +14,6 @@ export const USER_OP: UserOp = { hash: '0x20d6ed2bf0a04b011184c801e0b79fbd9411d32be14a6fab3d6150f2691970df', sender: '0xAb28462026f7E7318808a6aF1accAbD13031Af9c', nonce: '0x000000000000000000000000000000000000000000000000000000000000000b', - init_code: null, // eslint-disable-next-line max-len call_data: '0x51945447000000000000000000000000fd04fb0538479ad70dfae539c875b2c1802050120000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000008000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000024d55f960d0adbe9c9b444dc1fbe2b475312067d9dea42db93646ccc87057657aba1d49cd800000000000000000000000000000000000000000000000000000000', call_gas_limit: '71316', @@ -38,11 +37,23 @@ export const USER_OP: UserOp = { gas: '399596', sponsor_type: 'paymaster_sponsor', fee: '17927001792700', - timestamp: '1704994440', - // eslint-disable-next-line max-len - paymaster_and_data: '0x23b944a93020a9c7c414b1adecdb2fd4cd4e81840000000000000000000000000000000000000000000000000000000065a919f70000000000000000000000000000000000000000000000000000000000000000a2c025b3257c409d7ec855f27ca2d7af7c0bee76ff7d9e9038378e70e974d18a182828dd2bca76de61bfae51ba4cff1afd382b451a6e0f5a73d693c04cf9a5311b', + timestamp: '2023-12-18T10:48:49.000000Z', user_logs_count: 1, user_logs_start_index: 2, + raw: { + sender: '0xbE0c5Ef0Da631723Fc32EC12a61173628774Efd2', + nonce: '1', + init_code: '0x', + // eslint-disable-next-line max-len + call_data: '0x34fcd5be0000000000000000000000000000000000000000000000000000000000000020000000000000000000000000000000000000000000000000000000000000000100000000000000000000000000000000000000000000000000000000000000200000000000000000000000004200000000000000000000000000000000000042000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000600000000000000000000000000000000000000000000000000000000000000044a9059cbb00000000000000000000000030713a9895e150d73fb7676d054814d30266f8f100000000000000000000000000000000000000000000000002c68af0bb14000000000000000000000000000000000000000000000000000000000000', + call_gas_limit: '29491', + verification_gas_limit: '80734', + pre_verification_gas: '3276112', + max_fee_per_gas: '309847206', + max_priority_fee_per_gas: '100000000', + paymaster_and_data: '0x', + signature: '0x000000000beec352335acb3aef09a1f4e00877540db24283a347c475bdee548df87b8bc424e6493076495fdf7ced709507e45245b54e59c967dfdf1d24815416e8a639bb1b', + }, }; export const USER_OPS_ACCOUNT: UserOpsAccount = { diff --git a/types/api/userOps.ts b/types/api/userOps.ts index 1ed86a8b7e..08cc0df917 100644 --- a/types/api/userOps.ts +++ b/types/api/userOps.ts @@ -43,13 +43,13 @@ export type UserOp = { factory: string | null; paymaster: string | null; sponsor_type: UserOpSponsorType; - init_code: string | null; signature: string; nonce: string; call_data: string; user_logs_start_index: number; user_logs_count: number; - paymaster_and_data?: string; + // eslint-disable-next-line @typescript-eslint/no-explicit-any + raw: Record; } export type UserOpsFilters = { diff --git a/ui/pages/UserOp.tsx b/ui/pages/UserOp.tsx index af6bd464f7..e023aab0ae 100644 --- a/ui/pages/UserOp.tsx +++ b/ui/pages/UserOp.tsx @@ -35,30 +35,27 @@ const UserOp = () => { }, }); - const logRangeStart = Number(userOpQuery.data?.user_logs_start_index); - const logRangeEnd = logRangeStart + Number(userOpQuery.data?.user_logs_count); - const filterTokenTransfersByLogIndex = React.useCallback((tt: TokenTransfer) => { if (!userOpQuery.data) { return true; } else { - if (inRange(Number(tt.log_index), logRangeStart, logRangeEnd)) { + if (inRange(Number(tt.log_index), userOpQuery.data?.user_logs_start_index, userOpQuery.data?.user_logs_start_index + userOpQuery.data?.user_logs_count)) { return true; } return false; } - }, [ userOpQuery.data, logRangeStart, logRangeEnd ]); + }, [ userOpQuery.data ]); const filterLogsByLogIndex = React.useCallback((log: Log) => { if (!userOpQuery.data) { return true; } else { - if (inRange(log.index, logRangeStart, logRangeEnd)) { + if (inRange(log.index, userOpQuery.data?.user_logs_start_index, userOpQuery.data?.user_logs_start_index + userOpQuery.data?.user_logs_count)) { return true; } return false; } - }, [ userOpQuery.data, logRangeStart, logRangeEnd ]); + }, [ userOpQuery.data ]); const tabs: Array = React.useMemo(() => ([ { id: 'index', title: 'Details', component: }, @@ -73,7 +70,7 @@ const UserOp = () => { component: , }, { id: 'logs', title: 'Logs', component: }, - { id: 'raw', title: 'Raw', component: }, + { id: 'raw', title: 'Raw', component: }, ].filter(Boolean)), [ userOpQuery, filterTokenTransfersByLogIndex, filterLogsByLogIndex ]); const tabIndex = useTabIndexFromQuery(tabs); diff --git a/ui/userOp/UserOpDetails.tsx b/ui/userOp/UserOpDetails.tsx index c8fa9f89d8..f3635bc547 100644 --- a/ui/userOp/UserOpDetails.tsx +++ b/ui/userOp/UserOpDetails.tsx @@ -88,7 +88,6 @@ const UserOpDetails = ({ query }: Props) => { > - { /* how to show it? */ } { data.revert_reason && ( { hint="Date and time of User operation" isLoading={ isPlaceholderData } > - { /* timestamp format will be fixed */ } - + ) } { !config.UI.views.tx.hiddenFields?.tx_fee && ( @@ -137,18 +135,21 @@ const UserOpDetails = ({ query }: Props) => { @@ -263,16 +264,6 @@ const UserOpDetails = ({ query }: Props) => { - { data.init_code && ( - - { data.init_code } - - ) } ; + // eslint-disable-next-line @typescript-eslint/no-explicit-any + rawData?: Record; + isLoading?: boolean; } -const RAW_FIELDS: Array = [ - 'sender', - 'nonce', - 'init_code', - 'call_data', - 'call_gas_limit', - 'verification_gas_limit', - 'pre_verification_gas', - 'max_fee_per_gas', - 'max_priority_fee_per_gas', - 'paymaster_and_data', - 'signature', -]; - -const UserOpRaw = ({ query }: Props) => { - if (!query.data) { +const UserOpRaw = ({ rawData, isLoading }: Props) => { + if (!rawData) { return null; } - const dataToDisplay = pick(query.data, RAW_FIELDS); - const text = JSON.stringify(dataToDisplay, undefined, 4); + const text = JSON.stringify(rawData, undefined, 4); - return ; + return ; }; export default UserOpRaw; diff --git a/ui/userOps/UserOpsListItem.tsx b/ui/userOps/UserOpsListItem.tsx index 09ede6c0fc..e3eb68b5bc 100644 --- a/ui/userOps/UserOpsListItem.tsx +++ b/ui/userOps/UserOpsListItem.tsx @@ -21,8 +21,7 @@ type Props = { }; const UserOpsListItem = ({ item, isLoading, showTx, showSender }: Props) => { - // format will be fixed on the back-end - const timeAgo = dayjs(Number(item.timestamp) * 1000).fromNow(); + const timeAgo = dayjs(item.timestamp).fromNow(); return ( diff --git a/ui/userOps/UserOpsTableItem.tsx b/ui/userOps/UserOpsTableItem.tsx index 752683c93f..cdd0a74609 100644 --- a/ui/userOps/UserOpsTableItem.tsx +++ b/ui/userOps/UserOpsTableItem.tsx @@ -20,8 +20,7 @@ import UserOpStatus from 'ui/shared/userOps/UserOpStatus'; }; const UserOpsTableItem = ({ item, isLoading, showTx, showSender }: Props) => { - // will be fixed on the back-end - const timeAgo = dayjs(Number(item.timestamp) * 1000).fromNow(); + const timeAgo = dayjs(item.timestamp).fromNow(); return (