Design: My Predictions & Transaction History Page

[greatest0fallt1me]

Description
Design the personal history page: user’s predictions and transaction history in one place.

Requirements and context

• Reference: My Predictions & Transaction History — https://www.figma.com/design/0WWKE7970cnVtuuTFv8lSI/Predictify?node-id=348-737&m=draw
• Tabs/sections: “My Predictions” (active, pending, completed) and “Transaction history” (wallet inflows/outflows).
• Predictions: List/cards with event name, stake, odds, status (active/pending/won/lost), potential winnings.
• Stats (optional): Total wagered, total won, total lost, net profit.
• Filters: e.g. status, date range.
• Theme: Tables or cards; status badges; clear typography for amounts.

Design deliverables

• My Predictions view: list/cards + filters + stats
• Transaction history view: list with date, type, amount, status
• Empty states for both
• Desktop and mobile

Current implementation reference: app/(dashboard)/mypredictions/page.tsx

[drips-wave]

This issue has been added to the Stellar Wave Program and is worth 200 Points.

🧑‍💻 Interested in contributing? Apply to work on this issue on Drips Wave, earn points, and receive rewards.

Warning

Only applications submitted via the apply link above will be considered. Please do not apply by commenting on the issue or opening a PR directly.

🤠 Repo maintainers: You can manage this issue's Points and Complexity on your Maintainer Dashboard here. Please keep an eye on applications and respond quickly 💙

ℹ️ Learn more about Drips Wave

[Emmzyemms]

@Emmzyemms has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

I’d like to work on this frontend issue. I have experience with Web3 UI integration, wallet connections, and responsive React-based interfaces.
I can start immediately. Thanks!

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Emmzyemms to this issue.

[DanielEmmanuel1]

@DanielEmmanuel1 has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

Hi team,
I'd love to be assigned this issue. I have strong experience building highly immersivee and scalable frontend UIs. Please assign this issue to me!

ℹ️ Repo Maintainers: To accept this application, review their application or assign @DanielEmmanuel1 to this issue.

[blessme247]

@blessme247 has applied to work on this issue as part of the Stellar Wave Program's 2nd wave.

I would like to work on this issue

ℹ️ Repo Maintainers: To accept this application, review their application or assign @blessme247 to this issue.