Skip to content

feat: add TransactionPendingModal component (#9) - #18

Closed
Anuoluwapo25 wants to merge 1 commit into
accesslayerorg:mainfrom
Anuoluwapo25:feat/transaction-pending-modal
Closed

feat: add TransactionPendingModal component (#9)#18
Anuoluwapo25 wants to merge 1 commit into
accesslayerorg:mainfrom
Anuoluwapo25:feat/transaction-pending-modal

Conversation

@Anuoluwapo25

Copy link
Copy Markdown

Summary

Closes #9

  • Adds TransactionPendingModal at src/components/common/TransactionPendingModal.tsx
  • Built on the existing Radix UI Dialog shell — opens/closes cleanly via isOpen / onClose props
  • Supports three status states: pending (animated spinner), success (check icon), error (X icon)
  • Exposes title, statusText, description for flexible copy per flow (buy, sell, etc.)
  • Optional actionLabel + onAction for a primary CTA in the action area
  • Close button is suppressed during pending state to prevent accidental dismissal
  • Matches the dark theme (slate-950 background, amber accents) used throughout the app

Test plan

  • Import TransactionPendingModal and toggle isOpen — modal opens and closes cleanly
  • Verify pending state: spinner animates, close button is hidden, pulse dot visible
  • Verify success state: green check icon, close button appears
  • Verify error state: red X icon, close button appears
  • Pass actionLabel + onAction — confirm CTA button renders and fires callback
  • Confirm modal is dismissible via overlay click or Escape key (Radix default)

🤖 Generated with Claude Code

…tates

Implements a reusable modal shell for transaction feedback (pending/success/error).
Supports title, status text, description, and an optional action area — ready
for buy and sell flows.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Build transaction pending modal shell

1 participant