Add "View on Explorer" button and contract address display after deployment (#1610)#1623
Open
ytfahim29 wants to merge 5 commits into
Open
Add "View on Explorer" button and contract address display after deployment (#1610)#1623ytfahim29 wants to merge 5 commits into
ytfahim29 wants to merge 5 commits into
Conversation
Contributor
📝 WalkthroughWalkthroughContractItem.vue now imports the network store and Vue computed, derives a network-aware explorer URL from ChangesContract Explorer Link
Sequence Diagram(s)sequenceDiagram
participant UI
participant NetworkStore
participant Explorer
UI->>NetworkStore: query current network
UI->>UI: compute isLocalNetwork & explorerUrl (if address)
alt explorerUrl present and not local
UI->>Explorer: open explorer URL in new tab
end
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Tip 💬 Introducing Slack Agent: The best way for teams to turn conversations into code.Slack Agent is built on CodeRabbit's deep understanding of your code, so your team can collaborate across the entire SDLC without losing context.
Built for teams:
One agent for your entire SDLC. Right inside Slack. 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@frontend/src/components/Simulator/ContractItem.vue`:
- Around line 145-152: The link currently always renders when contract?.address
exists; update ContractItem.vue to be network-aware by reading the current
network (e.g., from the existing chain/network store or config — reference the
store getter like currentNetwork or a prop if present) and implement a computed
property (e.g., explorerBase or explorerUrl) and a boolean (e.g.,
isLocalNetwork) that: 1) returns the correct base URL for Asimov vs Bradbury
testnets and constructs the full URL for the anchor when on supported networks,
2) hides the anchor or replaces it with the text "Explorer not available for
local networks" when isLocalNetwork is true (local/studionet), and 3) keeps
existing behavior for other networks; then use these computed values in the
template instead of the unconditional v-if contract?.address check.
- Line 148: The anchor in ContractItem.vue that uses target="_blank" must
include security attributes to prevent window.opener access; update the <a>
element (the anchor with target="_blank") to add rel="noopener noreferrer" so
external links open in a new tab safely and avoid exposing the opener to the new
page.
- Line 147: Update the explorer link in ContractItem.vue: the current :href uses
the wrong domain and path; change it so the URL uses the -asimov subdomain and
the /contract/ path (i.e., build the href from
"https://explorer-asimov.genlayer.com/contract/" + contract.address) so tests
and issue `#1610` expectations are satisfied.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 6307e77d-2de1-4249-ae7c-a15a56ebd704
📒 Files selected for processing (1)
frontend/src/components/Simulator/ContractItem.vue
Contributor
There was a problem hiding this comment.
♻️ Duplicate comments (1)
frontend/src/components/Simulator/ContractItem.vue (1)
53-57:⚠️ Potential issue | 🟠 Major | 🏗️ Heavy liftExplorer URL is hardcoded to Asimov and not network-aware.
The current hardcoded URL only works for Testnet Asimov. Other networks (Testnet Bradbury, etc.) have different explorer subdomains and will produce broken explorer links.
A
getExplorerUrl()utility already exists atfrontend/src/utils/explorerUrl.tsand is used by other components (TransactionItem.vue, ContractInfo.vue) to handle network-aware explorer URLs. Use this utility instead of hardcoding:🔧 Proposed fix
import { getExplorerUrl } from '@/utils/explorerUrl'; const explorerUrl = computed(() => { const address = props.contract?.address; if (!address) return ''; - return `https://explorer-asimov.genlayer.com/contract/${address}`; + return `${getExplorerUrl()}/contract/${address}`; });🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@frontend/src/components/Simulator/ContractItem.vue` around lines 53 - 57, Replace the hardcoded Asimov explorer URL in the computed explorerUrl inside ContractItem.vue with the shared network-aware utility getExplorerUrl: import getExplorerUrl from frontend/src/utils/explorerUrl.ts, and call it with the contract address (e.g. getExplorerUrl(props.contract?.address)) so explorer links respect the current network; update the computed const explorerUrl to return '' when address is missing and otherwise return the value from getExplorerUrl.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Duplicate comments:
In `@frontend/src/components/Simulator/ContractItem.vue`:
- Around line 53-57: Replace the hardcoded Asimov explorer URL in the computed
explorerUrl inside ContractItem.vue with the shared network-aware utility
getExplorerUrl: import getExplorerUrl from frontend/src/utils/explorerUrl.ts,
and call it with the contract address (e.g.
getExplorerUrl(props.contract?.address)) so explorer links respect the current
network; update the computed const explorerUrl to return '' when address is
missing and otherwise return the value from getExplorerUrl.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 2b1dae6a-885b-442f-95d8-e03810be81e4
📒 Files selected for processing (1)
frontend/src/components/Simulator/ContractItem.vue
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #1610
What
Why
Testing done
Decisions made
Checks
Reviewing tips
#Added a direct link to view deployed contracts on the GenLayer Explorer.
Summary by CodeRabbit