[FEATURE] Add Show Password Option

[AhmedKarray005]

Describe the bug

When a user enters an incorrect password in the password field, the field does not automatically clear itself. Instead, the incorrect password remains in the field until manually deleted by the user.

To Reproduce

Navigate to the login page.
Enter an incorrect password in the password field.
Observe that the incorrect password remains in the field.

Expected Behavior

After entering an incorrect password, the password field should automatically clear itself, ready for the user to re-enter their password without having to manually delete the incorrect input.

Screenshot/ Video

No response

Code of Conduct

• I agree to follow this project's Code of Conduct

[github-actions]

It's great having you contribute to this project

🌟 Welcome to the community 🌟

• If you would like to continue contributing to open source and would like to do it with an awesome inclusive community.
• You should join our Discord chat and our GitHub Organisation.
• We help and encourage each other to contribute to open source little and often 😄.
• Any questions let us know.

[ArkadiK94]

@AhmedKarray005 If we would have "show password" it is not relevant.

@kabir0x23 what do you think?

[AhmedKarray005]

so you want to add the show password functionality + fixing the bug I told u about?

[ArkadiK94]

@AhmedKarray005 You don't need to clear input if we have show password so the user could change typo and so on.
Let's wait @kabir0x23 to hear his opinion

[AhmedKarray005]

@kabir0x23 ??

[AhmedKarray005]

@kabir0x23

[kabir0x23]

hey @AhmedKarray005 @ArkadiK94 sorry for the late response

You don't need to clear input if we have show password so the user could change typo and so on.

this one is also a good option

about clearing password

if user keep entering wrong password, it will lock their account for 30mins
example user is using caps lock without knowingly.

[kabir0x23]

i thhink this is better option

You don't need to clear input if we have show password so the user could change typo and so on.

[ArkadiK94]

@AhmedKarray005 I changed the title, to add show password button, would you like to handle it?
Don't remove the incorrect password on wrong submission.

[AhmedKarray005]

@ArkadiK94 yes i would like to

[AhmedKarray005]

@ArkadiK94

2024-05-16.00-19-33.mp4

[AhmedKarray005]

@ArkadiK94

[ArkadiK94]

@AhmedKarray005 I think it is better to add some margin bottom to emphasize that this related to the password input box. Beside it, looks great thanks. Could you open a pr?

[kabir0x23]

https://react-icons.github.io/react-icons/ u can get icons from here

and u can add in same like

password input show hide icon

import { BiHide,BiShowAlt } from "react-icons/bi";
<BiHide />
<BiShowAlt />

[AhmedKarray005]

@kabir0x23 @ArkadiK94

2024-05-19.14-58-32.mp4

[AhmedKarray005]

@ArkadiK94 i create a pr?

[ArkadiK94]

@AhmedKarray005 yes, even though, I am not sure of the icons. I think when you see the password the eye should be without cross and the opposite.

[ArkadiK94]

@kabir0x23 I need to look for similar examples. Do you know which way is correct? Of the icons?

[kabir0x23]

i think it's fine,

example

[ArkadiK94]

I found example :)
I don't know haha very hard question, who is right

Recording.2024-05-19.213622.mp4

[kabir0x23]

yes in facebook, it is showing what is there

in my example and his pr, it is about what to do

on buttons we do that task

here

arrow is above, when we click, it will bring the tab and icon will be down after words

without getting confused, it's fine for now, will it decide later

[kabir0x23]

example of linkedin,

show means open eye
hide means crossed eye

[ArkadiK94]

@kabir0x23 ok great, @AhmedKarray005 yes please open the pr

[ArkadiK94]

@AhmedKarray005 is it ok the someone else will work on it? I saw that someone opened new pr