Refactor signup hook to use environment variable for API URL and incl…

…ude credentials in fetch request
rebeljelly2147 · Feb 7, 2025 · 41ce9d9 · 41ce9d9
1 parent c690629
commit 41ce9d9
Showing 1 changed file with 71 additions and 43 deletions.
diff --git a/frontend/src/hooks/useSignup.js b/frontend/src/hooks/useSignup.js
@@ -3,53 +3,81 @@ import toast from "react-hot-toast";
 import { useAuthContext } from "../context/AuthContext";
 
 const useSignup = () => {
-	const [loading, setLoading] = useState(false);
-	const { setAuthUser } = useAuthContext();
-
-	const signup = async ({ fullName, username, password, confirmPassword, gender }) => {
-		const success = handleInputErrors({ fullName, username, password, confirmPassword, gender });
-		if (!success) return;
-
-		setLoading(true);
-		try {
-			const res = await fetch("/api/auth/signup", {
-				method: "POST",
-				headers: { "Content-Type": "application/json" },
-				body: JSON.stringify({ fullName, username, password, confirmPassword, gender }),
-			});
-
-			const data = await res.json();
-			if (data.error) {
-				throw new Error(data.error);
-			}
-			localStorage.setItem("chat-user", JSON.stringify(data));
-			setAuthUser(data);
-		} catch (error) {
-			toast.error(error.message);
-		} finally {
-			setLoading(false);
-		}
-	};
-
-	return { loading, signup };
+  const [loading, setLoading] = useState(false);
+  const { setAuthUser } = useAuthContext();
+
+  const signup = async ({
+    fullName,
+    username,
+    password,
+    confirmPassword,
+    gender,
+  }) => {
+    const success = handleInputErrors({
+      fullName,
+      username,
+      password,
+      confirmPassword,
+      gender,
+    });
+    if (!success) return;
+
+    setLoading(true);
+    try {
+      const res = await fetch(
+        `${import.meta.env.VITE_API_URL}/api/auth/signup`,
+        {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          credentials: "include",
+          body: JSON.stringify({
+            fullName,
+            username,
+            password,
+            confirmPassword,
+            gender,
+          }),
+        }
+      );
+
+      const data = await res.json();
+      if (data.error) {
+        throw new Error(data.error);
+      }
+      localStorage.setItem("chat-user", JSON.stringify(data));
+      setAuthUser(data);
+    } catch (error) {
+      toast.error(error.message);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return { loading, signup };
 };
 export default useSignup;
 
-function handleInputErrors({ fullName, username, password, confirmPassword, gender }) {
-	if (!fullName || !username || !password || !confirmPassword || !gender) {
-		toast.error("Please fill in all fields");
-		return false;
-	}
+function handleInputErrors({
+  fullName,
+  username,
+  password,
+  confirmPassword,
+  gender,
+}) {
+  if (!fullName || !username || !password || !confirmPassword || !gender) {
+    toast.error("Please fill in all fields");
+    return false;
+  }
 
-	if (password !== confirmPassword) {
-		toast.error("Passwords do not match");
-		return false;
-	}
+  if (password !== confirmPassword) {
+    toast.error("Passwords do not match");
+    return false;
+  }
 
-	if (password.length < 6) {
-		toast.error("Password must be at least 6 characters");
-		return false;
-	}
+  if (password.length < 6) {
+    toast.error("Password must be at least 6 characters");
+    return false;
+  }
 
-	return true;
+  return true;
 }