feat: move sdk tokens

[rohanchkrabrty]

Summary

• Migrates tokens page from components/organization/tokens/ to standalone views/tokens/
• Converts route-based add-tokens modal (/tokens/modal) to state-based AddTokensDialog with open/onOpenChange props
• Removes addTokensRoute child route from routes.tsx
• Reduces components/organization/tokens/index.tsx to a thin wrapper

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
frontier	Ready	Preview, Comment	Mar 2, 2026 5:34am

[coderabbitai]

📝 Walkthrough

Summary by CodeRabbit

• Refactor
  • Reorganized token management interface and improved component structure.
  • Converted add tokens feature to use inline dialog instead of separate route navigation.
  • Enhanced token balance display and transaction history with improved loading states and error handling.

Walkthrough

The PR refactors tokens management from route-based modal navigation to a controlled dialog pattern. It removes the AddTokens route, converts AddTokensDialog to accept open and onOpenChange props, introduces TokensPage as a standalone view component with data fetching and transaction display, and consolidates public exports.

Changes

Cohort / File(s)	Summary
Route Configuration web/sdk/react/components/organization/routes.tsx	Removed AddTokens route definition and its import; simplified tokens route by eliminating the child route addition.
Dialog Component Refactoring web/sdk/react/views/tokens/add-tokens-dialog.tsx	Converted AddTokens to AddTokensDialog with prop-controlled visibility (open, onOpenChange); updated styling source and close behavior to invoke onOpenChange callback instead of navigation.
Page Component & Exports web/sdk/react/views/tokens/tokens-page.tsx, web/sdk/react/views/tokens/index.ts	New TokensPage component with billing data fetching, transaction display, and dialog state management; added public exports for TokensPage, AddTokensDialog, and their prop types.
Tokens Index Wrapper web/sdk/react/components/organization/tokens/index.tsx	Simplified to thin wrapper delegating to TokensPage; removed all internal component logic, error handling, and data fetching.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

Possibly related PRs

• feat: move sdk plans #1424: Applies the same refactor pattern of converting route-driven modal components into controlled dialog components with prop-based open/onOpenChange state and removing corresponding route definitions.
• feat: move sdk security #1422: Performs related route composition changes in routes.tsx by removing modal child routes and simplifying root children across multiple routes.

Suggested reviewers

• rohilsurana
• rsbh
• paanSinghCoder

---

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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[paanSinghCoder]

Please check page - view file renaming.

[coderabbitai]

Actionable comments posted: 1

Caution

Some comments are outside the diff and can’t be posted inline due to platform limitations.

⚠️ Outside diff range comments (1)

web/sdk/react/views/tokens/add-tokens-dialog.tsx (1)

155-160: ⚠️ Potential issue | 🟡 Minor

Use a semantic button for the close control.

Clickable Image is not keyboard-friendly by default. Please expose this as a proper button with an accessible label.

♿ Suggested accessible close control

-              <Image
-                alt="cross"
-                style={{ cursor: 'pointer' }}
-                src={cross as unknown as string}
-                onClick={handleClose}
-                data-test-id="frontier-sdk-add-tokens-btn"
-              />
+              <button
+                type="button"
+                onClick={handleClose}
+                aria-label="Close add tokens dialog"
+                className={tokenStyles.iconButton}
+                data-test-id="frontier-sdk-add-tokens-close-btn"
+              >
+                <Image
+                  alt=""
+                  aria-hidden
+                  style={{ cursor: 'pointer' }}
+                  src={cross as unknown as string}
+                />
+              </button>

🧹 Nitpick comments (1)

web/sdk/react/views/tokens/add-tokens-dialog.tsx (1)

26-35: Make onOpenChange required for a controlled dialog API.

With open required, leaving onOpenChange optional can create non-dismissible usage when consumers forget the callback.

♻️ Proposed API contract tweak

 export interface AddTokensDialogProps {
   open: boolean;
-  onOpenChange?: (value: boolean) => void;
+  onOpenChange: (value: boolean) => void;
 }
 
 export const AddTokensDialog = ({ open, onOpenChange }: AddTokensDialogProps) => {
@@
-  const handleClose = () => onOpenChange?.(false);
+  const handleClose = () => onOpenChange(false);

---

ℹ️ Review info

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 94094e0 and 5147028.

📒 Files selected for processing (8)

• web/sdk/react/components/organization/routes.tsx
• web/sdk/react/components/organization/tokens/index.tsx
• web/sdk/react/views/tokens/add-tokens-dialog.tsx
• web/sdk/react/views/tokens/index.ts
• web/sdk/react/views/tokens/token.module.css
• web/sdk/react/views/tokens/tokens-page.tsx
• web/sdk/react/views/tokens/transactions/columns.tsx
• web/sdk/react/views/tokens/transactions/index.tsx

[coveralls]

Pull Request Test Coverage Report for Build 22562786035

Details

• 0 of 0 changed or added relevant lines in 0 files are covered.
• No unchanged relevant lines lost coverage.
• Overall coverage remained the same at 39.848%

---

Totals
Change from base Build 22562756210:	0.0%
Covered Lines:	13595
Relevant Lines:	34117

---

💛 - Coveralls