added login and forgot form validation and changed server response format

src/components/Project/ProjectNav.jsx

@@ -35,7 +35,7 @@ const ProjectNav = ( {onPillClick, activePill} ) =>
               <i className="bx bx-group bx-sm me-1_5"></i> Teams
             </a>
           </li>
-          <li className={`nav-item ${HasViewInfraStructure ? "":"d-none"} `}>
+          <li className={`nav-item ${!HasViewInfraStructure && 'd-none'} `}>
             <a
               className={`nav-link ${activePill === "infra" ? "active" : ""}`}
               href="#"

src/hooks/masterHook/useMaster.js

@@ -41,6 +41,7 @@ const useMaster = () => {
               break;
             case "Job Role":
               response = await MasterRespository.getJobRole();
+              response = response.data
                 break;
             case "Module":
               response = [{description: null,module:"Module 1",featurePermission: null,id: "08dd4761-363c-49ed-8851-3d2489a3e98d"},{description: null,module:"Module 2",featurePermission: null,id: "08dy9761-363c-49ed-8851-3d2489a3e98d"},{description: null,module:"Module 3",featurePermission: null,id: "08dy7761-263c-49ed-8851-3d2489a3e98d"}];

src/hooks/useMasterRole.js

@@ -16,9 +16,9 @@ export const useMasterRole =()=>{
         if (!features_cache) {
          MasterRespository.getRoles()
            .then((response) => {
-            setMasterRole(response);
+            setMasterRole(response.data);
      
-             cacheData("masterRole", response);
+             cacheData("masterRole", response.data);
              setLoading(false)
            })
            .catch((error) => {
@@ -55,9 +55,9 @@ export const useFeatures =()=> {
         if (!features_cache) {
          MasterRespository.getFeatures()
            .then((response) => {
-            setMasterFeatures(response);
+            setMasterFeatures(response.data);
      
-             cacheData("features", response);
+             cacheData("features", response.data);
              setLoading(false)
            })
            .catch((error) => {

src/hooks/useProfile.js

@@ -18,8 +18,8 @@ export const useProfile = () =>
     {
       setLoading( true )
       let response = await AuthRepository.profile();
-      setProfile( response )
+      setProfile( response.data )
-      cacheProfileData( response )
+      cacheProfileData( response.data )
       setLoading( false );
         
     } catch ( error )

src/hooks/useProjects.js

@@ -19,9 +19,9 @@ export const useProjects =()=>{
         setLoading(true)   
         ProjectRepository.getProjectList()
         .then((response) => {
-          setProjects(response);
+          setProjects(response.data);
          
-          cacheData("projectslist", response);
+          cacheData("projectslist", response.data);
           setLoading(false);
         })
         .catch((error) => {
@@ -94,8 +94,8 @@ export const useProjectDetails =(projectId)=>{
       ProjectRepository.getProjectByprojectId(projectId)
         .then( ( response ) =>
         {
-          setProject_Details(response);
+          setProject_Details(response.data);
-          cacheData( `projectinfo-${ projectId }`, response );
+          cacheData( `projectinfo-${ projectId }`, response.data );
           setLoading(false)
         })
         .catch((error) => {

src/pages/Activities/TaskPlannng.jsx

@@ -25,22 +25,12 @@ const TaskPlannng = () => {
       if (!activities_cache) {
         ActivityeRepository.getActivities()
           .then((response) => {
-            setActivities(response);
+            setActivities(response.data);
-            cacheData("activitiesMaster", response);
+            cacheData("activitiesMaster", response.data);
           })
           .catch((error) => {
             setError("Failed to fetch data.");
           });
-        // api
-        //   .get("/api/task/activities")
-        //   .then((data) => {
-        //     setActivities(data);
-        //     dispatch(cacheApiResponse({ key: "activitiesMaster", data: data }));
-        //   })
-        //   .catch((error) => {
-        //     console.error(error);
-        //     setError("Failed to fetch data.");
-        //   });
       } else {
         setActivities(activities_cache);
       }

src/pages/authentication/ForgotPasswordPage.jsx

@@ -4,45 +4,52 @@ import { AuthWrapper } from "./AuthWrapper"
 import "./page-auth.css";
 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";
 
 
+const forgotPassSceham = z.object( {
+  email: z.string().email(),
+} )
+
 const ForgotPasswordPage = () => {
-  const [ email, setEmail ] = useState( "" );
+
   const[loding,setLoading] = useState(false)
 
-  const handleChange = (e) => {
+  const {register,
-    setEmail(e.target.value);
+    handleSubmit,
-  };
+    formState: { errors },
+    reset,
+    getValues } = useForm( {
+    resolver: zodResolver( forgotPassSceham ),
+    defaultValues: {
+      email:""
+    }
+  })
 
-  const handleSubmit = async ( e ) =>
+  const onSubmit = async (data) =>
   {
-    setLoading(true)
-    e.preventDefault();
     try
     {
-     const response = await  AuthRepository.forgotPassword({email})
+      const response = await  AuthRepository.forgotPassword(data)
       if ( response.data && response.success )
-      {
       showToast( response.message, "success" )    
-      } else
-      {   
-        showToast( response.message, "warning" )
-      }
       setLoading( false )
       setEmail("")
-    } catch ( error )
+    } catch ( err )
     {
-      showToast( "User Not Found", "error" )
+      showToast( err.response.data, "error" )
       setLoading(false)
     }
-  };
+  }
   return (
     <AuthWrapper>
       <h4 className="mb-2">Forgot Password? 🔒</h4>
       <p className="mb-4">
         Enter your email and we'll send you instructions to reset your password
       </p>
-      <form id="formAuthentication" className="mb-3" onSubmit={handleSubmit}>
+      <form id="formAuthentication" className="mb-3" onSubmit={handleSubmit(onSubmit)}>
         <div className="mb-3">
           <label htmlFor="email" className="form-label">
             Email
@@ -52,11 +59,18 @@ const ForgotPasswordPage = () => {
             className="form-control"
             id="email"
             name="email"
-            value={email}
+            {...register("email")}
-            onChange={handleChange}
             placeholder="Enter your email"
             autoFocus
           />
+           {errors.email && (
+                      <div
+                        className="danger-text text-start"
+                        style={{ fontSize: "12px" }}
+                      >
+                        {errors.email.message}
+                      </div>
+                    )}
         </div>
         <button aria-label="Click me" className="btn btn-primary d-grid w-100">
           {loding ? "Please Wait...":"Send Reset Link"}

src/pages/authentication/LoginPage.jsx

@@ -5,39 +5,40 @@ import { useNavigate } from "react-router-dom";
 import "./page-auth.css";
 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"
+
+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 [formData, setFormData] = useState({
+   const {register,
-    password: "",
+      handleSubmit,
-    username: "",
+      formState: { errors },
-    rememberMe: false,
+      reset,
-  });
+      getValues } = useForm( {
+      resolver: zodResolver( loginScheam ),
+      
+    })
 
-  const handleChange = (e) => {
+  const onSubmit = async ( data ) =>
-    const { name, value, type, checked } = e.target;
+  { 
-
-    setFormData((prevData) => ({
-      ...prevData,
-      [name]: type === "checkbox" ? checked : value,
-    }));
-  };
-
-  const handleSubmit = async ( e ) =>
-  {
-    
-    e.preventDefault();
     setLoading(true);
 
     try {
-      let data = {
+      
-        username: formData.username,
+      let userCredential = {
-        password: formData.password,
+        username: data.username,
-      };
+        password:data.password
-
+      }
-      const response = await AuthRepository.login(data);
+      const response = await AuthRepository.login(userCredential);
       localStorage.setItem("jwtToken", response.data.token);
       localStorage.setItem( "refreshToken", response.data.refreshToken );
       setLoading(false);
@@ -45,9 +46,9 @@ const LoginPage = () => {
     } catch (err) {
       console.log("Unable to proceed. Please try again.");
       setLoading(false);
-
     }
   };
+
   return (
     <AuthWrapper>
       <h4 className="mb-2">Welcome to PMS!</h4>
@@ -55,7 +56,7 @@ const LoginPage = () => {
         Please sign-in to your account and start the adventure
       </p>
 
-      <form id="formAuthentication" className="mb-3" onSubmit={handleSubmit}>
+      <form id="formAuthentication" className="mb-3" onSubmit={handleSubmit(onSubmit)}>
         <div className="mb-3">
           <label htmlFor="username" className="form-label">
             Email or Username
@@ -64,12 +65,19 @@ const LoginPage = () => {
             type="text"
             className="form-control"
             id="username"
-            value={formData.name}
+            {...register("username")}
-            onChange={handleChange}
             name="username"
             placeholder="Enter your email or username"
             autoFocus
           />
+           {errors.username && (
+                      <div
+                        className="danger-text text-start"
+                        style={{ fontSize: "12px" }}
+                      >
+                        {errors.username.message}
+                      </div>
+                    )}
         </div>
         <div className="mb-3 form-password-toggle">
           <div className="d-flex justify-content-between">
@@ -88,8 +96,7 @@ const LoginPage = () => {
               type="password"
               autoComplete="true"
               id="password"
-              value={formData.password}
+              {...register("password")}
-              onChange={handleChange}
               className="form-control"
               name="password"
               placeholder="&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;&#xb7;"
@@ -97,6 +104,14 @@ const LoginPage = () => {
             />
             <span className="input-group-text cursor-pointer"></span>
           </div>
+          {errors.password && (
+                      <div
+                        className="danger-text text-start"
+                        style={{ fontSize: "12px" }}
+                      >
+                        {errors.password.message}
+                      </div>
+                    )}
         </div>
         <div className="mb-3">
           <div className="form-check">
@@ -105,8 +120,7 @@ const LoginPage = () => {
               type="checkbox"
               id="remember-me"
               name="rememberMe"
-              checked={formData.rememberMe}
+              {...register("rememberMe")}
-              onChange={handleChange}
             />
             <label className="form-check-label" htmlFor="remember-me">
               {" "}

src/pages/project/ProjectDetails.jsx

@@ -35,8 +35,8 @@ const ProjectDetails = () => {
       if (!activities_cache) {
         ActivityeRepository.getActivities()
           .then((response) => {
-            setActivities(response);
+            setActivities(response.data);
-            cacheData("activitiesMaster", response);
+            cacheData("activitiesMaster", response.data);
           })
           .catch((error) => {
             setError("Failed to fetch data.");
@@ -55,9 +55,9 @@ const ProjectDetails = () => {
         ProjectRepository.getProjectByprojectId(projectId)
           .then( ( response ) =>
           {
-            setProjectDetails(response);
+            setProjectDetails(response.data);
-            setProject(response);
+            setProject(response.data);
-            cacheData( `projectinfo-${ projectId }`, response );
+            cacheData( `projectinfo-${ projectId }`, response.data );
             setLoading(false)
           })
           .catch((error) => {

src/pages/project/ProjectList.jsx

@@ -118,11 +118,7 @@ const ProjectList = () =>
             {" "}
             <button
               type="button"
-              className={`btn btn-sm btn-primary ${
+              className={`btn btn-sm btn-primary ${!HasManageProject && 'd-none' }`}
-                HasManageProject
-                  ? ""
-                  : "d-none"
-              }`}
               data-bs-toggle="modal"
               data-bs-target="#create-project-model"
               onClick={handleShow}

src/slices/localVariablesSlice.jsx

@@ -5,7 +5,7 @@ const localVariablesSlice = createSlice({
   initialState: {
     selectedMaster:"Role",
     regularizationCount:0,
-    projectId:5,
+    projectId:1,
   
   },
   reducers: {

src/utils/constants.jsx

@@ -5,6 +5,8 @@ export const MANAGE_MASTER = "588a8824-f924-4955-82d8-fc51956cf323";
 
 export const MANAGE_PROJECT = "172fc9b6-755b-4f62-ab26-55c34a330614"
 
+export const VIEW_PROJECTS = "6ea44136-987e-44ba-9e5d-1cf8f5837ebc"
+
 export const MANAGE_EMPLOYEES = "a97d366a-c2bb-448d-be93-402bd2324566"
 
 export const MANAGE_PROJECT_INFRA = "f2aee20a-b754-4537-8166-f9507b44585b"