diff --git a/README.md b/README.md index e61cf70..a03fb55 100644 --- a/README.md +++ b/README.md @@ -23,3 +23,4 @@ Table: | 19.07.2023 | Post widget | 10 | | 21.07.2023 | Each post on home page | 20 | | 22.07.2023 | Ads and friend list | 10 | +| 23.07.2023 | Profile page | 5 | diff --git a/client/src/scenes/profilePage/index.jsx b/client/src/scenes/profilePage/index.jsx index 3e410a0..99535b8 100644 --- a/client/src/scenes/profilePage/index.jsx +++ b/client/src/scenes/profilePage/index.jsx @@ -1,7 +1,65 @@ +import { Box, useMediaQuery } from "@mui/material"; +import { useEffect, useState } from "react"; +import { useSelector } from "react-redux"; +import { useParams } from "react-router-dom"; +import Navbar from "scenes/navbar"; +import FriendList from "scenes/widgets/FriendList"; +import PostWidget from "scenes/widgets/PostWidget"; +import FeedWidget from "scenes/widgets/FeedWidget"; +import UserWidget from "scenes/widgets/UserWidget"; + const ProfilePage = () => { - return ( -
profilepage
- ) + const [user, setUser] = useState(null); + const { userId } = useParams(); + const token = useSelector((state) => state.token); + const isNotMobile = useMediaQuery("(min-width: 1000px)"); + + const getUser = async () => { + const response = await fetch(`http://localhost:3001/users/${userId}`, { + method: "GET", + headers: { + Authorization: `Bearer ${token}`, + }, + }); + const data = await response.json(); + setUser(data); + }; + + useEffect(() => { + getUser(); + }, []); // eslint-disable-line react-hooks/exhaustive-deps + + if (!user) return null; + + return ( + + + + + + + + + + + + + + + + ); }; export default ProfilePage;