Merge pull request #796 from melpsh/56-Feb-10-Password-change

Fixed the error on the change Password page
bluewave-labs · Feb 20, 2025 · 614f30d · 614f30d
2 parents 9aa9534 + 15be9d7
commit 614f30d
Showing 1 changed file with 57 additions and 97 deletions.
diff --git a/Clients/src/presentation/pages/SettingsPage/Password/index.tsx b/Clients/src/presentation/pages/SettingsPage/Password/index.tsx
@@ -58,39 +58,39 @@ const PasswordForm: React.FC = () => {
   });
 
   // Fetch current user password on component mount
-  useEffect(() => {
-    const fetchUserPassword = async () => {
-      setLoading(true);
-      try {
-        const response = await getEntityById({ routeUrl: `/users/${id}` });
-        console.log("response , PasswordForm : ", response);
-        setCurrentPassword(
-          response.data.password_hash ? "••••••••••••••••••••••••" : ""
-        );
-      } catch (error) {
-        logEngine({
-          type: "error",
-          message: "Failed to fetch user password.",
-          user: {
-            id: String(localStorage.getItem("userId")) || "N/A",
-            email: "N/A",
-            firstname: "N/A",
-            lastname: "N/A",
-          },
-        });
-        setAlert({
-          variant: "error",
-          title: "Error",
-          body: "Failed to fetch user password.",
-          isToast: true,
-          visible: true,
-        });
-      } finally {
-        setLoading(false);
-      }
-    };
-    fetchUserPassword();
-  }, []);
+  // useEffect(() => {
+  //   const fetchUserPassword = async () => {
+  //     setLoading(true);
+  //     try {
+  //       const response = await getEntityById({ routeUrl: `/users/${id}` });
+  //       console.log("response , PasswordForm : ", response);
+
+  //     } catch (error) {
+  //       logEngine({
+  //         type: "error",
+  //         message: "Failed to fetch user password.",
+  //         user: {
+  //           id: String(localStorage.getItem("userId")) || "N/A",
+  //           email: "N/A",
+  //           firstname: "N/A",
+  //           lastname: "N/A",
+  //         },
+  //       });
+
+
+  //       setAlert({
+  //         variant: "error",
+  //         title: "Error",
+  //         body: "Failed to fetch user password.",
+  //         isToast: true,
+  //         visible: true,
+  //       });
+  //     } finally {
+  //       setLoading(false);
+  //     }
+  //   };
+  //   fetchUserPassword();
+  // }, []);
 
   // Handle current password validation
   const handleCurrentPasswordChange = useCallback(
@@ -151,81 +151,42 @@ const PasswordForm: React.FC = () => {
 
   // Handle save
   const handleSave = useCallback(async () => {
+    setCurrentPasswordError(null);
+    setNewPasswordError(null);
+    setConfirmPasswordError(null);
+
+    const validation = checkStringValidation("New password", newPassword, 8, 128, true, true, true, true);
+    if (!validation.accepted) {
+      setNewPasswordError(validation.message);
+      return;
+    }
+
+    if (newPassword !== confirmPassword) {
+      setConfirmPasswordError("Passwords do not match");
+      return;
+    }
+
     try {
-      if (currentPasswordError || newPasswordError || confirmPasswordError) {
-        logEngine({
-          type: "error",
-          message: "Validation errors occurred while updating password.",
-          user: {
-            id: String(localStorage.getItem("userId")) || "N/A",
-            email: "N/A",
-            firstname: "N/A",
-            lastname: "N/A",
-          },
-        });
-        setAlert({
-          variant: "error",
-          title: "Error",
-          body: "Validation errors occurred while updating password.",
-          isToast: true,
-          visible: true,
-        });
-        return;
-      }
+      await updateEntityById({ routeUrl: `/users/${id}`, body: { currentPassword, newPassword } });
 
-      // const userId = localStorage.getItem("userId") || "1";
-      const updatedPassword = {
-        currentPassword,
-        newPassword,
-        confirmPassword,
-      };
+      setCurrentPassword("");
+      setNewPassword("");
+      setConfirmPassword("");
 
-      await updateEntityById({
-        routeUrl: `/users/1`,
-        body: updatedPassword,
-      });
-      setAlert({
-        variant: "success",
-        title: "Success",
-        body: "Password updated successfully.",
-        isToast: true,
-        visible: true,
-      });
-      setIsConfirmationModalOpen(false);
+      setAlert({ variant: "success", title: "Success", body: "Password updated successfully.", isToast: true, visible: true });
     } catch (error) {
-      logEngine({
-        type: "error",
-        message: "An error occurred while updating the password.",
-        user: {
-          id: String(localStorage.getItem("userId")) || "N/A",
-          email: "N/A",
-          firstname: "N/A",
-          lastname: "N/A",
-        },
-      });
-      setAlert({
-        variant: "error",
-        title: "Error",
-        body: "Failed to update password. Please try again.",
-        isToast: true,
-        visible: true,
-      });
+      setAlert({ variant: "error", title: "Error", body: "Failed to update password. Please try again.", isToast: true, visible: true });
     }
-  }, [
-    currentPassword,
-    newPassword,
-    confirmPassword,
-    currentPasswordError,
-    newPasswordError,
-    confirmPasswordError,
-  ]);
+  }, [currentPassword, newPassword, confirmPassword]);
+
 
   const handleCloseConfirmationModal = useCallback(() => {
     setIsConfirmationModalOpen(false);
   }, []);
 
   const handleConfirmSave = useCallback(() => {
     handleSave();
+    setIsConfirmationModalOpen(false);
   }, [handleSave]);
 
   const isSaveDisabled =
@@ -274,7 +235,6 @@ const PasswordForm: React.FC = () => {
             onChange={handleCurrentPasswordChange}
             type="password"
             sx={{ mb: 5, backgroundColor: "#FFFFFF" }}
-            disabled
           />
           {currentPasswordError && (
             <Typography color="error" variant="caption">