fix: wire real balance API and remove placeholders (#31)#169
fix: wire real balance API and remove placeholders (#31)#169steph-crown wants to merge 1 commit intoPi-Defi-world:mainfrom
Conversation
Replace hardcoded BALANCE_PLACEHOLDER ("—") on home, mint, and send
pages with live data from GET /users/me/balance.
- Add BalanceResponse type and getBalance() API function
- Add useBalance hook (loading, error, refetch support)
- Wire home, mint, and send pages to real balance
- Fix undefined exceedsBalance runtime error on send page
- Remove duplicate TabsContent and stray </div> in send page
- Remove undefined BURN_DESTINATION_LABELS reference in mint page
- Clean up unused imports (Skeleton, PageContainer)
Made-with: Cursor
📝 WalkthroughWalkthroughA new Changes
Sequence DiagramsequenceDiagram
participant Page as React Page
participant Hook as useBalance Hook
participant API as userApi
participant Backend as Backend API
Page->>Hook: Call useBalance()
Hook->>Hook: Initialize state (balance, loading, error)
activate Hook
Hook->>API: Call getBalance()
activate API
API->>Backend: GET /users/me/balance
activate Backend
Backend-->>API: Return balance data
deactivate Backend
API-->>Hook: BalanceResponse
deactivate API
Hook->>Hook: Parse balance, set loading=false
Hook-->>Page: Return {balance, loading, error, refetch}
deactivate Hook
Page->>Page: Render with dynamic balance or loading state
Note over Page,Hook: User triggers refetch (e.g., after transfer)
Page->>Hook: Call refetch()
Hook->>Hook: Increment tick, restart fetch cycle
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
@steph-crown Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits. You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀 |
There was a problem hiding this comment.
🧹 Nitpick comments (4)
.gitignore (1)
29-30: Consider using leading/for root-level directories.The new ignore patterns are appropriate, but for consistency with other root-level patterns in this file (e.g.,
/node_modules,/.next/), consider:-.pnpm-store/ -.history/* +/.pnpm-store/ +/.history/This makes it explicit that these directories are expected at the repository root and follows the existing convention. The current form works correctly but is less precise.
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In @.gitignore around lines 29 - 30, Update the root-level ignore patterns in .gitignore to use a leading slash for consistency: replace occurrences of ".pnpm-store/" and ".history/*" with "/.pnpm-store/" and "/.history/*" so they explicitly target repository-root directories; locate these patterns in the .gitignore file and change the two entries (".pnpm-store/" and ".history/*") accordingly.hooks/use-balance.ts (1)
52-52: Dependency array includesopts.tokenbut not the fulloptsobject.Per
hooks/use-api.ts,useApiOpts()currently returns a stable empty object (useMemo(() => ({}), [])), soopts.tokenis alwaysundefinedand this works fine. IfuseApiOptsever returns additional request options (e.g.,signal, custom headers), those changes wouldn't trigger a refetch. Consider depending onoptsdirectly if future-proofing is desired, though current behavior is correct.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@hooks/use-balance.ts` at line 52, The hook's effect currently depends on opts.token and tick, but because useApiOpts() may later return other request options changes (like signal or headers) those won't trigger the refetch; update the dependency array to depend on the full opts object (replace opts.token with opts) so any change to the options returned by useApiOpts() causes the effect to rerun—look for the effect inside the useBalance hook in hooks/use-balance.ts and update its dependency array from [opts.token, tick] to [opts, tick].app/(app)/mint/page.tsx (1)
36-36: Consider refetching balance after successful mint/burn operations.Unlike
send/page.tsxwhich callsrefetchBalance()after a successful transfer (line 120), this page doesn't refresh the balance after mint or burn operations. The displayed balance will be stale until the user navigates away and back.♻️ Proposed fix
- const { balance, loading: balanceLoading } = useBalance(); + const { balance, loading: balanceLoading, refetch: refetchBalance } = useBalance();Then call
refetchBalance()after successful operations:setTxId(res.transaction_id); setStep("success"); + refetchBalance(); } catch (e) {Apply similarly in
handleExecuteBurn.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@app/`(app)/mint/page.tsx at line 36, The balance returned by useBalance is not refreshed after mint/burn; destructure refetchBalance from useBalance (e.g., const { balance, loading: balanceLoading, refetchBalance } = useBalance()) and invoke refetchBalance() after each successful operation in the handlers (call it at the point where handleExecuteMint and handleExecuteBurn currently treat the operation as successful, right after the success path/await completes) so the UI shows the updated balance immediately.app/(app)/send/page.tsx (1)
119-120: Balance refetch may return stale data immediately after transfer.Per
types/api.ts(lines 88-91),createTransferreturns only atransaction_idandstatus(which may be "pending"). The backend balance may not be updated yet whenrefetchBalance()is called. This is acceptable for now—the balance will eventually sync—but consider adding a brief delay or showing optimistic UI if precise balance is critical.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@app/`(app)/send/page.tsx around lines 119 - 120, The current flow calls loadTransfers() and immediately refetchBalance(), but createTransfer (per types/api.ts) can return a "pending" transaction_id so the backend balance may not reflect the transfer yet; update the UI to avoid showing stale balance by either adding a short delay before calling refetchBalance() (e.g., schedule refetchBalance() with a small timeout after loadTransfers()) or implement an optimistic UI: immediately update the cached/local balance and transfers list in the client (subtract the sent amount and push a pending transfer entry) and then call refetchBalance() to reconcile once the backend confirms; touch the code around loadTransfers(), refetchBalance(), and the createTransfer handling to implement one of these approaches.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In @.gitignore:
- Around line 29-30: Update the root-level ignore patterns in .gitignore to use
a leading slash for consistency: replace occurrences of ".pnpm-store/" and
".history/*" with "/.pnpm-store/" and "/.history/*" so they explicitly target
repository-root directories; locate these patterns in the .gitignore file and
change the two entries (".pnpm-store/" and ".history/*") accordingly.
In `@app/`(app)/mint/page.tsx:
- Line 36: The balance returned by useBalance is not refreshed after mint/burn;
destructure refetchBalance from useBalance (e.g., const { balance, loading:
balanceLoading, refetchBalance } = useBalance()) and invoke refetchBalance()
after each successful operation in the handlers (call it at the point where
handleExecuteMint and handleExecuteBurn currently treat the operation as
successful, right after the success path/await completes) so the UI shows the
updated balance immediately.
In `@app/`(app)/send/page.tsx:
- Around line 119-120: The current flow calls loadTransfers() and immediately
refetchBalance(), but createTransfer (per types/api.ts) can return a "pending"
transaction_id so the backend balance may not reflect the transfer yet; update
the UI to avoid showing stale balance by either adding a short delay before
calling refetchBalance() (e.g., schedule refetchBalance() with a small timeout
after loadTransfers()) or implement an optimistic UI: immediately update the
cached/local balance and transfers list in the client (subtract the sent amount
and push a pending transfer entry) and then call refetchBalance() to reconcile
once the backend confirms; touch the code around loadTransfers(),
refetchBalance(), and the createTransfer handling to implement one of these
approaches.
In `@hooks/use-balance.ts`:
- Line 52: The hook's effect currently depends on opts.token and tick, but
because useApiOpts() may later return other request options changes (like signal
or headers) those won't trigger the refetch; update the dependency array to
depend on the full opts object (replace opts.token with opts) so any change to
the options returned by useApiOpts() causes the effect to rerun—look for the
effect inside the useBalance hook in hooks/use-balance.ts and update its
dependency array from [opts.token, tick] to [opts, tick].
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: ff0c4694-d213-4435-945d-7cfe0db55a0c
⛔ Files ignored due to path filters (1)
pnpm-lock.yamlis excluded by!**/pnpm-lock.yaml
📒 Files selected for processing (7)
.gitignoreapp/(app)/mint/page.tsxapp/(app)/page.tsxapp/(app)/send/page.tsxhooks/use-balance.tslib/api/user.tstypes/api.ts
Replace hardcoded BALANCE_PLACEHOLDER ("—") on home, mint, and send
pages with live data from GET /users/me/balance.
Closes #31
Summary by CodeRabbit
New Features
Bug Fixes
.gitignorefile formatting issues.Chores
.gitignorewith additional local cache directory patterns.