Skip to content

feat(ui): add accessible show/hide password toggle on signin#6098

Open
sahil2448 wants to merge 1 commit intoFlowiseAI:mainfrom
sahil2448:feature/signin-password-visibility-toggle
Open

feat(ui): add accessible show/hide password toggle on signin#6098
sahil2448 wants to merge 1 commit intoFlowiseAI:mainfrom
sahil2448:feature/signin-password-visibility-toggle

Conversation

@sahil2448
Copy link
Copy Markdown
Contributor

Related Issue

Fixes #6097

What this PR does

This PR adds a “View Password” toggle to the signin password field so users can reveal or hide their password while typing.

In simple terms, users can click or tap an eye icon to check what they typed, then hide it again before submitting.

Why this change

The password was always masked before, which made typo detection difficult, especially on mobile, with complex passwords, or for accessibility-related input needs.

This update reduces avoidable login failures and user frustration.

Scope of changes

  • Added optional password visibility toggle support in the shared input component:
    • Input.jsx
  • Enabled the toggle only on the signin password field:
    • signIn.jsx

Behavior implemented

  • Default password state is hidden (type="password").
  • Clicking/tapping the eye icon toggles to visible (type="text").
  • Clicking/tapping again toggles back to hidden.
  • Current input value is preserved.
  • Cursor/selection is preserved when toggling visibility.
Screen.Recording.2026-03-31.191558.mp4

Accessibility

  • Added dynamic aria-label for screen readers.
  • Kept the toggle as a native focusable button control.
  • Prevented focus loss on mouse down to preserve typing flow.

Regression risk

Low.

The new behavior is opt-in via enablePasswordToggle, and only signin currently enables it.

No backend, API, or auth logic was changed.

Copy link
Copy Markdown
Contributor

@gemini-code-assist gemini-code-assist bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces management actions for Document Stores, enabling users to rename and delete stores from both card and table views. It also adds a password visibility toggle to the shared Input component and implements it on the sign-in page. The changes include permission-based access control for these new actions and local state management to prevent unnecessary UI flickering during updates. A review comment suggests improving the error message extraction logic to safely handle null response data.

@HenryHengZJ HenryHengZJ requested a review from 0xi4o April 1, 2026 16:54
@sahil2448 sahil2448 force-pushed the feature/signin-password-visibility-toggle branch from fb9ceca to 5021a35 Compare April 2, 2026 13:44
@sahil2448 sahil2448 requested a review from 0xi4o April 2, 2026 13:55
@sahil2448
Copy link
Copy Markdown
Contributor Author

sahil2448 commented Apr 2, 2026

Thanks for the review and follow-up; i have now separated and cleaned both PRs by scope: the rename/delete feedback was fixed in the docstore PR (imports cleaned, useApi kept correctly, and delete flow updated to DeleteDocStoreDialog), and the signin PR now contains only the password visibility toggle changes, so both PRs are independent and clean—please review each PR against its respective issue.

@0xi4o
Copy link
Copy Markdown
Contributor

0xi4o commented Apr 3, 2026

@sahil2448 Thanks for splitting it into two PRs. Approved.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add "View Password" Toggle to Sign-In Page Password Field

2 participants