Frontend Integration: Fetch Dashboard Data from Backend API

[ogazboiz]

Update the User Dashboard to fetch the user's active and incoming streams using the recently merged Backend API endpoints (GET /api/v1/streams), replacing the current mock data.

[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

[DIFoundation]

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

I’ve worked on replacing mock data with production API integrations in React/Next.js dashboards. I can wire the User Dashboard to GET /api/v1/streams, handle loading/empty states properly, and ensure clean state management for active and incoming streams. This will move the dashboard from prototype to production-ready data flow.

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

[olathedev]

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

Hello Maintainer, i would love to work on this.

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

[OluwapelumiElisha]

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

Hello Maintainers,

I would like to work on issue #177 – Update User Dashboard to fetch streams from Backend API in the FlowFi repository.

The task involves replacing the current mock data on the dashboard with real data from the newly merged backend endpoint GET /api/v1/streams. The dashboard should display the user’s active and incoming streams accurately based on authenticated session data.

Implementation Plan:

Replace mock data with an API call to GET /api/v1/streams using useEffect or an appropriate data-fetching strategy.

Ensure authenticated requests include required headers/tokens.

Properly handle loading, empty, and error states.

Map API response data to the existing dashboard UI components without breaking layout.

Ensure reactivity so updates reflect correctly when stream data changes.

Maintain clean separation between data logic and UI components.

I will also verify type safety (if using TypeScript), ensure consistent formatting of stream values (amount, duration, status), and test edge cases such as users with no streams.

I have experience integrating frontend dashboards with backend APIs using Next.js, TypeScript, and RESTful endpoints, and I will ensure the implementation is clean, reliable, and production-ready.

Please assign this issue to me.

Best regards,
Elisha

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

[CMI-James]

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

Can I take on this issue ?
ETA: 6 hours.

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

[drips-wave]

Congratulations, @CMI-James! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on February 26, 2026.

🧑‍💻 @CMI-James: 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 issued 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 🌊

[drips-wave]

This issue has been completed by @CMI-James as part of the Stellar Wave Program's 2nd Wave 🥳

😎 @CMI-James: You earned 200 Points for completing this issue! After the current Wave ends, you'll be eligible for a percentage of the Wave's reward pool based on the percentage of total points you've earned. Learn more here. You can also Leave a review to share your experience working on this issue.

🧑‍💻 Repo maintainers: How'd the contributor do? Leave a review to share your experience working with them.