Design Transaction Processing Modal

[onlydustapp]

Overview

Design a transaction processing modal to display real-time updates on transactions. This modal will be accessible from multiple pages within the application and support future extensibility for additional transaction types.

Requirements

• Modal Window: Create a modal window to display the status of transactions in real-time.
• Progress Indicator: Include a progress bar or similar visual element to indicate transaction progress.
• Transaction Details:
  • Transaction ID
  • Transaction type (e.g. airdrop, transfer, etc.)
  • Amount
  • Recipient address
• Real-Time Updates: Provide updates on the transaction status (e.g. "processing", "confirmed", "failed").
• Controls: Include a "Close" or "Cancel" button to dismiss the modal.
• Responsiveness: Ensure the modal is responsive and works well on various devices.

Additional Context

• The modal design should be consistent with our existing brand guidelines.
• It should be easily extensible to accommodate future transaction types.
• Accessible from multiple pages within the application.

Acceptance Criteria

1. The modal meets all outlined requirements.
2. It displays transaction details clearly and updates in real time.
3. The design is consistent with the current brand guidelines.
4. The modal is responsive and functional across different devices.

This issue is crucial for enhancing user experience during transaction processing. 🚀

For more details about our project context, refer to our README.

[Verifieddanny]

Can I be assigned to this?

[JayWebtech]

Hello, my name is Jethro. I am a full-stack/blockchain developer with 6 years of experience building solution-oriented products.

I am also an expert in building dApps

I can confidently handle this issue.
Here is my portfolio and projects I have handled:

https://jaykosai.vercel.app
https://shopwithsteez.com
https://escrowlink.vercel.app
https://ecohotels.com
https://blockheader-wallet.vercel.app/
https://nijostam.org

[RareMmemshima]

I'm a UI/UX designer with experience in using Figma as a design tool.

I understand this issue requires me to design a fully functional "Transaction Processing Modal" that is consistent with the current design and is fully responsive.

Keeping in mind the design principles, I'll make the design user friendly and intuitive whilst it carries all necessary details.

I would love to tackle this. Thank you.

[AnnetteCodes]

Hi, my name is Annette, I am a female frontend developer skilled in React, Next.js, JavaScript, and TypeScript. For this task, I will

• Design a responsive transaction processing modal with real-time updates
• Display transaction details, including ID, type, amount, and recipient
• Implement a progress indicator and controls for user interaction

I’ll ensure the modal aligns with brand guidelines and supports future extensibility

ETA: 8 hours

[Zeegaths]

Mind if I try this one?

[Luluameh]

Can I take this from here?

[Agbeleshe]

Can I start working on this?

[Cybermaxi7]

I am a software developer
I have experience building real-time, responsive modals with transaction updates. I’ll ensure it’s extensible, aligned with brand guidelines, and accessible from multiple pages. Looking forward to contributing!