Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(display-raw-data): Show raw data when the method name and parameters is missing in a tx #4260

Open
wants to merge 3 commits into
base: dev
Choose a base branch
from

Conversation

clovisdasilvaneto
Copy link
Contributor

What it solves

Resolves #4215

How this PR fixes it

it adds the hexData in the txData of the DecodedTx component and check if there is parameters when the method name is missing, if there are no parameters and method name is missing, we show the raw hexData

How to test it

  1. Go to transaction builder
  2. Create a new transacation with custom data
  3. Send it

Expected: The raw data should appears in the confirmation screen as screenshot bellow

Screenshots

Screenshot 2024-09-26 at 17 03 53

Checklist

  • I've tested the branch on mobile 📱
  • I've documented how it affects the analytics (if at all) 📊
  • I've written a unit/e2e test for it (if applicable) 🧑‍💻

Copy link

github-actions bot commented Sep 26, 2024

@clovisdasilvaneto clovisdasilvaneto self-assigned this Sep 26, 2024
@clovisdasilvaneto clovisdasilvaneto changed the title fix(display-raw-data): Display raw data when the method name and parameters is missing in a tx fix(display-raw-data): Show raw data when the method name and parameters is missing in a tx Sep 26, 2024
Copy link

github-actions bot commented Sep 26, 2024

📦 Next.js Bundle Analysis for safe-wallet-web

This analysis was generated by the Next.js Bundle Analysis action. 🤖

⚠️ Global Bundle Size Increased

Page Size (compressed)
global 954.82 KB (🟡 +26 B)
Details

The global bundle is the javascript bundle that loads alongside every page. It is in its own category because its impact is much higher - an increase to its size means that every page on your website loads slower, and a decrease means every page loads faster.

Any third party scripts you have added directly to your app using the <script> tag are not accounted for in this analysis

If you want further insight into what is behind the changes, give @next/bundle-analyzer a try!

Copy link

github-actions bot commented Sep 26, 2024

Coverage report

Caution

Test run failed

St.
Category Percentage Covered / Total
🟡 Statements
79.39% (+1.3% 🔼)
10580/13326
🟡 Branches
62.28% (+4.07% 🔼)
2810/4512
🟡 Functions
67.99% (+2.9% 🔼)
1763/2593
🟢 Lines
80.98% (+1.34% 🔼)
9496/11726
Show files with reduced coverage 🔻
St.
File Statements Branches Functions Lines
🟡
... / transactions.ts
65.55% (-7.56% 🔻)
21.95% (-17.07% 🔻)
38.1% (-9.52% 🔻)
67.96% (-6.8% 🔻)
🟡
... / transaction-guards.ts
62.56% (-7.18% 🔻)
30.77% (-6.15% 🔻)
58.33% (-10% 🔻)
66.67% (-4.44% 🔻)
🟡
... / safeContracts.ts
71.43% (-4.76% 🔻)
50% (-12.5% 🔻)
54.55% (-9.09% 🔻)
66.04% (-5.66% 🔻)
🔴
... / sdk.ts
34.31% (-1.46% 🔻)
9.76%
23.53% (-5.88% 🔻)
33.33% (-0.81% 🔻)
🟡
... / settingsSlice.ts
65.67% (-8.96% 🔻)
66.67% (-16.67% 🔻)
56% (-12% 🔻)
60% (-6% 🔻)
🟡
... / gateway.ts
64% (-4% 🔻)
100% 50%
68.18% (-4.55% 🔻)
🟢
... / safeTheme.ts
90.7% (-2.33% 🔻)
50%
90% (-3.33% 🔻)
92.68% (-2.44% 🔻)
🟢
... / hooks.ts
81.03%
69.7% (-3.03% 🔻)
70.59% 81.13%
🟢
... / index.tsx
81.25% (-18.75% 🔻)
75% (-25% 🔻)
50% (-50% 🔻)
85.71% (-14.29% 🔻)
🟡
... / utils.ts
60%
5.56% (-5.56% 🔻)
60% 62.22%
🟢
... / index.tsx
97.06%
73.68% (-10.53% 🔻)
100% 96.67%
🔴
... / SafeTxProvider.tsx
28.57% 0%
22.22% (-22.22% 🔻)
29.17%
🟢
... / utils.ts
86.17% (-3.19% 🔻)
62.96% (-3.7% 🔻)
86.67% (-6.67% 🔻)
90.48% (-2.38% 🔻)
🔴
... / useRecoveryQueue.ts
50% (-50% 🔻)
0% (-75% 🔻)
0% (-100% 🔻)
50% (-50% 🔻)
🟡
... / index.tsx
72.5% (-15% 🔻)
35.29% (-2.94% 🔻)
33.33% (-16.67% 🔻)
71.05% (-15.79% 🔻)
🟢
... / index.tsx
100%
91.11% (-4.44% 🔻)
100% 100%
🟢
... / index.tsx
85.88%
67.65% (-2.94% 🔻)
100% 86.59%
🟡
... / hooks.ts
75% (-5.63% 🔻)
52.7% (-9.46% 🔻)
72.97% (-13.51% 🔻)
78.26% (-2.17% 🔻)
🟢
... / ExecuteForm.tsx
93.06% (-2.78% 🔻)
86.49%
66.67% (-33.33% 🔻)
95.65%
🟡
... / useWalletCanRelay.ts
70%
50% (-33.33% 🔻)
50% 70.59%
🟢
... / useSafeAppFromBackend.ts
84.21% (-5.26% 🔻)
20% (-20% 🔻)
100% 88.89%
🟢
... / useVisibleBalances.ts
100%
66.67% (-8.33% 🔻)
100% 100%
🟢
... / SignForm.tsx
89.29% (-3.57% 🔻)
87.1%
75% (-25% 🔻)
94.23%
🟢
... / useBatchedTxs.ts
81.25% (-15.63% 🔻)
85.71%
71.43% (-28.57% 🔻)
88% (-12% 🔻)
🔴
... / useTransactionType.tsx
47.83% (-13.04% 🔻)
15.22% (-21.74% 🔻)
100%
47.73% (-13.64% 🔻)
🟢
... / index.tsx
84.21% (-5.26% 🔻)
50% (-12.5% 🔻)
100%
83.33% (-5.56% 🔻)
🟢
... / useTransactionStatus.ts
88%
50% (-10% 🔻)
100% 90.91%
🟢
... / ConfirmationTitle.tsx
85.71% (-14.29% 🔻)
33.33% (-66.67% 🔻)
50% (-50% 🔻)
100%
🟡
... / TxChecks.tsx
61.11% (-38.89% 🔻)
0% (-100% 🔻)
0% (-100% 🔻)
64.71% (-35.29% 🔻)
🔴
... / BlockaidBalanceChange.tsx
57.14% (-9.52% 🔻)
0% (-4.76% 🔻)
0% (-10% 🔻)
58.54% (-7.32% 🔻)

Test suite run failed

Failed tests: 0/1460. Failed suites: 7/203.
  ● Test suite failed to run

    TypeError: Cannot read properties of undefined (reading 'READY_TO_WITHDRAW')

      45 |     text: 'Withdrawn',
      46 |   },
    > 47 |   [NativeStakingExitStatus.READY_TO_WITHDRAW]: {
         |                            ^
      48 |     color: 'success',
      49 |     icon: CheckIcon,
      50 |     text: 'Ready to withdraw',

      at Object.READY_TO_WITHDRAW (src/features/stake/components/StakingStatus/index.tsx:47:28)
      at Object.<anonymous> (src/features/stake/components/StakingConfirmationTx/Deposit.tsx:800:66)
      at Object.<anonymous> (src/features/stake/components/StakingTxDepositDetails/index.tsx:419:65)
      at Object.<anonymous> (src/components/transactions/TxDetails/TxData/index.tsx:1046:67)
      at Object.<anonymous> (src/components/tx/SignOrExecuteForm/index.tsx:3943:67)
      at Object.<anonymous> (src/components/tx/SignOrExecuteForm/__tests__/SignOrExecute.test.tsx:11:28)


  ● Test suite failed to run

    TypeError: Cannot read properties of undefined (reading 'READY_TO_WITHDRAW')

      45 |     text: 'Withdrawn',
      46 |   },
    > 47 |   [NativeStakingExitStatus.READY_TO_WITHDRAW]: {
         |                            ^
      48 |     color: 'success',
      49 |     icon: CheckIcon,
      50 |     text: 'Ready to withdraw',

      at Object.READY_TO_WITHDRAW (src/features/stake/components/StakingStatus/index.tsx:47:28)
      at Object.<anonymous> (src/features/stake/components/StakingConfirmationTx/Deposit.tsx:800:66)
      at Object.<anonymous> (src/features/stake/components/StakingTxDepositDetails/index.tsx:419:65)
      at Object.<anonymous> (src/components/transactions/TxDetails/TxData/index.tsx:1046:67)
      at Object.<anonymous> (src/components/tx/SignOrExecuteForm/index.tsx:3943:67)
      at Object.<anonymous> (src/components/tx-flow/flows/SignMessageOnChain/ReviewSignMessageOnChain.tsx:1656:67)
      at Object.<anonymous> (src/components/tx-flow/flows/SignMessageOnChain/ReviewSignMessageOnChain.test.tsx:12:74)


  ● Test suite failed to run

    TypeError: Cannot read properties of undefined (reading 'READY_TO_WITHDRAW')

      45 |     text: 'Withdrawn',
      46 |   },
    > 47 |   [NativeStakingExitStatus.READY_TO_WITHDRAW]: {
         |                            ^
      48 |     color: 'success',
      49 |     icon: CheckIcon,
      50 |     text: 'Ready to withdraw',

      at Object.READY_TO_WITHDRAW (src/features/stake/components/StakingStatus/index.tsx:47:28)
      at Object.<anonymous> (src/features/stake/components/StakingConfirmationTx/Deposit.tsx:800:66)
      at Object.<anonymous> (src/features/stake/components/StakingTxDepositDetails/index.tsx:419:65)
      at Object.<anonymous> (src/components/transactions/TxDetails/TxData/index.tsx:1046:67)
      at Object.<anonymous> (src/components/transactions/TxDetails/index.tsx:2631:66)
      at Object.<anonymous> (src/components/transactions/TxListItem/ExpandableTransactionItem.tsx:805:67)
      at Object.<anonymous> (src/components/transactions/GroupedTxListItems/index.tsx:671:66)
      at Object.<anonymous> (src/components/transactions/TxList/index.tsx:879:66)
      at Object.<anonymous> (src/components/transactions/SingleTx/index.tsx:2027:28)
      at Object.<anonymous> (src/pages/transactions/tx.tsx:334:66)
      at Object.<anonymous> (src/components/transactions/SingleTx/SingleTx.test.tsx:19:52)


  ● Test suite failed to run

    TypeError: Cannot read properties of undefined (reading 'READY_TO_WITHDRAW')

      45 |     text: 'Withdrawn',
      46 |   },
    > 47 |   [NativeStakingExitStatus.READY_TO_WITHDRAW]: {
         |                            ^
      48 |     color: 'success',
      49 |     icon: CheckIcon,
      50 |     text: 'Ready to withdraw',

      at Object.READY_TO_WITHDRAW (src/features/stake/components/StakingStatus/index.tsx:47:28)
      at Object.<anonymous> (src/features/stake/components/StakingConfirmationTx/Deposit.tsx:800:66)
      at Object.<anonymous> (src/features/stake/components/StakingTxDepositDetails/index.tsx:419:65)
      at Object.<anonymous> (src/components/transactions/TxDetails/TxData/index.tsx:1046:67)
      at Object.<anonymous> (src/components/transactions/TxDetails/index.tsx:2631:66)
      at Object.<anonymous> (src/components/transactions/TxListItem/ExpandableTransactionItem.tsx:805:67)
      at Object.<anonymous> (src/components/transactions/GroupedTxListItems/index.tsx:671:66)
      at Object.<anonymous> (src/components/transactions/TxList/index.tsx:879:66)
      at Object.<anonymous> (src/components/common/PaginatedTxns/index.tsx:1244:65)
      at Object.<anonymous> (src/components/safe-apps/AppFrame/TransactionQueueBar/index.tsx:906:66)
      at Object.<anonymous> (src/components/safe-apps/AppFrame/index.tsx:2972:68)
      at Object.<anonymous> (src/components/safe-apps/AppFrame/__tests__/AppFrame.test.tsx:7:58)


  ● Test suite failed to run

    TypeError: Cannot read properties of undefined (reading 'READY_TO_WITHDRAW')

      45 |     text: 'Withdrawn',
      46 |   },
    > 47 |   [NativeStakingExitStatus.READY_TO_WITHDRAW]: {
         |                            ^
      48 |     color: 'success',
      49 |     icon: CheckIcon,
      50 |     text: 'Ready to withdraw',

      at Object.READY_TO_WITHDRAW (src/features/stake/components/StakingStatus/index.tsx:47:28)
      at Object.<anonymous> (src/features/stake/components/StakingConfirmationTx/Deposit.tsx:800:66)
      at Object.<anonymous> (src/features/stake/components/StakingTxDepositDetails/index.tsx:419:65)
      at Object.<anonymous> (src/components/transactions/TxDetails/TxData/index.tsx:1046:67)
      at Object.<anonymous> (src/components/transactions/TxDetails/index.tsx:2631:66)
      at Object.<anonymous> (src/components/transactions/TxListItem/ExpandableTransactionItem.tsx:805:67)
      at Object.<anonymous> (src/components/transactions/GroupedTxListItems/index.tsx:671:66)
      at Object.<anonymous> (src/components/transactions/TxList/index.tsx:879:66)
      at Object.<anonymous> (src/components/safe-messages/SingleMsg/index.tsx:557:27)
      at Object.<anonymous> (src/components/safe-messages/SingleMsg/SingleMsg.test.tsx:21:50)


  ● Test suite failed to run

    TypeError: Cannot read properties of undefined (reading 'READY_TO_WITHDRAW')

      45 |     text: 'Withdrawn',
      46 |   },
    > 47 |   [NativeStakingExitStatus.READY_TO_WITHDRAW]: {
         |                            ^
      48 |     color: 'success',
      49 |     icon: CheckIcon,
      50 |     text: 'Ready to withdraw',

      at Object.READY_TO_WITHDRAW (src/features/stake/components/StakingStatus/index.tsx:47:28)
      at Object.<anonymous> (src/features/stake/components/StakingConfirmationTx/Deposit.tsx:800:66)
      at Object.<anonymous> (src/features/stake/components/StakingTxDepositDetails/index.tsx:419:65)
      at Object.<anonymous> (src/components/transactions/TxDetails/TxData/index.tsx:1046:67)
      at Object.<anonymous> (src/components/tx/SignOrExecuteForm/index.tsx:3943:67)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/ReviewTokenTransfer.tsx:757:65)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/ReviewTokenTx.tsx:379:66)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/index.tsx:861:67)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/__tests__/CreateTokenTransfer.test.tsx:6:24)


  ● Test suite failed to run

    TypeError: Cannot read properties of undefined (reading 'READY_TO_WITHDRAW')

      45 |     text: 'Withdrawn',
      46 |   },
    > 47 |   [NativeStakingExitStatus.READY_TO_WITHDRAW]: {
         |                            ^
      48 |     color: 'success',
      49 |     icon: CheckIcon,
      50 |     text: 'Ready to withdraw',

      at Object.READY_TO_WITHDRAW (src/features/stake/components/StakingStatus/index.tsx:47:28)
      at Object.<anonymous> (src/features/stake/components/StakingConfirmationTx/Deposit.tsx:800:66)
      at Object.<anonymous> (src/features/stake/components/StakingTxDepositDetails/index.tsx:419:65)
      at Object.<anonymous> (src/components/transactions/TxDetails/TxData/index.tsx:1046:67)
      at Object.<anonymous> (src/components/tx/SignOrExecuteForm/index.tsx:3943:67)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/ReviewTokenTransfer.tsx:757:65)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/ReviewTokenTx.tsx:379:66)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/index.tsx:861:67)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/SpendingLimitRow/index.tsx:744:27)
      at Object.<anonymous> (src/components/tx-flow/flows/TokenTransfer/CreateTokenTransfer.tsx:1273:66)
      at Object.<anonymous> (src/components/common/TokenAmountInput/index.tsx:1084:28)
      at Object.<anonymous> (src/components/tx-flow/flows/NewSpendingLimit/CreateSpendingLimit.tsx:1034:67)
      at Object.<anonymous> (src/components/tx-flow/flows/NewSpendingLimit/__tests__/SpendingLimitForm.test.ts:5:30)

Report generated by 🧪jest coverage report action from fa1a642

@@ -50,7 +50,7 @@ export const DecodedData = ({ txData, toInfo }: Props): ReactElement | null => {
const avatar = addressInfo?.logoUri || toInfo?.logoUri || txData.to.logoUri

let decodedData = <></>
if (txData.dataDecoded) {
if (txData.dataDecoded && (method || (!method && txData.dataDecoded.parameters))) {
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this check for the parameters and method name is needed because for a native token transfer (from transaction builder) the decoded data comes also with an empty method:

{
    "type": "GENERIC",
    "method": "",
    "parameters": [
        {
            "name": "to",
            "type": "address",
            "value": "0xDa5e9FA404881Ff36DDa97b41Da402dF6430EE6b"
        },
        {
            "name": "value",
            "type": "uint256",
            "value": "1000000000000000000"
        }
    ]
}

Copy link
Member

@schmanu schmanu left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Works well!
Could you add a unit test case to e.g. DecodedTx/index.test.ts?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Status: Ready for QA
Development

Successfully merging this pull request may close these issues.

Show raw data for empty methods without params
3 participants