[Feature]: Build Authentication UI (Wallet Connect Page)

[SudiptaPaul-31]

🔍 Problem Statement

🔑 Feature: Build Authentication UI (Wallet Connect Page)

📖 Description

Create a dedicated authentication page that supports Stellar wallet (Freighter) connection. This page will serve as the entry point for users to connect, disconnect, and manage their wallet sessions securely.

Expected Behavior

• Connect / Disconnect button: Allow users to connect or disconnect their Stellar wallet easily.
• Display connected address: Show the wallet address in a shortened format (e.g., GABC...XYZ).
• Error handling: Provide clear feedback when connection fails (e.g., “Unable to connect wallet. Please try again.”).
• Persist session state: Maintain wallet connection state across page reloads and sessions.

🛠 Technical Notes

• Integrate with Freighter wallet SDK for connection and signature handling.
• Ensure session persistence using JWTs or local storage.
• Maintain dark/minimal UI styling consistent with the rest of the app.
• Responsive design should be preserved across devices.
• Handle edge cases such as rejected connection requests or invalid signatures.

✅ Acceptance Criteria

• Connect/Disconnect button works as expected.
• Connected wallet address is displayed in shortened format.
• Connection errors are surfaced with clear messages.
• Session state persists across reloads.
• npm run lint and npm run build succeed.
• No regression in existing chat, navigation, or wallet features.

📈 Expected Impact

High — Would significantly improve user experience

[drips-wave]

This issue has been added to the Stellar Wave Program and is worth 150 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

[shaaibu7]

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

Can i work on this?

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

[chibokaxavier]

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

I’m Xavier, a full-stack developer with extensive experience in building Stellar-based applications and secure wallet integration flows. I’m applying to build the Authentication UI (Wallet Connect Page) for TaskChain.

Seamless Wallet Integration: I’ll integrate the Freighter SDK to handle secure connections and signature requests, implementing a reactive "Connect/Disconnect" flow that provides real-time feedback for session management.

Persistent & Secure Sessions: My solution focuses on maintaining state across reloads using local storage or JWTs, ensuring the shortened wallet address (e.g., GABC...XYZ) is always accessible to the user without redundant prompts.

Robust UX & Error Handling: I will build a dark, minimal UI that handles edge cases—like rejected signatures or missing extensions with clear, helpful error messages, all while ensuring the design is fully responsive and lint-clean.

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

[drips-wave]

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

🧑‍💻 @chibokaxavier: 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 @chibokaxavier as part of the Stellar Wave Program's 2nd Wave 🥳

😎 @chibokaxavier: You earned 150 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.