Update docs for adding Celestia network params to Leap w/ React #1830
Conversation
WalkthroughThe pull request introduces documentation and a React component for integrating the Celestia network with the Leap wallet. The new Changes
Sequence DiagramsequenceDiagram
participant Dev as Developer
participant React as React Component
participant Leap as Leap Wallet Extension
Dev->>React: Import AddNetworkLeap
Dev->>React: Pass Celestia network params
React->>Leap: Check wallet extension
alt Leap Extension Installed
Leap-->>React: Wallet detected
React->>Leap: Suggest network parameters
Leap-->>React: Network added successfully
else Leap Extension Not Found
React-->>Dev: Display error message
end
Poem
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: 0
🧹 Nitpick comments (2)
tutorials/wallets.md (2)
190-251: Consider enhancing error handling in theaddfunction.The current implementation could benefit from more specific error handling to help developers troubleshoot integration issues.
Consider this enhancement:
async function add() { if (!window.leap) { - alert("Please install leap extension"); + alert("Leap wallet extension not found. Please install it from https://www.leapwallet.io/"); } else { if (window.leap.experimentalSuggestChain) { try { await window.leap.experimentalSuggestChain({ // ... configuration ... }); } catch (error) { - alert("Failed to suggest the chain"); + alert(`Failed to suggest the chain: ${error.message}`); + console.error("Chain suggestion error:", error); } } const chainId = params.chainId; try { await window.leap.enable(chainId); } catch (error) { + alert(`Failed to enable chain: ${error.message}`); + console.error("Chain enable error:", error); } } }
172-175: Consider varying the introductory phrases.To improve readability and avoid repetition, consider rephrasing these introductions.
-Before we demonstrate how to export the specific parameters for -Celestia's testnets, we need to create a ReactJS component -that allows us to connect directly to Leap and pass it the network -parameters. +Let's create a ReactJS component that enables direct connection +to Leap and handles the network parameter configuration. -We still need to pass the Celestia network parameters to -the `AddNetworkLeap` function: +Next, let's configure the Celestia network parameters for +the `AddNetworkLeap` function:Also applies to: 267-268
🧰 Tools
🪛 LanguageTool
[style] ~173-~173: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... parameters for Celestia's testnets, we need to create a ReactJS component that allows ...(REP_NEED_TO_VB)
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
tutorials/wallets.md(1 hunks)
🧰 Additional context used
🪛 LanguageTool
tutorials/wallets.md
[style] ~173-~173: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... parameters for Celestia's testnets, we need to create a ReactJS component that allows ...
(REP_NEED_TO_VB)
[style] ~267-~267: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ...markdownlint-enable MD013 --> We still need to pass the Celestia network parameters to...
(REP_NEED_TO_VB)
🔇 Additional comments (2)
tutorials/wallets.md (2)
170-315: LGTM! The Leap wallet integration section is well-structured.
The new section maintains consistency with the existing Keplr implementation while providing clear instructions for Leap wallet integration.
🧰 Tools
🪛 LanguageTool
[style] ~173-~173: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ... parameters for Celestia's testnets, we need to create a ReactJS component that allows ...
(REP_NEED_TO_VB)
[style] ~267-~267: You have already used this phrasing in nearby sentences. Consider replacing it to add variety to your writing.
Context: ...markdownlint-enable MD013 --> We still need to pass the Celestia network parameters to...
(REP_NEED_TO_VB)
275-280: Verify the network parameters constants.
The implementation correctly uses template variables for network parameters. Let's verify that all required constants are defined.
Also applies to: 288-293, 301-306
✅ Verification successful
All required network parameters constants are properly defined
Based on the search results, I can verify that all the required constants for network parameters are properly defined in .vitepress/constants/constants.js. The file includes:
mainnetChainId: "celestia"mainnetRpcUrl: "https://rpc.lunaroasis.net/"mainnetRestUrl: "https://api.lunaroasis.net/"
These constants match exactly what's being referenced in the template variables in the code snippet under review.
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash
# Check if all required constants are defined in the constants file
rg -A 1 "export const .*(?:Chain|Url)" .vitepress/constants/constants.js
Length of output: 74
Script:
#!/bin/bash
# Let's try a broader search for constants file and its content
fd constants.js
# After finding the file, let's check its content
fd constants.js --exec cat {}
Length of output: 51
Script:
#!/bin/bash
# Let's try searching for any file that might contain these constants
rg -l "mainnetChainId|mainnetRpcUrl|mainnetRestUrl"
# Also search for any config or constant related files
fd -e js -e ts "config|constant"
Length of output: 209
Script:
#!/bin/bash
# Let's check the content of these files to understand how these constants are used
cat tutorials/wallets.md | grep -A 5 -B 5 "mainnet.*Url\|mainnet.*Chain"
cat how-to-guides/consensus-node.md | grep -A 5 -B 5 "mainnet.*Url\|mainnet.*Chain"
cat how-to-guides/celestia-node-troubleshooting.md | grep -A 5 -B 5 "mainnet.*Url\|mainnet.*Chain"
# Also check if there's a .vitepress directory with config
fd -H ".vitepress"
Length of output: 3550
Script:
#!/bin/bash
# Let's check the .vitepress directory for config files that might define these constants
fd . .vitepress -t f -x cat {}
Length of output: 43011
Overview
This PR ads a section in
tutorials/wallet-> Integrating Wallets for developers Page to provide a guide on how to add celestia network parameters to Leap using React.Summary by CodeRabbit
AddNetworkLeap, for checking Leap wallet extension and suggesting network parameters.