Kinou/ft_transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix mute ? fix socket fix infinite request profile, modify port

Browse Source
This commit is contained in:
Alexandre POMMIER 2023-06-23 19:59:23 +02:00
parent cdd2836e7c
commit c07a169794
10 changed files with 132 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
conf/nginx.conf
View File

@ -21,7 +21,7 @@ server {
proxy_pass http://api:3000/api;
}
location /socket {
location /socket.io {
# Forward requests to socket server running on port 4001
if ($request_uri ~ ^/socket/4001) {
proxy_pass http://chat:4001;

13
containers/api/src/app.controller.ts
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/17 01:00:00 by apommier #+# #+# */
/* Updated: 2023/06/21 01:19:01 by apommier ### ########.fr */
/* Updated: 2023/06/23 19:15:56 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -588,7 +588,7 @@ export class AppController {
async muteUser(@Body() data: any) {
if (!data.username)
return ;
return await this.chatService.muteUser(data.convId, data.username)
return await this.chatService.muteUser(data.convId, data.username, data.time)
}
@UseGuards(JwtAuthGuard)
@ -598,11 +598,16 @@ export class AppController {
return await this.chatService.isAdmin(data.convId, req.user.username)
}
@UseGuards(JwtAuthGuard)
@Post('/private')
async setPrivate(@Body() data: any) {
return await this.chatService.setPrivate(data.convId)
return await this.chatService.setPrivate(data.convId, true)
}
@UseGuards(JwtAuthGuard)
@Post('/public')
async setPublic(@Body() data: any) {
return await this.chatService.setPrivate(data.convId, false)
}
@UseGuards(JwtAuthGuard)

24
containers/api/src/chat/chat.service.ts
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/17 01:00:25 by apommier #+# #+# */
/* Updated: 2023/06/20 16:47:02 by apommier ### ########.fr */
/* Updated: 2023/06/23 19:37:41 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -119,14 +119,22 @@ async verifyPassword(convId: number, password: string) {
// conv.password = password
}
async muteUser(convId: number, username: string) {
async muteUser(convId: number, username: string, time: string) {
const conv = await this.findConv(convId);
console.log("MUTE USER");
conv.muted = conv.muted || [];
if (conv.muted.find(item => item === username))
return (1);
conv.muted.push(username);
this.save(conv);
setTimeout(() => {
conv.muted = conv.muted.filter((item) => item !== username)
this.save(conv);
}, 5000);
console.log("END MUTE USER");
}
async setAdmin(convId: number, username: string) {
@ -149,12 +157,14 @@ async isAdmin(convId: number, username: string) {
return (0);
}
async setPrivate(convId: number) {
async setPrivate(convId: number, bool: boolean) {
const conv = await this.findConv(convId);
if (conv.private === true)
conv.private = false;
else
conv.private = true;
console.log("bool= ", bool);
conv.private = bool;
// if (conv.private === true)
// conv.private = false;
// else
// conv.private = true;
this.save(conv);
}

4
containers/react/src/components/Game/Rank.tsx
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/09 08:49:24 by apommier #+# #+# */
/* Updated: 2023/06/20 13:06:35 by apommier ### ########.fr */
/* Updated: 2023/06/23 17:16:40 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -41,7 +41,7 @@ function Rank({user, index}: RankProps){
};
fetchProfilePicture();
})
}, [])
// console.log(index);
return (

2
containers/react/src/components/Messages/Chats.tsx
View File

@ -119,7 +119,7 @@ function Chats(){
setUsers(tmpUsers.data);
// console.log(`connection....`);
socket.current = io('http://' + process.env.REACT_APP_BASE_URL + ':4001', { transports: ['polling'] });
socket.current = io('http://localhost:4001', { transports: ['polling'] });
// console.log(`connection done`);
socket.current.emit('connection', {username: tmpUser.data.username})
socket.current.on('message', (data) => { //data should be a message ?)

112
containers/react/src/components/Messages/ModalSetting.tsx
View File

@ -39,8 +39,10 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
const [selectTags, setSelectTag] = useState([{ id: 1, selectedOption: ''}]);
const [selectedUser, setSelectedUser] = useState("");
const [newName, setNewName] = useState("");
const [time, setTime] = useState("");
const [newPassword, setNewPassword] = useState("");
const [privateConv, setPrivateConv] = useState(false);
const [privateConv, setPrivateConv] = useState<Boolean>();
const [loading, setLoading] = useState<Boolean>(true);
const dark = () => setPrivateConv(true);
const light = () => setPrivateConv(false);
const [mute, setMute] = useState(false);
@ -53,9 +55,15 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
console.log("convid =", convId)
const getUsers = async ()=>{
try {
const currentConv = await api.post("/convId", {convId: convId});
// console.log("conv private =================== ", )
if (currentConv.data.private)
setPrivateConv(true);
const tmpUsers = await api.get("/users");
console.log("users=", tmpUsers.data);
setUsers(tmpUsers.data);
setLoading(false);
} catch(err){
console.log(err)
}
@ -63,6 +71,31 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
getUsers();
}, []);
useEffect(() => {
// Function to run when myVariable changes
const handleVariableChange = () => {
console.log('Variable changed:', privateConv);
if (privateConv === undefined)
{
console.log("return")
return ;
}
try {
if (privateConv)
api.post("/private", {convId: convId})
else
api.post("/public", {convId: convId})
} catch (err){
console.log(err);
}
};
if (!loading)
handleVariableChange();
// return () => {
// handleVariableChange();
// };
}, [privateConv]);
// const [multi, setMulti] = useState(false);
// const [selectedOptionArray, setSelectedOptionArray] = useState([]);
@ -80,30 +113,30 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
const handleCheckPass = (e: { target: { checked: boolean | ((prevState: boolean) => boolean); }; }) => {
setPassword(e.target.checked);
console.log("password??", e.target.checked)
console.log("password??", e.target.checked);
}
const handleCheckPriv = (e: { target: { checked: any; }; }) => {
// setPassword(e.target.checked);
if (e.target.checked)
{
console.log("chack true", e.target.checked)
try{
api.post("/private", {convId: convId})
} catch(err) {
console.log(err);
}
}
else
{
console.log("chack false", e.target.checked)
try{
api.post("/private", {convId: convId})
} catch(err) {
console.log(err);
}
}
}
// const handleCheckPriv = (e: { target: { checked: any; }; }) => {
// // setPassword(e.target.checked);
// if (e.target.checked)
// {
// console.log("chack true", e.target.checked)
// try{
// api.post("/private", {convId: convId})
// } catch(err) {
// console.log(err);
// }
// }
// else
// {
// console.log("chack false", e.target.checked)
// try{
// api.post("/private", {convId: convId})
// } catch(err) {
// console.log(err);
// }
// }
// }
const handleName = async (e: { key: string; })=>{
if (e.key !== "Enter")
@ -157,11 +190,15 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
handleClose();
};
const handleMute = async () => {
if (!selectedUser.length)
const handleMute = async (e: { key: string; }) => {
console.log(`e in press= ${e.key}`)
if (e.key != "Enter")
return ;
// console.log("value mute = ", e.target.value);
console.log("value mute = ", time);
try{
await api.post("/mute", {convId: convId, username: selectedUser})
await api.post("/mute", {convId: convId, username: selectedUser, time: time})
} catch(err) {
console.log(err);
}
@ -177,6 +214,17 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
handleClose();
};
const handleKeyPress = async (e: { key: string; })=> {
if (e.key !== "Enter")
return ;
try{
}
catch(err){
}
}
return (
<Backdrop onClick={handleClose}>
<motion.div
@ -198,7 +246,7 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
<p className="checkbox">Password<input type="checkbox" value="password" checked={password} onChange={handleCheckPass}/> </p>
{password || privateConv ? (
{password ? (
<input
onChange={(e) => setNewPassword(e.target.value)}
onKeyDown={handlePassword}
@ -208,7 +256,6 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
):
("")}
</div>
<div className="forName">
<input
@ -254,7 +301,14 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
</div>
{mute ? (
<input type="text" className="in_howLong" placeholder="How long ?" />
<input
onKeyDown={handleMute}
type="number"
className="in_howLong"
placeholder="How long ?"
value={time}
onChange={(e) => setTime(e.target.value)}
/>
):("")}
</motion.div>

5
containers/react/src/components/Social/Friend.tsx
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/09 08:18:58 by apommier #+# #+# */
/* Updated: 2023/06/20 13:41:44 by apommier ### ########.fr */
/* Updated: 2023/06/23 17:12:07 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -59,9 +59,8 @@ export default function Friend({currentUser}: UserProps)
console.error('Error fetching profile picture:', error);
}
};
fetchProfilePicture();
})
}, []);
function getStatus(friend: User)
{

47
containers/react/src/pages/Home.tsx
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/09 08:19:04 by apommier #+# #+# */
/* Updated: 2023/06/23 15:58:14 by apommier ### ########.fr */
/* Updated: 2023/06/23 17:33:51 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -82,43 +82,13 @@ function Profile () {
// }
};
// const handleUpload = async () => {
// const formData = new FormData();
// formData.append('photo', selectedPhoto);
// try {
// await api.post('/picture', formData);
// console.log('File uploaded successfully');
// window.location.reload();
// } catch (error) {
// console.error('Error uploading file:', error);
// }
// };
// const handleUpload = async (event: React.FormEvent) => {
// event.preventDefault()
// console.log("up photo")
// if (selectedPhoto) {
// console.log("selected photo")
// const formData = new FormData();
// formData.append('photo', selectedPhoto);
// try {
// await api.post('/picture', formData);
// console.log('File uploaded successfully');
// window.location.reload();
// } catch (error) {
// console.error('Error uploading file:', error);
// }
// } else {
// console.log('No file selected');
// }
// };
useEffect(()=> {
const getUser = async ()=>{
console.log(`username= ${username}`)
// const pic
let pic
let pic;
try{
console.log("before request")
const me = await api.get("/profile")
if (!username)
{
@ -202,7 +172,7 @@ function Profile () {
function Home () {
const [move, setmove ] = useState(false);
const [user, setUser] = useState([]);
const [user, setUser] = useState<User>();
const [successQr, setSuccessQr] = useState(false);
const [successSword, setSuccessSword] = useState(false);
@ -224,7 +194,7 @@ function Home () {
}
};
fetchSuccess();
})
}, []);
return (
<motion.div className="page"
@ -232,14 +202,13 @@ function Home () {
animate={{opacity: 1}}
exit={{opacity: -1}}>
<div>
{user.otp_verified ? (
{user && user.otp_verified ? (
<MdQrCodeScanner className='success' onClick={() => setSuccessQr(true)}/>
):("")}
{user.win >= 2 ? (
{user && user.win >= 2 ? (
<GiWingedSword className="success" onClick={() => setSuccessSword(true)}/>
):("")}
{user.win >= 5 ? (
{user && user.win >= 5 ? (
<GiCrownedSkull className="success" onClick={() => setSuccessCrown(true)}/>
):("")}
</div>

10
containers/react/src/script/tokenSuccess.tsx
View File

@ -3,12 +3,15 @@ import { useState, useEffect } from 'react'
import queryString from 'query-string';
import api from "./axiosApi.tsx";
import axios from 'axios';
import React from 'react';
import {Matchlog, User} from "../../interfaces.tsx"
function SuccessToken() {
const location = useLocation();
const { data } = queryString.parse(location.search);
const [code, setCode] = useState('');
const [user, setUser] = useState(false);
const [user, setUser] = useState<User>();
useEffect(() => {
if (!data) {
@ -37,7 +40,7 @@ function SuccessToken() {
getUser();
}, [data]);
const handleKeyPress = async (e)=>{
const handleKeyPress = async (e: { key: string; })=>{
// console.log(`e in press= ${e.key}`)
if (e.key !== "Enter")
return ;
@ -90,7 +93,8 @@ function SuccessToken() {
// Render a loading indicator or return null while user is being fetched
return <h1>Loading...</h1>;
}
if (!data)
return ;
const cleanData = data.slice(1, -1); // Declare cleanData here as well
if (!user.otp_verified) {

10
docker-compose.yml
View File

@ -14,19 +14,9 @@ services:
- 8080:8080
volumes:
- ./conf/nginx.conf:/etc/nginx/conf.d/default.conf
# volumes:
# - "./conf:/etc/nginx/templates/"
# ports:
# - 80:80
# volumes:
# - ./conf/nginx.conf:/etc/nginx/conf.d/default.conf
# command: sh -c "envsubst < /etc/nginx/conf.d/default.conf > /etc/nginx/conf.d/default.conf && nginx -g 'daemon off;'"
# - ./containers/frontend:/var/www/html
networks:
- pongNetwork
react_app:
image: node:latest
container_name: react_app