Merge branch 'Nagarjuna0033:main' into main

src/App.js

@@ -1,4 +1,5 @@
-import { useState, useEffect } from "react";
+import { useState } from "react";
+import { useNavigate } from "react-router-dom";
 import Dashboard from "./pages/Dashboard";
 import ComplaintAnalytics from "./pages/ComplaintAnalytics";
 import OverAllAnalytics from "./pages/OverAllAnalytics";
@@ -17,54 +18,50 @@ import EditProfile from "./pages/EditProfile";
 import ChangeMesses from "./pages/ChangeMesses";
 import Assign from "./pages/Assign";
 import { auth } from "./firebaseUtils/firebaseConfig";
-import DetailsModel from "./components/DetailsModal";
-import { onAuthStateChanged } from "firebase/auth";
+// import DetailsModel from "./components/DetailsModal";
+// import { onAuthStateChanged } from "firebase/auth";
 import { toast, ToastContainer } from "react-toastify";
-import { LoginPrompt } from "./components/LoginPrompt";
 import SendNotice from "./pages/SendNotice";
+import { signInWithPopup, GoogleAuthProvider } from "firebase/auth";
+import { isInDb } from "./firebaseUtils/getRequests";
+const provider = new GoogleAuthProvider();
 
 function App() {
-  const [shouldShowDetailsModel, setShouldShowDetailsModel] = useState(false);
+  // const [shouldShowDetailsModel, setShouldShowDetailsModel] = useState(false);
   const [user, setUser] = useState(false);
-  const [showLoginPrompt, setShowLoginPrompt] = useState(false);
+  const navigate = useNavigate();
 
-  useEffect(() => {
-    const unsubscribe = onAuthStateChanged(auth, (user) => {
-      if (user) {
-        const detailsIncomplete = localStorage.getItem("details") === "false";
-        setShouldShowDetailsModel(detailsIncomplete);
-        toast.success("succsesfully logged in");
-      } else {
-        setShouldShowDetailsModel(false);
-        setUser(false);
-      }
-    });
+  const handleUserLogin = async () => {
+    try {
+      const result = await signInWithPopup(auth, provider);
+      const credential = GoogleAuthProvider.credentialFromResult(result);
+      // eslint-disable-next-line no-unused-vars
+      const token = credential.accessToken;
+      const user = result.user;
 
-    return () => {
-      unsubscribe();
-    };
-  }, []);
-
-  useEffect(() => {
-    const interval = setInterval(() => {
-      if (user) {
-        setShowLoginPrompt(true);
+      const check = await isInDb(user.uid);
+      setUser(user);
+      toast.success("Successfully logged in");
+      if (check) {
+        localStorage.setItem("details", "true");
+      } else {
+        localStorage.setItem("details", "false");
       }
-    }, 30000);
-
-    return () => clearInterval(interval);
-  }, [user]);
-
+      localStorage.setItem("id", user.uid);
+      navigate("/");
+    } catch (error) {
+      console.log("error", error.code, "error msg: ", error.message);
+    }
+  };
   return (
     <div>
       <ToastContainer />
-      {shouldShowDetailsModel && (
+      {/* {shouldShowDetailsModel && (
         <DetailsModel
           open={shouldShowDetailsModel}
           onClose={() => setShouldShowDetailsModel(false)}
         />
-      )}
-      {showLoginPrompt && <LoginPrompt />}
+      )} */}
       <Routes>
         <Route path="/" element={<Dashboard />}>
           <Route path="/" element={<Home />} />
@@ -87,9 +84,12 @@ function App() {
           <Route path="/profile" element={<Profile />} />
           <Route path="/edit-profile" element={<EditProfile />} />
           <Route path="/Assign" element={<Assign />} />
-          <Route path="/SendNotice" element={<SendNotice user={user}/>} />
+          <Route path="/SendNotice" element={<SendNotice user={user} />} />
         </Route>
-        <Route path="/Auth/Login" element={<SignIn />} />
+        <Route
+          path="/Auth/Login"
+          element={<SignIn handleLogin={handleUserLogin} />}
+        />
       </Routes>
     </div>
   );

src/components/SignInCard.js

@@ -6,7 +6,6 @@ import Typography from "@mui/material/Typography";
 import { styled } from "@mui/material/styles";
 import GoogleIcon from "@mui/icons-material/Google";
 import logo from "../images/rguktLogo.png";
-import { handleUserLogin } from "../firebaseUtils/login";
 import { toast } from "react-toastify";
 const Card = styled(MuiCard)(({ theme }) => ({
   display: "flex",
@@ -26,10 +25,10 @@ const Card = styled(MuiCard)(({ theme }) => ({
   }),
 }));
 
-export default function SignInCard() {
-  const handleLogin = async () => {
+export default function SignInCard({ handleLogin }) {
+  const handleUserLogin = async () => {
     try {
-      await handleUserLogin();
+      await handleLogin();
     } catch (error) {
       toast.error("Failed to login");
     }
@@ -56,7 +55,7 @@ export default function SignInCard() {
           <Button
             fullWidth
             variant="contained"
-            onClick={handleLogin}
+            onClick={handleUserLogin}
             startIcon={<GoogleIcon />}
           >
             Sign in with Google

src/firebaseUtils/login.js

@@ -1,7 +1,6 @@
 import { signInWithPopup, GoogleAuthProvider } from "firebase/auth";
 import { auth } from "../firebaseUtils/firebaseConfig";
 import { isInDb } from "../firebaseUtils/getRequests";
-
 const provider = new GoogleAuthProvider();
 const handleUserLogin = async () => {
   try {
@@ -18,8 +17,8 @@ const handleUserLogin = async () => {
     } else {
       localStorage.setItem("details", "false");
     }
+    localStorage.setItem("id", user.uid);
     window.history.replaceState(null, "", "/");
-    window.location.href = "/";
   } catch (error) {
     console.log("error", error.code, "error msg: ", error.message);
   }

src/firebaseUtils/logout.js

@@ -6,6 +6,7 @@ const logoutUser = () => {
     .then(() => {
       localStorage.removeItem("currentUser");
       localStorage.removeItem("details");
+      localStorage.removeItem("id");
     })
     .catch((error) => {
       "error in logging out user";

src/pages/EditProfile.js

@@ -6,24 +6,54 @@ import MenuItem from "@mui/material/MenuItem";
 import FormControl from "@mui/material/FormControl";
 import Select from "@mui/material/Select";
 import { auth } from "../firebaseUtils/firebaseConfig";
-import { updateUser } from "../firebaseUtils/createDoc";
+import { createUser, updateUser } from "../firebaseUtils/createDoc";
 import { useNavigate } from "react-router-dom";
+import { getUserInfo } from "../firebaseUtils/getRequests";
+import { onAuthStateChanged } from "firebase/auth";
 const EditProfile = () => {
   const location = useLocation();
   const navigate = useNavigate();
   console.log(location.state);
-  const [profile, setProfile] = useState(location.state || {});
+  const [profile, setProfile] = useState(null);
+  const [user, setUser] = useState(null);
+  console.log("profile", profile);
+
+  React.useEffect(() => {
+    const unsubscribe = onAuthStateChanged(auth, async (user) => {
+      console.log(user);
+      if (user) {
+        setUser(user);
+        const res = await getUserInfo(user.uid);
+
+        setProfile(res);
+        console.log("res", res);
+      }
+    });
+
+    return () => unsubscribe();
+  }, []);
+
   const handleChange = (e) => {
     const { name, value } = e.target;
     setProfile((prev) => ({ ...prev, [name]: value }));
   };
 
   const handleSave = async () => {
     try {
-      const res = await updateUser(profile);
-      if (res === 200) {
-        navigate("/profile");
+      profile.uid = localStorage.getItem("id");
+      profile.email = user.email;
+      if (localStorage.getItem("details") === "false") {
+        const res = await createUser(profile);
+        if (res === 200) {
+          localStorage.setItem("details", "true");
+        }
+      } else {
+        const res = await updateUser(profile);
+
+        if (res === 200) {
+        }
       }
+      navigate("/profile");
     } catch (error) {
       console.log(error);
     }
@@ -49,22 +79,22 @@ const EditProfile = () => {
           id="outlined"
           name="name"
           variant="standard"
-          value={profile.name}
+          value={profile && profile.name}
           onChange={handleChange}
           fullWidth
         />
         <TextField
           label="Mobile Number"
           name="phoneNumber"
           variant="standard"
-          value={profile.phoneNumber}
+          value={profile && profile.phoneNumber}
           onChange={handleChange}
           fullWidth
         />
 
         <TextField
           label="Email"
-          value={auth.currentUser.email}
+          value={user && user.email}
           variant="standard"
           InputProps={{
             readOnly: true,
@@ -75,7 +105,9 @@ const EditProfile = () => {
           <InputLabel>Gender</InputLabel>
           <Select
             name="gender"
-            defaultValue={profile.gender}
+            defaultValue={
+              profile && profile.gender === "Male" ? "Male" : "Female"
+            }
             onChange={handleChange}
             required
           >

src/pages/Profile.js

@@ -1,26 +1,27 @@
-import React, { useEffect, useState } from "react";
+import React, { useState } from "react";
 import { Box, Typography, Button, Stack } from "@mui/material";
 import { useNavigate } from "react-router-dom";
 import { TextField } from "@mui/material";
 import { getUserInfo } from "../firebaseUtils/getRequests";
 import { auth } from "../firebaseUtils/firebaseConfig";
+import { onAuthStateChanged } from "firebase/auth";
 const Profile = () => {
   const navigate = useNavigate();
 
   const [profile, setProfile] = useState(null);
-  useEffect(() => {
-    getUserDetails();
-  }, []);
 
-  const getUserDetails = async () => {
-    if (auth.currentUser) {
-      const res = await getUserInfo(auth.currentUser.uid);
-      setProfile(res);
-    } else {
-      console.log("No user is logged in.");
-    }
-  };
+  React.useEffect(() => {
+    const unsubscribe = onAuthStateChanged(auth, async (user) => {
+      console.log(user);
+      if (user) {
+        const res = await getUserInfo(user.uid);
+        setProfile(res);
+        console.log("res", res);
+      }
+    });
 
+    return () => unsubscribe();
+  }, []);
   return (
     <Box
       sx={{
@@ -37,7 +38,7 @@ const Profile = () => {
         </Typography>
         <TextField
           label="Email"
-          value={auth.currentUser.email}
+          value={auth && auth?.currentUser?.email}
           slotProps={{
             inputLabel: {
               shrink: true,

src/pages/SendNotice.js

@@ -59,7 +59,7 @@ const SendNotice = () => {
 
   const handleSubmit = async (e) => {
     e.preventDefault();
-    if (user) {
+    if (user && localStorage.getItem("details") === "true") {
       const noticeData = {
         title: e.target.title.value,
         description: e.target.description.value,
@@ -88,6 +88,7 @@ const SendNotice = () => {
         toast.error("Announcement Sent Failed");
       }
     } else {
+      toast.error("please update your profile to send announcements");
       console.log("No user is logged in.");
     }
   };

src/pages/SignIn.js

@@ -3,7 +3,7 @@ import Stack from "@mui/material/Stack";
 import SignInCard from "../components/SignInCard";
 import Content from "../components/Content";
 
-export default function SignIn(props) {
+export default function SignIn({ handleLogin }) {
   return (
     <Stack
       direction="column"
@@ -52,7 +52,7 @@ export default function SignIn(props) {
           }}
         >
           <Content />
-          <SignInCard />
+          <SignInCard handleLogin={handleLogin} />
         </Stack>
       </Stack>
     </Stack>