feat: create multi contracts #1247
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
6 Skipped Deployments
|
WalkthroughThe diff documents support for multi-address creation transactions in the CHANGELOG and adds a new dependency ( Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant EvmCell as EvmToCell Component
participant EvmCreate as EvmToCellCreate Component
participant TxService as Transaction Service (useCreatedContractsByEvmTxHash)
User->>EvmCell: Render with toAddress (type: Create)
EvmCell->>EvmCreate: Pass address & tx hash (plus isCompact prop)
EvmCreate->>TxService: Invoke useCreatedContractsByEvmTxHash(evmTxHash)
TxService-->>EvmCreate: Return list of created contracts
EvmCreate->>User: Display contract count/details based on retrieved data
Possibly related PRs
Suggested reviewers
Poem
Warning There were issues while running some tools. Please review the errors and either fix the tool’s configuration or disable the tool if it’s a critical failure. 🔧 ESLint
src/lib/components/evm-to-cell/evm-to-cell-create.tsxOops! Something went wrong! :( ESLint: 8.57.1 ESLint couldn't find the plugin "eslint-plugin-react". (The package "eslint-plugin-react" was not found when loaded as a Node module from the directory "".) It's likely that the plugin isn't installed correctly. Try reinstalling by running the following: The plugin "eslint-plugin-react" was referenced from the config file in ".eslintrc.json". If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team. src/lib/components/evm-to-cell/index.tsxOops! Something went wrong! :( ESLint: 8.57.1 ESLint couldn't find the plugin "eslint-plugin-react". (The package "eslint-plugin-react" was not found when loaded as a Node module from the directory "".) It's likely that the plugin isn't installed correctly. Try reinstalling by running the following: The plugin "eslint-plugin-react" was referenced from the config file in ".eslintrc.json". If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team. src/lib/pages/evm-tx-details/components/evm-tx-method/EvmTxCreateContract.tsxOops! Something went wrong! :( ESLint: 8.57.1 ESLint couldn't find the plugin "eslint-plugin-react". (The package "eslint-plugin-react" was not found when loaded as a Node module from the directory "".) It's likely that the plugin isn't installed correctly. Try reinstalling by running the following: The plugin "eslint-plugin-react" was referenced from the config file in ".eslintrc.json". If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team.
✨ Finishing Touches
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (4)
src/lib/pages/evm-tx-details/components/evm-tx-method/EvmTxCreateContract.tsx (1)
78-93: Consider memoizing the contract list rendering for better performance.Since the contracts array is used in multiple places and the rendering logic is identical, consider extracting it into a memoized component.
+const ContractLink = React.memo(({ contract }: { contract: string }) => ( + <Flex gap={1} align="center"> + <CustomIcon + name="contract-address" + boxSize={3} + color="primary.main" + /> + <ExplorerLink + value={contract} + type="evm_contract_address" + showCopyOnHover + textFormat="normal" + fixedHeight={false} + /> + </Flex> +)); {contracts.map((contract) => ( - <Flex key={contract} gap={1} align="center"> - <CustomIcon - name="contract-address" - boxSize={3} - color="primary.main" - /> - <ExplorerLink - value={contract} - type="evm_contract_address" - showCopyOnHover - textFormat="normal" - fixedHeight={false} - /> - </Flex> + <ContractLink key={contract} contract={contract} /> ))}src/lib/components/evm-to-cell/evm-to-cell-create.tsx (2)
48-65: Consider adding keyboard accessibility.While the hover interaction is implemented well, consider adding keyboard accessibility for better user experience.
Consider adding keyboard interaction handlers:
+ const { getReferenceProps, getFloatingProps } = useInteractions([ + hover, + useRole({ + role: "tooltip", + }), + useDismiss(), + useFocus(), + ]);
84-89: Adjust overflow property for better UX.The
overflow: scrollproperty always shows scrollbars. Consider usingautoinstead for better user experience.Apply this diff:
- overflow="scroll" + overflow="auto"src/lib/services/tx/index.ts (1)
788-820: Well-structured contract creation hooks!The new hooks effectively handle contract creation transactions with proper error handling and data transformation. The filtering of duplicate contracts in
useCreatedContractsByEvmTxHashis a nice touch.However, consider adding error handling for the event attribute access:
- .map((event) => zHexAddr20.parse(event.attributes[0].value)) ?? []; + .map((event) => { + if (!event.attributes?.[0]?.value) { + throw new Error("Invalid contract_created event format"); + } + return zHexAddr20.parse(event.attributes[0].value); + }) ?? [];
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (15)
CHANGELOG.md(1 hunks)package.json(1 hunks)src/lib/components/EvmToCell.tsx(0 hunks)src/lib/components/evm-to-cell/evm-to-cell-create.tsx(1 hunks)src/lib/components/evm-to-cell/index.tsx(1 hunks)src/lib/components/table/evm-transactions/EvmTransactionsTableMobileCard.tsx(1 hunks)src/lib/components/table/evm-transactions/EvmTransactionsTableRow.tsx(2 hunks)src/lib/pages/evm-tx-details/components/evm-tx-method/EvmTxCreateContract.tsx(3 hunks)src/lib/pages/tx-details/components/evm-related-tx-section/EvmRelatedField.tsx(1 hunks)src/lib/pages/tx-details/components/evm-related-tx-section/index.tsx(2 hunks)src/lib/services/tx/index.ts(5 hunks)src/lib/services/types/tx.ts(1 hunks)src/lib/styles/theme/components/tag.ts(2 hunks)src/lib/types/evm.ts(0 hunks)src/lib/utils/evm.ts(1 hunks)
💤 Files with no reviewable changes (2)
- src/lib/types/evm.ts
- src/lib/components/EvmToCell.tsx
✅ Files skipped from review due to trivial changes (3)
- package.json
- src/lib/components/table/evm-transactions/EvmTransactionsTableMobileCard.tsx
- CHANGELOG.md
🧰 Additional context used
🪛 Biome (1.9.4)
src/lib/components/evm-to-cell/evm-to-cell-create.tsx
[error] 26-26: Missing key property for this element in iterable.
The order of the items may change, and having a key can help React identify which item was moved.
Check the React documentation.
(lint/correctness/useJsxKeyInIterable)
🔇 Additional comments (12)
src/lib/styles/theme/components/tag.ts (1)
21-26: LGTM!The new
primaryvariant follows the established pattern and maintains consistency with the existing variants.src/lib/pages/tx-details/components/evm-related-tx-section/EvmRelatedField.tsx (1)
27-27: LGTM!The layout adjustments improve flexibility while maintaining responsive design across different screen sizes.
src/lib/utils/evm.ts (1)
38-45:❓ Verification inconclusive
Verify handling of all contract creation scenarios.
The removal of
isEvmSingleCreateand direct assignment ofevmTxHashsuggests support for multi-contract creation. Please ensure all contract creation scenarios are properly handled.Run the following script to verify contract creation handling:
🏁 Script executed:
#!/bin/bash # Description: Search for contract creation patterns in the codebase. # Test: Search for contract creation patterns ast-grep --pattern $'getEvmToAddress($$$) { $$$ if ($method === EvmMethodName.Create) { $$$ } $$$ }' # Test: Search for contract creation tests rg -A 5 'test.*contract.*creation'Length of output: 150
Action Required: Reassess Contract Creation Verification
The recent changes to support multi-contract creation by removing
isEvmSingleCreateand directly assigningevmTxHashappear to align with the PR objectives. However, our initial automated search for tests or explicit patterns validating all contract creation scenarios (especially edge cases like a missingcontractAddress) produced no output. Please double-check manually that:
- All contract creation scenarios (including cases with missing or multiple contract addresses) are correctly handled.
- Adequate test coverage exists to validate these scenarios, or consider adding tests if they’re missing.
src/lib/services/types/tx.ts (1)
483-489: LGTM!The addition of
contractAddresshandling with proper checksum formatting and null checks is well-implemented and consistent with Ethereum address handling standards.src/lib/pages/evm-tx-details/components/evm-tx-method/EvmTxCreateContract.tsx (1)
20-23: LGTM! Good use of default value for contracts array.The hook usage is clean and handles the data properly with a default empty array, preventing potential undefined errors.
src/lib/components/evm-to-cell/index.tsx (1)
9-41: LGTM! Well-structured component with proper type safety.The component has:
- Clear interface definition
- Proper null checks
- Type-safe conditional rendering based on address type
src/lib/components/table/evm-transactions/EvmTransactionsTableRow.tsx (1)
7-7: LGTM! Clean import update and proper prop usage.The changes correctly:
- Update the import path to follow the new convention
- Add the isCompact prop to EvmToCell for consistent layout
Also applies to: 91-91
src/lib/pages/tx-details/components/evm-related-tx-section/index.tsx (1)
5-5: LGTM! Clean import update and improved layout spacing.The changes correctly:
- Update the import path to follow the new convention
- Add margin-top to improve vertical alignment of the arrow icon
Also applies to: 59-59
src/lib/components/evm-to-cell/evm-to-cell-create.tsx (2)
18-22: Props interface looks good!The interface is well-defined with appropriate types and optional flags.
36-44: Component structure looks good!The component is well-organized and follows React best practices for data fetching and state management.
src/lib/services/tx/index.ts (2)
114-114: Consider the implications of infinite stale time.Setting
staleTime: Infinitymeans the data will never be considered stale. Ensure this aligns with your data freshness requirements.Consider if transaction data needs to be refreshed periodically to reflect chain state changes.
732-756: Error handling improvements look good!The additional error check for undefined
evmTxHashand the enabled condition update improve the robustness of the hook.
Summary by CodeRabbit
New Features
Refactor
Style
Chores