[Frontend] Create Stream page form fields have no label/htmlFor (Recipient/Token/Amount/Duration)

[ogazboiz]

Join the discussion on Telegram

Why this matters

frontend/src/app/streams/create/page.tsx uses unattached <label> elements above each form control — they're styled like labels but have no htmlFor, and the inputs/selects have no id. Screen readers can't pair them.

Affected blocks:

• Lines 113-123: "Recipient Address" label + input
• Lines 128-139: "Token" label + select
• Lines 142-164: "Total Amount" label + input
• Lines 168-180: "Duration (Days)" label + input

This page is one of the two main entry points for stream creation (the other being the modal Wizard, which already has proper htmlFor on its sub-steps).

Acceptance criteria

• Add an id to each control (e.g. recipient, create-stream-token, create-stream-amount, create-stream-duration)
• Add the matching htmlFor on each <label>
• No visual change

Files to touch

• frontend/src/app/streams/create/page.tsx (lines 113-180)

Out of scope

• Restructuring the page's form layout

[Anuoluwapo25]

Hi maintainer, I’d love to work on this issue. I have experience improving frontend accessibility in React apps.

[SharifIbrahimDev]

Hi, I'd like to work on this issue.

I have experience building accessible React applications and improving form usability. I can add proper id and htmlFor associations to the Recipient Address, Token, Total Amount, and Duration fields without affecting the existing layout or styling.

I will deliver a small, clean change that improves accessibility and ensures screen readers can correctly associate labels with their corresponding form controls while keeping the UI unchanged.

[MoscowDev]

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

I’d love to take this issue on. I’ve worked on production-ready applications and collaborated extensively through GitHub workflows. I’ll dig into the current setup, implement a solid and reliable fix, and deliver a well-tested PR. My focus is on clean, maintainable code and fast, dependable delivery.

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

[T-kesh]

@T-kesh has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

Please assign me

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

[Banx17]

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

Please assign this issue to me, thanks.

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

[elcabasa]

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

Hi team,

I would like to take on this issue! Ensuring that the form inputs are accessible via screen readers is highly important, especially since this is one of the primary entry points for creating streams.

I will update the form elements in frontend/src/app/streams/create/page.tsx according to the exact acceptance criteria:

• Accessibility Linking: Add explicit matching id and htmlFor pairings to the four affected blocks (Recipient Address, Token, Total Amount, and Duration).
• Design Integrity: Maintain the existing layout with absolutely zero visual changes.
• Isolated Scope: Restructure nothing outside of standard input-label pairings, keeping the overall page layout exactly as it is.

Could you please assign this issue to me? Thanks!

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

[uche102]

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

Hi maintainer I would love to work on this

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

[grantfox-oss]

🦊 GrantFox — @T-kesh has been assigned to this issue!

Next steps:

1. Open a Pull Request referencing this issue (e.g., Closes #631)
2. Your PR will be reviewed by the LabsCrypt maintainers

Good luck! Track your progress on GrantFox.

[drips-wave]

Congratulations, @T-kesh! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 30, 2026.

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