merge reborn
This commit is contained in:
commit
abf09f24fd
19
.env
19
.env
@ -7,18 +7,17 @@
|
||||
# POSTGRES_PASSWORD=pass
|
||||
# POSTGRES_DB=postgreDB
|
||||
# POSTGRES_ROOT_PASSWORD=pass
|
||||
# POSTGRES_HOST=bess-f2r5s13
|
||||
# POSTGRES_HOST=localhost
|
||||
# POSTGRES_HOST_AUTH_METHOD=trust
|
||||
|
||||
#URL
|
||||
NGINX_ENVSUBST_TEMPLATE_SUFFIX=".conf"
|
||||
|
||||
# BASE_URL=http://bess-f2r5s13
|
||||
# SOCKET_URL=bess-f2r5s13:8080
|
||||
BASE_URL=bess-f2r5s13:8080
|
||||
REACT_APP_BASE_URL=bess-f2r5s13:8080
|
||||
REDIRECT_URI=http://bess-f2r5s13:8080/api/auth/login
|
||||
INTRA_URL="https://api.intra.42.fr/oauth/authorize?client_id=u-s4t2ud-2bd3c5d4f41e776f2e3d5d699d2a8421f6d0c0468ec882516d9ca89b0c211789&redirect_uri=http%3A%2F%2Fbess-f2r5s13%3A8080%2Fapi%2Fauth%2Flogin&response_type=code"
|
||||
# BASE_URL=http://localhost
|
||||
# SOCKET_URL=localhost:8080
|
||||
BASE_URL=localhost:8080
|
||||
REACT_APP_BASE_URL=localhost:8080
|
||||
REDIRECT_URI=http://localhost:8080/api/auth/login
|
||||
#postgres var
|
||||
# POSTGRES_HOST=127.0.0.1
|
||||
# DB_TYPE=postgres
|
||||
@ -43,6 +42,6 @@ REACT_HOST=0.0.0.0
|
||||
|
||||
#auth var
|
||||
JWT_SECRET=secrethere
|
||||
# REDIRECT_URI=http://bess-f2r5s13:80/api/auth/login
|
||||
API_SECRET=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
|
||||
CLIENT_UID=u-s4t2ud-2bd3c5d4f41e776f2e3d5d699d2a8421f6d0c0468ec882516d9ca89b0c211789
|
||||
# REDIRECT_URI=http://localhost:80/api/auth/login
|
||||
API_SECRET=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
|
||||
CLIENT_UID=u-s4t2ud-6d29dfa49ba7146577ffd8bf595ae8d9e5aaa3e0a9615df18777171ebf836a41
|
||||
|
||||
@ -6,13 +6,12 @@
|
||||
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
|
||||
/* +#+#+#+#+#+ +#+ */
|
||||
/* Created: 2023/06/17 01:00:00 by apommier #+# #+# */
|
||||
/* Updated: 2023/06/26 03:23:42 by apommier ### ########.fr */
|
||||
/* Updated: 2023/06/26 04:10:56 by apommier ### ########.fr */
|
||||
/* */
|
||||
/* ************************************************************************** */
|
||||
|
||||
import { Controller, Request, Req, Get, Post, UseGuards, Redirect, Res, Body, UploadedFile, UseInterceptors} from '@nestjs/common';
|
||||
import { FileInterceptor } from '@nestjs/platform-express';
|
||||
|
||||
import { JwtAuthGuard } from './auth/jwt-auth.guard';
|
||||
import { AuthService } from './auth/auth.service';
|
||||
import { loginClass } from './auth/login42'
|
||||
@ -452,14 +451,22 @@ export class AppController {
|
||||
@UseGuards(JwtAuthGuard)
|
||||
@Post('/quit')
|
||||
async setOffline(@Request() req) {
|
||||
|
||||
const user = await this.userService.findOne(req.user.username);
|
||||
|
||||
user.status = 0;
|
||||
user.sessionNumber-- ;
|
||||
if (!user.sessionNumber)
|
||||
user.status = 0;
|
||||
await this.userService.save(user);
|
||||
console.log("User quit");
|
||||
}
|
||||
|
||||
@UseGuards(JwtAuthGuard)
|
||||
@Post('/addSession')
|
||||
async addSession(@Request() req) {
|
||||
|
||||
const user = await this.userService.findOne(req.user.username);
|
||||
user.sessionNumber++ ;
|
||||
await this.userService.save(user);
|
||||
}
|
||||
|
||||
//========================================================================================================
|
||||
//========================================================================================================
|
||||
|
||||
@ -17,8 +17,6 @@ export class loginClass {
|
||||
let userId = null;
|
||||
let userName = null;
|
||||
|
||||
console.log("process.env.REDIRECT_URI=", process.env.REDIRECT_URI)
|
||||
|
||||
const params = new URLSearchParams(url.split('?')[1]);
|
||||
const code = params.get('code');
|
||||
|
||||
@ -76,6 +74,7 @@ export class loginClass {
|
||||
friends: null,
|
||||
blocked: null,
|
||||
photo: null,
|
||||
sessionNumber: 1,
|
||||
};
|
||||
await this.usersService.create(user);
|
||||
}
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
|
||||
/* +#+#+#+#+#+ +#+ */
|
||||
/* Created: 2023/06/17 01:00:25 by apommier #+# #+# */
|
||||
/* Updated: 2023/06/26 04:02:50 by apommier ### ########.fr */
|
||||
/* Updated: 2023/06/26 04:11:00 by apommier ### ########.fr */
|
||||
/* */
|
||||
/* ************************************************************************** */
|
||||
|
||||
@ -84,10 +84,15 @@ async banUser(convId: number, username: string) {
|
||||
|
||||
conv.banned = conv.banned || [];
|
||||
if (conv.banned.find(item => item === username))
|
||||
return (1);
|
||||
{
|
||||
conv.banned = conv.banned.filter((item) => item !== username);
|
||||
this.save(conv);
|
||||
return (2);
|
||||
}
|
||||
conv.members = conv.members.filter((item) => item !== username);
|
||||
conv.banned.push(username);
|
||||
this.save(conv);
|
||||
return (1);
|
||||
}
|
||||
|
||||
async inviteUser(convId: number, username: string) {
|
||||
|
||||
@ -50,6 +50,9 @@ export class User {
|
||||
@Column({ default: 0 })
|
||||
loss: number;
|
||||
|
||||
@Column({ default: 0 })
|
||||
sessionNumber: number;
|
||||
|
||||
@Column({ default: 0 })
|
||||
rank: number;
|
||||
|
||||
|
||||
@ -3,10 +3,10 @@
|
||||
/* ::: :::::::: */
|
||||
/* users.service.ts :+: :+: :+: */
|
||||
/* +:+ +:+ +:+ */
|
||||
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
|
||||
/* By: sadjigui <sadjigui@student.42.fr> +#+ +:+ +#+ */
|
||||
/* +#+#+#+#+#+ +#+ */
|
||||
/* Created: 2023/06/17 01:00:07 by apommier #+# #+# */
|
||||
/* Updated: 2023/06/24 23:30:52 by apommier ### ########.fr */
|
||||
/* Updated: 2023/06/26 02:23:16 by sadjigui ### ########.fr */
|
||||
/* */
|
||||
/* ************************************************************************** */
|
||||
|
||||
@ -143,7 +143,11 @@ export class UsersService {
|
||||
return (0);
|
||||
user.blocked = user.blocked || [];
|
||||
if (user.blocked.find(item => item === username))
|
||||
return (1);
|
||||
{
|
||||
this.save(user);
|
||||
user.blocked = user.blocked.filter((item) => item !== username);
|
||||
return (2);
|
||||
}
|
||||
user.blocked.push(username);
|
||||
this.save(user);
|
||||
return (1);
|
||||
|
||||
@ -1,8 +1,11 @@
|
||||
REACT_APP_BASE_URL=bess-f2r5s13:8080
|
||||
REACT_APP_SOCKET_URL=bess-f2r5s13
|
||||
REACT_APP_API_SECRET=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
|
||||
REACT_APP_CLIENT_UID=u-s4t2ud-2bd3c5d4f41e776f2e3d5d699d2a8421f6d0c0468ec882516d9ca89b0c211789
|
||||
REACT_APP_INTRA_URL="https://api.intra.42.fr/oauth/authorize?client_id=u-s4t2ud-2bd3c5d4f41e776f2e3d5d699d2a8421f6d0c0468ec882516d9ca89b0c211789&redirect_uri=http%3A%2F%2Fbess-f2r5s13%3A8080%2Fapi%2Fauth%2Flogin&response_type=code"
|
||||
REACT_APP_BASE_URL=localhost:8080
|
||||
REACT_APP_SOCKET_URL=localhost
|
||||
REACT_APP_API_SECRET=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
|
||||
REACT_APP_CLIENT_UID=u-s4t2ud-6d29dfa49ba7146577ffd8bf595ae8d9e5aaa3e0a9615df18777171ebf836a41
|
||||
|
||||
# REACT_APP_BASE_URL=92.143.191.152
|
||||
# REACT_APP_BASE_URL=192.168.1.19
|
||||
REACT_APP_INTRA_URL="https://api.intra.42.fr/oauth/authorize?client_id=u-s4t2ud-6d29dfa49ba7146577ffd8bf595ae8d9e5aaa3e0a9615df18777171ebf836a41&redirect_uri=http%3A%2F%2Flocalhost%3A8080%2Fapi%2Fauth%2Flogin&response_type=code"
|
||||
|
||||
# REACT_APP_BASE_URL=92.143.191.152
|
||||
# REACT_APP_BASE_URL=192.168.1.19
|
||||
@ -23,8 +23,9 @@ interface AlertProps {
|
||||
}
|
||||
|
||||
function GreenAlert ({handleClose, text}: AlertProps){
|
||||
|
||||
{setTimeout(handleClose, 1500)}
|
||||
return(
|
||||
|
||||
<Backdrop onClick={handleClose}>
|
||||
<motion.div
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
@ -37,7 +38,6 @@ function GreenAlert ({handleClose, text}: AlertProps){
|
||||
<AiOutlineCheckCircle/>
|
||||
<p>{text}</p>
|
||||
</motion.div>
|
||||
{setTimeout(handleClose, 1500)}
|
||||
</Backdrop>
|
||||
)
|
||||
}
|
||||
|
||||
@ -23,6 +23,7 @@ interface AlertProps {
|
||||
}
|
||||
|
||||
function RedAlert ({handleClose, text}: AlertProps) {
|
||||
{setTimeout(handleClose, 1500)}
|
||||
return(
|
||||
<Backdrop onClick={handleClose}>
|
||||
<motion.div
|
||||
@ -36,7 +37,6 @@ function RedAlert ({handleClose, text}: AlertProps) {
|
||||
<BiErrorCircle/>
|
||||
<p>{text}</p>
|
||||
</motion.div>
|
||||
{setTimeout(handleClose, 1500)}
|
||||
</Backdrop>
|
||||
)
|
||||
}
|
||||
|
||||
@ -25,6 +25,7 @@ interface AlertProps {
|
||||
}
|
||||
|
||||
function YellowAlert ({handleClose, text, icon}: AlertProps) {
|
||||
{setTimeout(handleClose, 3000)}
|
||||
return(
|
||||
<Backdrop onClick={handleClose}>
|
||||
<motion.div
|
||||
@ -53,7 +54,6 @@ function YellowAlert ({handleClose, text, icon}: AlertProps) {
|
||||
|
||||
<h5>{text}</h5>
|
||||
</motion.div>
|
||||
{setTimeout(handleClose, 3000)}
|
||||
</Backdrop>
|
||||
)
|
||||
}
|
||||
|
||||
@ -1,16 +1,10 @@
|
||||
import React from 'react';
|
||||
import '../../styles/field.css';
|
||||
// import { useHistory } from 'react-router-dom';
|
||||
import { useNavigate } from "react-router-dom";
|
||||
|
||||
function PlayButton() {
|
||||
|
||||
const history = useNavigate();
|
||||
|
||||
// const handleButtonClick = () => {
|
||||
// let path = `play`;
|
||||
// history(path);
|
||||
// };
|
||||
const handleButtonClick = () => {
|
||||
let path = `play?`;
|
||||
|
||||
@ -19,17 +13,11 @@ function PlayButton() {
|
||||
path += 'superpower=true&';
|
||||
}
|
||||
|
||||
// const obstacleCheckbox = document.querySelector<HTMLInputElement>('input[value="obstacle"]');
|
||||
// if (obstacleCheckbox && obstacleCheckbox.checked) {
|
||||
// path += 'obstacle=true&';
|
||||
// }
|
||||
|
||||
const speedCheckbox = document.querySelector<HTMLInputElement>('input[value="speed"]');
|
||||
if (speedCheckbox && speedCheckbox.checked) {
|
||||
path += 'speed=true&';
|
||||
}
|
||||
|
||||
// Remove the trailing '&' character
|
||||
path = path.slice(0, -1);
|
||||
console.log(path)
|
||||
history(path);
|
||||
@ -40,8 +28,7 @@ function PlayButton() {
|
||||
<button onClick={handleButtonClick} className="playButton">Play</button>
|
||||
{/* !buttonClicked && <button onClick={handleButtonClick}>Draw on Canvas</button> */}
|
||||
<div className='checkbox'>
|
||||
<p><input className="inside_checkbox" type="checkbox" value="superpower"/> Super Power</p>
|
||||
{/* <p><input className="inside_checkbox" type="checkbox" value="obstacle"/> Obstacle </p> */}
|
||||
<p><input className="inside_checkbox" type="checkbox" value="superpower"/> Super Power <br/> ( w = wall power ) </p>
|
||||
<p><input className="inside_checkbox" type="checkbox" value="speed"/> Faster and Faster </p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -17,6 +17,7 @@ import { ImBlocked } from 'react-icons/im';
|
||||
import { MdOutlineGroupAdd } from 'react-icons/md';
|
||||
import { GrAdd } from 'react-icons/gr';
|
||||
import { RiListSettingsLine } from 'react-icons/ri'
|
||||
import { HiChatBubbleLeft } from 'react-icons/hi2'
|
||||
|
||||
// import { Rank } from "../../DataBase/DataRank";
|
||||
import GreenAlert from "../Alert/GreenAlert.tsx";
|
||||
@ -269,6 +270,8 @@ function Chats(){
|
||||
const [selectTags, setSelectTag] = useState([{ id: 1, selectedOption: ''}]);
|
||||
const [users, setUsers] = useState<User[]>([]);
|
||||
|
||||
const [unblock, setUnblock] = useState(false);
|
||||
const closeUnblock = () => setUnblock(false);
|
||||
|
||||
const openNewGameModal = () => {
|
||||
setNewGameModalOpen(true);
|
||||
@ -322,10 +325,13 @@ function Chats(){
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const handleBlockFriend = async () => {
|
||||
try{
|
||||
const res = await api.post("/block", {username: friend})
|
||||
// if(1)
|
||||
if (res.data === 2)
|
||||
setUnblock(true);
|
||||
if (res.data === 1)
|
||||
{
|
||||
setBlock(true);
|
||||
@ -434,7 +440,7 @@ function Chats(){
|
||||
onChange={(a) => handleOptionChange(selectTag.id, a.target.value)}
|
||||
>
|
||||
<option value="">{
|
||||
selectTag.selectedOption ? selectTag.selectedOption : "Select an option"
|
||||
selectTag.selectedOption ? selectTag.selectedOption : "Select a user"
|
||||
}</option>
|
||||
{users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.username)).map((item, index) => (
|
||||
<option key={index} value={item.username}>
|
||||
@ -468,6 +474,9 @@ function Chats(){
|
||||
{showBlockAlert && !block && (
|
||||
<RedAlert handleClose={closeBlock} text={friend + ' was not found'} />
|
||||
)}
|
||||
{unblock ? (
|
||||
<GreenAlert handleClose={closeUnblock} text={friend + ' was unblocked'} />
|
||||
):("")}
|
||||
</AnimatePresence>
|
||||
</TouchDiv>
|
||||
{currentChat && isAdmin ? (
|
||||
@ -475,7 +484,7 @@ function Chats(){
|
||||
<motion.div
|
||||
onClick={() => (setting ? setSetting(false) : setSetting(true))}
|
||||
>
|
||||
<RiListSettingsLine/>
|
||||
<RiListSettingsLine className="block"/>
|
||||
<AnimatePresence
|
||||
initial={false}
|
||||
onExitComplete={() => null}
|
||||
@ -526,7 +535,8 @@ function Chats(){
|
||||
<div key={index}
|
||||
onClick={() => setCurrentChat(c)}>
|
||||
<UserChat>
|
||||
<img className="pic-user" src={DefaultPic} alt="User" />
|
||||
{/* <img className="pic-user" src={DefaultPic} alt="User" /> */}
|
||||
<HiChatBubbleLeft className="catchat"/>
|
||||
<div className="infoSideBar">
|
||||
<span>{c.name}</span>
|
||||
{/* <SideP>Desc?</SideP> */}
|
||||
|
||||
@ -123,7 +123,7 @@ const Modal = ({handleClose}: ModalProps) => {
|
||||
onChange={(a) => handleOptionChange(selectTag.id, a.target.value)}
|
||||
>
|
||||
<option value="">{
|
||||
selectTag.selectedOption ? selectTag.selectedOption : "Select an option"
|
||||
selectTag.selectedOption ? selectTag.selectedOption : "Select a user"
|
||||
}</option>
|
||||
{users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.nickname)).map((item, index) => (
|
||||
<option key={index} value={item.username}>
|
||||
@ -137,9 +137,7 @@ const Modal = ({handleClose}: ModalProps) => {
|
||||
<GrAdd onClick={addNewSelectedTag}/>
|
||||
</div>
|
||||
<div className="div_submit">
|
||||
<Link to='#' className="submit" onClick={ saveSelectedOptions}>Submit</Link>
|
||||
|
||||
<Link to="#" className="submit" onClick={() => handleClose}>Cancel</Link>
|
||||
<Link to='#' className="submit" onClick={saveSelectedOptions}>Submit</Link>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -152,7 +150,7 @@ const Modal = ({handleClose}: ModalProps) => {
|
||||
onChange={(event) => setChannel(event.target.value)}
|
||||
|
||||
>
|
||||
<option value="">Select an option</option>
|
||||
<option value="">Select a channel</option>
|
||||
{convs.map((conv) => (
|
||||
!(!conv.group || conv.private || (conv.banned && user && conv.banned.includes(user.username)) || (conv.members && user && conv.members.includes(user.username))) && (
|
||||
<option key={conv.id} value={conv.id}>
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { motion } from "framer-motion";
|
||||
import { AnimatePresence, motion } from "framer-motion";
|
||||
import Backdrop from "../Sidebar/Backdrop.tsx";
|
||||
// import { Rank } from "../../DataBase/DataRank"
|
||||
import '../../styles/Messages.css'
|
||||
@ -9,6 +9,7 @@ import api from "../../script/axiosApi.tsx";
|
||||
import React from "react";
|
||||
import {User} from "../../../interfaces.tsx"
|
||||
import { Socket } from "socket.io-client";
|
||||
import GreenAlert from "../Alert/GreenAlert.tsx";
|
||||
|
||||
|
||||
const dropIn = {
|
||||
@ -161,13 +162,18 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
|
||||
handleClose();
|
||||
}
|
||||
|
||||
const [unban, setUnban] = useState(false);
|
||||
const closeUnban = () => setUnban(false);
|
||||
const handleBan = async () => {
|
||||
// console.log("ban option= ", selectedUser)
|
||||
try{
|
||||
// console.log("user select=", selectedUser.length)
|
||||
if (!selectedUser.length)
|
||||
return ;
|
||||
await api.post("/ban", {convId: convId, username: selectedUser})
|
||||
const res = await api.post("/ban", {convId: convId, username: selectedUser})
|
||||
if (res.data === 2)
|
||||
setUnban(true);
|
||||
|
||||
if (socket)
|
||||
{
|
||||
console.log("emit to ban server")
|
||||
@ -207,8 +213,8 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
|
||||
|
||||
const handleInvite = async () => {
|
||||
try{
|
||||
console.log("post invite bitch")
|
||||
await api.post("/inviteConv", {convId: convId, username: selectedUser})
|
||||
console.log("post invite bitch");
|
||||
await api.post("/inviteConv", {convId: convId, username: selectedUser});
|
||||
} catch(err) {
|
||||
console.log(err);
|
||||
}
|
||||
@ -244,7 +250,7 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
|
||||
<Link to="#" onClick={dark} className={ privateConv ? "darkSubmit" : "submit"}>Private</Link>
|
||||
</div>
|
||||
{/* <p className="checkbox">Private<input className="check"type="checkbox" value="private" onChange={handleCheckPriv}/></p> */}
|
||||
<p className="checkbox">Password<input type="checkbox" value="password" checked={password} onChange={handleCheckPass}/> </p>
|
||||
<p className="checkbox">Password<input className="inside_ckeckbox" type="checkbox" value="password" checked={password} onChange={handleCheckPass}/> </p>
|
||||
|
||||
|
||||
{password ? (
|
||||
@ -294,7 +300,7 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
|
||||
|
||||
|
||||
<div>
|
||||
<Link to="#" onClick={handleInvite} className="submit">Send</Link>
|
||||
<Link to="#" onClick={handleInvite} className="submit">Invite</Link>
|
||||
<Link to="#" onClick={handleBan} className="submit">Ban</Link>
|
||||
<Link to="#" onClick={mute ? darkMute : lightMute} className={mute ? "darkSubmit": "submit"}>Mute</Link>
|
||||
<Link to="#" onClick={handleAdmin} className="submit">Admin</Link>
|
||||
@ -306,11 +312,16 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
|
||||
onKeyDown={handleMute}
|
||||
type="number"
|
||||
className="in_howLong"
|
||||
placeholder="How long ?"
|
||||
placeholder="Time"
|
||||
value={time}
|
||||
onChange={(e) => setTime(e.target.value)}
|
||||
/>
|
||||
):("")}
|
||||
<AnimatePresence initial={false} onExitComplete={() => null}>
|
||||
{unban ? (
|
||||
<GreenAlert handleClose={closeUnban} text={selectedUser+": was unbanned"} />
|
||||
): ("")}
|
||||
</AnimatePresence>
|
||||
|
||||
</motion.div>
|
||||
</Backdrop>
|
||||
|
||||
@ -54,21 +54,24 @@ const ModalEdit = () => {
|
||||
const handlePostNickname = async () => {
|
||||
console.log("nickname=", nickname)
|
||||
try {
|
||||
const ret = await api.post("/nickname", { nickname: nickname });
|
||||
// console.log("cest ici = ",ret);
|
||||
// if (!ret)
|
||||
console.log("test ret =", ret.data);
|
||||
if (nickname.length < 3) {
|
||||
setErrTooShort(true);
|
||||
}
|
||||
else if (ret.data) {
|
||||
console.log("ici error = ", ret.data);
|
||||
window.location.reload();
|
||||
}
|
||||
else {
|
||||
console.log("nickname already set = ", ret.data);
|
||||
// console.log("test ret =", ret.data);
|
||||
if (nickname.length > 3) {
|
||||
const ret = await api.post("/nickname", { nickname: nickname });
|
||||
if (ret.data) {
|
||||
console.log("ici error = ", ret.data);
|
||||
window.location.reload();
|
||||
}
|
||||
else {
|
||||
console.log("nickname already set = ", ret.data);
|
||||
|
||||
setErrTaken(true);
|
||||
setErrTaken(true);
|
||||
}
|
||||
}
|
||||
else if (nickname.length < 3)
|
||||
{
|
||||
setErrTooShort(true);
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -3,16 +3,18 @@
|
||||
/* ::: :::::::: */
|
||||
/* Home.tsx :+: :+: :+: */
|
||||
/* +:+ +:+ +:+ */
|
||||
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
|
||||
/* By: sadjigui <sadjigui@student.42.fr> +#+ +:+ +#+ */
|
||||
/* +#+#+#+#+#+ +#+ */
|
||||
/* Created: 2023/06/09 08:19:04 by apommier #+# #+# */
|
||||
/* Updated: 2023/06/24 23:26:45 by apommier ### ########.fr */
|
||||
/* Updated: 2023/06/26 04:03:16 by sadjigui ### ########.fr */
|
||||
/* */
|
||||
/* ************************************************************************** */
|
||||
|
||||
// import { React, useState } from "react";
|
||||
import '../styles/Profile.css'
|
||||
// import '../styles/App.css'
|
||||
import RedAlert from "../components/Alert/RedAlert.tsx";
|
||||
|
||||
import DefaultPicture from "../assets/profile.jpg";
|
||||
import WinLoss from "../components/Profile/Win_Loss.tsx";
|
||||
import { motion, AnimatePresence } from 'framer-motion'
|
||||
@ -52,7 +54,10 @@ function Profile () {
|
||||
const [isLoading, setIsLoading] = useState<boolean>(true);
|
||||
const [modalOpen, setModalOpen] = useState<boolean>(false);
|
||||
const [mine, setMine] = useState<boolean>(false);
|
||||
const [error, setError] = useState<boolean>(false);
|
||||
// const [visible, setVisible] = useState<boolean>(false);
|
||||
const close = () => setModalOpen(false);
|
||||
const closeError = () => setError(false);
|
||||
const open = () => setModalOpen(true);
|
||||
|
||||
const { username } = useParams();
|
||||
@ -76,6 +81,7 @@ function Profile () {
|
||||
console.log('File uploaded successfully');
|
||||
window.location.reload();
|
||||
} catch (error) {
|
||||
setError(true);
|
||||
console.error('Error uploading file:', error);
|
||||
}
|
||||
}
|
||||
@ -146,6 +152,14 @@ function Profile () {
|
||||
<>
|
||||
<label htmlFor="file-input" className="edit_name"><MdOutlinePhotoLibrary/></label>
|
||||
<input type="file" id="file-input" className="file-input" accept="image/*" onChange={handleFileChange} />
|
||||
<AnimatePresence initial={false} onExitComplete={() => null}>
|
||||
{error ? (
|
||||
<RedAlert handleClose={closeError} text={'Error : upload failed'} />
|
||||
): ("")}
|
||||
|
||||
</AnimatePresence>
|
||||
|
||||
|
||||
</>
|
||||
)}
|
||||
</motion.div>
|
||||
@ -229,7 +243,7 @@ function Home () {
|
||||
// backdropFilter: move ? "blur(10px)" : "none",
|
||||
// WebkitBackdropFilter: move ? "blur(10px)" : "none"
|
||||
// }}
|
||||
animate={{x: move ? '-50%' : '30%'}}
|
||||
animate={{x: move ? '-50%' : '25%'}}
|
||||
transition={{type: "tween", duration: 0.5}}>
|
||||
<Profile/>
|
||||
</motion.div>
|
||||
|
||||
@ -6,7 +6,8 @@ import "../styles/App.css";
|
||||
import api from '../script/axiosApi.tsx';
|
||||
|
||||
import QRCodeStyling from "qr-code-styling";
|
||||
import { motion } from 'framer-motion'
|
||||
import { AnimatePresence, motion } from 'framer-motion'
|
||||
import RedAlert from "../components/Alert/RedAlert.tsx";
|
||||
|
||||
|
||||
|
||||
@ -36,6 +37,8 @@ function QrCode () {
|
||||
const [secret, setSecret] = useState(false);
|
||||
const [code, setCode] = useState('');
|
||||
const [activated, setActivated] = useState(false);
|
||||
const [err, setErr] = useState(false);
|
||||
const closeErr = () => setErr(false);
|
||||
|
||||
// const history = useHistory();
|
||||
|
||||
@ -80,6 +83,10 @@ function QrCode () {
|
||||
const res = await api.post("/verifyOtp", {token: code})
|
||||
console.log("res= ", res.data)
|
||||
console.log("res= ", res)
|
||||
if (!res.data)
|
||||
{
|
||||
setErr(true);
|
||||
}
|
||||
if (res.data === 1)
|
||||
{
|
||||
console.log("registered")
|
||||
@ -158,6 +165,11 @@ function QrCode () {
|
||||
) : (
|
||||
<button className="desactivate" onClick={handleDesactivate}>Desactivate 2FA</button>
|
||||
)}
|
||||
<AnimatePresence
|
||||
initial={false}
|
||||
onExitComplete={() => null}>
|
||||
{err ? (<RedAlert handleClose={closeErr} text="Error: Bad intput. Try again"/>):("")}
|
||||
</AnimatePresence>
|
||||
</>
|
||||
|
||||
{/* {!localStorage.getItem('token') && (
|
||||
|
||||
@ -15,9 +15,10 @@ input.qr{
|
||||
border-radius: 5px;
|
||||
background-color: rgb(0, 0, 0);
|
||||
margin : 1%;
|
||||
color:rgb(42, 41, 41);
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
border-color:rgb(42, 41, 41);
|
||||
border-style: solid;
|
||||
border-width: 1px;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.desactivate {
|
||||
|
||||
@ -233,9 +233,9 @@ p {
|
||||
backdrop-filter: sepia(90%);
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
border-radius: 4px;
|
||||
width: 11rem;
|
||||
height: 1.5rem;
|
||||
margin-top: 1rem;
|
||||
width: 15rem;
|
||||
height: 2rem;
|
||||
margin-top: 1.3rem;
|
||||
}
|
||||
|
||||
.greenAlert{
|
||||
@ -385,4 +385,11 @@ input.in_howLong{
|
||||
.block{
|
||||
font-size: 25px;
|
||||
margin-left: 12px;
|
||||
margin-top: 0.2rem;
|
||||
}
|
||||
|
||||
.inside_ckeckbox{
|
||||
height: 25px;
|
||||
margin-left: -50px;
|
||||
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user