Hunar (#53)

* Add folder for student register issue: There was a router problem for student register resolve: always make page.js for route just separate them by making different folders. * database * - Created useContext for user (uid) - Added service folder with functions to read and write data from the database - Added authentication for student/homepage and student/information - Updated student/login page to fix email and password authentication issues * starting login page * login page design * signup page complete * adding colors * file change * forget password * add modal * add conditions * login page * add posst function for menu and restaurant details * meging with main * adding restaurant information page * fetching and adding data for restaurants * merging from origin * merge from orign * adding emails status in database * add and create function for adding new email with active status add and create function for getting email names where active status is true make changes in register page to check that email is in database for register * chengin import sttement * adding terms condition * adding logos facility * merge from master * update database sait-staff * adding search option * commit * connecting sait-staff with database * merging form master * changes on sait * mege from master to origin * changing restaurant info table * adding data to database * updating cards * adding logc for increase and decrease arrow * adding databse changes * updating datasbe function to getting student information * adding authentication for restaurants * changing Searching bar * adding search bar in sait-staff * updating restaurant login page * adding update,delete and change password features * adding fuctionality of deleting user's information from database including user data and restaurant menu, delete data from storage and from authentication * update edit functionallity in sait-staff and add delete functionality in restaurant * add add functionality for admins * Hunar (#46) * Add folder for student register issue: There was a router problem for student register resolve: always make page.js for route just separate them by making different folders. * database * - Created useContext for user (uid) - Added service folder with functions to read and write data from the database - Added authentication for student/homepage and student/information - Updated student/login page to fix email and password authentication issues * starting login page * login page design * signup page complete * adding colors * file change * forget password * add modal * add conditions * login page * add posst function for menu and restaurant details * meging with main * adding restaurant information page * fetching and adding data for restaurants * merging from origin * merge from orign * adding emails status in database * add and create function for adding new email with active status add and create function for getting email names where active status is true make changes in register page to check that email is in database for register * chengin import sttement * adding terms condition * adding logos facility * merge from master * update database sait-staff * adding search option * commit * connecting sait-staff with database * merging form master * changes on sait * mege from master to origin * changing restaurant info table * adding data to database * updating cards * adding logc for increase and decrease arrow * adding databse changes * updating datasbe function to getting student information * adding authentication for restaurants * changing Searching bar * adding search bar in sait-staff * updating restaurant login page * adding update,delete and change password features * adding fuctionality of deleting user's information from database including user data and restaurant menu, delete data from storage and from authentication --------- Co-authored-by: Abdel Mouzahir <[email protected]> * trying to show username in saitstaff * console log * small change * remove azure * adding loading animation * loading in all login pages * trying to fetch the name * fetch data in login * comment to hunar * problem solved mentioned by abdel * updatinf sait-login * add feature of edit and update active state * add search functionality in sait-staff * add feature of updating password and delete account * small change * add profil picture in saitadmin * approuval * add profile page for sait-staff and resolve the problem related sait-staff login --------- Co-authored-by: Abdel Mouzahir <[email protected]> Co-authored-by: abdel mouzahir <[email protected]>
Abdelmouzahir · Jul 9, 2024 · 5fc0460 · 5fc0460
1 parent 6e533b8
commit 5fc0460
Show file tree

Hide file tree

Showing 14 changed files with 303 additions and 128 deletions.
diff --git a/Components/UserGreeting.js b/Components/UserGreeting.js
@@ -1,33 +1,43 @@
 import { useEffect, useState } from "react";
 import { AiOutlineUser } from "react-icons/ai";
+import { useUserAuth } from "@/services/utils";
+import { getSaitDataByUser } from "@/services/GetRequest/getRequest";
 
-const UserGreeting = () => {
+const UserGreeting = ({setActiveTab}) => {
+  const { user } = useUserAuth();
+  const [userData, setUserData] = useState(null);
   const [userName, setUserName] = useState("User");
   const [email, setEmail] = useState("");
-  const [uid, setUid] = useState("");
   const [userImage, setUserImage] = useState("");
 
+  async function fetchSaitStaffUserInformation() {
+    const data = await getSaitDataByUser(user);
+    setUserData(data);
+    console.log(data);
+  }
+
   useEffect(() => {
-    // Ensure this runs only on the client-side
-    if (typeof window !== "undefined") {
-      const name = sessionStorage.getItem("name") || "User";
-      const userEmail = sessionStorage.getItem("email") || "";
-      const userUid = sessionStorage.getItem("uid") || "";
-      const userImage = sessionStorage.getItem("imageUrl") || "";
+    if (!user==false && user){
+      fetchSaitStaffUserInformation();
+    }
+  }, [user]);
 
-      setUserName(name);
-      setEmail(userEmail);
-      setUid(userUid);
-      setUserImage(userImage);
+  useEffect(() => {
+    if(userData){
+      setUserName(userData[0].name);
+      setEmail(userData[0].email);
+      setUserImage(userData[0].imageUrl);
     }
-  }, []);
+  }, [userData]);
+
+  useEffect(() => {console.log(userImage)}, [userName, email, userImage]);
 
   return (
-    <div className="inline-flex items-center ml-5 rounded-full">
+    <div className="inline-flex items-center ml-5 rounded-full cursor-pointer" onClick={()=>{setActiveTab("setting")}}>
       <div className="bg-slate-200 relative h-12 w-12 border rounded-full overflow-hidden hover:bg-[#F29F3D]">
         <img
           className="w-full h-full rounded-full"
-          src={userImage}
+          src={userImage ? userImage : "/assets/images/UserDefaultSaitStaff.png"}
           alt="User Image"
         />
       </div>

diff --git a/app/auth/sign-in/page.js b/app/auth/sign-in/page.js
@@ -5,7 +5,7 @@ import { auth } from "@/app/firebase/config";
 import { useRouter } from "next/navigation";
 import Link from "next/link";
 import { sendPasswordResetEmail } from "firebase/auth";
-import Modal from "@/components/Modal";
+import Modal from "@/Components/Modal";
 import { BiSolidCommentError } from "react-icons/bi";
 import Loading from "@/app/loading"; 
 

diff --git a/app/page.js b/app/page.js
@@ -1,14 +1,13 @@
 'use client'
 import Header from "./main-component/layout/header/header";
 import Footer from "./main-component/layout/footer/footer";
-import { Button } from "@/components/ui/button";
-import Modal from "@/components/Modal";
+import { Button } from "@/Components/ui/button";
+import Modal from "@/Components/Modal";
 import {motion} from "framer-motion";
-import { Card, CardContent } from "/components/ui/card";
-import { Avatar, AvatarFallback } from "@/components/ui/avatar";
+import { Card, CardContent } from "/Components/ui/card";
+import { Avatar, AvatarFallback } from "@/Components/ui/avatar";
 import { useState } from "react";
-import LearnMore from "@/components/LearnMore";
-import Reviews from "@/components/reviews";
+import LearnMore from "@/Components/LearnMore";
 
 
 export default function Home() {
@@ -24,7 +23,7 @@ const [showModal, setShowModal] = useState(false);
                 <div className="container px-4 md:px-6">
                     <div className="grid gap-6 lg:grid-cols-[1fr_400px] lg:gap-12 xl:grid-cols-[1fr_600px]">
                         <motion.img
-                        whileHover={{ scale: 1.1 }}
+                        iwhileHover={{ scale: 1.1 }}
                         whileTap={{ scale: 0.9 }}
 
                             alt="Hero"
@@ -105,8 +104,79 @@ const [showModal, setShowModal] = useState(false);
 
             {/* Section 3: Testimonials section with student reviews */}
             <section className="w-full py-12 md:py-24 lg:py-32 bg-[#f8f9fa] dark:bg-[#2b2b2b]">
-                <div>
-                   <Reviews />
+                <div className="container px-4 md:px-6">
+                    <div className="flex flex-col items-center justify-center space-y-4 text-center">
+                        <div className="space-y-2">
+                            <div className="inline-block rounded-lg bg-[#e6e6e6] px-3 py-1 text-sm dark:bg-[#3b3b3b]">
+                                Student Testimonials
+                            </div>
+                            <h2 className="text-3xl font-bold tracking-tighter sm:text-5xl">What Our Users Say</h2>
+                            <p className="max-w-[900px] text-gray-500 md:text-xl/relaxed lg:text-base/relaxed xl:text-xl/relaxed dark:text-gray-400">
+                                Hear from our satisfied students about how our app has helped them discover delicious and affordable
+                                meals near their campus.
+                            </p>
+                        </div>
+                    </div>
+                    <div className="mx-auto grid max-w-5xl grid-cols-1 gap-6 py-12 sm:grid-cols-2 md:grid-cols-3 lg:gap-12">
+                        <Card>
+                            <CardContent className="p-6 text-left">
+                                <div className="flex items-center gap-4">
+                                    <Avatar className="h-12 w-12 border">
+                                        <img src="/placeholder.svg" alt="@username" />
+                                        <AvatarFallback>JS</AvatarFallback>
+                                    </Avatar>
+                                    <div>
+                                        <h3 className="text-lg font-bold">Jessica Smith</h3>
+                                        <p className="text-gray-500 dark:text-gray-400">University of California, Berkeley</p>
+                                    </div>
+                                </div>
+                                <p className="mt-4 text-gray-500 dark:text-gray-400">
+                                    "This app has been a game-changer for me as a busy student. I love being able to discover new
+                                    restaurants with discounts and save money on delicious meals. It's made eating out so much more
+                                    affordable."
+                                </p>
+                            </CardContent>
+                        </Card>
+                        <Card>
+                            <CardContent className="p-6 text-left">
+                                <div className="flex items-center gap-4">
+                                    <Avatar className="h-12 w-12 border">
+                                        <img src="/placeholder.svg" alt="@username" />
+                                        <AvatarFallback>MR</AvatarFallback>
+                                    </Avatar>
+                                    <div>
+                                        <h3 className="text-lg font-bold">Michael Rodriguez</h3>
+                                        <p className="text-gray-500 dark:text-gray-400">University of Texas, Austin</p>
+                                    </div>
+                                </div>
+                                <p className="mt-4 text-gray-500 dark:text-gray-400">
+                                    "As a student, I'm always looking for ways to save money, and this app has been a lifesaver. The
+                                    discounts and deals have helped me enjoy delicious meals without breaking the bank. I highly
+                                    recommend it to all my friends."
+                                </p>
+                            </CardContent>
+                        </Card>
+                        <Card>
+                            <CardContent className="p-6 text-left">
+                                <div className="flex items-center gap-4">
+                                    <Avatar className="h-12 w-12 border">
+                                        <img src="/placeholder.svg" alt="@username" />
+                                        <AvatarFallback>EM</AvatarFallback>
+                                    </Avatar>
+                                    <div>
+                                        <h3 className="text-lg font-bold">Emily Martinez</h3>
+                                        <p className="text-gray-500 dark:text-gray-400">University of Washington, Seattle</p>
+                                    </div>
+                                </div>
+                                <p className="mt-4 text-gray-500 dark:text-gray-400">
+                                    "I love how this app connects me with local restaurants that offer discounts for students. It's
+                                    helped me discover so many new and delicious places to eat, and the community aspect is really
+                                    special. I feel like I'm part of a network of students who are all looking to save money and enjoy
+                                    great food."
+                                </p>
+                            </CardContent>
+                        </Card>
+                    </div>
                 </div>
             </section>
         </div>

diff --git a/app/sait-staff/RDashboard/Edit.js b/app/sait-staff/RDashboard/Edit.js
@@ -74,6 +74,7 @@ const Edit = ({ restaurants, selectedRestaurant, setRestaurants, setIsEditing, g
             value={email}
             // onChange={(e) => setEmail(e.target.value)}
             className="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none sm:text-sm cursor-not-allowed bg-black/20"
+            readOnly={true}
           />
         </div>
         <div>

diff --git a/app/sait-staff/SDashboard/Edit.js b/app/sait-staff/SDashboard/Edit.js
@@ -101,6 +101,7 @@ const Edit = ({ selectedStudent, setIsEditing }) => {
             value={email}
             // onChange={(e) => setEmail(e.target.value)}
             className="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none sm:text-sm cursor-not-allowed bg-black/20"
+            readOnly={true}
           />
         </div>
         <div>

diff --git a/app/sait-staff/login/page.js b/app/sait-staff/login/page.js
@@ -2,12 +2,11 @@
 import React, { Fragment, useState, useEffect } from "react";
 import { useSignInWithEmailAndPassword } from "react-firebase-hooks/auth";
 import { auth, db } from "@/app/firebase/config";
-import { updateProfile } from "firebase/auth";
 import { collection, query, where, getDocs } from "firebase/firestore";
 import { useRouter } from "next/navigation";
 import { sendPasswordResetEmail } from "firebase/auth";
 import { AiOutlineUser } from "react-icons/ai";
-import Modal from "@/components/Modal";
+import Modal from "@/Components/Modal";
 import { BiSolidCommentError } from "react-icons/bi";
 import Loading from "@/app/loading";
 
@@ -62,18 +61,7 @@ const SignIn = () => {
   const handleSignIn = async () => {
     setLoading(true);
     try {
-      const userCredential = await signInWithEmailAndPassword(email, password);
-      const user = userCredential.user;
-
-      // Update display name with SAIT Staff name
-      await updateProfile(user, { displayName: saitStaffName , photoURL : saitStaffimg});
-      //console.log('img ',saitStaffimg)
-
-      sessionStorage.setItem("user", true);
-      sessionStorage.setItem("name", saitStaffName);
-      sessionStorage.setItem("email", user.email || ""); // Store the user's email
-      sessionStorage.setItem("uid", user.uid || ""); // Store the user's UID
-      sessionStorage.setItem("imageUrl", saitStaffimg|| ""); // Store the user's photo URL
+      await signInWithEmailAndPassword(email, password);
       router.push("/sait-staff"); // Redirect after successful sign-in
       setEmail("");
       setPassword("");

diff --git a/app/sait-staff/overviewDash/Edit.js b/app/sait-staff/overviewDash/Edit.js
@@ -89,11 +89,12 @@ const Edit = ({ employeeData, setIsEditing, getData, userData }) => {
             value={email}
             // onChange={(e) => setEmail(e.target.value)}
             className="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none sm:text-sm cursor-not-allowed bg-black/20"
+            readOnly={true}
           />
         </div>
         <div>
           <label
-            htmlFor="salary"
+            htmlFor="phone"
             className="block text-sm font-medium text-gray-700"
           >
             Phone Number

diff --git a/app/sait-staff/overviewDash/index.js b/app/sait-staff/overviewDash/index.js
@@ -10,8 +10,10 @@ import {
 } from "@/services/GetRequest/getRequest";
 import { useUserAuth } from "@/services/utils";
 import { updateSaitEmployeeStatus } from "@/services/PostRequest/postRequest";
+import { getAuth } from "firebase/auth";
 
 export default function Dash() {
+  const auth = getAuth();
   const [userData, setUserData] = useState(null);
   const [editEmployeData, setEditEmployeData] = useState(null);
   const [isAdding, setIsAdding] = useState(false);
@@ -32,6 +34,7 @@ export default function Dash() {
     if (user) {
       fetchData();
       fetchDataByUser(user);
+      console.log("user", auth.currentUser);
     }
   }, [user]);
 

diff --git a/app/sait-staff/overviewDash/table.js b/app/sait-staff/overviewDash/table.js
@@ -1,7 +1,7 @@
 import React, { useState } from "react";
 import { LuPencil, LuTrash } from "react-icons/lu";
 import { IoMdPersonAdd } from "react-icons/io";
-import Modal from "@/components/Modal";
+import Modal from "@/Components/Modal";
 import { FaFilter } from "react-icons/fa";
 import { MdOutlineDoneOutline } from "react-icons/md";
 

diff --git a/app/sait-staff/page.js b/app/sait-staff/page.js
@@ -1,24 +1,20 @@
-'use client';
-import Link from "next/link";
-import SDashboard from './SDashboard';
-import RDashboard from './RDashboard';
+"use client";
+import SDashboard from "./SDashboard";
+import RDashboard from "./RDashboard";
 import Dash from "./overviewDash";
 import Settings from "./settingS";
 import { LuLogOut } from "react-icons/lu";
-import { onAuthStateChanged } from 'firebase/auth';
-import { auth } from '@/app/firebase/config';
-import UserGreeting from '@/components/UserGreeting';
+import UserGreeting from "@/Components/UserGreeting";
 //import navbar
-import SaitStaffNav from "@/components/SaitStaffNav";
-import { CgProfile } from "react-icons/cg";
-import { useState, useEffect } from 'react';
+import SaitStaffNav from "@/Components/SaitStaffNav";
+import { useState, useEffect } from "react";
 import { useRouter } from "next/navigation";
 
-
 export default function Page() {
   const [isCollapsed, setIsCollapsed] = useState(false);
-  const [activeTab, setActiveTab] = useState('home'); // Set default active tab
+  const [activeTab, setActiveTab] = useState("home"); // Set default active tab
   const [user, setUser] = useState(null);
+  const [hideUserGreeting, setHideUserGreeting] = useState(false);
 
   const router = useRouter();
 
@@ -27,37 +23,67 @@ export default function Page() {
     setActiveTab(tabName);
   };
 
- function handeLogoutClick() {
+  function handeLogoutClick() {
     // handle logout click
     return router.push("/");
   }
 
+  useEffect(() => {
+    if (activeTab === "setting") {
+      setHideUserGreeting(true);
+    } else {
+      setHideUserGreeting(false);
+    }
+  }, [activeTab]);
 
   return (
-    <div className="flex min-h-screen mx-auto"
+    <div
+      className="flex min-h-screen mx-auto"
       style={{
         backgroundImage: "linear-gradient(115deg, #F7F5EB, #F9F5F6)",
         backgroundSize: "cover",
         backgroundPosition: "center",
-        backgroundRepeat: "no-repeat"
-      }}>
-      <SaitStaffNav isCollapsed={isCollapsed} setIsCollapsed={setIsCollapsed} onTabClick={handleTabClick} />
-      <div className={`flex-1 flex flex-col mx-auto transition-all duration-300 ease-in-out ${isCollapsed ? 'ml-20' : 'ml-64'}`}>
+        backgroundRepeat: "no-repeat",
+      }}
+    >
+      <SaitStaffNav
+        isCollapsed={isCollapsed}
+        setIsCollapsed={setIsCollapsed}
+        onTabClick={handleTabClick}
+      />
+      <div
+        className={`flex-1 flex flex-col mx-auto transition-all duration-300 ease-in-out ${
+          isCollapsed ? "ml-20" : "ml-64"
+        }`}
+      >
         <div className="flex justify-between items-center px-4 py-3 mt-2 mr-5">
-           <div className="inline-flex items-center ml-5 rounded-full">    
-              <UserGreeting />
+          <div className="grid grid-cols-3 w-full">
+            <div
+              className={
+                hideUserGreeting
+                  ? "hidden"
+                  : "inline-flex items-center ml-5 rounded-full"
+              }
+            >
+              <UserGreeting setActiveTab={setActiveTab}/>
+            </div>
+            <div className="col-start-3 grid w-full justify-items-end">
+              <button
+                onClick={handeLogoutClick}
+                className=" w-1/2 inline-flex h-10 items-center justify-center rounded-md bg-gray-600 px-8 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-[#F29F3D] focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-[#6c5ce7] disabled:pointer-events-none disabled:opacity-50 dark:bg-[#6c5ce7] dark:text-gray-50 dark:hover:bg-[#6c5ce7]/90 dark:focus-visible:ring-[#6c5ce7]"
+              >
+                <LuLogOut className="mr-2 h-5 w-5" />
+                Logout
+              </button>
+            </div>
           </div>
-          <button onClick={handeLogoutClick} className="inline-flex h-10 items-center justify-center rounded-md bg-gray-600 px-8 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-[#F29F3D] focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-[#6c5ce7] disabled:pointer-events-none disabled:opacity-50 dark:bg-[#6c5ce7] dark:text-gray-50 dark:hover:bg-[#6c5ce7]/90 dark:focus-visible:ring-[#6c5ce7]">
-            <LuLogOut className="mr-2 h-5 w-5" />
-            Logout
-          </button>
         </div>
         <div className="flex-1 p-6">
           {/* select the tab based on the click */}
-          {activeTab === 'student' && <SDashboard />}
-          {activeTab === 'restaurant' && <RDashboard />}
-          {activeTab === 'home' && <Dash />}
-          {activeTab === 'setting' && <Settings />}
+          {activeTab === "student" && <SDashboard />}
+          {activeTab === "restaurant" && <RDashboard />}
+          {activeTab === "home" && <Dash />}
+          {activeTab === "setting" && <Settings />}
         </div>
       </div>
     </div>