Frontend: Wallet Account Header Dropdown

[johdanike]

📁 Implementation Directory

components/wallet/AccountMenu.tsx

🎯 Goal

Quick access to wallet status in header.

📋 Requirements

• Truncated display of public key
• Copy address button
• Disconnect button

🔧 Technical Scope

• Tailwind / Headless UI

🌿 Branch

git checkout -b feat/wallet-menu

✅ Acceptance Criteria

- Dropdown must be keyboard accessible and close on outside click

    Strict Layered Architecture: Implement using the Component -> Hook -> Service pattern

    Data Source: Response data must be retrieved from the backend API. No Inline Mock Objects

    Screenshot of all implementations must be included in PR

    AI-generated PR submissions are strictly disallowed

    Closes #[issue_id] with a work summary included in the PR body

    Note a default in any of this will result to issue not being closed nor merged

📌 PR Requirements

    ⚠️ Assignment is required before starting — comment to request assignment

    PR must comply fully with CONTRIBUTING.md [CONTRIBUTING.md](../CONTRIBUTING.md)

    AI Agent submissions are DISALLOWED and will be closed without review

    Upload a screenshot showing all unit tests passing or API response

    PR description must include: Closes #[issue_id] and a brief summary of work done

💬 Example Commit
Plaintext

feat(wallet): create wallet account dropdown menu

[coderolisa]

@coderolisa has applied to work on this issue as part of the Stellar Wave Program's 4th wave.

Hello maintainer i would like to work on this issue please assign

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

[legend4tech]

@legend4tech has applied to work on this issue as part of the Stellar Wave Program's 4th wave.

Hi am legend4tech a fullstack developer, and a top Open source Contributor (former Fellow at onlydust) I will love to work on this issue. Looking forward to be assigned.

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

[Salmatcre8]

@Salmatcre8 has applied to work on this issue as part of the Stellar Wave Program's 4th wave.

I’d like to request assignment for this issue. Providing a seamless wallet management interface in the header is a key UX requirement, and I’m ready to implement the AccountMenu according to the project’s strict architectural standards.

My implementation plan includes:

Service Layer: I will ensure the wallet state (public key and connection status) is synchronized with a dedicated service layer, ensuring no inline mocks are used for the data source.

Hook Layer: I’ll implement a custom hook to manage the truncation logic, 'Copy to Clipboard' functionality, and the disconnect flow.

UI Component: I’ll build the AccountMenu.tsx using Headless UI to ensure the dropdown is fully keyboard accessible (WAI-ARIA compliant) and closes automatically on outside clicks.

Strict Compliance: I will strictly follow the Component -> Hook -> Service pattern and acknowledge the restriction on AI-generated PRs. I will provide a manual work summary, required screenshots of the implementation, and proof of passing unit tests.

I’m ready to start once assigned. Please assign this to me!

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

[BigNathan1]

@BigNathan1 has applied to work on this issue as part of the Stellar Wave Program's 5th wave.

Hello, i would kindly like to work on this issue

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

[drips-wave]

Congratulations, @BigNathan1! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 2, 2026.

🧑‍💻 @BigNathan1: 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 🌊