diff --git a/src/components/Post.tsx b/src/components/Post.tsx index 57f29bbdc7e0b8f791feda59dac3ad3ae3902213..c799df0b3f14c3a84518c65d635890313423227c 100644 --- a/src/components/Post.tsx +++ b/src/components/Post.tsx @@ -35,7 +35,7 @@ const dispatch = useAppDispatch(); return <> {/* A POST */} -<div className="border rounded-xl mt-10 bg-white"> +<div className="border rounded-xl bg-white"> {/* HEADER POST */} <div className="flex justify-between p-4"> <div className="flex items-center gap-4"> diff --git a/src/views/FeedView.tsx b/src/views/FeedView.tsx index 30393b18da45a4297df1369c8fa60c4c14b4f908..063c3be99f7829355a2ddda933ca52434641110b 100644 --- a/src/views/FeedView.tsx +++ b/src/views/FeedView.tsx @@ -5,7 +5,6 @@ import { Instalike } from '@jmetterrothan/instalike'; import Navbar from '../components/Navbar'; import Suggestion from '../components/Suggestion'; import Post from '../components/Post'; -// import { Link } from 'react-router-dom'; // AUTRES FICHIERS import useAppDispatch from '../hooks/useAppDispatch'; @@ -34,7 +33,7 @@ const FeedView = () => { return <> {/* HEADER */} <Navbar /> - {/* FEED */} + {/* FEEDVIEW */} <div className="max-w-[640px] mx-auto mt-8 mb-16 px-4"> {/* USERS / STORIES */} <ul className="flex gap-8"> @@ -50,13 +49,13 @@ return <> }) } </ul> - {/* POSTS */} - {feedItems && - feedItems.map((post: Instalike.Post) => { - console.log(post) + <div className="flex flex-col gap-10 mt-10"> + {/* POSTS */} + {feedItems && + feedItems.map((post: Instalike.Post) => { + console.log(post) - return ( - // <Link key={post.id} to={`/post/${post.id}`}> + return ( <Post key={post.id} postid={post.id} username={post.owner.userName} @@ -69,9 +68,9 @@ return <> comments={post.commentsCount} comment_post={post.previewComments} ></Post> - // </Link> - ); - })} + ); + })} + </div> </div> </>; diff --git a/src/views/PostView.tsx b/src/views/PostView.tsx index 7ba4378f150a48a88a8e3c2477d19ca1c27c36da..770b0a15db2a5ebe956fd8b9ed900cac96b9acf8 100644 --- a/src/views/PostView.tsx +++ b/src/views/PostView.tsx @@ -1,9 +1,14 @@ import { useEffect } from 'react'; import { Navigate, useParams } from 'react-router-dom'; + +// COMPOSANTS +import Post from '../components/Post'; +import Navbar from '../components/Navbar'; + +// AUTRES FICHIERS import useAppDispatch from '../hooks/useAppDispatch'; import usePost from '../hooks/usePostItems'; import { fetchPost, calculateTime } from '../redux/post/thunks'; -import Post from '../components/Post'; const usePostId = () => { @@ -23,27 +28,29 @@ const PostView = () => { return <Navigate to="feed" />; } -return <> - <div className="bg-gray-900/50 h-full"> - <div className="max-w-[640px] mx-auto py-16 px-4"> - {/* A POST */} - {post && ( - <Post key={post.id} - postid={post.id} - username={post.owner.userName} - location={post.location} - time_post={calculateTime(post.createdAt)} - img={post.resources[0]} - caption={post.caption} - isLiked={post.viewerHasLiked} - likes={post.likesCount} - comments={post.commentsCount} - comment_post={post.previewComments} - ></Post> - )} + return <> + <div className="h-full"> + {/* HEADER */} + <Navbar /> + <div className="max-w-[640px] mx-auto py-16 px-4"> + {/* A POST */} + {post && ( + <Post key={post.id} + postid={post.id} + username={post.owner.userName} + location={post.location} + time_post={calculateTime(post.createdAt)} + img={post.resources[0]} + caption={post.caption} + isLiked={post.viewerHasLiked} + likes={post.likesCount} + comments={post.commentsCount} + comment_post={post.previewComments} + ></Post> + )} + </div> </div> - </div> -</>; + </>; }; export default PostView; \ No newline at end of file