From f05a1a0d14703c3a8ffaef57560b67bec9c057af Mon Sep 17 00:00:00 2001 From: Noan07 <84435602+Noan07@users.noreply.github.com> Date: Thu, 19 Jan 2023 11:23:09 +0100 Subject: [PATCH] ajout post --- Site Web/client/src/actions/post.actions.js | 9 +- Site Web/client/src/components/AjoutLien.js | 51 ++++++++--- Site Web/client/src/components/Navbar.js | 51 +---------- Site Web/client/src/components/NewPoste.js | 3 - .../client/src/components/Post/ButtonLike.js | 61 +++++++------ .../src/components/Post/DisplayPosts.js | 7 +- Site Web/client/src/components/Post/Post.js | 4 - .../components/UserProfil/FollowHandler.js | 3 +- Site Web/client/src/pages/SearchBar.js | 89 +++++++++++-------- Site Web/client/src/reducers/post.reducer.js | 14 +-- Site Web/client/src/styles/_settings.scss | 1 + Site Web/client/src/styles/index.scss | 2 +- Site Web/client/src/styles/pages/_profil.scss | 1 + .../client/src/styles/pages/_searchBar.scss | 23 +++++ Site Web/controllers/auth.controller.js | 4 - Site Web/controllers/post.controller.js | 1 + Site Web/controllers/user.controller.js | 2 - Site Web/models/post.model.js | 6 +- Site Web/models/user.model.js | 1 - 19 files changed, 169 insertions(+), 164 deletions(-) create mode 100644 Site Web/client/src/styles/pages/_searchBar.scss diff --git a/Site Web/client/src/actions/post.actions.js b/Site Web/client/src/actions/post.actions.js index e42b12df..2e856650 100644 --- a/Site Web/client/src/actions/post.actions.js +++ b/Site Web/client/src/actions/post.actions.js @@ -19,10 +19,13 @@ export const getPostsDisc = (num) => { return axios .get(`${process.env.REACT_APP_API_URL}api/post/`) .then((res) => { - console.log("test"); - let array = res.data.sort((a, b) => b.likers.length - a.likers.length); + let currentTime = new Date().getTime(); + let array = res.data.filter(post => { + let postTime = new Date(post.createdAt); + return (currentTime - postTime) / (1000 * 60 * 60) < 24 + }); + array = array.sort((a, b) => b.likers.length - a.likers.length); array = array.slice(0, num); - console.log(array); dispatch(setPostData(array)); }) .catch((err) => console.log(err)) diff --git a/Site Web/client/src/components/AjoutLien.js b/Site Web/client/src/components/AjoutLien.js index 4ef8e33f..630d2924 100644 --- a/Site Web/client/src/components/AjoutLien.js +++ b/Site Web/client/src/components/AjoutLien.js @@ -10,33 +10,43 @@ const AjoutLien = () => { const [displayAdd, setDisplayAdd] = useState(false); const [lien, setLien] = useState(""); const [description, setDescription] = useState(""); + const [tag, setTag] = useState(''); + const [tags, setTags] = useState([]); const dispatch = useDispatch(); + const handleSubmit = (e) => { + e.preventDefault(); + setTags([...tags, tag]); + setTag(''); + } + + + const handlePost = async () => { - if(isValidUrl(lien)) - if ((description || lien) ){ - putData(); - dispatch(getPosts()); - cancelPost(); - setDisplayAdd(false); - window.location.reload(); - }else { - alert("Veuillez compléter tous les champs.") + if(isValidUrl(lien)){ + if ((description || lien) && tags.length > 0){ + putData(); + dispatch(getPosts()); + cancelPost(); + setDisplayAdd(false); + window.location.reload(); + }else { + alert("Veuillez compléter tous les champs et ajouter au moins un tag.") + } + }else{ + alert("Veuillez saisir un lien valide.") } - else{ - alert("Ce n'est pas lien!") - } }; - const cancelPost = () => { setDescription(""); setLien(""); + setTags([]); }; const putData = async() => { axios - .post(`${process.env.REACT_APP_API_URL}api/post/`, { postedId: userData._id, message: description, lien: lien} + .post(`${process.env.REACT_APP_API_URL}api/post/`, { postedId: userData._id, message: description, lien: lien, tags: tags} ) .then((res) => { // if (res.data.errors) { @@ -95,6 +105,19 @@ const AjoutLien = () => { /> + setTag(e.target.value)} + /> + Add Tag + + +
diff --git a/Site Web/client/src/components/Navbar.js b/Site Web/client/src/components/Navbar.js index d5a4eae0..8a47ba25 100644 --- a/Site Web/client/src/components/Navbar.js +++ b/Site Web/client/src/components/Navbar.js @@ -11,55 +11,6 @@ import { addPost, getPosts } from "../actions/post.actions"; const Navbar = () => { const uid = useContext( UidContext ); - const userData = useSelector((state) => state.user.user); - const [displayAdd, setDisplayAdd] = useState(false); - const [lien, setLien] = useState(""); - const [description, setDescription] = useState(""); - const dispatch = useDispatch(); - - const handlePost = () => { - if ((description || lien) ){ - const data = new FormData(); - data.append('postedId', userData._id); - data.append('message', description); - data.append('lien', lien); - //console.log("test",data); - putData(data); - console.log(data); - cancelPost(); - setDisplayAdd(false) - }else { - alert("Veuillez compléter tous les champs.") - } - }; - - const putData = async(data) => { - axios - .post(`${process.env.REACT_APP_API_URL}api/post/`, { postedId: userData._id, message: description, lien: lien} - ) - .then((res) => { - console.log(data,"test"); - // if (res.data.errors) { - // dispatch(setPostError({payload: res.data.errors })); - // } else { - // dispatch(setPostError({payload: "" })); - // } - })}; - - - const cancelPost = () => { - setDescription(""); - setLien(""); - }; - - const isValidUrl = (url) => { - try { - new URL(url); - return true; - }catch { - return false; - } - } const removeCookie = (key) => { if(window !== "undefined"){ @@ -111,7 +62,7 @@ const Navbar = () => {
  • - Me + Profil
  • diff --git a/Site Web/client/src/components/NewPoste.js b/Site Web/client/src/components/NewPoste.js index ff0ea002..9f14677e 100644 --- a/Site Web/client/src/components/NewPoste.js +++ b/Site Web/client/src/components/NewPoste.js @@ -10,17 +10,14 @@ const NewPoste = ({ post }) => {
    - {/* */}
    - {/* */}
    - {/* */}
    diff --git a/Site Web/client/src/components/Post/ButtonLike.js b/Site Web/client/src/components/Post/ButtonLike.js index f1f9d4c5..ae1d5cb5 100644 --- a/Site Web/client/src/components/Post/ButtonLike.js +++ b/Site Web/client/src/components/Post/ButtonLike.js @@ -6,35 +6,40 @@ import CoeurPlein from '../../assets/img/coeursPlein.png'; import { likePost, unlikePost } from '../../actions/post.actions'; const ButtonLike = ( { post } ) => { - const [liked, setLiked] = useState(false); - const uid = useContext(UidContext); - const dispatch = useDispatch(); - - const like = () => { - dispatch(likePost(post._id, uid)) - setLiked(true); - }; - - const unlike = () => { - dispatch(unlikePost(post._id, uid)) - setLiked(false); - }; - - useEffect(() => { - if (post.likers.includes(uid)) setLiked(true); - else setLiked(false); - }, [uid, post.likers, liked]); + const [liked, setLiked] = useState(false); + const uid = useContext(UidContext); + const dispatch = useDispatch(); - return ( -
    - {uid && liked === false && ( - like - )} - {uid && liked && ( - unlike - )} -
    - ); + const like = (e) => { + e.preventDefault(); + dispatch(likePost(post._id, uid)); + setLiked(true); + }; + + const unlike = (e) => { + e.preventDefault(); + dispatch(unlikePost(post._id, uid)); + setLiked(false); + }; + + useEffect(() => { + if (post.likers.includes(uid)) { + setLiked(true); + } else { + setLiked(false); + } + }, [uid, post.likers, liked]); + + return ( +
    + {uid && liked === false && ( + like + )} + {uid && liked && ( + unlike + )} +
    + ); }; export default ButtonLike; \ No newline at end of file diff --git a/Site Web/client/src/components/Post/DisplayPosts.js b/Site Web/client/src/components/Post/DisplayPosts.js index 97b25675..52a3e264 100644 --- a/Site Web/client/src/components/Post/DisplayPosts.js +++ b/Site Web/client/src/components/Post/DisplayPosts.js @@ -13,13 +13,11 @@ const DisplayPosts = ( {type} ) => { const loadMore = () => { if (window.innerHeight + document.documentElement.scrollTop + 1 > document.scrollingElement.scrollHeight){ setLoadPost(true); + setCount(count + 5); } } useEffect(() => { - while(postsData== null){ - - } if (loadPost) { if(type === "discover"){ dispatch(getPostsDisc(count)); @@ -28,7 +26,6 @@ const DisplayPosts = ( {type} ) => { dispatch(getPosts(count)); } setLoadPost(false); - setCount(count + 5); } window.addEventListener('scroll', loadMore); return () => window.removeEventListener('scroll',loadMore); @@ -37,7 +34,7 @@ const DisplayPosts = ( {type} ) => { return (
      - {!isEmpty(postsData[0]) && + {!isEmpty(postsData) && !isEmpty(postsData[0]) && postsData.map((post) => { return })} diff --git a/Site Web/client/src/components/Post/Post.js b/Site Web/client/src/components/Post/Post.js index 143ed619..1f197a7a 100644 --- a/Site Web/client/src/components/Post/Post.js +++ b/Site Web/client/src/components/Post/Post.js @@ -35,7 +35,6 @@ const LinkPreview = ({ link }) => {
    -

    {preview.description}

    ); } @@ -46,8 +45,6 @@ const Post = ( { post } ) => { const [isLoading, setIsLoading] = useState(true); const usersData = useSelector((state) => state.users.users); const userData = useSelector((state) => state.user.user); - const [updated,setUpdate] = useState(false); - const [message, setMessage] = useState(null); const [comments, setComments] = useState(false); @@ -78,7 +75,6 @@ const Post = ( { post } ) => {
    - {/* */}
    {post.likers.length}
    diff --git a/Site Web/client/src/components/UserProfil/FollowHandler.js b/Site Web/client/src/components/UserProfil/FollowHandler.js index 026ab498..cd995312 100644 --- a/Site Web/client/src/components/UserProfil/FollowHandler.js +++ b/Site Web/client/src/components/UserProfil/FollowHandler.js @@ -11,7 +11,6 @@ const FollowHandler = ( { idToFollow , type } ) => { const dispatch = useDispatch(); const handleFollow = (e) => { - axios.patch(`${process.env.REACT_APP_API_URL}api/user/follow/` + userData._id, {idToFollow: idToFollow}) .then((res) => { //dispatch(setUserToFollowData({payload: {idToFollow}})); @@ -19,10 +18,10 @@ const FollowHandler = ( { idToFollow , type } ) => { .catch((err) => console.log(err)); setIsFollowed(true); e.preventDefault(); + //window.location.reload(); }; const handleUnFollow = (e) => { - axios.patch(`${process.env.REACT_APP_API_URL}api/user/unfollow/` + userData._id, {idToUnFollow: idToFollow}) .then((res) => { // dispatch(setUserToUnFollowData({payload: {idToFollow}})); diff --git a/Site Web/client/src/pages/SearchBar.js b/Site Web/client/src/pages/SearchBar.js index fbfa09b2..9eb2c557 100644 --- a/Site Web/client/src/pages/SearchBar.js +++ b/Site Web/client/src/pages/SearchBar.js @@ -1,43 +1,52 @@ import React, { useState } from 'react'; import { useSelector } from 'react-redux'; import Navbar from '../components/Navbar'; +import Post from '../components/Post/Post'; +import { isEmpty } from '../components/Utils'; const SearchBar = () => { const [searchValue, setSearchValue] = useState(""); const [searchUsers, setSearchUsers] = useState(true); const [searchPosts, setSearchPosts] = useState(false); const [searchResults, setSearchResults] = useState([]); - const postsData = useSelector((state) => state.post.post); - const usersData = useSelector((state) => state.users.users); + const posts = useSelector((state) => state.post.post); + const users = useSelector((state) => state.users.users); - function handleSearch() { - const input = searchValue.toLowerCase(); - console.log("Recherche pour : " + input); - const filteredResultsUsers = usersData.filter(function(item) { - return item.pseudo.toLowerCase().indexOf(input) !== -1; + const filteredResultsPosts = posts.filter(function(item) { + return item.tags.some(function(tag) { + return tag.toLowerCase().indexOf(searchValue.toLowerCase()) !== -1; }); + }); - const filteredResultsPosts = postsData.filter(function(item) { - return item.message.toLowerCase().indexOf(input) !== -1; - }); + const filteredResultsUsers = users.filter(function(item) { + return item.pseudo.toLowerCase().indexOf(searchValue.toLowerCase()) !== -1; + }); - if(searchUsers) - setSearchResults(filteredResultsUsers); - if(searchPosts) - setSearchResults(filteredResultsPosts); + function handleSearch() { - console.log(searchResults); + + const input = searchValue.toLowerCase(); + console.log("Recherche pour : " + input); + + if(searchUsers && searchValue !== "") + setSearchResults(filteredResultsUsers); + else if(searchPosts && searchValue !== "") + setSearchResults(filteredResultsPosts); } const handleModals = (e) => { if (e.target.id === "Users") { setSearchUsers(true); setSearchPosts(false); + if(searchValue !== "") + setSearchResults(filteredResultsUsers); } else { setSearchPosts(true); setSearchUsers(false); + if(searchValue !== "") + setSearchResults(filteredResultsPosts); } }; @@ -45,36 +54,38 @@ const SearchBar = () => {
    +
    setSearchValue(e.target.value)} placeholder="Rechercher..." /> -
    - + } +
    - { searchUsers && -
      - {searchResults.map((result) => ( -
    • {result.pseudo}
    • - ))} -
    - } - { searchPosts && -
      - {searchResults.map((result) => ( -
    • {result.message}
    • - ))} -
    - }
    ); diff --git a/Site Web/client/src/reducers/post.reducer.js b/Site Web/client/src/reducers/post.reducer.js index 59a547a0..664c056d 100644 --- a/Site Web/client/src/reducers/post.reducer.js +++ b/Site Web/client/src/reducers/post.reducer.js @@ -3,7 +3,8 @@ import { createSlice } from "@reduxjs/toolkit"; export const postSlice = createSlice({ name: "post", initialState: { - post : null, + post : { + }, }, reducers: { setPostData: (state,action) => { @@ -11,14 +12,13 @@ export const postSlice = createSlice({ console.log(state.post) }, setPostLikeData: (state,action) => { - console.log(...state.post); if (state.post._id === action.payload.postId) { - return { - ...state.post, - likers: [action.payload.userId, ...state.post.likers], + state.post = { + ...state.post, + likers: [action.payload.userId, ...state.post.likers], }; - } - return state.post; + } + console.log(state.post) }, setPostUnLikeData: (state,action) => { console.log(state); diff --git a/Site Web/client/src/styles/_settings.scss b/Site Web/client/src/styles/_settings.scss index ca99a006..d6033ff7 100644 --- a/Site Web/client/src/styles/_settings.scss +++ b/Site Web/client/src/styles/_settings.scss @@ -26,6 +26,7 @@ $color-10:#dddddd; padding: 0; margin: 0; box-sizing: border-box; + max-height: 100%; } body{ diff --git a/Site Web/client/src/styles/index.scss b/Site Web/client/src/styles/index.scss index 62024312..37461681 100644 --- a/Site Web/client/src/styles/index.scss +++ b/Site Web/client/src/styles/index.scss @@ -12,7 +12,7 @@ @import'./component/postNouvelleAffichage'; - +@import './pages/searchBar'; @import './component/notif'; @import './pages/trends'; diff --git a/Site Web/client/src/styles/pages/_profil.scss b/Site Web/client/src/styles/pages/_profil.scss index 6efa2209..3049b746 100644 --- a/Site Web/client/src/styles/pages/_profil.scss +++ b/Site Web/client/src/styles/pages/_profil.scss @@ -172,6 +172,7 @@ + .navLinkProfil, .navLinkProfil:link, .navLinkProfil:visited, diff --git a/Site Web/client/src/styles/pages/_searchBar.scss b/Site Web/client/src/styles/pages/_searchBar.scss new file mode 100644 index 00000000..b43a7f25 --- /dev/null +++ b/Site Web/client/src/styles/pages/_searchBar.scss @@ -0,0 +1,23 @@ +.search-main{ + width: 75%; + display: flex; + align-items: center; + flex-direction: column; +} + + +.divMenuSearch { + background-color: #cccaca; + width: 100%; + height: 500px; + border-radius: 25px; +} + +.listUsers{ + padding-top: 20px; + li { + list-style: none; + padding-left: 10%; + padding-bottom: 15px; + } +} \ No newline at end of file diff --git a/Site Web/controllers/auth.controller.js b/Site Web/controllers/auth.controller.js index 4ca43ba5..0cd1a1ad 100644 --- a/Site Web/controllers/auth.controller.js +++ b/Site Web/controllers/auth.controller.js @@ -91,18 +91,14 @@ module.exports.signIn = async (req, res) => { console.log("signin: ",req.body); const {email, password} = req.body try { - console.log("test user1 "); const user = await UserModel.login({email, password}); - console.log("test user2 "); //creation d'un token const token = createToken(user._id); - console.log("test user3 "); res.cookie('jwt', token, { httpOnly: true, maxAge}); - console.log("test user4 "); res.status(200).json({ user: user._id}); } diff --git a/Site Web/controllers/post.controller.js b/Site Web/controllers/post.controller.js index 03d83b30..e4b2b52e 100644 --- a/Site Web/controllers/post.controller.js +++ b/Site Web/controllers/post.controller.js @@ -24,6 +24,7 @@ module.exports.createPost = async (req, res) => { message: req.body.message, lien: req.body.lien, likers: [], + tags: req.body.tags, comments: [], }); diff --git a/Site Web/controllers/user.controller.js b/Site Web/controllers/user.controller.js index ee192b5c..9f9bf81c 100644 --- a/Site Web/controllers/user.controller.js +++ b/Site Web/controllers/user.controller.js @@ -16,11 +16,9 @@ module.exports.getNotif = async (req, res) => { module.exports.userInfo = (req, res) => { if (!ObjectID.isValid(req.params.id)) return res.status(400).send("ID unknown : " + req.params.id); - console.log('userinfo:',req.params.id) UserModel.findById(req.params.id, (err, docs) => { if (!err) { - console.log('doc:',docs) res.send(docs); } else diff --git a/Site Web/models/post.model.js b/Site Web/models/post.model.js index 4083f14c..fd4c7a2e 100644 --- a/Site Web/models/post.model.js +++ b/Site Web/models/post.model.js @@ -21,6 +21,10 @@ const postSchema = new mongoose.Schema( type: [String], required: true }, + tags: { + type: [String], + required: true + }, comments: { type: [ { @@ -31,7 +35,7 @@ const postSchema = new mongoose.Schema( } ], required: true, - }, + } }, { timestamps: true, diff --git a/Site Web/models/user.model.js b/Site Web/models/user.model.js index 5cabeadd..c5cf72cd 100644 --- a/Site Web/models/user.model.js +++ b/Site Web/models/user.model.js @@ -84,7 +84,6 @@ userSchema.pre("save", async function(next) { userSchema.statics.login = async function({email, password}) { const user = await this.findOne( {email} ); - console.log(user); if (user) { const auth = await bcrypt.compare(password, user.password); if (auth) {