Feature: Update UB Docs for latest SDK and Guides #7265
Conversation
…es section - Replaced existing feature cards with new titles and descriptions, including "Cross-Chain Asset Routing" and "Fiat-to-Crypto Onramps." - Introduced new features such as "Webhook Integration" and "Real-time Status Tracking." - Added a detailed SDK modules section outlining key functionalities for developers. - Improved overall clarity and organization of the payment documentation.
…lation guide - Replaced outdated links in the sidebar with new entries for "Installation" and "Recipes." - Updated the installation guide to provide clearer instructions for integrating the Universal Bridge SDK, including detailed steps for setting up the client and preparing transactions. - Added new sections for transaction status tracking and error handling to improve user guidance.
…ted guides - Removed the "Accept Direct Payments" and "Build a Custom Onramp Experience" guides from the sidebar. - Added a new link for "Smart Accounts" to enhance user navigation. - Updated the cross-chain swapping guide to improve clarity and consistency in transaction parameters.
…on guide - Removed the "Developer Mode" section from the sidebar for clarity. - Renamed "Smart Accounts" to "Swap Smart Accounts" for better specificity. - Added a new guide for "Fiat Onramp Integration," detailing how to integrate fiat-to-crypto onramps using Stripe, Coinbase, and Transak. - Improved organization and navigation within the payment documentation.
…ounts" to "Swap with Smart Accounts" and add new "NFT Checkout" guide for improved user navigation.
|
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
How to use the Graphite Merge QueueAdd either label to this PR to merge it via the merge queue:
You must have a Graphite account in order to use the merge queue. Sign up using this link. An organization admin has enabled the Graphite Merge Queue in this repository. Please do not merge from GitHub as this will restart CI on PRs being processed by the merge queue. |
WalkthroughThe documentation for the Universal Bridge SDK and related payment flows was extensively restructured. Several guides were removed and replaced with new, modular tutorials focused on SDK-based integration, updated code examples, and new features like smart accounts and NFT checkout. Sidebar navigation and feature descriptions were revised to reflect these changes. Changes
Sequence Diagram(s)sequenceDiagram
participant User
participant App
participant BridgeSDK
participant OnrampProvider
participant Blockchain
User->>App: Initiate payment or swap
App->>BridgeSDK: Prepare quote/session (e.g., buy, transfer, onramp)
BridgeSDK-->>App: Return prepared steps/transactions
loop For each step in steps
App->>BridgeSDK: Send and confirm transaction(s)
BridgeSDK->>Blockchain: Submit transaction
Blockchain-->>BridgeSDK: Transaction receipt
BridgeSDK-->>App: Transaction status
end
App->>BridgeSDK: Poll for transaction status
BridgeSDK-->>App: Status (COMPLETED/FAILED/etc.)
App-->>User: Update UI (success, error, etc.)
Possibly related PRs
Suggested reviewers
Warning Review ran into problems🔥 ProblemsErrors were encountered while retrieving linked issues. Errors (1)
📜 Recent review detailsConfiguration used: CodeRabbit UI 📒 Files selected for processing (1)
🚧 Files skipped from review as they are similar to previous changes (1)
⏰ Context from checks skipped due to timeout of 90000ms (8)
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. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. 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 (
|
github-actions
bot
added
the
Portal
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🔭 Outside diff range comments (1)
apps/portal/src/app/pay/guides/cross-chain-swapping/page.mdx (1)
29-37: 🛠️ Refactor suggestionFix nested
<Step>tagsThe
<Step>for installing the SDK opens and immediately nests the next<Step>. You should close the first step before opening the second:<Steps> -<Step title='Install the Connect SDK'> +<Step title='Install the Connect SDK'> <InstallTabs ... /> -<Step title='Get Your Client ID'> + </Step> + <Step title='Get Your Client ID'>
🧹 Nitpick comments (6)
apps/portal/src/app/pay/guides/smart-accounts/page.mdx (2)
1-8: Remove unused import: DocImageThe
DocImagecomponent is imported but not used anywhere in this guide. Consider removing it to clean up imports.Apply:
import { createMetadata, Callout, - DocImage, InstallTabs, Steps, Step, } from "@doc";
68-86: Consolidate imports for clarityYou can combine
sendBatchTransactioninto the main thirdweb import to reduce line count and improve readability.-import { Bridge, NATIVE_TOKEN_ADDRESS, toWei } from "thirdweb"; -import { sendBatchTransaction } from "thirdweb"; +import { + Bridge, + NATIVE_TOKEN_ADDRESS, + toWei, + sendBatchTransaction, +} from "thirdweb";apps/portal/src/app/pay/guides/cross-chain-swapping/page.mdx (2)
1-8: Remove unused import: DocImageThe
DocImagecomponent is not used in this file. Consider removing it to tidy imports.-import { - createMetadata, - Callout, - DocImage, - InstallTabs, - Steps, - Step, -} from "@doc"; +import { + createMetadata, + Callout, + InstallTabs, + Steps, + Step, +} from "@doc";
9-10: Remove unused asset import
OnrampStepOneis imported but never used. You may remove this import or add the intended image to the guide.apps/portal/src/app/pay/guides/nft-checkout/page.mdx (2)
1-12: Remove unused imports: DocImage and Tabs components
DocImage,Tabs,TabsList,TabsTrigger, andTabsContentare imported but never used. Consider removing them to declutter the import.-import { - createMetadata, - Callout, - DocImage, - InstallTabs, - Steps, - Step, - Tabs, - TabsList, - TabsTrigger, - TabsContent, -} from "@doc"; +import { + createMetadata, + Callout, + InstallTabs, + Steps, + Step, +} from "@doc";
78-115: WalletAuth callback may cause double rendersCalling
onConnectdirectly inside the render whenaccountis truthy can trigger repeated renders. Consider movingonConnectinto auseEffectto avoid side effects during render.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (10)
apps/portal/src/app/pay/get-started/page.mdx(2 hunks)apps/portal/src/app/pay/guides/accept-direct-payments/page.mdx(0 hunks)apps/portal/src/app/pay/guides/build-a-custom-experience/page.mdx(0 hunks)apps/portal/src/app/pay/guides/cross-chain-swapping/page.mdx(2 hunks)apps/portal/src/app/pay/guides/nft-checkout/page.mdx(1 hunks)apps/portal/src/app/pay/guides/onramp-integration/page.mdx(1 hunks)apps/portal/src/app/pay/guides/smart-accounts/page.mdx(1 hunks)apps/portal/src/app/pay/page.mdx(4 hunks)apps/portal/src/app/pay/sidebar.tsx(2 hunks)apps/portal/src/app/pay/testing-pay/page.mdx(0 hunks)
💤 Files with no reviewable changes (3)
- apps/portal/src/app/pay/guides/accept-direct-payments/page.mdx
- apps/portal/src/app/pay/testing-pay/page.mdx
- apps/portal/src/app/pay/guides/build-a-custom-experience/page.mdx
🧰 Additional context used
🪛 LanguageTool
apps/portal/src/app/pay/guides/onramp-integration/page.mdx
[uncategorized] ~141-~141: Loose punctuation mark.
Context: ...link); return onrampSession; } catch (error) { console.error("Fail...
(UNLIKELY_OPENING_PUNCTUATION)
apps/portal/src/app/pay/guides/nft-checkout/page.mdx
[uncategorized] ~719-~719: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...tically after successful payment ### Production Ready - Multiple Providers: Stripe, Coi...
(EN_COMPOUND_ADJECTIVE_INTERNAL)
[uncategorized] ~735-~735: If this is a compound adjective that modifies the following noun, use a hyphen.
Context: ...es**: Digital art and collectibles with zero friction - Event Ticketing: NFT-based ticket...
(EN_COMPOUND_ADJECTIVE_INTERNAL)
⏰ Context from checks skipped due to timeout of 90000ms (4)
- GitHub Check: Unit Tests
- GitHub Check: Lint Packages
- GitHub Check: Size
- GitHub Check: Analyze (javascript)
🔇 Additional comments (38)
apps/portal/src/app/pay/sidebar.tsx (2)
47-53: LGTM! Navigation structure aligns with new SDK-focused approach.The updated "Get Started" section links properly reflect the shift from UI component examples to modular SDK installation and recipes, which is consistent with the overall documentation restructuring.
62-77: Well-organized tutorial structure with comprehensive coverage.The updated tutorials section provides good coverage of core Universal Bridge functionality including cross-chain swapping, smart accounts, fiat onramp, and NFT checkout. The organization is logical and user-friendly.
apps/portal/src/app/pay/guides/onramp-integration/page.mdx (4)
1-23: Excellent metadata and documentation structure.The metadata is properly configured with appropriate title, description, and social sharing information. The import statements include all necessary components for a comprehensive guide.
65-83: Comprehensive Stripe onramp example with good practices.The Stripe integration example is well-structured and includes all necessary parameters. The code demonstrates proper error handling and user experience considerations.
91-116: Robust Coinbase onramp implementation with proper error handling.The Coinbase example includes excellent error handling, logging, and user feedback. The try-catch structure and detailed console logging make debugging easier for developers.
154-191: Comprehensive status monitoring with clear state handling.The status monitoring section provides excellent coverage of all possible transaction states with appropriate actions for each. The polling mechanism and error handling are well-implemented.
apps/portal/src/app/pay/page.mdx (3)
28-62: Excellent feature descriptions with clear value propositions.The updated feature cards provide comprehensive coverage of Universal Bridge capabilities with clear, benefit-focused descriptions. The icons appropriately represent each feature area.
65-77: Well-structured SDK modules overview.The new SDK modules table provides excellent clarity on the different modules and their purposes. This helps developers understand the modular architecture and choose the right functions for their use case.
104-159: Practical quick start examples demonstrate real-world usage.The code examples are comprehensive and show realistic usage patterns. They include proper imports, error handling considerations, and demonstrate the SDK's key functionality effectively.
apps/portal/src/app/pay/get-started/page.mdx (5)
33-76: Excellent installation flow with practical initial setup.The installation steps are well-structured and include all necessary components: SDK installation, client ID setup, client initialization, and a practical first example. The progression is logical and developer-friendly.
82-135: Comprehensive Buy module recipe with clear progression.The Buy/Bridge & Swap recipe provides excellent coverage from quote to execution. The step-by-step approach with clear comments makes it easy for developers to understand the complete flow.
169-195: Practical onramp integration with provider flexibility.The onramp recipe demonstrates multi-provider support effectively and includes practical cost display and redirect handling. The example is realistic and production-ready.
232-261: Robust status tracking with comprehensive state handling.The status tracking section covers all possible transaction states with appropriate handling for each. The switch statement approach is clean and extensible.
265-288: Excellent error handling with detailed debugging information.The error handling section demonstrates proper
ApiErrorhandling with useful debugging information including correlation IDs. This will significantly help developers troubleshoot issues.apps/portal/src/app/pay/guides/smart-accounts/page.mdx (9)
10-18: Metadata configuration looks goodThe SEO metadata values are well-defined, concise, and descriptive.
20-28: Guide title and intro verifiedThe heading and introductory description clearly explain the purpose and benefits of using smart accounts.
28-35: Install step is correctThe
InstallTabscomponent usage and step structure are correctly implemented.
36-61: Verify example setup code completenessThe snippet correctly shows how to configure and connect an EIP7702 in-app wallet. Ensure surrounding context indicates this code should be inside an
asyncfunction or React effect to useawait.
63-65: Callout usage is appropriateThe informational callout correctly highlights key EIP7702 benefits.
88-90: Batching rule callout is clearThe important callout correctly emphasizes chain-based batching constraints.
93-140: Confirm parameter names forwaitForReceiptThe code uses
chain: step.transactions[0].chain, but laterchainIdwhen polling status. Verify thatwaitForReceiptaccepts achainobject (not justchainId) and that the transaction object'schainproperty exists. Otherwise, this may cause runtime errors.
142-144: Smart account atomic callout is accurateThis callout succinctly explains the atomic execution and sponsorship model.
149-155: Next Steps links are correctThe related documentation links appear valid and are consistent with repository structure.
apps/portal/src/app/pay/guides/cross-chain-swapping/page.mdx (9)
11-19: Metadata configuration is validThe page metadata (title, description, image) accurately reflects the cross-chain swapping guide.
21-25: Heading and intro content approvedThe heading and introductory paragraphs are clear and informative.
47-69: Get available routes example is correctThe snippet correctly demonstrates filtering and paginating routes.
73-83: Callout clarifies Buy vs Sell usageThe informational callout effectively distinguishes
BuyandSellnamespaces.
88-96: Quote snippet updated properlyThe transition from
buyAmountWeitoamountwith a bigint literal is correctly illustrated.
105-117: Prepare snippet is consistentThe change from flat
transactionstostepsis correctly reflected in the example.
187-188: Final callout is helpfulThe info callout highlights transaction configuration details appropriately.
195-203: Status retrieval example approvedThis code correctly shows how to fetch the status of a bridge transaction.
207-221: Expanded status handling is accurateIncluding
NOT_FOUNDand explicit logs enhances clarity for readers.apps/portal/src/app/pay/guides/nft-checkout/page.mdx (6)
14-22: Metadata section is correctThe title, icon, and description are well-crafted for the NFT Checkout guide.
24-30: Header and intro are clearThe heading and introductory text succinctly explain the flow and use cases.
32-39: Install step is implemented correctly
InstallTabsusage follows the established pattern.
40-71: Project setup snippet is completeThe snippet shows client creation and contract instantiation correctly.
73-75: Info callout is appropriateThis note effectively guides readers on deploying to mainnet for production.
704-707: Final callout helps summarize featuresThe closing info callout effectively reinforces the end-to-end experience.
size-limit report 📦
|
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## main #7265 +/- ##
=======================================
Coverage 55.57% 55.57%
=======================================
Files 909 909
Lines 58680 58681 +1
Branches 4157 4167 +10
=======================================
+ Hits 32610 32612 +2
+ Misses 25963 25961 -2
- Partials 107 108 +1
🚀 New features to boost your workflow:
|
…e and enhance NFT checkout guide with new imports for improved functionality.
There was a problem hiding this comment.
Actionable comments posted: 4
🔭 Outside diff range comments (2)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/universal-bridge/layout.tsx (2)
88-88:⚠️ Potential issueUpdate footer link for consistency.
The footer still references the old URL structure (
https://portal.thirdweb.com/connect/pay/overview) while the main "Learn more" link has been updated to the new structure. This inconsistency could confuse users.Apply this diff to maintain consistency:
- href: "https://portal.thirdweb.com/connect/pay/overview", + href: "https://portal.thirdweb.com/pay",Or verify if the footer should point to a different specific page within the new documentation structure.
88-103: 💡 Verification agent🧩 Analysis chain
Verify all documentation links in the footer.
Since the documentation has been restructured, please verify that all the footer links are still valid and point to the correct updated documentation pages.
🏁 Script executed:
#!/bin/bash # Description: Verify all documentation URLs in the footer are accessible # Expected result: All URLs should return HTTP 200 status codes urls=( "https://portal.thirdweb.com/connect/pay/overview" "https://portal.thirdweb.com/typescript/v5/convertCryptoToFiat" "https://portal.thirdweb.com/react/v5/pay/fund-wallets" "https://portal.thirdweb.com/dotnet/universal-bridge/quickstart" ) for url in "${urls[@]}"; do echo "Checking: $url" status=$(curl -o /dev/null -s -w "%{http_code}" "$url") echo "Status: $status" echo "---" doneLength of output: 1560
🏁 Script executed:
#!/bin/bash # Description: Determine the final URL targets for routes returning 308 urls=( "https://portal.thirdweb.com/connect/pay/overview" "https://portal.thirdweb.com/typescript/v5/convertCryptoToFiat" ) for url in "${urls[@]}"; do echo "Original: $url" # Follow redirects and output the final effective URL and status curl -s -o /dev/null -w "HTTP %{http_code} -> final URL: %{url_effective}\n" -L "$url" doneLength of output: 870
Update the Pay Overview documentation link
The “Overview” URL currently returns a 308 and redirects to the new
/paypage. Please update it to avoid the redirect. The other links are returning 200 and can remain unchanged.• File:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/universal-bridge/layout.tsx (lines 88–103){ - href: "https://portal.thirdweb.com/connect/pay/overview", + href: "https://portal.thirdweb.com/pay", label: "Overview", },
🧹 Nitpick comments (2)
apps/portal/src/app/pay/guides/nft-checkout/page.mdx (2)
1-12: Cleanup unused MDX imports
The top import block brings inDocImage,Tabs,TabsList,TabsTrigger, andTabsContent, which aren’t used in this page. Removing these will reduce noise and maintenance overhead.
83-150: Clarifyclientcontext in wallet auth snippet
This snippet references theclientinstance without showing its import or initialization. Consider adding a comment like:// Assume `client` is initialized as shown in the previous stepor include an explicit import to avoid confusion when copying this code.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/universal-bridge/layout.tsx(1 hunks)apps/portal/src/app/pay/guides/nft-checkout/page.mdx(1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (8)
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: Size
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: Lint Packages
- GitHub Check: Build Packages
- GitHub Check: Unit Tests
- GitHub Check: Analyze (javascript)
🔇 Additional comments (3)
apps/portal/src/app/pay/guides/nft-checkout/page.mdx (3)
44-71: Setup snippet looks correct
The project and contract setup example properly imports and configures the thirdweb client and NFT contract, and defines pricing and metadata. Good to go.
369-452: PaymentOptions component is well-defined
ThePaymentOptionssnippet correctly lists providers and handles selection. JSX and styling are clear.
454-557: ProcessingStep snippet is functional
Auto-progress timers and step visuals are implemented correctly. No issues found.
| @@ -33,7 +33,7 @@ export default async function Layout(props: { | |||
| tokens via cross-chain routing.{" "} | |||
| <UnderlineLink | |||
| target="_blank" | |||
| href="https://portal.thirdweb.com/connect/pay/overview" | |||
| href="https://portal.thirdweb.com/pay" | |||
There was a problem hiding this comment.
💡 Verification agent
🧩 Analysis chain
Verify the new documentation URL and ensure consistency.
The URL has been simplified from the previous structure, which aligns with the documentation restructuring. However, there's an inconsistency within this same file.
Please verify that the new URL is accessible and contains the expected content:
🏁 Script executed:
#!/bin/bash
# Description: Verify the new documentation URL is accessible
# Expected result: Should return HTTP 200 status code
curl -I "https://portal.thirdweb.com/pay"Length of output: 1692
🏁 Script executed:
#!/bin/bash
# Search for any remaining references to the old documentation URL structure
rg -n "portal\.thirdweb\.com/connect/pay" .Length of output: 2509
Ensure consistent documentation URLs across the codebase
Verified that https://portal.thirdweb.com/pay returns HTTP 200. However, there are still multiple links pointing to the old portal.thirdweb.com/connect/pay/... structure. To avoid confusion and maintain consistency, please update the following references (or confirm if any should remain on a specific sub-page):
• apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/universal-bridge/layout.tsx: line 88
• apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/page.tsx: line 424
• apps/dashboard/src/app/(app)/team/[team_slug]/(team)/~/analytics/page.tsx: lines 293, 305
• apps/dashboard/src/app/(app)/(dashboard)/(chain)/components/server/products.ts: line 52
• apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/(chainPage)/components/server/BuyFundsSection.tsx: line 56
• apps/dashboard/src/components/pay/PayConfig.tsx: line 117
You can run rg "portal\\.thirdweb\\.com/connect/pay" to locate all remaining instances. Replace these with the simplified /pay URL (or the correct new paths) so all documentation links resolve consistently.
🤖 Prompt for AI Agents
In
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/connect/universal-bridge/layout.tsx
at lines 36 and 88, update all documentation URLs from the old structure
"portal.thirdweb.com/connect/pay/..." to the new simplified URL
"https://portal.thirdweb.com/pay" to ensure consistency. Verify the new URL is
accessible and replace all instances of the old URL within this file
accordingly.
| import { ThirdwebProvider } from "thirdweb/react"; | ||
| // Import all the components we defined earlier | ||
| import { NFTCheckout, WalletAuth, PaymentOptions, ProcessingStep, SuccessStep, ErrorStep } from "./nft-checkout-components"; | ||
|
|
||
| function App() { | ||
| return ( | ||
| <ThirdwebProvider> | ||
| <div className="min-h-screen bg-gradient-to-br from-purple-50 to-blue-50 py-8"> | ||
| <div className="container mx-auto px-4"> | ||
| <header className="text-center mb-8"> | ||
| <h1 className="text-4xl font-bold text-gray-800 mb-2"> | ||
| NFT Marketplace | ||
| </h1> | ||
| <p className="text-gray-600"> | ||
| Buy NFTs seamlessly with fiat currency | ||
| </p> | ||
| </header> | ||
|
|
||
| <NFTCheckout /> | ||
|
|
||
| <footer className="text-center mt-8 text-sm text-gray-500"> | ||
| <p>Powered by thirdweb Universal Bridge</p> | ||
| </footer> | ||
| </div> | ||
| </div> | ||
| </ThirdwebProvider> | ||
| ); | ||
| } | ||
|
|
||
| export default App; | ||
| ``` |
There was a problem hiding this comment.
Missing component file creation instructions
The final integration imports NFTCheckout and related components from "./nft-checkout-components", but there’s no guidance on creating that file. We need a preceding step instructing users to extract and export the previously defined snippets into nft-checkout-components.tsx (or similar), ensuring the import path is valid.
🤖 Prompt for AI Agents
In apps/portal/src/app/pay/guides/nft-checkout/page.mdx around lines 674 to 704,
the code imports NFTCheckout and related components from
"./nft-checkout-components" without instructions to create that file. Add a step
before this integration that instructs users to create a new file named
nft-checkout-components.tsx (or similar) where they should extract and export
all previously defined component snippets. Ensure this file is saved in the
correct directory so the import path "./nft-checkout-components" resolves
correctly.
| import { Bridge, NATIVE_TOKEN_ADDRESS, toWei, sendTransaction } from "thirdweb"; | ||
| import { prepareContractCall } from "thirdweb"; | ||
| import { mintTo } from "thirdweb/extensions/erc721"; | ||
| import { useState, useEffect } from "react"; | ||
|
|
There was a problem hiding this comment.
Missing and unused imports in checkout flow snippet
prepareContractCallis imported but never used.- The snippet references
useActiveAccount,client,sepolia,nftContract, andNFT_METADATAwithout importing them.
Readers will encounter unresolved identifiers. Either remove the unused prepareContractCall import and add lines such as:
-import { prepareContractCall } from "thirdweb";
+// Remove unused import
+// import { prepareContractCall } from "thirdweb";
+// Add required imports for this snippet
+import { useActiveAccount } from "thirdweb/react";
+import { client, sepolia, nftContract, NFT_METADATA } from "./setup";or consolidate all these into a single file in a clear setup step.
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| import { Bridge, NATIVE_TOKEN_ADDRESS, toWei, sendTransaction } from "thirdweb"; | |
| import { prepareContractCall } from "thirdweb"; | |
| import { mintTo } from "thirdweb/extensions/erc721"; | |
| import { useState, useEffect } from "react"; | |
| import { Bridge, NATIVE_TOKEN_ADDRESS, toWei, sendTransaction } from "thirdweb"; | |
| // Remove unused import | |
| // import { prepareContractCall } from "thirdweb"; | |
| // Add required imports for this snippet | |
| import { useActiveAccount } from "thirdweb/react"; | |
| import { client, sepolia, nftContract, NFT_METADATA } from "./setup"; | |
| import { mintTo } from "thirdweb/extensions/erc721"; | |
| import { useState, useEffect } from "react"; |
🤖 Prompt for AI Agents
In apps/portal/src/app/pay/guides/nft-checkout/page.mdx around lines 159 to 163,
remove the unused import prepareContractCall to clean up the imports.
Additionally, add imports for useActiveAccount, client, sepolia, nftContract,
and NFT_METADATA to ensure all referenced identifiers in the checkout flow
snippet are defined and avoid unresolved identifier errors. Alternatively,
consolidate these imports into a single setup file and import that file here for
clarity and maintainability.
…to ensure proper rendering in documentation.
PR-Codex overview
This PR focuses on updating the
Universal Bridgedocumentation and related components to enhance the user experience for cross-chain payments, onramps, and NFT checkouts. It includes the removal of outdated guides, the addition of new features, and improvements to existing functionalities.Detailed summary
testing-pay,accept-direct-payments,build-a-custom-experience.layout.tsxandsidebar.tsxto reflect new paths.onramp-integration,smart-accounts, andcross-chain-swapping.page.mdxwith new features and clearer instructions for users.get-startedguide, including new steps for initializing clients and preparing swaps.Summary by CodeRabbit
New Features
Documentation