-
Notifications
You must be signed in to change notification settings - Fork 60
[BLOCKED] feat: Add Sui support #301
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
base: main
Are you sure you want to change the base?
Conversation
📝 WalkthroughWalkthroughThis PR adds Sui blockchain support to the example frontend application by extending chain type definitions to include 'SUI', updating chain configuration with Sui Testnet, integrating SUI wallet handling into the connected content component, and implementing the SUI deposit-and-call transaction flow in the transaction handling hook. Changes
Sequence Diagram(s)sequenceDiagram
participant App
participant HandleCall as useHandleCall
participant Sui as SUI Handler
participant WalletClient
App->>HandleCall: handleCall (walletType: 'SUI')
HandleCall->>Sui: handleSuiCall()
rect rgba(77, 162, 255, 0.1)
Sui->>Sui: prepareSuiDepositAndCall()
Sui->>Sui: onSigningStart callback
Sui->>WalletClient: signAndExecuteTransactionBlock()
WalletClient-->>Sui: signature + txHash
Sui->>Sui: onTransactionSubmitted callback
Sui->>Sui: onTransactionConfirmed callback
end
Sui-->>HandleCall: result
HandleCall-->>App: completion
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes
Pre-merge checks and finishing touches❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (2)
examples/hello/frontend/src/hooks/useHandleCall.ts (1)
127-162: Consider parameterizing hardcoded values.The hardcoded
amount: '0.001'(line 145) andchainId: '103'(line 147) reduce flexibility. Consider:
- Deriving
chainIdfromsupportedChain.chainId(passed via the parent hook's context)- Making
amountconfigurable throughCallParamsorUseHandleCallParamsThis would align with the parameterized approach used in
handleEvmCalland improve maintainability.Apply this diff to parameterize the values:
async function handleSuiCall( callParams: CallParams, primaryWallet: PrimaryWallet, + chainId: string, callbacks: { onSigningStart?: UseHandleCallParams['onSigningStart']; onTransactionSubmitted?: UseHandleCallParams['onTransactionSubmitted']; onTransactionConfirmed?: UseHandleCallParams['onTransactionConfirmed']; } ): Promise<void> { const suiWallet = getSuiWallet(primaryWallet); const walletClient = await getSuiWalletClient(primaryWallet); callbacks.onSigningStart?.(); const { transaction } = await prepareSuiDepositAndCall( { ...callParams, amount: '0.001' }, { - chainId: '103', + chainId, } );Then update the call site at line 323:
- await handleSuiCall(callParams, primaryWallet, callbacks); + await handleSuiCall( + callParams, + primaryWallet, + String(supportedChain.chainId), + callbacks + );examples/hello/frontend/src/DynamicAppContent.tsx (1)
22-24: Add inline documentation for consistency with the Solana mapping.The network identifier
'502'correctly maps to chainId103(Sui Testnet), consistent with the supported chains defined in the codebase. However, to match the documentation pattern established on line 17 for Solana, add an inline comment explaining the Sui network mapping:// Sui Testnet id from `network` property if (network === '502') { return 103; }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
Disabled knowledge base sources:
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
⛔ Files ignored due to path filters (7)
examples/hello/frontend/public/logos/arbitrum-logo.svgis excluded by!**/*.svgexamples/hello/frontend/public/logos/avalanche-logo.svgis excluded by!**/*.svgexamples/hello/frontend/public/logos/base-logo.svgis excluded by!**/*.svgexamples/hello/frontend/public/logos/bsc-logo.svgis excluded by!**/*.svgexamples/hello/frontend/public/logos/ethereum-logo.svgis excluded by!**/*.svgexamples/hello/frontend/public/logos/network-placeholder-logo.svgis excluded by!**/*.svgexamples/hello/frontend/public/logos/polygon-logo.svgis excluded by!**/*.svg
📒 Files selected for processing (5)
examples/hello/frontend/src/ConnectedContent.tsx(1 hunks)examples/hello/frontend/src/DynamicAppContent.tsx(1 hunks)examples/hello/frontend/src/components/NetworkSelector.tsx(1 hunks)examples/hello/frontend/src/constants/chains.ts(2 hunks)examples/hello/frontend/src/hooks/useHandleCall.ts(3 hunks)
🧰 Additional context used
🧠 Learnings (5)
📓 Common learnings
Learnt from: hernan-clich
Repo: zeta-chain/example-contracts PR: 280
File: examples/hello/frontend/src/App.tsx:8-9
Timestamp: 2025-09-17T20:09:36.410Z
Learning: In the zeta-chain/example-contracts repository, commit c9e419c6c8d6f045b06b2ba94c3c9f9b4ab05d0f addressed a runtime issue by splitting AppContent.tsx into DynamicAppContent.tsx and Eip6963AppContent.tsx components, providing better separation of concerns between dynamic wallet and EIP-6963 wallet implementations.
Learnt from: hernan-clich
Repo: zeta-chain/example-contracts PR: 280
File: examples/hello/frontend/src/utils/ethersHelpers.ts:1-6
Timestamp: 2025-09-18T17:59:04.889Z
Learning: Commit 1c6cffd3d29499bf0544987a9116c7c6571ff895 in zeta-chain/example-contracts resolves the noble/hashes esbuild build failure by adding resolutions for "noble/hashes": "1.8.0" and "noble/curves": "1.9.7" to examples/hello/frontend/package.json.
Learnt from: hernan-clich
Repo: zeta-chain/example-contracts PR: 297
File: examples/hello/frontend/src/Eip6963AppContent.tsx:19-24
Timestamp: 2025-10-17T15:57:52.849Z
Learning: In the zeta-chain/example-contracts repository's Eip6963AppContent.tsx, the useEffect synchronization pattern `if (walletChain?.chainType === 'EVM')` before calling `setSelectedChain(walletChain)` is intentional for multi-wallet architecture: it syncs selectedChain with EIP-6963 wallet state only for EVM chains, preventing automatic overwrites when users manually select non-EVM chains (BTC/SOL) via onChainSelect callback, since EIP-6963 wallets remain on EVM chains and don't natively switch to non-EVM chains.
Learnt from: hernan-clich
Repo: zeta-chain/example-contracts PR: 276
File: examples/hello/frontend/tsconfig.node.json:16-22
Timestamp: 2025-07-28T19:20:39.900Z
Learning: The user hernan-clich prefers to reference previous discussions when the same issue appears in multiple files, indicating a preference for consistent resolution approaches across similar configuration files.
📚 Learning: 2025-10-17T15:57:52.849Z
Learnt from: hernan-clich
Repo: zeta-chain/example-contracts PR: 297
File: examples/hello/frontend/src/Eip6963AppContent.tsx:19-24
Timestamp: 2025-10-17T15:57:52.849Z
Learning: In the zeta-chain/example-contracts repository's Eip6963AppContent.tsx, the useEffect synchronization pattern `if (walletChain?.chainType === 'EVM')` before calling `setSelectedChain(walletChain)` is intentional for multi-wallet architecture: it syncs selectedChain with EIP-6963 wallet state only for EVM chains, preventing automatic overwrites when users manually select non-EVM chains (BTC/SOL) via onChainSelect callback, since EIP-6963 wallets remain on EVM chains and don't natively switch to non-EVM chains.
Applied to files:
examples/hello/frontend/src/components/NetworkSelector.tsxexamples/hello/frontend/src/hooks/useHandleCall.tsexamples/hello/frontend/src/ConnectedContent.tsxexamples/hello/frontend/src/constants/chains.tsexamples/hello/frontend/src/DynamicAppContent.tsx
📚 Learning: 2025-09-17T20:09:36.410Z
Learnt from: hernan-clich
Repo: zeta-chain/example-contracts PR: 280
File: examples/hello/frontend/src/App.tsx:8-9
Timestamp: 2025-09-17T20:09:36.410Z
Learning: In the zeta-chain/example-contracts repository, commit c9e419c6c8d6f045b06b2ba94c3c9f9b4ab05d0f addressed a runtime issue by splitting AppContent.tsx into DynamicAppContent.tsx and Eip6963AppContent.tsx components, providing better separation of concerns between dynamic wallet and EIP-6963 wallet implementations.
Applied to files:
examples/hello/frontend/src/components/NetworkSelector.tsxexamples/hello/frontend/src/hooks/useHandleCall.tsexamples/hello/frontend/src/ConnectedContent.tsxexamples/hello/frontend/src/constants/chains.tsexamples/hello/frontend/src/DynamicAppContent.tsx
📚 Learning: 2025-09-18T17:59:04.889Z
Learnt from: hernan-clich
Repo: zeta-chain/example-contracts PR: 280
File: examples/hello/frontend/src/utils/ethersHelpers.ts:1-6
Timestamp: 2025-09-18T17:59:04.889Z
Learning: Commit 1c6cffd3d29499bf0544987a9116c7c6571ff895 in zeta-chain/example-contracts resolves the noble/hashes esbuild build failure by adding resolutions for "noble/hashes": "1.8.0" and "noble/curves": "1.9.7" to examples/hello/frontend/package.json.
Applied to files:
examples/hello/frontend/src/constants/chains.tsexamples/hello/frontend/src/DynamicAppContent.tsx
📚 Learning: 2025-09-18T18:00:10.177Z
Learnt from: hernan-clich
Repo: zeta-chain/example-contracts PR: 280
File: examples/hello/frontend/src/ConnectedContent.tsx:3-10
Timestamp: 2025-09-18T18:00:10.177Z
Learning: Commit 1c6cffd3d29499bf0544987a9116c7c6571ff895 in zeta-chain/example-contracts#280 successfully resolved the noble/hashes "anumber" export error by adding resolutions in examples/hello/frontend/package.json to pin noble/hashes to 1.8.0 and noble/curves to 1.9.7, eliminating the version conflicts that were causing esbuild build failures.
Applied to files:
examples/hello/frontend/src/constants/chains.tsexamples/hello/frontend/src/DynamicAppContent.tsx
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (13)
- GitHub Check: test (examples/token)
- GitHub Check: test (examples/hello)
- GitHub Check: test (examples/swap)
- GitHub Check: test (examples/call)
- GitHub Check: test (examples/nft)
- GitHub Check: test (examples/hello)
- GitHub Check: test (examples/swap)
- GitHub Check: test (examples/token)
- GitHub Check: test (examples/call)
- GitHub Check: test (examples/nft)
- GitHub Check: slither (examples/hello, hello.sarif)
- GitHub Check: slither (examples/swap, swap.sarif)
- GitHub Check: slither (examples/call, call.sarif)
🔇 Additional comments (6)
examples/hello/frontend/src/constants/chains.ts (2)
5-5: LGTM: chainType union correctly extended.The addition of 'SUI' to the union type is consistent with the existing pattern and necessary for type safety across the codebase.
72-78: LGTM: Sui Testnet entry properly configured.The new chain entry follows the established pattern and includes all necessary properties. The chainId 103 is used consistently across related files.
examples/hello/frontend/src/hooks/useHandleCall.ts (2)
8-8: LGTM: SUI wallet imports added.The imports for SUI functionality follow the established pattern for other chain types (SOL, BTC).
Also applies to: 11-11
319-323: LGTM: SUI integration follows established pattern.The integration properly validates that
primaryWalletis provided and follows the same pattern as the SOL chain handling.examples/hello/frontend/src/ConnectedContent.tsx (1)
39-39: LGTM: SUI wallet integration follows established pattern.The SUI wallet retrieval and mapping are consistent with the existing SOL and EVM implementations, maintaining uniformity across chain types.
Also applies to: 44-44
examples/hello/frontend/src/components/NetworkSelector.tsx (1)
31-35: LGTM: SUI chain filtering properly integrated.The inclusion of SUI in the dynamic wallet chain filter is consistent with the broader SUI support implementation and follows the existing pattern.
Todos
toolkitstable releasewalletstable releasepackage.jsonof the frontend project with the newly released versions oftoolkitandwalletSummary
Added Sui Testnet integration to the Hello example frontend, enabling users to send cross-chain messages from Sui to ZetaChain using Dynamic Labs wallet connectivity.
Key Changes
Sui Chain Configuration
'SUI'to supported chain types'502'to Sui TestnetTransaction Handling
handleSuiCall()function using wallet-agnostic approach@zetachain/toolkit/chains/suifor transaction building@zetachain/wallet/suifor wallet client extractionCode Cleanup
iconproperty from chain configuration (no longer needed)Implementation Details
Transaction Flow:
getSuiWallet()andgetSuiWalletClient()prepareSuiDepositAndCall()from toolkitSuiClient.executeTransactionBlock()Summary by CodeRabbit
New Features
Style