diff --git a/src/components/loginform/index.jsx b/src/components/loginform/index.jsx index 08fe0bd..31dc5ee 100644 --- a/src/components/loginform/index.jsx +++ b/src/components/loginform/index.jsx @@ -8,6 +8,7 @@ import { useAuth } from "@/context/AuthContext"; export default function LoginForm() { const [email, setEmail] = useState(""); const [password, setPassword] = useState(""); + const [notification, setNotification] = useState(null); // State for notification message const { login, currentUser } = useAuth(); const router = useRouter(); @@ -17,12 +18,41 @@ export default function LoginForm() { .then(() => { router.push("/account"); }) - .catch((error) => {}); + .catch((error) => { + // Update the notification state with the error message + setNotification("Email or password is incorrect."); + }); } return (
+ {/* Notification */} + {notification && ( +
+ Error! + {notification} + + + Close + + + +
+ )} +

Log in

diff --git a/src/components/profile/Profile.jsx b/src/components/profile/Profile.jsx index ca0b4fa..b7b0ca9 100644 --- a/src/components/profile/Profile.jsx +++ b/src/components/profile/Profile.jsx @@ -1,7 +1,6 @@ -/* eslint-disable @next/next/no-img-element */ +import React from "react"; import { useEffect, useState } from "react"; import { AiOutlineEdit, AiOutlineMail, AiOutlinePhone } from "react-icons/ai"; -import { BsBasketFill } from "react-icons/bs"; import { GoLocation } from "react-icons/go"; import { getDocData } from "@/lib/firebase/firestoreFunctions"; @@ -11,30 +10,58 @@ import Button from "@/components/button/Button"; import { useAuth } from "@/context/AuthContext"; import EditProfile from "./EditProfile"; +import { collection, getDocs } from "firebase/firestore"; +import { db } from "@/lib/firebase/firebase"; const Profile = () => { const { currentUser } = useAuth(); const [editProfile, setEditProfile] = useState(false); const [userData, setUserData] = useState({}); + const [hideAltTextBio, setHideAltTextBio] = useState(false); useEffect(() => { - getDocData("users", currentUser.uid).then((data) => { - setUserData(data); - }); + // Fetch user data when the component mounts + getUserData(); }, []); - const { name, avatarUrl, bio, publicEmail, publicPhoneNumber, location } = - userData; + useEffect(() => { + console.log(userData); + }, [userData]); + + async function getUserData() { + try { + const userdata = collection(db, "users"); + const response = await getDocs(userdata); + + const data = response.docs.map((doc) => ({ + data: doc.data(), + publicPhoneNumber: doc.data()["phone number"], + })); + + setUserData(data); + } catch (error) { + console.error("Error fetching user data:", error); + // Handle the error here (e.g., show an error message to the user) + } + } + + const { name, avatarurl, bio, email, location } = userData[0]?.data || {}; + const { publicPhoneNumber } = userData[0] || {}; + + const handleIconClick = () => { + setHideAltTextBio(true); + }; + return ( <> {editProfile && ( { )}

My account

-
-
-
+
+
+
profile
-
-
-
-

- {`${(bio && bio) || "Add Bio"}`} -

-

- {name} -

-
-
-
- -
- {/*
- - {5 + " "} - items -
*/} -
+ {`${(bio && bio) || "Add Bio"}`} +

+
+
+
+ +
+
+
- {publicEmail} + {email}
-
- - +
+ {publicPhoneNumber}
-
- +
+ {location}
diff --git a/src/pages/account/index.jsx b/src/pages/account/index.jsx index 8529575..835ead2 100644 --- a/src/pages/account/index.jsx +++ b/src/pages/account/index.jsx @@ -1,25 +1,32 @@ import Link from "next/link"; import { useEffect, useState } from "react"; import { AiOutlineDelete, AiOutlineEdit } from "react-icons/ai"; - +import { useRouter } from "next/router"; // Import useRouter import { getItemsByUser } from "@/lib/firebase/firestoreFunctions"; - import DeleteWarning from "@/components/delete-warning"; import ItemCard from "@/components/itemcard/ItemCard"; import Profile from "@/components/profile/Profile"; - import { useAuth } from "@/context/AuthContext"; export default function MyAccount() { const { currentUser } = useAuth(); const [items, setItems] = useState([]); const [deleteWarningItem, setDeleteWarningItem] = useState(); + const router = useRouter(); // Initialize useRouter useEffect(() => { + // Check if the user is not logged in and redirect to 404 page + if (!currentUser) { + router.push("/"); + return; // Stop further execution of the useEffect + } + + // Fetch items only if the user is logged in getItemsByUser(currentUser.uid).then((data) => { setItems(data); }); - }, [currentUser]); + }, [currentUser, router]); + return ( <> {deleteWarningItem && ( diff --git a/src/pages/addItemPage/index.jsx b/src/pages/addItemPage/index.jsx index 0ac346c..18fa115 100644 --- a/src/pages/addItemPage/index.jsx +++ b/src/pages/addItemPage/index.jsx @@ -1,11 +1,17 @@ +import Button from "@/components/button/Button"; import React, { useState, useRef } from "react"; import { BiSolidDownArrow } from "react-icons/bi"; export default function Index() { - const clothes = "whatever"; - const place = "whatever"; + const [title, setTitle] = useState(""); + const [category, setCategory] = useState(""); + const [state, setState] = useState(""); + const [city, setCity] = useState(""); + const [price, setPrice] = useState(); + const [description, setDescription] = useState(""); const [selectedPhotos, setSelectedPhotos] = useState([]); const [deleteIndices, setDeleteIndices] = useState([]); + const fileInputRef = useRef(null); const handleFileChange = (e) => { @@ -55,42 +61,106 @@ export default function Index() { htmlFor='category' className='text-sm font-medium' > - Category + Category
-
+
+ +