merge all all

This commit is contained in:
Alexandre POMMIER 2023-06-23 20:30:14 +02:00
parent 6d1cd933e2
commit d5e3532bd0
5 changed files with 69 additions and 67 deletions

View File

@ -6,15 +6,14 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/01 18:24:46 by apommier #+# #+# */
/* Updated: 2023/06/20 19:05:10 by apommier ### ########.fr */
/* Updated: 2023/06/23 20:25:32 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
import React, { HtmlHTMLAttributes } from "react";
import { useEffect, useState, useRef } from "react";
import api from '../../script/axiosApi';
import api from '../../script/axiosApi.tsx';
import styled from "styled-components"
// import DefaultPicture from '../../assets/profile.jpg'
import DefaultPicture from '../../assets/profile.jpg'
// import { useRef } from "react";
// import { useEffect } from "react";
import '../../styles/Messages.css'
@ -28,7 +27,6 @@ const MeStyleP = styled.p`
color: white;
margin-right: 20px;
`
<<<<<<< HEAD
interface MessageMeProps {
message: Message;
@ -44,20 +42,13 @@ function MessageMe({message, own}: MessageMeProps){
const [user, setUser] = useState<User>();
const scrollRef = useRef<HTMLDivElement>(null);
// console.log("Message eher")
=======
function MessageMe({message, own}){
const [profilePicture, setProfilePicture] = useState('');
const scrollRef = useRef<HTMLDivElement>(null);
const DefaultPicture: string = '../../assets/profile.jpg'
>>>>>>> sadjigui
useEffect(() => {
if (scrollRef.current)
{
scrollRef.current.scrollIntoView({ behavior: "smooth",})
}
scrollRef.current.scrollIntoView({ behavior: "smooth"});
}})
useEffect(() => {
const fetchProfilePicture = async () => {
try {
// const user = await api.get("/profile");
@ -91,20 +82,13 @@ function MessageMe({message, own}){
};
if (!user || !sender || !conv)
{
// console.log("return")
return (<></>);
}
// console.log("result includes=", conv.banned.includes(user.username))
// console.log("result includes=", conv.blocked.includes(user.username))
if (user.blocked && user.blocked.includes(message.sender))
return (<></>);
// else if (conv.banned && conv.banned.includes(user.username))
// {
// console.log("return2")
// return (<></>);
// }
// console.log("noy return")
else if (conv.banned && conv.banned.includes(user.username))
return (<></>);
// if (user.blocked.includes(message.sender))/
return (

View File

@ -1,11 +1,11 @@
import { motion } from "framer-motion";
import Backdrop from "../Sidebar/Backdrop";
import Backdrop from "../Sidebar/Backdrop.tsx";
// import { Rank } from "../../DataBase/DataRank"
import '../../styles/Messages.css'
import { useState, useEffect } from "react";
import { GrAdd } from "react-icons/gr";
import { Link } from "react-router-dom";
import api from "../../script/axiosApi";
import api from "../../script/axiosApi.tsx";
import React from "react";
const dropIn = {
@ -21,7 +21,6 @@ const dropIn = {
}},
exit:{y: "100vh",
opacity: 0,},
};
const Modal = ({handleClose}) => {
@ -100,30 +99,29 @@ const Modal = ({handleClose}) => {
// let new_name;
return (
<<<<<<< HEAD
<Backdrop onClick={handleClose}>
=======
<Backdrop >
>>>>>>> sadjigui
<Backdrop>
<motion.div
onClick={(e) => e.stopPropagation()}
className="modal"
// variant={dropIn}
className="modalSetting"
variant={dropIn}
initial="hidden"
animate="visible"
exit="exit"
>
{/* <p>New Conversation</p> */}
<div className="settingFirstPart2">
{selectTags.map((selectTag) => (
<div key={selectTag.id}>
<div key={selectTag.id}>
<select
value={selectTag.selectedOption}
onChange={(a) => handleOptionChange(selectTag.id, a.target.value)}
>
>
<option value="">{
selectTag.selectedOption ? selectTag.selectedOption : "Select an option"
}</option>
selectTag.selectedOption ? selectTag.selectedOption : "Select an option"
}</option>
{users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.name)).map((item, index) => (
<option key={index} value={item.username}>
<option key={index} value={item.username}>
{item.username}
</option>
))}
@ -138,28 +136,30 @@ const Modal = ({handleClose}) => {
<Link to="#" className="submit" onClick={handleClose}>Cancel</Link>
</div>
</div>
<div className="settingSecondPart">
{convs.length > 0 && (
<select
value={channel}
onChange={(event) => setChannel(event.target.value)}
<select
value={channel}
onChange={(event) => setChannel(event.target.value)}
>
<option value="">Select an option</option>
{convs.map((conv) => (
!(!conv.group || conv.private || (conv.banned && conv.banned.includes(user.username)) || (conv.members && conv.members.includes(user.username))) && (
<option key={conv.id} value={conv.id}>
!(!conv.group || conv.private || (conv.banned && conv.banned.includes(user.username)) || (conv.members && conv.members.includes(user.username))) && (
<option key={conv.id} value={conv.id}>
{conv.name}
</option>
)
))}
))}
</select>
)}
{channel.private ? (
<input className="mdp" placeholder="password" type="text" />
):("")}
<input className="mdp" placeholder="password" type="text" />
):("")}
<div className="div_submit">
@ -168,6 +168,7 @@ const Modal = ({handleClose}) => {
</div>
</motion.div>
</Backdrop>
)

View File

@ -1,6 +1,6 @@
.home{
background-color: rgb(0, 0, 0);
height: 90vh;
height: 70vh;
display: flex;
align-items: center;
justify-content: center;
@ -202,6 +202,7 @@ p {
text-decoration: none;
font-weight:lighter;
margin: 1%;
height: 25px;
}
.darkSubmit{
@ -307,11 +308,17 @@ p {
/* flex-direction: column; */
/* align-items: center; */
background-color: #3e3c61;
overflow: scroll;
}
.settingFirstPart{
margin-top: 10%;
margin-left: 15%;
margin-left: 20%;
}
.settingFirstPart2{
margin-top: 10%;
margin-left: 30%;
}
.settingSecondPart{
@ -324,6 +331,7 @@ p {
.checkbox{
display:flex;
flex-direction:row;
margin-left: 60px;
}
input.in{
@ -331,17 +339,25 @@ input.in{
margin-left: 0px;
background-color: black;
color: white;
border-radius: 12px;
border-radius: 4px;
width: 70%;
height: 100%;
font-weight:100;
font-size: 20px;
padding: 7px;
}
input.in_howLong{
margin-top: 14.5%;
margin-top: 13%;
margin-left: 0px;
background-color: black;
color: white;
border-radius: 12px;
width: 15%;
border-radius: 4px;
width: 10%;
height: 10%;
font-weight:100;
font-size: 20px;
padding: 7px;
}
.mdp{
@ -351,3 +367,8 @@ input.in_howLong{
width: 20%;
}
.case{
height: auto;
width: auto;
margin-left: 10px;
}

View File

@ -62,6 +62,7 @@
.page {
text-align: center;
overflow-y: scroll;
/* height: 80vh; */
/* height: 50vh; */
/* width: 50vh; */
/* background-color: black; */
@ -80,7 +81,6 @@
border-radius: 50%;
border: thick;
border-color: red;
margin-left: 10px;
/* border-image: linear-gradient(90deg, #5843e4, #5a0760); */
/* margin-top: 20px; */
@ -97,11 +97,11 @@
}
.history{
display: inline-block;
display:inline-block;
color: white;
background-color: #5843e4;
border-radius: 20px;
padding: 14px;
padding: 20px 500px;
font-size: 1.7rem;
text-decoration: none;
font-weight: bold;

View File

@ -1,18 +1,14 @@
.playButton {
background-image: linear-gradient(90deg, #5843e4, #5a0760);
display: flex;
flex-wrap: wrap;
overflow: hidden;
border-radius: 5vh;
color: white;
/* display: block; */
display: block;
margin: auto;
margin-top: 30vh;
padding: 2vh 4vw;
padding: 2vh 5vw;
height: 10vh;
width: 20vw;
font-size: 250%;
text-align: center;
font-size: 300%;
}