Activity page UI and timeline component styling

[greatest0fallt1me]

Description

Implement an Activity screen with a timeline component style for stream events (created, started, settled, stopped). Use mock events and provide a clean, readable layout.

Requirements and context

• Must handle empty and populated states.
• Must be readable on dark background and avoid visual clutter.

Suggested execution

git checkout -b design/activity-timeline-ui

Implementation targets

• StreamPay-Frontend/app/activity/page.tsx (new)
• StreamPay-Frontend/app/components/ActivityTimeline.tsx (new)

Tests and validation

• Tests for empty and populated renders.

Guidelines

• Timeframe: 96 hours.

Example commit message

feat(frontend): add Activity page and timeline component styles

[mitchellecm7]

@mitchellecm7 has applied to work on this issue as part of the Stellar Wave Program's 3rd wave.

This is my speciality give me a chance to work on it

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

[mikewheeleer]

@mikewheeleer has applied to work on this issue as part of the Stellar Wave Program's 3rd wave.

I would like to work on this issue, and I have good knowledge of smart contacts and Sorabani Rust. Kindly assign it to me.

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

[drips-wave]

Congratulations, @mitchellecm7! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on March 30, 2026.

🧑‍💻 @mitchellecm7: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊