added hid and visible functionality for password field.

This commit is contained in:
Pramod Mahajan 2025-04-07 17:16:18 +05:30
parent 2081b13d64
commit 8bce23d9b6
2 changed files with 53 additions and 41 deletions

View File

@ -142,8 +142,8 @@ const ReportTaskComments = ( {commentsData, closeModal} ) =>
)}
<div class="text-end my-1">
<button type="button" class="btn btn-secondary" onClick={closeModal} data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary ms-2">{ loading ? "Sending...":"Comment"}</button>
<button type="button" class="btn btn-sm btn-secondary" onClick={closeModal} data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-sm btn-primary ms-2">{ loading ? "Sending...":"Comment"}</button>
</div>
</form>

View File

@ -7,38 +7,37 @@ import AuthRepository from "../../repositories/AuthRepository";
import showToast from "../../services/toastService";
import { useForm } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import {z} from "zod"
import { z } from "zod";
const loginScheam = z.object({
username: z.string().email(),
password: z.string().min(1, { message: "Password required" }),
rememberMe: z.boolean(),
} )
});
const LoginPage = () => {
const navigate = useNavigate();
const [loading, setLoading] = useState(false);
const[hidepass,setHidepass] = useState(true)
const [hidepass, setHidepass] = useState(true);
const {register,
const {
register,
handleSubmit,
formState: { errors },
reset,
getValues } = useForm( {
getValues,
} = useForm({
resolver: zodResolver(loginScheam),
});
})
const onSubmit = async ( data ) =>
{
const onSubmit = async (data) => {
setLoading(true);
try {
let userCredential = {
username: data.username,
password:data.password
}
password: data.password,
};
const response = await AuthRepository.login(userCredential);
localStorage.setItem("jwtToken", response.data.token);
localStorage.setItem("refreshToken", response.data.refreshToken);
@ -57,8 +56,12 @@ const LoginPage = () => {
Please sign-in to your account and start the adventure
</p>
<form id="formAuthentication" className="mb-3" onSubmit={handleSubmit(onSubmit)}>
<div className="mb-3">
<form
id="formAuthentication"
className="mb-3"
onSubmit={handleSubmit(onSubmit)}
>
<div className="mb-0">
<label htmlFor="username" className="form-label">
Email or Username
</label>
@ -103,7 +106,16 @@ const LoginPage = () => {
placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
aria-describedby="password"
/>
<span class="input-group-text cursor-pointer" onClick={()=>setHidepass(!hidepass)}>{ hidepass ? <i className="bx bx-hide"></i> :<i className="bx bx-show"></i>}</span>
<span
class="input-group-text cursor-pointer"
onClick={() => setHidepass(!hidepass)}
>
{hidepass ? (
<i className="bx bx-hide"></i>
) : (
<i className="bx bx-show"></i>
)}
</span>
</div>
{errors.password && (
<div