-
Notifications
You must be signed in to change notification settings - Fork 636
[SDK] Update token balances query to use client instead of clientId #8507
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
[SDK] Update token balances query to use client instead of clientId #8507
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
WalkthroughClient context for token-balance requests was switched from a Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes
Pre-merge checks and finishing touches❌ Failed checks (2 warnings)
✅ Passed checks (1 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
Warning Review ran into problems🔥 ProblemsErrors were encountered while retrieving linked issues. Errors (1)
Comment |
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. This stack of pull requests is managed by Graphite. Learn more about stacking. |
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #8507 +/- ##
==========================================
+ Coverage 54.63% 54.66% +0.03%
==========================================
Files 920 920
Lines 61107 61105 -2
Branches 4141 4142 +1
==========================================
+ Hits 33383 33404 +21
+ Misses 27625 27599 -26
- Partials 99 102 +3
🚀 New features to boost your workflow:
|
size-limit report 📦
|
de8724f to
b31c389
Compare
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
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx (1)
421-435:SwapProjectWalletModalContentexpects aclient, but the call site never passes it (SwapWidget receivesundefined)
SwapProjectWalletModalContentPropsnow require aclient: ThirdwebClient, and the component usesprops.clientwhen rendering<SwapWidget>. However, the caller at Line 421 does not passclient, so at runtimeprops.clientisundefinedandSwapWidgetis invoked without a valid client. This is both a type-level mismatch and a runtime bug.You can fix this by wiring
props.clientthrough and using the destructuredclientwhen rendering the widget:@@ <Dialog onOpenChange={setIsSwapOpen} open={isSwapOpen}> <DialogContent className="gap-0 p-0 overflow-hidden max-w-md"> <SwapProjectWalletModalContent + client={props.client} chainId={selectedChainId} tokenAddress={selectedTokenAddress} walletAddress={projectWallet.address} chain={chain} isManagedVault={isManagedVault} @@ function SwapProjectWalletModalContent( props: SwapProjectWalletModalContentProps, ) { const { - client, + client, @@ - <div className="px-4 pb-4 lg:px-6 lg:pb-6 flex justify-center"> - {activeWallet && ( + <div className="px-4 pb-4 lg:px-6 lg:pb-6 flex justify-center"> + {activeWallet && client && ( <SwapWidget - client={props.client} + client={client} prefill={{ sellToken: { chainId: chainId, tokenAddress: tokenAddress, },This ensures
SwapWidgetalways receives a validThirdwebClientand also avoids the unusedclientdestructured variable.Also applies to: 615-628, 783-795
🧹 Nitpick comments (1)
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts (1)
75-118: Client-based fetch integration inuseTokenBalanceslooks correctWiring the balances request through
getClientFetch(options.client)is consistent with the rest of the SDK’s client-aware HTTP flow and keeps auth/headers centralized; the rest of the query logic (guards, URL construction, error handling) remains sound.One low-priority thought: since
optionsnow includes aThirdwebClient, you may eventually want to narrow thequeryKeypayload to just the primitives that actually affect the response (e.g. chainId, walletAddress, page, limit, and some stable client identifier) to avoid hashing the full client object. This is non-blocking and can be deferred.
📜 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 selected for processing (3)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx(4 hunks)packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsx(1 hunks)packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts(3 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsx
🧰 Additional context used
📓 Path-based instructions (11)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.{ts,tsx}: Write idiomatic TypeScript with explicit function declarations and return types
Limit each TypeScript file to one stateless, single-responsibility function for clarity
Re-use shared types from@/typesor localtypes.tsbarrels
Prefer type aliases over interface except for nominal shapes in TypeScript
Avoidanyandunknownin TypeScript unless unavoidable; narrow generics when possible
Choose composition over inheritance; leverage utility types (Partial,Pick, etc.) in TypeScript
**/*.{ts,tsx}: Write idiomatic TypeScript with explicit function declarations and return types
Limit each file to one stateless, single-responsibility function for clarity and testability
Re-use shared types from @/types or local types.ts barrel exports
Prefer type aliases over interface except for nominal shapes
Avoid any and unknown unless unavoidable; narrow generics whenever possible
Choose composition over inheritance; leverage utility types (Partial, Pick, etc.)
Comment only ambiguous logic in TypeScript files; avoid restating TypeScript types and signatures in prose
Files:
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
packages/thirdweb/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
packages/thirdweb/src/**/*.{ts,tsx}: Comment only ambiguous logic in SDK code; avoid restating TypeScript in prose
Load heavy dependencies inside async paths to keep initial bundle lean (e.g.const { jsPDF } = await import("jspdf");)Lazy-load heavy dependencies inside async paths to keep the initial bundle lean (e.g., const { jsPDF } = await import('jspdf');)
Files:
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts
**/*.{js,jsx,ts,tsx,json}
📄 CodeRabbit inference engine (AGENTS.md)
Biome governs formatting and linting; its rules live in biome.json. Run
pnpm fix&pnpm lintbefore committing, ensure there are no linting errors
Files:
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (AGENTS.md)
Lazy-import optional features; avoid top-level side-effects
Files:
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
apps/{dashboard,playground-web}/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
apps/{dashboard,playground-web}/src/**/*.{ts,tsx}: Import UI component primitives from@/components/ui/*(Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground
Use Tailwind CSS only – no inline styles or CSS modules in dashboard and playground
Usecn()from@/lib/utilsfor conditional Tailwind class merging
Use design system tokens for styling (backgrounds:bg-card, borders:border-border, muted text:text-muted-foreground)
ExposeclassNameprop on root element for component overrides
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
apps/dashboard/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
apps/dashboard/src/**/*.{ts,tsx}: UseNavLinkfor internal navigation with automatic active states in dashboard
Start server component files withimport "server-only";in Next.js
Read cookies/headers withnext/headersin server components
Access server-only environment variables in server components
Perform heavy data fetching in server components
Implement redirect logic withredirect()fromnext/navigationin server components
Begin client component files with'use client';directive in Next.js
Handle interactive UI with React hooks (useState,useEffect, React Query, wallet hooks) in client components
Access browser APIs (localStorage,window,IntersectionObserver) in client components
Support fast transitions with prefetched data in client components
Always callgetAuthToken()to retrieve JWT from cookies on server side
UseAuthorization: Bearerheader for API calls – never embed tokens in URLs
Return typed results (Project[],User[]) from server-side data fetches – avoidany
Wrap client-side API calls in React Query (@tanstack/react-query)
Use descriptive, stablequeryKeysin React Query for cache hits
ConfigurestaleTime/cacheTimein React Query based on freshness (default ≥ 60s)
Keep tokens secret via internal API routes or server actions
Never importposthog-jsin server components – only use analytics client-side
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
apps/dashboard/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/dashboard.mdc)
apps/dashboard/**/*.{ts,tsx}: Always import from the central UI library under@/components/ui/*for reusable core UI components likeButton,Input,Select,Tabs,Card,Sidebar,Separator,Badge
UseNavLinkfrom@/components/ui/NavLinkfor internal navigation to ensure active states are handled automatically
For notices and skeletons, rely onAnnouncementBanner,GenericLoadingPage, andEmptyStateCardcomponents
Import icons fromlucide-reactor the project-specific…/iconsexports; never embed raw SVG
Keep components pure; fetch data outside using server components or hooks and pass it down via props
Use Tailwind CSS as the styling system; avoid inline styles or CSS modules
Merge class names withcnfrom@/lib/utilsto keep conditional logic readable
Stick to design tokens: usebg-card,border-border,text-muted-foregroundand other Tailwind variables instead of hard-coded colors
Use spacing utilities (px-*,py-*,gap-*) instead of custom margins
Follow mobile-first responsive design with Tailwind helpers (max-sm,md,lg,xl)
Never hard-code colors; always use Tailwind variables
Combine class names viacn, and exposeclassNameprop if useful in components
Use React Query (@tanstack/react-query) for all client-side data fetching with typed hooks
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
apps/dashboard/**/components/**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/dashboard.mdc)
Add
classNameprop to the root element of every component to allow external overrides
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
apps/{dashboard,playground}/**/*.{tsx,ts}
📄 CodeRabbit inference engine (AGENTS.md)
apps/{dashboard,playground}/**/*.{tsx,ts}: Import UI primitives from @/components/ui/_ (Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in Dashboard and Playground apps
Use NavLink for internal navigation so active states are handled automatically
Use Tailwind CSS for styling – no inline styles or CSS modules
Merge class names with cn() from @/lib/utils to keep conditional logic readable
Stick to design tokens for styling: backgrounds (bg-card), borders (border-border), muted text (text-muted-foreground), etc.
Server Components: Read cookies/headers with next/headers, access server-only environment variables or secrets, perform heavy data fetching, implement redirect logic with redirect() from next/navigation, and start files with import 'server-only'; to prevent client bundling
Client Components: Begin files with 'use client'; before imports, handle interactive UI relying on React hooks (useState, useEffect, React Query, wallet hooks), access browser APIs (localStorage, window, IntersectionObserver, etc.), and support fast transitions with client-side data prefetching
For client-side data fetching: Wrap calls in React Query (@tanstack/react-query), use descriptive and stable queryKeys for cache hits, configure staleTime / cacheTime based on freshness requirements (default ≥ 60 s), and keep tokens secret by calling internal API routes or server actions
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
apps/{dashboard,playground}/**/components/**/*.{tsx,ts}
📄 CodeRabbit inference engine (AGENTS.md)
apps/{dashboard,playground}/**/components/**/*.{tsx,ts}: Group feature-specific components under feature/components/_ and expose a barrel index.ts when necessary
Expose a className prop on the root element of every component for styling overrides
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
apps/{dashboard,playground}/**/*.{ts,tsx}
📄 CodeRabbit inference engine (AGENTS.md)
apps/{dashboard,playground}/**/*.{ts,tsx}: For server-side data fetching: Always call getAuthToken() to retrieve the JWT from cookies and inject the token as an Authorization: Bearer header – never embed it in the URL. Return typed results (Project[], User[], …) – avoid any
Never import posthog-js in server components; analytics reporting is client-side only
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
🧬 Code graph analysis (2)
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts (2)
packages/thirdweb/src/exports/thirdweb.ts (1)
ThirdwebClient(25-25)packages/thirdweb/src/utils/fetch.ts (1)
getClientFetch(19-130)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx (2)
packages/thirdweb/src/exports/thirdweb.ts (1)
ThirdwebClient(25-25)packages/thirdweb/src/react/web/ui/Bridge/swap-widget/SwapWidget.tsx (1)
SwapWidget(251-271)
⏰ 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). (6)
- GitHub Check: Size
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: Lint Packages
- GitHub Check: Vercel Agent Review
- GitHub Check: Analyze (javascript)
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.
Additional Suggestion:
Missing required client prop on SwapProjectWalletModalContent component. The component type now requires this prop (added at line 616), but it's not being passed at the call site.
View Details
📝 Patch Details
diff --git a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
index 3d608eb7a..6f83fd3f0 100644
--- a/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
+++ b/apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
@@ -419,6 +419,7 @@ export function ProjectWalletDetailsSection(props: ProjectWalletControlsProps) {
<Dialog onOpenChange={setIsSwapOpen} open={isSwapOpen}>
<DialogContent className="gap-0 p-0 overflow-hidden max-w-md">
<SwapProjectWalletModalContent
+ client={props.client}
chainId={selectedChainId}
tokenAddress={selectedTokenAddress}
walletAddress={projectWallet.address}
Analysis
Missing client prop on SwapProjectWalletModalContent component
What fails: SwapProjectWalletModalContent component is instantiated without the required client prop. The component's type signature at line 616 defines client: ThirdwebClient; as a required property, but the call site at lines 421-433 does not pass this prop.
How to reproduce:
cd apps/dashboard
npx tsc --noEmitResult: TypeScript compilation error at line 421:
error TS2741: Property 'client' is missing in type '{ chainId: number; tokenAddress: string | undefined; walletAddress: string; chain: Chain; isManagedVault: boolean; publishableKey: any; secretKey: string; setSecretKey: Dispatch<SetStateAction<string>>; vaultAccessToken: string; setVaultAccessToken: Dispatch<...>; onClose: () => void; }' but required in type 'SwapProjectWalletModalContentProps'.
Expected behavior: Component should compile without errors. The parent component ProjectWalletDetailsSection has access to props.client as defined in ProjectWalletControlsProps (line 92), which should be passed to the child component.
Fix applied: Added client={props.client} as the first prop in the SwapProjectWalletModalContent component instantiation.
b31c389 to
48fd978
Compare
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 (1)
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts (1)
7-7: useTokenBalances now uses client-bound fetch; consider adding coverageSwitching
useTokenBalancesto acceptclient: ThirdwebClientand callinggetClientFetch(options.client)before issuing the request is consistent with the new client-based flow and avoids manually managing headers. The URL construction and error handling remain unchanged, so behavior should be equivalent aside from going through the client’s fetch wrapper.Given this is a behavioral change in how token balances are fetched, it would be good to add at least a small test (or adjust existing ones) that:
- Mocks
getClientFetchto assert it is invoked with the provided client.- Confirms that a non-OK response still results in the current thrown error.
This would address the patch coverage warning and guard against regressions if the client fetch behavior changes.
Also applies to: 75-81, 105-106
📜 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 selected for processing (3)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx(5 hunks)packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsx(1 hunks)packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts(3 hunks)
🚧 Files skipped from review as they are similar to previous changes (1)
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/components/project-wallet/project-wallet-details.tsx
🧰 Additional context used
📓 Path-based instructions (4)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.{ts,tsx}: Write idiomatic TypeScript with explicit function declarations and return types
Limit each TypeScript file to one stateless, single-responsibility function for clarity
Re-use shared types from@/typesor localtypes.tsbarrels
Prefer type aliases over interface except for nominal shapes in TypeScript
Avoidanyandunknownin TypeScript unless unavoidable; narrow generics when possible
Choose composition over inheritance; leverage utility types (Partial,Pick, etc.) in TypeScript
**/*.{ts,tsx}: Write idiomatic TypeScript with explicit function declarations and return types
Limit each file to one stateless, single-responsibility function for clarity and testability
Re-use shared types from @/types or local types.ts barrel exports
Prefer type aliases over interface except for nominal shapes
Avoid any and unknown unless unavoidable; narrow generics whenever possible
Choose composition over inheritance; leverage utility types (Partial, Pick, etc.)
Comment only ambiguous logic in TypeScript files; avoid restating TypeScript types and signatures in prose
Files:
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsxpackages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts
packages/thirdweb/src/**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
packages/thirdweb/src/**/*.{ts,tsx}: Comment only ambiguous logic in SDK code; avoid restating TypeScript in prose
Load heavy dependencies inside async paths to keep initial bundle lean (e.g.const { jsPDF } = await import("jspdf");)Lazy-load heavy dependencies inside async paths to keep the initial bundle lean (e.g., const { jsPDF } = await import('jspdf');)
Files:
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsxpackages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts
**/*.{js,jsx,ts,tsx,json}
📄 CodeRabbit inference engine (AGENTS.md)
Biome governs formatting and linting; its rules live in biome.json. Run
pnpm fix&pnpm lintbefore committing, ensure there are no linting errors
Files:
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsxpackages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (AGENTS.md)
Lazy-import optional features; avoid top-level side-effects
Files:
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsxpackages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts
🧬 Code graph analysis (1)
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts (1)
packages/thirdweb/src/exports/thirdweb.ts (1)
ThirdwebClient(25-25)
🪛 GitHub Check: codecov/patch
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsx
[warning] 93-93: packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsx#L93
Added line #L93 was not covered by tests
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts
[warning] 105-106: packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-tokens.ts#L105-L106
Added lines #L105 - L106 were not covered by tests
⏰ 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). (7)
- GitHub Check: Size
- GitHub Check: E2E Tests (pnpm, vite)
- GitHub Check: E2E Tests (pnpm, webpack)
- GitHub Check: E2E Tests (pnpm, esbuild)
- GitHub Check: Lint Packages
- GitHub Check: Vercel Agent Review
- GitHub Check: Analyze (javascript)
🔇 Additional comments (1)
packages/thirdweb/src/react/web/ui/Bridge/swap-widget/select-token-ui.tsx (1)
92-98: Owned-tokens query now correctly passes the client instancePassing
client: props.clientintouseTokenBalancesaligns this call site with the updated hook signature and the rest of the swap-widget, and theenabledflag in the hook will prevent calls whenchainIdorwalletAddressare missing. No issues from a correctness standpoint.

PR-Codex overview
This PR focuses on updating the handling of
clientin theuseTokenBalancesandSwapProjectWalletModalContentcomponents, enhancing the way tokens are fetched and passed to the swap widget.Detailed summary
clientIdtoclientinownedTokensQueryanduseTokenBalances.getClientFetchwith the newclientparameter.SwapProjectWalletModalContentto acceptclientas a prop.SwapWidgetto useprops.clientinstead ofswapClient.Summary by CodeRabbit
✏️ Tip: You can customize this high-level summary in your review settings.