Add view password functionality to login form

[princekumarg12]

Resolves #4671

Description

This change implements an "eyeball" icon functionality on the login page, allowing users to toggle password visibility. This feature aims to improve user experience by enabling users to confirm their password entry, reducing login errors due to typos.

This solution balances usability with security, ensuring the password is hidden by default.

No additional dependencies are required for this change.

Type of change

• New feature (non-breaking change which adds functionality)

How Has This Been Tested?

I implemented unit tests to verify the password toggle functionality:

• Confirmed that clicking the "eyeball" icon switches the password field from masked to visible.
• Verified the icon changes correctly between eye and eye-slash states.

[cielf]

Functionality looks fine

[dorner]

Can we package this into a Stimulus controller? That's the way we want to encourage sprinkling JavaScript into our pages. You can see an example here: https://github.com/rubyforgood/human-essentials/blob/8839e19eb67ed92fb4c96fa7a98beab2ddf9e09f/app/javascript/controllers/highchart_controller.js#L32-L32 and it's used

human-essentials/app/views/shared/_highcharts.html.erb

Line 4 in 8839e19

<button type="button" class="btn btn-sm btn-secondary" data-action="click->highchart#selectAll">Select All</button>

[princekumarg12]

Hi Dorner,
I've refactored the password toggle into a Stimulus controller as requested. It’s now encapsulated neatly in the password_visibility_controller.js, making our JS integration more structured.

[dorner]

Also, erb lint is failing - see above.

[dorner]

Awesome, thanks!

[github-actions]

@princekumarg12: Your PR Add view password functionality to login form is part of today's Human Essentials production release: 2024.10.13.
Thank you very much for your contribution!