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
Darius BERTRAND 2 years ago
parent 551f7cd469 7e41fc2295
commit e0372627df
13 changed files with 190 additions and 147 deletions
Show Stats Download Patch File Download Diff File

7
Site Web/client/src/components/Log/index.js
Unescape View File

@ -1,6 +1,7 @@
import React, { useState } from 'react';
import Connexion from './Connexion';
import Inscription from './Inscription';
import Logo from '../../assets/img/logo.png';
const Log = ( props ) => {
const [signUpModal, setSignUpModal] = useState(props.signup);
@ -18,6 +19,12 @@ const Log = ( props ) => {
return (
<div className="connection-form">
<div className='form-presentation'>
<img src={Logo} alt='Favor'/>
<p>Bienvenue!</p>
<p>"Comment découvrir et partager des sites et des ressources sur internet de manière plus efficace et personnalisée ?"</p>
<p></p>
</div>
<div className="form-container">
<div className="info-form-container">
<ul className='ul-profil'>

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

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

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

@ -18,19 +18,24 @@ const NouveauDisplayPosts = () => {
if (!postsData) {
return <p>Loading...</p>;
}
try{
return (
<div>
<ul>
{!isEmpty(postsData[0]) &&
postsData.map((post) => {
if(post.postedId === uid){
return <Post post={post} key={post._id}/>
}
})}
</ul>
</div>
);
}
catch (error){
return <p>Loading...</p>;
return (
<div>
<ul>
{!isEmpty(postsData[0]) &&
postsData.map((post) => {
if(post.postedId === uid){
return <Post post={post} key={post._id}/>
}
})}
</ul>
</div>
);
}
};
export default NouveauDisplayPosts;

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

@ -49,38 +49,43 @@ const PostNouvelleAffichage = ( { post } ) => {
!isEmpty(usersData[0]) && setIsLoading(false)
})
return (
<li className='PostesProfilConteneur' key={post._id}>
{isLoading ? (
<i className='fas fa-spinner fa-spin'></i>
):(
<>
<div className="unPosteNouvelleAffichage">
<div className="dateDePublicationDuPost">
<div>{dateParser(post.createdAt)}</div>
</div>
<div className="LienDunPosteNouvelleAffichage">
<LinkPreview link={post.lien}/>
<p>{post.message}</p>
</div>
<div className='informationDunPosteNouvelleAffichage'>
<div id="like">
<ButtonLike post={post}/>
{/* <img src="coeurs.png"/> */}
<div>{post.likers.length}</div>
</div>
<div id="commentaire">
<img src={Commentaire} onClick={() => setComments(!comments)}/>
<div >{post.comments.length}</div>
</div>
</div>
</div>
{comments && <Comment className="CommentaireProfil" post={post} />}
</>
) }
</li>
);
try {
return (
<li className='PostesProfilConteneur' key={post._id}>
{isLoading ? (
<i className='fas fa-spinner fa-spin'></i>
) : (
<>
<div className="unPosteNouvelleAffichage">
<div className="dateDePublicationDuPost">
<div>{dateParser(post.createdAt)}</div>
</div>
<div className="LienDunPosteNouvelleAffichage">
<LinkPreview link={post.lien}/>
<p>{post.message}</p>
</div>
<div className='informationDunPosteNouvelleAffichage'>
<div id="like">
<ButtonLike post={post}/>
{/* <img src="coeurs.png"/> */}
<div>{post.likers.length}</div>
</div>
<div id="commentaire">
<img src={Commentaire} onClick={() => setComments(!comments)}/>
<div>{post.comments.length}</div>
</div>
</div>
</div>
{comments && <Comment className="CommentaireProfil" post={post}/>}
</>
)}
</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 { isEmpty } from '../Utils';
import FollowHandler from './FollowHandler';
import MiniProfil from "../MiniProfil";
const SuggestFriends = () => {
const userData = useSelector((state) => state.user.user);
@ -79,8 +80,7 @@ const SuggestFriends = () => {
if(user === usersData[i]._id){
return (
<div className="UtiReco" key={user}>
<img src={usersData[i].picture} alt="img"/>
<p>{usersData[i].pseudo}</p>
<MiniProfil uid={usersData[i]._id}></MiniProfil>
<FollowHandler idToFollow={usersData[i]._id} type={"card"}/>
</div>
);

68
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 { useParams } from 'react-router-dom'
@ -9,15 +9,19 @@ import PostPersonnels from '../components/UserProfil/NavigationProfil/PostsPerso
import DossierPersonnels from '../components/UserProfil/NavigationProfil/DossiersPersonnels';
import PostsLikes from '../components/UserProfil/NavigationProfil/PostsLikes';
import MiniProfil from "../components/MiniProfil";
import SuggestFriends from "../components/UserProfil/SuggestFriends";
import {UidContext} from "../components/AppContext";
const Profil = () => {
const { uid } = useParams();
const [userData, setUserData] = useState(null);
const [followingPopup, setFollowingPopup] = useState(false);
const [uidS, setUidS] = useState(false);
const [followerPopup, setFollowerPopup] = useState(false);
const [dossierPersonnels,setdossierPersonnels ] = useState(false);
const [postPersonnels,setpostPersonnels ] = useState(true);
const [postLikes,setpostLikes ] = useState(false)
const [postLikes,setpostLikes ] = useState(false);
const uidU= useContext(UidContext);
useEffect(() => {
async function fetchData() {
@ -26,6 +30,9 @@ const Profil = () => {
setUserData(data);
}
fetchData();
if(uidU === uid){
setUidS(true);
}
}, [uid]);
@ -50,8 +57,8 @@ const Profil = () => {
}
return (
<>
<Navbar />
<div>
<Navbar />
{/* <main>
<div id="bandeauProfil">
<h1 classNameName='affichage-date'>Compte créé le : {dateParser(userData.createdAt)}</h1>
@ -134,8 +141,8 @@ const Profil = () => {
</div>
</main> */}
<main>
<div>
<main>
<div>
<div>
<div className="imageProfil">
<img className="image" src={userData.picture}/>
@ -145,7 +152,7 @@ const Profil = () => {
{/* <h3>suuu</h3> */}
</div>
<div className="divSuivreFollowing">
<a href="#" className="button" id="button">Suivre +</a>
{ uidS && <a href="#" className="button" id="button">Suivre +</a>}
</div>
<div className="divSuivreFollowing">
<div className="nbFollow" onClick={() => setFollowingPopup(true)}>
@ -211,7 +218,7 @@ const Profil = () => {
<div className="basDePage">
<div className="divMenu">
<div className="divMenu">
<div>
<nav role="navigation" className="navProfil">
<ul className="navItemsProfil">
@ -223,52 +230,25 @@ const Profil = () => {
</li>
<li className="navItemProfil">
<a className="navLinkProfil" id='PostsLikes' onClick={handleModals}>Posts likés</a>
</li>
</li>
</ul>
</nav>
</div>
<div className="menuContent">
<div className="listContent">
{dossierPersonnels &&<DossierPersonnels/>}
{postPersonnels &&<PostPersonnels/>}
{postLikes &&<PostsLikes/>}
{dossierPersonnels &&<DossierPersonnels/>}
{postPersonnels &&<PostPersonnels/>}
{postLikes &&<PostsLikes/>}
</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 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>
<div>
{uid && <SuggestFriends />}
</div>
</div>
</div>
</main>
</>
</div>
</main>
</div>
)
};

94
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 Post from '../components/Post/Post';
import { isEmpty } from '../components/Utils';
import MiniProfil from "../components/MiniProfil";
const SearchBar = () => {
const [searchValue, setSearchValue] = useState("");
@ -12,7 +13,6 @@ const SearchBar = () => {
const posts = useSelector((state) => state.post.post);
const users = useSelector((state) => state.users.users);
const filteredResultsPosts = posts.filter(function(item) {
return item.tags.some(function(tag) {
return tag.toLowerCase().indexOf(searchValue.toLowerCase()) !== -1;
@ -31,9 +31,9 @@ const SearchBar = () => {
console.log("Recherche pour : " + input);
if(searchUsers && searchValue !== "")
setSearchResults(filteredResultsUsers);
setSearchResults(filteredResultsUsers);
else if(searchPosts && searchValue !== "")
setSearchResults(filteredResultsPosts);
setSearchResults(filteredResultsPosts);
}
const handleModals = (e) => {
@ -41,54 +41,60 @@ const SearchBar = () => {
setSearchUsers(true);
setSearchPosts(false);
if(searchValue !== "")
setSearchResults(filteredResultsUsers);
setSearchResults(filteredResultsUsers);
} else {
setSearchPosts(true);
setSearchUsers(false);
if(searchValue !== "")
setSearchResults(filteredResultsPosts);
setSearchResults(filteredResultsPosts);
}
};
return (
<div>
<Navbar />
<main>
<div className="search-main">
<form>
<input type="text" value={searchValue} onChange={(e) => setSearchValue(e.target.value)} placeholder="Rechercher..." />
<button type="button" onClick={handleSearch}>Rechercher</button>
</form>
<div className="divMenuSearch">
<nav role="navigation" className="navProfil">
<ul className="navItemsProfil">
<li className="navItemProfil">
<a className="navLinkProfil" onClick={handleModals} id="Users" >Utilisateur</a>
</li>
<li className="navItemProfil">
<a className="navLinkProfil" onClick={handleModals} id="Posts" >Postes</a>
</li>
</ul>
</nav>
{ searchUsers &&
<ul className='listUsers'>
{searchResults.map((result) => (
<li key={result.pseudo}>{result.pseudo}</li>
))}
</ul>
}
{ searchPosts &&
<ul className='listUsers'>
{searchResults.length !== 0 && searchResults.map((result) => (
<Post post={result} key={result._id}/>
))}
</ul>
}
</div>
</div>
</main>
</div>
);
try {
return (
<div>
<Navbar/>
<main>
<div className="search-main">
<form>
<input type="text" value={searchValue} onChange={(e) => setSearchValue(e.target.value)}
placeholder="Rechercher..."/>
<button type="button" onClick={handleSearch}>Rechercher</button>
</form>
<div className="divMenuSearch">
<nav role="navigation" className="navProfil">
<ul className="navItemsProfil">
<li className="navItemProfil">
<a className="navLinkProfil" onClick={handleModals} id="Users">Utilisateur</a>
</li>
<li className="navItemProfil">
<a className="navLinkProfil" onClick={handleModals} id="Posts">Postes</a>
</li>
</ul>
</nav>
{searchUsers &&
<ul className='listUsers'>
{searchResults.map((result) => (
<MiniProfil key={result._id} uid={result._id}></MiniProfil>
))}
</ul>
}
{searchPosts &&
<ul className='listUsers'>
{searchResults.length !== 0 && searchResults.map((result) => (
<Post post={result} key={result._id}/>
))}
</ul>
}
</div>
</div>
</main>
</div>
);
}
catch (error){
return <p>Loading...</p>;
}
};
export default SearchBar;

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

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

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

@ -2,7 +2,7 @@
border: solid black 2px;
background-color: beige;
border-radius: 10px;
width: 140px;
width: 250px;
height: 50px;
text-align: center;
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/politiqueDeConfidentialite';
@import './component/newPoste';
@import'./component/postNouvelleAffichage';
@import './component/postNouvelleAffichage';
@import './component/miniProfil';
@import './pages/searchBar';

17
Site Web/client/src/styles/pages/_homenavigation.scss
Unescape View File

@ -52,7 +52,7 @@
flex-direction: row-reverse;
justify-content: center;
padding-top: 4%;
padding-left: 400px;
}
@ -171,3 +171,18 @@ input[type="submit"]:hover, .buttonTEL:hover{
visibility: hidden;
}
*/
.form-presentation{
width: 400px;
display: flex;
flex-direction: column;
align-items: center;
height: 100%;
position: fixed;
border-right: 2px solid black;
border-radius: 5px;
p{
padding-top: 10%;
}
}

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

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

Write Preview
Loading…
Cancel
Save