[MNY-11] Dashboard: Add ERC20 token selector for starting price in token creation flow #7933
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
WalkthroughAdds ERC20 paired-token selection to pool pricing, introduces erc20Asset_poolMode.tokenAddress in the form, removes tick-based refine on startingPricePerToken, makes getInitialTickValue async to fetch on-chain decimals, validates initial tick using tokenAddress, and updates launch flow and UI to pass form values and conditionally bridge. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
actor User
participant UI as CreateToken Page
participant PC as PoolConfig (TokenSale)
participant TS as TokenSelector
participant UT as getInitialTickValue
participant RPC as Chain RPC
participant Launcher as Launch Flow
participant Bridge as Universal Bridge
participant RV as Revalidate
User->>UI: fill form (pool mode)
UI->>PC: render pricing
PC->>TS: bind tokenAddress
User->>TS: select token
TS-->>PC: update erc20Asset_poolMode.tokenAddress
User->>Launcher: click Launch
Launcher->>UT: getInitialTickValue(startingPricePerToken, tokenAddress, chain, client)
UT->>RPC: if ERC20 -> decimals()
RPC-->>UT: decimals
UT-->>Launcher: initialTick
Launcher->>Launcher: validate isValidTickValue(initialTick)
alt saleMode == "erc20-asset:pool"
Launcher->>Bridge: createTokenOnUniversalBridge(contractAddress, pairedTokenAddress, chainId)
Bridge-->>Launcher: result
end
Launcher->>RV: revalidate tokens page
RV-->>User: updated list
Estimated code review effort🎯 4 (Complex) | ⏱️ ~60 minutes Assessment against linked issues
Assessment against linked issues: Out-of-scope changes
Warning Review ran into problems🔥 ProblemsErrors were encountered while retrieving linked issues. Errors (1)
✨ Finishing Touches
🧪 Generate unit tests
🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
CodeRabbit Configuration File (
|
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✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #7933 +/- ##
=======================================
Coverage 56.53% 56.53%
=======================================
Files 904 904
Lines 58592 58592
Branches 4143 4143
=======================================
Hits 33126 33126
Misses 25360 25360
Partials 106 106
🚀 New features to boost your workflow:
|
size-limit report 📦
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 4
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)/tokens/create/token/_common/form.ts (1)
38-53: Guard against zero/negative starting price to avoid invalid tick math downstreamRemoving the refine means 0 is now allowed; getInitialTickValue does Math.log(price), which breaks for <= 0. Add an object-level refine for pool mode to enforce > 0 on startingPricePerToken.
erc20Asset_poolMode: z.object({ - startingPricePerToken: priceAmountSchema, + startingPricePerToken: priceAmountSchema, tokenAddress: addressSchema, saleAllocationPercentage: z.string().refine( (value) => { const number = Number(value); if (Number.isNaN(number)) { return false; } return number >= 0 && number <= 100; }, { message: "Must be a number between 0 and 100", }, ), - }), + }).refine( + (v) => Number(v.startingPricePerToken) > 0, + { message: "Starting price must be greater than 0", path: ["startingPricePerToken"] }, + ),
🧹 Nitpick comments (4)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx (2)
234-237: Tighten layout: make selector size to content and remove extra padding on inputgrid-cols-2 forces 50/50 split and DecimalInput still has pr-10 (legacy from currency adornment). Prefer content-based width and drop the padding.
- <div className="relative grid grid-cols-2"> + <div className="relative grid grid-cols-[1fr_auto]"> <DecimalInput - className="pr-10 rounded-r-none" + className="rounded-r-none"
258-266: Trigger validation when token changesSet shouldValidate so zod runs addressSchema checks and any cross-field refinements.
- onChange={(value) => { - props.form.setValue( - "erc20Asset_poolMode.tokenAddress", - value.address, - ); - }} + onChange={(value) => { + props.form.setValue( + "erc20Asset_poolMode.tokenAddress", + value.address, + { shouldValidate: true }, + ); + }}apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsx (1)
175-178: Validate after resetting token on chain changeTrigger schema validation so downstream state (e.g., tick calc) sees consistent values.
- tokenDistributionForm.setValue( - "erc20Asset_poolMode.tokenAddress", - nativeTokenAddress, - ); + tokenDistributionForm.setValue( + "erc20Asset_poolMode.tokenAddress", + nativeTokenAddress, + { shouldValidate: true }, + );apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx (1)
471-475: Await revalidation to ensure it runs after the bridge call.This preserves ordering and avoids stale UI after launch.
Apply this diff:
- revalidatePathAction( + await revalidatePathAction( `/team/${props.teamSlug}/project/${props.projectId}/tokens`, "page", );
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (6)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.ts(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx(4 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsx(3 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx(5 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts(1 hunks)
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.{ts,tsx}: Write idiomatic TypeScript with explicit function declarations and return types
Limit each 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
Avoidanyandunknownunless unavoidable; narrow generics when possible
Choose composition over inheritance; leverage utility types (Partial,Pick, etc.)
Comment only ambiguous logic; avoid restating TypeScript in prose
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (CLAUDE.md)
Load heavy dependencies inside async paths to keep initial bundle lean (lazy loading)
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx
apps/{dashboard,playground-web}/**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
apps/{dashboard,playground-web}/**/*.{ts,tsx}: Import UI primitives from@/components/ui/*(Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
UseNavLinkfor internal navigation with automatic active states in dashboard and playground apps
Use Tailwind CSS only – no inline styles or CSS modules
Usecn()from@/lib/utilsfor conditional class logic
Use design system tokens (e.g.,bg-card,border-border,text-muted-foreground)
Server Components (Node edge): Start files withimport "server-only";
Client Components (browser): Begin files with'use client';
Always callgetAuthToken()to retrieve JWT from cookies on server side
UseAuthorization: Bearerheader – never embed tokens in URLs
Return typed results (e.g.,Project[],User[]) – avoidany
Wrap client-side data fetching calls in React Query (@tanstack/react-query)
Use descriptive, stablequeryKeysfor React Query 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
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.tsapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx
🧠 Learnings (8)
📚 Learning: 2025-07-18T19:19:55.613Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-07-18T19:19:55.613Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{ts,tsx} : Use design system tokens (e.g., `bg-card`, `border-border`, `text-muted-foreground`)
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-05-30T17:14:25.332Z
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*client.tsx : Anything that consumes hooks from `tanstack/react-query` or thirdweb SDKs.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-07-18T19:19:55.613Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-07-18T19:19:55.613Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{ts,tsx} : Import UI primitives from `@/components/ui/*` (Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-07-10T10:18:33.238Z
Learnt from: arcoraven
PR: thirdweb-dev/js#7505
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx:186-204
Timestamp: 2025-07-10T10:18:33.238Z
Learning: The ThirdwebBarChart component in apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx does not accept standard accessibility props like `aria-label` and `role` in its TypeScript interface, causing compilation errors when added.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-06-17T18:30:52.976Z
Learnt from: MananTank
PR: thirdweb-dev/js#7356
File: apps/nebula/src/app/not-found.tsx:1-1
Timestamp: 2025-06-17T18:30:52.976Z
Learning: In the thirdweb/js project, the React namespace is available for type annotations (like React.FC) without needing to explicitly import React. This is project-specific configuration that differs from typical TypeScript/React setups.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-06-10T00:50:20.795Z
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx
📚 Learning: 2025-05-27T19:55:25.056Z
Learnt from: MananTank
PR: thirdweb-dev/js#7177
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/public-pages/erc20/_hooks/useTokenPriceData.ts:49-49
Timestamp: 2025-05-27T19:55:25.056Z
Learning: In the ERC20 public pages token price data hook (`useTokenPriceData.ts`), direct array access on `json.data[0]` without optional chaining is intentionally correct and should not be changed to use safety checks.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.ts
🧬 Code graph analysis (6)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsx (1)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.ts (1)
CreateAssetFormValues(85-86)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx (1)
apps/dashboard/src/@/components/ui/decimal-input.tsx (1)
DecimalInput(2-39)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx (1)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.ts (1)
CreateAssetFormValues(85-86)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.ts (1)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/_common/schema.ts (1)
addressSchema(41-51)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts (2)
packages/thirdweb/src/exports/thirdweb.ts (3)
ThirdwebClient(25-25)NATIVE_TOKEN_ADDRESS(31-31)getContract(43-43)packages/thirdweb/src/react/web/ui/ConnectWallet/screens/nativeToken.ts (1)
isNativeToken(15-25)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx (4)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts (2)
getInitialTickValue(10-38)isValidTickValue(40-42)packages/thirdweb/src/exports/utils.ts (1)
getAddress(147-147)packages/thirdweb/src/exports/thirdweb.ts (1)
NATIVE_TOKEN_ADDRESS(31-31)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/_apis/create-token-on-bridge.ts (1)
createTokenOnUniversalBridge(4-25)
⏰ 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). (4)
- GitHub Check: Size
- GitHub Check: Unit Tests
- GitHub Check: Lint Packages
- GitHub Check: Analyze (javascript)
🔇 Additional comments (7)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx (1)
7-7: TokenSelector integration looks goodImport is correct and aligns with the new form shape (erc20Asset_poolMode.tokenAddress).
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx (2)
59-62: onLaunchSuccess signature change is clearerPassing (formValues, contractAddress) simplifies consumers that already have form context.
253-255: All onLaunchSuccess handlers aligned with new signatureNo remaining callers use the old object‐shape signature; all token‐flow handlers accept (formValues, contractAddress) and all NFT‐flow handlers remain zero‐arg, matching their invocations.
• apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsx
– onLaunchSuccess: (formValues: CreateAssetFormValues, contractAddress: string)
• apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx
– props.onLaunchSuccess(formValues, contractAddress)
• apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/nft/create-nft-page-ui.tsx
– onLaunchSuccess: () => void (unchanged)
• apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/nft/launch/launch-nft.tsx
– props.onLaunchSuccess()Storybook stubs define onLaunchSuccess as zero‐arg functions but safely ignore extra parameters at runtime. No further updates needed.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsx (2)
62-65: Propagated onLaunchSuccess signature matches LaunchTokenStatusConsistent typing across components.
141-142: Good default: pair against native tokenBootstrapping to native keeps decimals path simple before user picks ERC20.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx (2)
41-41: Importing tick utilities is correct and aligns with the new flow.
143-147: Currency selection logic looks correct.Native token resolves to
undefined; ERC20 passes through the address. Normalization viagetAddressis good.
...pp)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx
Outdated
Show resolved
Hide resolved
...pp)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx
Show resolved
Hide resolved
...pp)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx
Show resolved
Hide resolved
.../(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts
Show resolved
Hide resolved
…ken creation flow
MananTank
force-pushed
the
08-28-_mny-11_dashboard_add_erc20_token_selector_for_starting_price_in_token_creation_flow
branch
from
84e5e24 to
b493352
Compare
There was a problem hiding this comment.
Actionable comments posted: 2
♻️ Duplicate comments (4)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts (2)
29-33: Guard invalid/overflowing computed price before log()Prevent NaN/Infinity and provide a clearer error.
- const decimalAdjustedPrice = - params.startingPricePerToken * 10 ** (pairTokenDecimals - 18); - - const calculatedTick = Math.log(decimalAdjustedPrice) / Math.log(1.0001); + const decimalAdjustedPrice = + params.startingPricePerToken * 10 ** (pairTokenDecimals - 18); + if (!Number.isFinite(decimalAdjustedPrice) || decimalAdjustedPrice <= 0) { + throw new Error("Computed price is invalid"); + } + const calculatedTick = Math.log(decimalAdjustedPrice) / Math.log(1.0001);
34-37: Clamp tick to bounds after roundingKeeps the value usable without relying solely on external validation.
- const tick = Math.round(calculatedTick / TICK_SPACING) * TICK_SPACING; + let tick = Math.round(calculatedTick / TICK_SPACING) * TICK_SPACING; + if (tick < MIN_TICK) tick = MIN_TICK; + if (tick > MAX_TICK) tick = MAX_TICK;apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx (2)
116-134: Great: guarded initial tick computation behind sale gatingThis addresses earlier crash potential when sale is disabled or saleAmount is zero.
145-152: Ensure initialTick is definitely a number in pool configType-wise, initialTick can be undefined; assert or compute inline to satisfy the pool config contract.
- initialTick: initialTick, + initialTick: initialTick!,If the type of config.initialTick is optional, ignore this.
🧹 Nitpick comments (5)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx (2)
190-201: Layout tweak: improve small-screen ergonomicsTwo-column layout for price + selector can feel cramped on narrow widths. Consider stacking on mobile and using a content-fit column for the selector on larger screens.
- <div className="flex flex-col lg:flex-row gap-4"> + <div className="flex flex-col lg:flex-row gap-4"> ... - <FormFieldSetup ... className="grow lg:max-w-sm"> + <FormFieldSetup ... className="grow lg:max-w-sm"> <div - className="relative grid grid-cols-2" + className="relative grid grid-cols-1 lg:grid-cols-[1fr_auto]" >
232-249: Minor UI polish: remove leftover padding on DecimalInputThe right padding was useful when a trailing symbol sat inside the input. With the TokenSelector now separate, the extra pr-10 is likely redundant.
- <DecimalInput - className="pr-10 rounded-r-none" + <DecimalInput + className="rounded-r-none"apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts (2)
10-21: Add explicit return type and early input guardMake the return type explicit per project style and fail fast on non-positive prices.
-export async function getInitialTickValue(params: { +export async function getInitialTickValue(params: { startingPricePerToken: number; tokenAddress: string; chain: Chain; client: ThirdwebClient; -}) { +}): Promise<number> { + if ( + !Number.isFinite(params.startingPricePerToken) || + params.startingPricePerToken <= 0 + ) { + throw new Error("Starting price must be > 0"); + }
16-21: Robust native detectionNormalize and check both native constants.
- const isNativeToken = - getAddress(params.tokenAddress) === getAddress(NATIVE_TOKEN_ADDRESS); + const normalized = getAddress(params.tokenAddress); + const isNativeToken = + normalized === getAddress(NATIVE_TOKEN_ADDRESS) || + normalized === getAddress(ZERO_ADDRESS);apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx (1)
148-151: Handle native token via ZERO_ADDRESS as wellKeep native detection consistent across the app by also treating 0x000...0 as native.
- currency: - getAddress(params.values.erc20Asset_poolMode.tokenAddress) === - getAddress(NATIVE_TOKEN_ADDRESS) - ? undefined - : params.values.erc20Asset_poolMode.tokenAddress, + currency: + [NATIVE_TOKEN_ADDRESS, ZERO_ADDRESS].some( + (n) => + getAddress(params.values.erc20Asset_poolMode.tokenAddress) === + getAddress(n), + ) + ? undefined + : params.values.erc20Asset_poolMode.tokenAddress,
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (6)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.ts(1 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx(4 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsx(3 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx(5 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx(2 hunks)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.ts
- apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page.client.tsx
🧰 Additional context used
📓 Path-based instructions (3)
**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
**/*.{ts,tsx}: Write idiomatic TypeScript with explicit function declarations and return types
Limit each 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
Avoidanyandunknownunless unavoidable; narrow generics when possible
Choose composition over inheritance; leverage utility types (Partial,Pick, etc.)
Comment only ambiguous logic; avoid restating TypeScript in prose
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts
**/*.{ts,tsx,js,jsx}
📄 CodeRabbit inference engine (CLAUDE.md)
Load heavy dependencies inside async paths to keep initial bundle lean (lazy loading)
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts
apps/{dashboard,playground-web}/**/*.{ts,tsx}
📄 CodeRabbit inference engine (CLAUDE.md)
apps/{dashboard,playground-web}/**/*.{ts,tsx}: Import UI primitives from@/components/ui/*(Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
UseNavLinkfor internal navigation with automatic active states in dashboard and playground apps
Use Tailwind CSS only – no inline styles or CSS modules
Usecn()from@/lib/utilsfor conditional class logic
Use design system tokens (e.g.,bg-card,border-border,text-muted-foreground)
Server Components (Node edge): Start files withimport "server-only";
Client Components (browser): Begin files with'use client';
Always callgetAuthToken()to retrieve JWT from cookies on server side
UseAuthorization: Bearerheader – never embed tokens in URLs
Return typed results (e.g.,Project[],User[]) – avoidany
Wrap client-side data fetching calls in React Query (@tanstack/react-query)
Use descriptive, stablequeryKeysfor React Query 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
Files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsxapps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts
🧠 Learnings (7)
📚 Learning: 2025-06-10T00:50:20.795Z
Learnt from: MananTank
PR: thirdweb-dev/js#7315
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx:153-226
Timestamp: 2025-06-10T00:50:20.795Z
Learning: In apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/assets/create/nft/launch-nft.tsx, the updateStatus function correctly expects a complete MultiStepState["status"] object. For pending states, { type: "pending" } is the entire status object. For error states, { type: "error", message: React.ReactNode } is the entire status object. The current code incorrectly spreads the entire step object instead of passing just the status object.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx
📚 Learning: 2025-08-27T22:11:41.706Z
Learnt from: MananTank
PR: thirdweb-dev/js#7933
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx:465-473
Timestamp: 2025-08-27T22:11:41.706Z
Learning: In the token creation flow (create-token-page-impl.tsx), the createTokenOnUniversalBridge() call is intentionally not awaited (fire-and-forget pattern) to allow the token creation process to complete immediately without waiting for the bridge operation. This is a deliberate design choice to prioritize user experience by not blocking the main flow with supplementary bridge operations.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx
📚 Learning: 2025-05-30T17:14:25.332Z
Learnt from: MananTank
PR: thirdweb-dev/js#7227
File: apps/dashboard/src/app/(app)/(dashboard)/(chain)/[chain_id]/[contractAddress]/modules/components/OpenEditionMetadata.tsx:26-26
Timestamp: 2025-05-30T17:14:25.332Z
Learning: The ModuleCardUIProps interface already includes a client prop of type ThirdwebClient, so when components use `Omit<ModuleCardUIProps, "children" | "updateButton">`, they inherit the client prop without needing to add it explicitly.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-07-18T19:20:32.530Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: .cursor/rules/dashboard.mdc:0-0
Timestamp: 2025-07-18T19:20:32.530Z
Learning: Applies to dashboard/**/*client.tsx : Anything that consumes hooks from `tanstack/react-query` or thirdweb SDKs.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-07-18T19:19:55.613Z
Learnt from: CR
PR: thirdweb-dev/js#0
File: CLAUDE.md:0-0
Timestamp: 2025-07-18T19:19:55.613Z
Learning: Applies to apps/{dashboard,playground-web}/**/*.{ts,tsx} : Import UI primitives from `@/components/ui/*` (Button, Input, Select, Tabs, Card, Sidebar, Badge, Separator) in dashboard and playground apps
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-07-10T10:18:33.238Z
Learnt from: arcoraven
PR: thirdweb-dev/js#7505
File: apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx:186-204
Timestamp: 2025-07-10T10:18:33.238Z
Learning: The ThirdwebBarChart component in apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/webhooks/analytics/components/WebhookAnalyticsCharts.tsx does not accept standard accessibility props like `aria-label` and `role` in its TypeScript interface, causing compilation errors when added.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
📚 Learning: 2025-06-17T18:30:52.976Z
Learnt from: MananTank
PR: thirdweb-dev/js#7356
File: apps/nebula/src/app/not-found.tsx:1-1
Timestamp: 2025-06-17T18:30:52.976Z
Learning: In the thirdweb/js project, the React namespace is available for type annotations (like React.FC) without needing to explicitly import React. This is project-specific configuration that differs from typical TypeScript/React setups.
Applied to files:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx
🧬 Code graph analysis (4)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx (1)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/_common/form.ts (1)
CreateAssetFormValues(85-86)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx (2)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts (2)
getInitialTickValue(10-38)isValidTickValue(40-42)apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/_apis/create-token-on-bridge.ts (1)
createTokenOnUniversalBridge(4-25)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx (1)
apps/dashboard/src/@/components/ui/decimal-input.tsx (1)
DecimalInput(2-39)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts (2)
packages/thirdweb/src/exports/thirdweb.ts (3)
ThirdwebClient(25-25)NATIVE_TOKEN_ADDRESS(31-31)getContract(43-43)packages/thirdweb/src/react/web/ui/ConnectWallet/screens/nativeToken.ts (1)
isNativeToken(15-25)
⏰ 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). (3)
- GitHub Check: Size
- GitHub Check: Lint Packages
- GitHub Check: Analyze (javascript)
🔇 Additional comments (5)
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/distribution/token-sale.tsx (1)
7-7: Good addition: TokenSelector integrationImport looks correct and aligns with the new ERC20 paired-token flow.
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/launch/launch-token.tsx (2)
253-255: Passing normalized values is fine hereUsing the ref avoids stale state; args match the new signature.
59-62: Fix missing arguments in NFT launch success handlerThe
onLaunchSuccesssignature was updated to accept(formValues, contractAddress: string), but the invocation in the NFT launcher still calls it with no arguments. Please update this call to pass the proper parameters:• Location:
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/nft/launch/launch-nft.tsx
Line 288:- props.onLaunchSuccess(); + props.onLaunchSuccess(formValues, contractAddressRef.current);apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/create-token-page-impl.tsx (2)
41-42: Import addition is appropriateBringing both calculator and validator into this module is the right split.
465-474: Fire-and-forget bridge call: handle native token & catch errorsTo preserve the non-blocking UX while avoiding unhandled promise rejections and omitting the paired address for native tokens, update the
onLaunchSuccesshandler as follows:
- Ensure you have at the top of this file:
import { getAddress } from "ethers/lib/utils"; import { NATIVE_TOKEN_ADDRESS } from "@thirdweb-dev/sdk"; // or wherever this constant is defined- Replace the existing call with:
onLaunchSuccess={(values, contractAddress) => { if (values.saleMode === "erc20-asset:pool") { - createTokenOnUniversalBridge({ - chainId: Number(values.chain), - client: props.client, - tokenAddress: contractAddress, - pairedTokenAddress: values.erc20Asset_poolMode.tokenAddress, - }); + const paired = values.erc20Asset_poolMode.tokenAddress; + const isNative = + getAddress(paired) === getAddress(NATIVE_TOKEN_ADDRESS); + void createTokenOnUniversalBridge({ + chainId: Number(values.chain), + client: props.client, + tokenAddress: getAddress(contractAddress), + pairedTokenAddress: isNative ? undefined : paired, + }).catch((err) => { + console.error("Universal bridge error:", err); + }); } }}Please verify:
getAddressandNATIVE_TOKEN_ADDRESSare imported correctly.- The paired address is omitted for native tokens.
- Errors from the bridge call are caught and logged.
| <TokenSelector | ||
| addNativeTokenIfMissing={true} | ||
| chainId={Number(props.chainId)} | ||
| className="bg-background border-l-0 rounded-l-none" | ||
| client={props.client} | ||
| disableAddress={true} | ||
| popoverContentClassName="!w-[320px]" | ||
| onChange={(value) => { | ||
| props.form.setValue( | ||
| "erc20Asset_poolMode.tokenAddress", | ||
| value.address, | ||
| ); | ||
| }} | ||
| selectedToken={{ | ||
| address: props.form.watch("erc20Asset_poolMode.tokenAddress"), | ||
| chainId: Number(props.chainId), | ||
| }} | ||
| showCheck={true} | ||
| /> |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Validate on token change and guard undefined selectedToken
Ensure form re-validates when the token changes, and avoid passing an object with an undefined address to selectedToken.
- onChange={(value) => {
- props.form.setValue(
- "erc20Asset_poolMode.tokenAddress",
- value.address,
- );
- }}
+ onChange={(value) => {
+ props.form.setValue(
+ "erc20Asset_poolMode.tokenAddress",
+ value.address,
+ { shouldValidate: true },
+ );
+ }}
- selectedToken={{
- address: props.form.watch("erc20Asset_poolMode.tokenAddress"),
- chainId: Number(props.chainId),
- }}
+ selectedToken={
+ props.form.watch("erc20Asset_poolMode.tokenAddress")
+ ? {
+ address: props.form.watch(
+ "erc20Asset_poolMode.tokenAddress",
+ )!,
+ chainId: Number(props.chainId),
+ }
+ : undefined
+ }📝 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.
| <TokenSelector | |
| addNativeTokenIfMissing={true} | |
| chainId={Number(props.chainId)} | |
| className="bg-background border-l-0 rounded-l-none" | |
| client={props.client} | |
| disableAddress={true} | |
| popoverContentClassName="!w-[320px]" | |
| onChange={(value) => { | |
| props.form.setValue( | |
| "erc20Asset_poolMode.tokenAddress", | |
| value.address, | |
| ); | |
| }} | |
| selectedToken={{ | |
| address: props.form.watch("erc20Asset_poolMode.tokenAddress"), | |
| chainId: Number(props.chainId), | |
| }} | |
| showCheck={true} | |
| /> | |
| <TokenSelector | |
| addNativeTokenIfMissing={true} | |
| chainId={Number(props.chainId)} | |
| className="bg-background border-l-0 rounded-l-none" | |
| client={props.client} | |
| disableAddress={true} | |
| popoverContentClassName="!w-[320px]" | |
| onChange={(value) => { | |
| props.form.setValue( | |
| "erc20Asset_poolMode.tokenAddress", | |
| value.address, | |
| { shouldValidate: true }, | |
| ); | |
| }} | |
| selectedToken={ | |
| props.form.watch("erc20Asset_poolMode.tokenAddress") | |
| ? { | |
| address: props.form.watch( | |
| "erc20Asset_poolMode.tokenAddress", | |
| )!, | |
| chainId: Number(props.chainId), | |
| } | |
| : undefined | |
| } | |
| showCheck={true} | |
| /> |
| import type { Chain, ThirdwebClient } from "thirdweb"; | ||
| import { getContract, NATIVE_TOKEN_ADDRESS } from "thirdweb"; | ||
| import { decimals } from "thirdweb/extensions/erc20"; | ||
| import { getAddress } from "thirdweb/utils"; | ||
|
|
There was a problem hiding this comment.
🛠️ Refactor suggestion
Treat ZERO_ADDRESS as native too
Some flows represent native token with the zero address. Normalize and compare against both NATIVE_TOKEN_ADDRESS and ZERO_ADDRESS to avoid accidental decimals() calls on 0x0.
-import type { Chain, ThirdwebClient } from "thirdweb";
-import { getContract, NATIVE_TOKEN_ADDRESS } from "thirdweb";
+import type { Chain, ThirdwebClient } from "thirdweb";
+import { getContract, NATIVE_TOKEN_ADDRESS, ZERO_ADDRESS } from "thirdweb";Committable suggestion skipped: line range outside the PR's diff.
🤖 Prompt for AI Agents
In
apps/dashboard/src/app/(app)/team/[team_slug]/[project_slug]/(sidebar)/tokens/create/token/utils/calculate-tick.ts
lines 1-5, treat the zero address as native too by normalizing the incoming
token address with getAddress and explicitly checking it against both
NATIVE_TOKEN_ADDRESS and the canonical zero address
("0x0000000000000000000000000000000000000000") before calling decimals(); if it
matches either, skip decimals() and handle as native, otherwise call decimals()
safely. Ensure you import/getAddress is used to normalize comparisons to avoid
case/format mismatches.
PR-Codex overview
This PR focuses on enhancing the functionality of the token creation process by modifying the
onLaunchSuccesshandler and improving token address handling and validation within the forms.Detailed summary
onLaunchSuccessto acceptformValuesandcontractAddressinstead of a single object.startingPricePerToken.tokenAddressfield to the token distribution form schema.getInitialTickValueto includetokenAddress,chain, andclient.CreateTokenAssetPageandPoolConfigcomponents.TokenSelectorcomponent for easier token address selection.Summary by CodeRabbit
New Features
Bug Fixes
Style