noan.randon
/
Favor
3
2
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' of https://codefirst.iut.uca.fr/git/noan.randon/Favor
continuous-integration/drone/push Build encountered an error Details

Browse Source
master
Noan07 2 years ago
parent 297c64b107 ac9db645eb
commit 7e41fc2295
11 changed files with 166 additions and 146 deletions
Show Stats Download Patch File Download Diff File

10
Site Web/client/src/components/MiniProfil.js
Unescape View File

@ -22,10 +22,12 @@ const MiniProfil = ({uid} ) => {
} }
return ( return (
<div className="ListReco"> <div className="miniProfil">
<div className="UtiReco"> <div className="infoMiniProfil">
<img className="image" src={userData.picture.data}/> <img className="miniProfilImage" src={userData.picture.data}/>
<a href={`/Profil/${uid}`}>{userData.pseudo}</a> </div>
<div className="infoMiniProfil">
<a className="miniProfilLien" href={`/Profil/${uid}`}>{userData.pseudo}</a>
</div> </div>
</div> </div>
); );

7
Site Web/client/src/components/Post/DisplayPost/NouveauDisplayPosts.js
Unescape View File

@ -17,7 +17,7 @@ const NouveauDisplayPosts = () => {
if (!postsData) { if (!postsData) {
return <p>Loading...</p>; return <p>Loading...</p>;
} }
try{
return ( return (
<div> <div>
<ul> <ul>
@ -30,6 +30,11 @@ const NouveauDisplayPosts = () => {
</ul> </ul>
</div> </div>
); );
}
catch (error){
return <p>Loading...</p>;
}
}; };
export default NouveauDisplayPosts; export default NouveauDisplayPosts;

14
Site Web/client/src/components/Post/PostNouvelleAffichage.js
Unescape View File

@ -52,12 +52,12 @@ const PostNouvelleAffichage = ( { post } ) => {
if(!isLoading){ if(!isLoading){
return <p></p>; return <p></p>;
} }
try {
return ( return (
<li className='PostesProfilConteneur' key={post._id}> <li className='PostesProfilConteneur' key={post._id}>
{isLoading ? ( {isLoading ? (
<i className='fas fa-spinner fa-spin'></i> <i className='fas fa-spinner fa-spin'></i>
):( ) : (
<> <>
<div className="unPosteNouvelleAffichage"> <div className="unPosteNouvelleAffichage">
<div className="dateDePublicationDuPost"> <div className="dateDePublicationDuPost">
@ -75,15 +75,19 @@ const PostNouvelleAffichage = ( { post } ) => {
</div> </div>
<div id="commentaire"> <div id="commentaire">
<img src={Commentaire} onClick={() => setComments(!comments)}/> <img src={Commentaire} onClick={() => setComments(!comments)}/>
<div >{post.comments.length}</div> <div>{post.comments.length}</div>
</div> </div>
</div> </div>
</div> </div>
{comments && <Comment className="CommentaireProfil" post={post} />} {comments && <Comment className="CommentaireProfil" post={post}/>}
</> </>
) } )}
</li> </li>
); );
}
catch (error){
return <p>Loading...</p>;
}
}; };

4
Site Web/client/src/components/UserProfil/SuggestFriends.js
Unescape View File

@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
import { useSelector } from 'react-redux'; import { useSelector } from 'react-redux';
import { isEmpty } from '../Utils'; import { isEmpty } from '../Utils';
import FollowHandler from './FollowHandler'; import FollowHandler from './FollowHandler';
import MiniProfil from "../MiniProfil";
const SuggestFriends = () => { const SuggestFriends = () => {
const userData = useSelector((state) => state.user.user); const userData = useSelector((state) => state.user.user);
@ -79,8 +80,7 @@ const SuggestFriends = () => {
if(user === usersData[i]._id){ if(user === usersData[i]._id){
return ( return (
<div className="UtiReco" key={user}> <div className="UtiReco" key={user}>
<img src={usersData[i].picture} alt="img"/> <MiniProfil uid={usersData[i]._id}></MiniProfil>
<p>{usersData[i].pseudo}</p>
<FollowHandler idToFollow={usersData[i]._id} type={"card"}/> <FollowHandler idToFollow={usersData[i]._id} type={"card"}/>
</div> </div>
); );

48
Site Web/client/src/pages/Profil.js
Unescape View File

@ -1,4 +1,4 @@
import React,{useEffect, useState} from 'react'; import React, {useContext, useEffect, useState} from 'react';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import { useParams } from 'react-router-dom' import { useParams } from 'react-router-dom'
@ -9,15 +9,19 @@ import PostPersonnels from '../components/UserProfil/NavigationProfil/PostsPerso
import DossierPersonnels from '../components/UserProfil/NavigationProfil/DossiersPersonnels'; import DossierPersonnels from '../components/UserProfil/NavigationProfil/DossiersPersonnels';
import PostsLikes from '../components/UserProfil/NavigationProfil/PostsLikes'; import PostsLikes from '../components/UserProfil/NavigationProfil/PostsLikes';
import MiniProfil from "../components/MiniProfil"; import MiniProfil from "../components/MiniProfil";
import SuggestFriends from "../components/UserProfil/SuggestFriends";
import {UidContext} from "../components/AppContext";
const Profil = () => { const Profil = () => {
const { uid } = useParams(); const { uid } = useParams();
const [userData, setUserData] = useState(null); const [userData, setUserData] = useState(null);
const [followingPopup, setFollowingPopup] = useState(false); const [followingPopup, setFollowingPopup] = useState(false);
const [uidS, setUidS] = useState(false);
const [followerPopup, setFollowerPopup] = useState(false); const [followerPopup, setFollowerPopup] = useState(false);
const [dossierPersonnels,setdossierPersonnels ] = useState(false); const [dossierPersonnels,setdossierPersonnels ] = useState(false);
const [postPersonnels,setpostPersonnels ] = useState(true); const [postPersonnels,setpostPersonnels ] = useState(true);
const [postLikes,setpostLikes ] = useState(false) const [postLikes,setpostLikes ] = useState(false);
const uidU= useContext(UidContext);
useEffect(() => { useEffect(() => {
async function fetchData() { async function fetchData() {
@ -26,6 +30,9 @@ const Profil = () => {
setUserData(data); setUserData(data);
} }
fetchData(); fetchData();
if(uidU === uid){
setUidS(true);
}
}, [uid]); }, [uid]);
@ -50,7 +57,7 @@ const Profil = () => {
} }
return ( return (
<> <div>
<Navbar /> <Navbar />
{/* <main> {/* <main>
<div id="bandeauProfil"> <div id="bandeauProfil">
@ -145,7 +152,7 @@ const Profil = () => {
{/* <h3>suuu</h3> */} {/* <h3>suuu</h3> */}
</div> </div>
<div className="divSuivreFollowing"> <div className="divSuivreFollowing">
<a href="#" className="button" id="button">Suivre +</a> { uidS && <a href="#" className="button" id="button">Suivre +</a>}
</div> </div>
<div className="divSuivreFollowing"> <div className="divSuivreFollowing">
<div className="nbFollow" onClick={() => setFollowingPopup(true)}> <div className="nbFollow" onClick={() => setFollowingPopup(true)}>
@ -224,51 +231,24 @@ const Profil = () => {
<li className="navItemProfil"> <li className="navItemProfil">
<a className="navLinkProfil" id='PostsLikes' onClick={handleModals}>Posts likés</a> <a className="navLinkProfil" id='PostsLikes' onClick={handleModals}>Posts likés</a>
</li> </li>
</ul> </ul>
</nav> </nav>
</div> </div>
<div className="menuContent"> <div className="menuContent">
<div className="listContent"> <div className="listContent">
{dossierPersonnels &&<DossierPersonnels/>} {dossierPersonnels &&<DossierPersonnels/>}
{postPersonnels &&<PostPersonnels/>} {postPersonnels &&<PostPersonnels/>}
{postLikes &&<PostsLikes/>} {postLikes &&<PostsLikes/>}
</div> </div>
</div>
</div>
<div className="recoDiv">
<div className="reco">
<span>Vous pourriez suivre</span>
<hr/>
<div className="ListReco">
<div className="UtiReco">
<img className="image" src="https://ionicframework.com/docs/img/demos/avatar.svg"/>
<span>UtiT</span>
<a href="#" className="buttonReco" id="button">Suivre</a>
</div>
<div className="UtiReco">
<img className="image" src="https://ionicframework.com/docs/img/demos/avatar.svg"/>
<span>UtiT</span>
<a href="#" className="buttonReco" id="button">Suivre</a>
</div> </div>
<div className="UtiReco">
<img className="image" src="https://ionicframework.com/docs/img/demos/avatar.svg"/>
<span>UtiT</span>
<a href="#" className="buttonReco" id="button">Suivre</a>
</div> </div>
<div>
{uid && <SuggestFriends />}
</div> </div>
</div>
</div>
</div> </div>
</div> </div>
</main> </main>
</> </div>
) )
}; };

22
Site Web/client/src/pages/SearchBar.js
Unescape View File

@ -3,6 +3,7 @@ import { useSelector } from 'react-redux';
import Navbar from '../components/Navbar'; import Navbar from '../components/Navbar';
import Post from '../components/Post/Post'; import Post from '../components/Post/Post';
import { isEmpty } from '../components/Utils'; import { isEmpty } from '../components/Utils';
import MiniProfil from "../components/MiniProfil";
const SearchBar = () => { const SearchBar = () => {
const [searchValue, setSearchValue] = useState(""); const [searchValue, setSearchValue] = useState("");
@ -12,7 +13,6 @@ const SearchBar = () => {
const posts = useSelector((state) => state.post.post); const posts = useSelector((state) => state.post.post);
const users = useSelector((state) => state.users.users); const users = useSelector((state) => state.users.users);
const filteredResultsPosts = posts.filter(function(item) { const filteredResultsPosts = posts.filter(function(item) {
return item.tags.some(function(tag) { return item.tags.some(function(tag) {
return tag.toLowerCase().indexOf(searchValue.toLowerCase()) !== -1; return tag.toLowerCase().indexOf(searchValue.toLowerCase()) !== -1;
@ -50,34 +50,36 @@ const SearchBar = () => {
} }
}; };
try {
return ( return (
<div> <div>
<Navbar /> <Navbar/>
<main> <main>
<div className="search-main"> <div className="search-main">
<form> <form>
<input type="text" value={searchValue} onChange={(e) => setSearchValue(e.target.value)} placeholder="Rechercher..." /> <input type="text" value={searchValue} onChange={(e) => setSearchValue(e.target.value)}
placeholder="Rechercher..."/>
<button type="button" onClick={handleSearch}>Rechercher</button> <button type="button" onClick={handleSearch}>Rechercher</button>
</form> </form>
<div className="divMenuSearch"> <div className="divMenuSearch">
<nav role="navigation" className="navProfil"> <nav role="navigation" className="navProfil">
<ul className="navItemsProfil"> <ul className="navItemsProfil">
<li className="navItemProfil"> <li className="navItemProfil">
<a className="navLinkProfil" onClick={handleModals} id="Users" >Utilisateur</a> <a className="navLinkProfil" onClick={handleModals} id="Users">Utilisateur</a>
</li> </li>
<li className="navItemProfil"> <li className="navItemProfil">
<a className="navLinkProfil" onClick={handleModals} id="Posts" >Postes</a> <a className="navLinkProfil" onClick={handleModals} id="Posts">Postes</a>
</li> </li>
</ul> </ul>
</nav> </nav>
{ searchUsers && {searchUsers &&
<ul className='listUsers'> <ul className='listUsers'>
{searchResults.map((result) => ( {searchResults.map((result) => (
<li key={result.pseudo}>{result.pseudo}</li> <MiniProfil key={result._id} uid={result._id}></MiniProfil>
))} ))}
</ul> </ul>
} }
{ searchPosts && {searchPosts &&
<ul className='listUsers'> <ul className='listUsers'>
{searchResults.length !== 0 && searchResults.map((result) => ( {searchResults.length !== 0 && searchResults.map((result) => (
<Post post={result} key={result._id}/> <Post post={result} key={result._id}/>
@ -89,6 +91,10 @@ const SearchBar = () => {
</main> </main>
</div> </div>
); );
}
catch (error){
return <p>Loading...</p>;
}
}; };
export default SearchBar; export default SearchBar;

1
Site Web/client/src/styles/_settings.scss
Unescape View File

@ -39,6 +39,5 @@ body{
width: 180px; width: 180px;
height: 180px; height: 180px;
clip-path:circle(50%); clip-path:circle(50%);
} }

2
Site Web/client/src/styles/component/_ajoutLien.scss
Unescape View File

@ -2,7 +2,7 @@
border: solid black 2px; border: solid black 2px;
background-color: beige; background-color: beige;
border-radius: 10px; border-radius: 10px;
width: 140px; width: 250px;
height: 50px; height: 50px;
text-align: center; text-align: center;
cursor: pointer; cursor: pointer;

23
Site Web/client/src/styles/component/_miniProfil.scss
Unescape View File

@ -0,0 +1,23 @@
.miniProfil{
display: flex;
justify-content: start;
}
.infoMiniProfil{
margin-left: 10px;
}
.miniProfilLien{
font-weight: bold;
text-decoration : none;
}
.miniProfilImage{
object-fit: cover;
background-size: cover;
width: 25px;
height: 25px;
clip-path:circle(50%);
}

3
Site Web/client/src/styles/index.scss
Unescape View File

@ -9,7 +9,8 @@
@import'./component/configurationDuCompte.scss'; @import'./component/configurationDuCompte.scss';
@import'./component/politiqueDeConfidentialite'; @import'./component/politiqueDeConfidentialite';
@import './component/newPoste'; @import './component/newPoste';
@import'./component/postNouvelleAffichage'; @import './component/postNouvelleAffichage';
@import './component/miniProfil';
@import './pages/searchBar'; @import './pages/searchBar';

10
Site Web/client/src/styles/pages/_profil.scss
Unescape View File

@ -313,7 +313,7 @@ margin-top: 1%;
.divMenu { .divMenu {
margin: 0%; margin: 0%;
background-color: #cccaca; background-color: #cccaca;
width: 75%; width: 1000px;
height: 500px; height: 500px;
border-radius: 25px; border-radius: 25px;
} }
@ -351,14 +351,14 @@ scrollbar-gutter: stable both-edges;
} }
.basDePage { .basDePage {
display: flex; display: flex;
flex-direction: row ; justify-content: space-between;
justify-content: space-around;
} }
.recoDiv { .recoDiv {
width: 20%; width: 250px;
margin-top: 10px;
} }
.UtiReco { .UtiReco {

Write Preview
Loading…
Cancel
Save