diff --git a/.env b/.env index ae4dd442..6449f712 100644 --- a/.env +++ b/.env @@ -29,7 +29,7 @@ MODE=DEV #port API_PORT=3000 # REACT_PORT=3000 (current = 8080) -NGINX_PORT=80 +NGINX_PORT=8080 PONG_PORT=4000 CHAT_PORT=4001 POSTGRES_PORT=5432 diff --git a/conf/.nfs000000000358102100000482 b/conf/.nfs000000000358102100000482 new file mode 100644 index 00000000..b3bdd0df --- /dev/null +++ b/conf/.nfs000000000358102100000482 @@ -0,0 +1,23 @@ +server { + # listen 443 ssl; + # listen 80 ssl; + # listen 443 ssl; + # listen ${NGINX_PORT}; + listen 8080; + + location /{ + proxy_set_header Host $host; + proxy_set_header X-Real-IP $remote_addr; + proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; + proxy_set_header X-Forwarded-Proto $scheme; + proxy_pass http://react_app:8081; + } + + location /api { + proxy_set_header Host $host; + proxy_set_header X-Real-IP $remote_addr; + proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; + proxy_set_header X-Forwarded-Proto $scheme; + proxy_pass http://api:3000/api; + } +} \ No newline at end of file diff --git a/conf/nginx.conf b/conf/nginx.conf index b3bdd0df..b8a40b8b 100644 --- a/conf/nginx.conf +++ b/conf/nginx.conf @@ -20,4 +20,18 @@ server { proxy_set_header X-Forwarded-Proto $scheme; proxy_pass http://api:3000/api; } + + location /socket.io { + # Forward requests to socket server running on port 4001 + if ($request_uri ~ ^/socket/4001) { + proxy_pass http://chat:4001; + break; + } + + # Forward requests to socket server running on port 4000 + if ($request_uri ~ ^/socket/4000) { + proxy_pass http://pong:4000; + break; + } + } } \ No newline at end of file diff --git a/containers/api/src/app.controller.ts b/containers/api/src/app.controller.ts index 24d6d00e..22d7ff29 100644 --- a/containers/api/src/app.controller.ts +++ b/containers/api/src/app.controller.ts @@ -6,7 +6,7 @@ /* By: apommier +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* 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 */ /* */ /* ************************************************************************** */ @@ -560,7 +560,7 @@ export class AppController { async verifyPassword(@Body() data: any) { return await this.chatService.verifyPassword(data.convId, data.password) } - + @UseGuards(JwtAuthGuard) @Post('/invite') async inviteUser(@Body() data: any) { @@ -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) diff --git a/containers/api/src/chat/chat.service.ts b/containers/api/src/chat/chat.service.ts index b912ff83..05415e63 100644 --- a/containers/api/src/chat/chat.service.ts +++ b/containers/api/src/chat/chat.service.ts @@ -6,7 +6,7 @@ /* By: apommier +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* 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); } diff --git a/containers/api/src/config/config.service.ts b/containers/api/src/config/config.service.ts index 3bde107e..3c1cc837 100644 --- a/containers/api/src/config/config.service.ts +++ b/containers/api/src/config/config.service.ts @@ -6,7 +6,7 @@ /* By: sadjigui +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* Created: 2023/04/09 14:53:49 by apommier #+# #+# */ -/* Updated: 2023/06/22 21:19:44 by sadjigui ### ########.fr */ +/* Updated: 2023/06/24 15:09:20 by sadjigui ### ########.fr */ /* */ /* ************************************************************************** */ diff --git a/containers/api/src/model/chat.entity.ts b/containers/api/src/model/chat.entity.ts index b81950d6..84a72306 100644 --- a/containers/api/src/model/chat.entity.ts +++ b/containers/api/src/model/chat.entity.ts @@ -6,12 +6,12 @@ /* By: apommier +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* Created: 2023/06/17 01:00:20 by apommier #+# #+# */ -/* Updated: 2023/06/17 01:31:29 by apommier ### ########.fr */ +/* Updated: 2023/06/23 15:18:19 by apommier ### ########.fr */ /* */ /* ************************************************************************** */ import { Entity, Column, PrimaryGeneratedColumn, CreateDateColumn, BaseEntity } from 'typeorm'; - + @Entity() export class Conv{ @PrimaryGeneratedColumn() diff --git a/containers/pong/src/pong/pong.gateway.ts b/containers/pong/src/pong/pong.gateway.ts index 42e1b648..d5a8649f 100644 --- a/containers/pong/src/pong/pong.gateway.ts +++ b/containers/pong/src/pong/pong.gateway.ts @@ -6,7 +6,7 @@ /* By: apommier +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* Created: 2023/06/19 15:18:38 by apommier #+# #+# */ -/* Updated: 2023/06/21 00:59:39 by apommier ### ########.fr */ +/* Updated: 2023/06/23 15:19:12 by apommier ### ########.fr */ /* */ /* ************************************************************************** */ @@ -50,14 +50,7 @@ export class PongGateway implements OnGatewayInit, OnGatewayConnection, OnGatewa handleDisconnect(client: Socket) { - // console.log(`Client disconnected: ${client.id}`); console.log(`Normal disconnected: ${client.id}`); - // this.waitingClients.delete(client); - // this.waitingClients.forEach((waitingClient) => { - // if (waitingClient.client === client) { - // this.waitingClients.delete(waitingClient); - // }}) - // delete this.clients[client.id]; this.waitingClients.forEach((item) => { if (item.client === client) diff --git a/containers/react/src/components/Game/Rank.tsx b/containers/react/src/components/Game/Rank.tsx index 4523c988..e6f94b81 100644 --- a/containers/react/src/components/Game/Rank.tsx +++ b/containers/react/src/components/Game/Rank.tsx @@ -6,7 +6,7 @@ /* By: apommier +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* 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 ( diff --git a/containers/react/src/components/Game/Ranking.tsx b/containers/react/src/components/Game/Ranking.tsx index 1880abcc..94f417ed 100644 --- a/containers/react/src/components/Game/Ranking.tsx +++ b/containers/react/src/components/Game/Ranking.tsx @@ -43,15 +43,6 @@ function Ranking(){
{ranking.map((user, index) => ( - // return ( - //
- //
- //

{index + 1}

- //

{user.rank}: {user.nickname}

- //
- //

{user.opponent}

- //
- // ) ))}
)} diff --git a/containers/react/src/components/Header.tsx b/containers/react/src/components/Header.tsx index 27ce65a3..57ec2d1d 100644 --- a/containers/react/src/components/Header.tsx +++ b/containers/react/src/components/Header.tsx @@ -40,10 +40,6 @@ function Header() { fetchProfilePicture(); }, []); - // console.log(`profile pic= ${profilePicture}`) - - // photo.toString('base64') - return (
(true); const [conversations, setConversation] = useState([]); const [partyInvite, setPartyInvite] = useState([]); @@ -95,7 +95,7 @@ function Chats(){ const [messages, setMessage] = useState([]); const [newMessages, setNewMessage] = useState(""); const [incomingMessage, setIncomingMessage] = useState(); - + // let socket: Socket; const socket = useRef(null); // const socket = Socket | null @@ -120,7 +120,8 @@ 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 ?) setIncomingMessage(data); @@ -287,7 +288,7 @@ function Chats(){ const [newConversationModalOpen, setNewConversationModalOpen] = useState(false); const [selectTags, setSelectTag] = useState([{ id: 1, selectedOption: ''}]); - const [users, setUsers] = useState([]); + const [users, setUsers] = useState([]); const openNewGameModal = () => { @@ -369,7 +370,7 @@ function Chats(){ setShowBlockAlert(false); }; - const handleOptionChange = (selectId, selectedOption) => { + const handleOptionChange = (selectId: number, selectedOption: string) => { console.log("selected Option=", selectedOption) setSelectTag((prevTags) => prevTags.map((tag) => @@ -454,7 +455,7 @@ function Chats(){ - {users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.name)).map((item, index) => ( + {users.filter((item) => !selectTags.some((tag) => tag.selectedOption === item.username)).map((item, index) => ( diff --git a/containers/react/src/components/Messages/Message.tsx b/containers/react/src/components/Messages/Message.tsx index 458453ea..a359a27e 100644 --- a/containers/react/src/components/Messages/Message.tsx +++ b/containers/react/src/components/Messages/Message.tsx @@ -6,7 +6,7 @@ /* By: sadjigui +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* Created: 2023/06/01 18:24:46 by apommier #+# #+# */ -/* Updated: 2023/06/23 21:14:59 by sadjigui ### ########.fr */ +/* Updated: 2023/06/24 15:10:21 by sadjigui ### ########.fr */ /* */ /* ************************************************************************** */ @@ -42,7 +42,6 @@ function MessageMe({message, own}: MessageMeProps){ const [user, setUser] = useState(); const scrollRef = useRef(null); - // console.log("Message eher") useEffect(() => { if (scrollRef.current) @@ -83,20 +82,13 @@ function MessageMe({message, own}: MessageMeProps){ }; 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 ( diff --git a/containers/react/src/components/Messages/Modal.tsx b/containers/react/src/components/Messages/Modal.tsx index 50b040fc..0f76ba43 100644 --- a/containers/react/src/components/Messages/Modal.tsx +++ b/containers/react/src/components/Messages/Modal.tsx @@ -21,7 +21,6 @@ const dropIn = { }}, exit:{y: "100vh", opacity: 0,}, - }; const Modal = ({handleClose}) => { @@ -100,11 +99,11 @@ const Modal = ({handleClose}) => { // let new_name; return ( - + e.stopPropagation()} - className="modal" - // variant={dropIn} + className="modalSetting" + variant={dropIn} initial="hidden" animate="visible" exit="exit" diff --git a/containers/react/src/components/Messages/ModalSetting.tsx b/containers/react/src/components/Messages/ModalSetting.tsx index 8226ed32..ec8a2500 100644 --- a/containers/react/src/components/Messages/ModalSetting.tsx +++ b/containers/react/src/components/Messages/ModalSetting.tsx @@ -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(); + const [loading, setLoading] = useState(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 ( {

Password

- {password || privateConv ? ( + {password ? ( setNewPassword(e.target.value)} onKeyDown={handlePassword} @@ -208,7 +256,6 @@ const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => { ): ("")} -
{
{mute ? ( - + setTime(e.target.value)} + /> ):("")} diff --git a/containers/react/src/components/Sidebar/Modal.tsx b/containers/react/src/components/Sidebar/Modal.tsx index 10756514..066fa219 100644 --- a/containers/react/src/components/Sidebar/Modal.tsx +++ b/containers/react/src/components/Sidebar/Modal.tsx @@ -20,26 +20,6 @@ const dropIn = { }, } - -// function showBar (){ -// return ( -// {SidebarData.map((item, index) => { -// return ( -// -//
  • -// -// {item.icon} -// {item.title} -// -//
    • -//     -// ) -// })} -// ) -// } interface CloseProps { handleclose: Function; } diff --git a/containers/react/src/components/Social/Friend.tsx b/containers/react/src/components/Social/Friend.tsx index 907c35c5..fe0436c5 100644 --- a/containers/react/src/components/Social/Friend.tsx +++ b/containers/react/src/components/Social/Friend.tsx @@ -6,7 +6,7 @@ /* By: apommier +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* 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) { diff --git a/containers/react/src/pages/Field.tsx b/containers/react/src/pages/Field.tsx index 1e2090d4..a1343083 100644 --- a/containers/react/src/pages/Field.tsx +++ b/containers/react/src/pages/Field.tsx @@ -62,64 +62,11 @@ function Field() }; }, []); - // const [buttonClicked, setButtonClicked] = useState(false); - - // const handleButtonClick = () => { - // drawCanvas(); - // setButtonClicked(true); - // }; - return (
    - {/* */} - {/* {buttonClicked && } - {!buttonClicked && } */}
    ); } -export default Field; -// export default withRouter(Field); - - -// function Field() { -// const [buttonClicked, setButtonClicked] = useState(false); - -// const handleButtonClick = () => { -// const canvas = document.createElement('canvas'); -// canvas.id = 'myCanvas'; -// console.log("button clicked") -// document.getElementById('canvas_container').appendChild(canvas); -// setButtonClicked(true); -// drawCanvas(canvas); -// }; -// setButtonClicked(true); -// return ( -// //
    -//
    -// {!buttonClicked && } -//
    -// ); -// } - -// export default Field; - -// function draw() { -// // Effacer le canvas -// ctx.clearRect(0, 0, canvas.width, canvas.height); - -// // Dessiner la raquette -// ctx.fillRect(canvas.width - paddleWidth, paddleY, paddleWidth, paddleHeight); - -// // Appeler la fonction draw à chaque frame -// requestAnimationFrame(draw); -// } - -// draw(); // Appeler la fonction draw pour la première fois - -// const canvas = document.getElementById('myCanvas'); -// canvas.width = 500; -// canvas.height = 500; -// const ctx = canvas.getContext('2d'); -// ctx.fillRect(50, 50, 1000, 1000); \ No newline at end of file +export default Field; \ No newline at end of file diff --git a/containers/react/src/pages/Home.tsx b/containers/react/src/pages/Home.tsx index cd381f6e..02a10663 100644 --- a/containers/react/src/pages/Home.tsx +++ b/containers/react/src/pages/Home.tsx @@ -6,7 +6,11 @@ /* By: sadjigui +#+ +:+ +#+ */ /* +#+#+#+#+#+ +#+ */ /* Created: 2023/06/09 08:19:04 by apommier #+# #+# */ +<<<<<<< HEAD /* Updated: 2023/06/24 14:31:22 by sadjigui ### ########.fr */ +======= +/* Updated: 2023/06/23 17:33:51 by apommier ### ########.fr */ +>>>>>>> origin/ereali /* */ /* ************************************************************************** */ @@ -62,24 +66,6 @@ function Profile () { const [profilePicture, setProfilePicture] = useState(''); - // const handleFileChange = (event: { target: { files: React.SetStateAction[]; }; }) => { - // // const file = event.target.files[0]; - // setSelectedPhoto(event.target.files[0]); - // // try{ - // // api.post("/picture", {picture: URL.createObjectURL(file)}) - // // } - // // catch(err){ - // // console.log(err); - // // } - // }; - - // const handleFileChange = (event: { target: { files: React.SetStateAction[] | FileList; }; }) => { - // const files = event.target.files; - // if (event.target.files && event.target.files.length > 0) { - // setSelectedPhoto(event.target.files[0]); - // } - // }; - const handleFileChange = async (event: { target: { files: any; }; }) => { // const files = event.target.files; // if (files && files.length > 0) { @@ -100,43 +86,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) { @@ -220,7 +176,7 @@ function Profile () { function Home () { const [move, setmove ] = useState(false); - const [user, setUser] = useState([]); + const [user, setUser] = useState(); const [successQr, setSuccessQr] = useState(false); const [successSword, setSuccessSword] = useState(false); @@ -242,7 +198,7 @@ function Home () { } }; fetchSuccess(); - },[]) + }, []); return (
    - {user.otp_verified ? ( + {user && user.otp_verified ? ( setSuccessQr(true)}/> ):("")} - {user.win >= 2 ? ( + {user && user.win >= 2 ? ( setSuccessSword(true)}/> - ):("")} - - {user.win >= 5 ? ( + ):("")} + {user && user.win >= 5 ? ( setSuccessCrown(true)}/> ):("")}
    diff --git a/containers/react/src/pages/QrCode.tsx b/containers/react/src/pages/QrCode.tsx index 2dcca83f..4da2138a 100644 --- a/containers/react/src/pages/QrCode.tsx +++ b/containers/react/src/pages/QrCode.tsx @@ -85,7 +85,7 @@ function QrCode () { console.log("registered") // history.push('/login') - const path = 'http://' + process.env.REACT_APP_BASE_URL + '/'; + const path = 'http://' + process.env.REACT_APP_BASE_URL + '/'; window.history.pushState({}, '', path); window.location.reload(); @@ -96,7 +96,7 @@ function QrCode () { //alert ?? retry } // redirect('/test') - } + } catch(err){ console.log(err) } @@ -105,7 +105,7 @@ function QrCode () { const handleDesactivate = async () => { try { await api.post("/deleteOtp") - // const path = 'http://' + process.env.REACT_APP_BASE_URL + '/'; + // const path = 'http://' + process.env.REACT_APP_BASE_URL + '/'; // window.history.pushState({}, '', path); window.location.reload(); } catch(err) { @@ -148,7 +148,7 @@ function QrCode () {

    Double Auth Validation

    Double Auth

    setCode(e.target.value)} /> @@ -179,4 +179,4 @@ function QrCode () { ) } -export default QrCode \ No newline at end of file +export default QrCode diff --git a/containers/react/src/pages/canvas.tsx b/containers/react/src/pages/canvas.tsx index 46dd1a58..798dcc8d 100644 --- a/containers/react/src/pages/canvas.tsx +++ b/containers/react/src/pages/canvas.tsx @@ -61,7 +61,7 @@ function DrawCanvas(option: number, gameParam: GameProps) { if(!ctx) return ; - const socket = io('http://' + process.env.REACT_APP_BASE_URL + ':4000', { transports: ['polling'] }); + const socket = io('http://localhost:4000', { transports: ['polling'] }); // useEffect(() => { // console.log("useeffect?????????????????") // return () => { @@ -576,11 +576,6 @@ async function draw(timestamp: number) ballY = ballRadius + 2 // send_info(); } - // else if (ballX + ballRadius + 2 >= canvas.width) //touch right wall - // { - // vX = -vX; - // // send_info(); - // } } function is_out() @@ -635,19 +630,6 @@ async function draw(timestamp: number) //======================================================================================================== //======================================================================================================== -// interface sizeProps { -// clientWidth: number, -// clientHeight: number -// } - - // document.addEventListener('resize', event => { - // // event.height - // // event.width - // const { clientWidth, clientHeight } = canvas.parentElement; - // // const { clientWidth, clientHeight } = canvas.parentElement!; - // console.log(`resize detected widht= ${clientWidth} height= ${clientHeight}`) - // }); - document.addEventListener('mousemove', event => { const mouseY = event.clientY; diff --git a/containers/react/src/script/tokenSuccess.tsx b/containers/react/src/script/tokenSuccess.tsx index fac964e4..8c3a5f09 100644 --- a/containers/react/src/script/tokenSuccess.tsx +++ b/containers/react/src/script/tokenSuccess.tsx @@ -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(); 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

    Loading...

    ; } - + if (!data) + return ; const cleanData = data.slice(1, -1); // Declare cleanData here as well if (!user.otp_verified) { diff --git a/containers/react/src/styles/App.css b/containers/react/src/styles/App.css index d4d7c8c6..f724c01b 100644 --- a/containers/react/src/styles/App.css +++ b/containers/react/src/styles/App.css @@ -5,9 +5,13 @@ background-color: black; height: 100%; } - +input.qr::-webkit-outer-spin-button, +input.qr::-webkit-inner-spin-button { + -webkit-appearance: none; + margin: 0; +} input.qr{ - width: 20%; + width: auto; border-radius: 5px; background-color: rgb(0, 0, 0); margin : 1%; diff --git a/containers/react/src/styles/Game.css b/containers/react/src/styles/Game.css index 94adce85..7b2adb2a 100644 --- a/containers/react/src/styles/Game.css +++ b/containers/react/src/styles/Game.css @@ -19,7 +19,7 @@ /* background-color: #5843e4; */ /* border-color: white; */ overflow: scroll; - height: 70vh; + height: 68vh; } .profilePic{ diff --git a/containers/react/src/styles/Messages.css b/containers/react/src/styles/Messages.css index 48f4f5b8..0c6a9d4c 100644 --- a/containers/react/src/styles/Messages.css +++ b/containers/react/src/styles/Messages.css @@ -19,7 +19,8 @@ select{ border: 0!important; margin: 5px; font-size: 18px; - border-radius: 6px; + padding: 5px; + border-radius: 1000px; } .modal{ @@ -54,6 +55,7 @@ select{ height: 74vh; width: 30%; overflow: scroll; + border-radius: 0px 0px 0px 10px; /* width: 2rem; */ /* height: 4rem; */ } @@ -131,16 +133,17 @@ select{ } .messages{ - background-color: rgb(26, 26, 26); + /* background-color: rgb(26, 26, 26); */ /* height: calc(100% - 118px); */ width: 70%; /* height: 300px; */ + border-radius: 0px 0px 10px 0px; overflow: scroll; } .input{ display: flex; - height: 50px; + height: 6vh; background-color: white; color:#060b26; border: none; diff --git a/containers/react/src/styles/Profile.css b/containers/react/src/styles/Profile.css index 7d8506ad..aaa20ee4 100644 --- a/containers/react/src/styles/Profile.css +++ b/containers/react/src/styles/Profile.css @@ -81,9 +81,9 @@ border-radius: 50%; border: thick; border-color: red; + margin-left: 20px; /* border-image: linear-gradient(90deg, #5843e4, #5a0760); */ - /* margin-top: 20px; */ } .home{ @@ -101,7 +101,7 @@ color: white; background-color: #5843e4; border-radius: 20px; - padding: 20px 500px; + padding: 1.3% 30%; font-size: 1.7rem; text-decoration: none; font-weight: bold; diff --git a/containers/react/src/styles/field.css b/containers/react/src/styles/field.css index 828dddc0..0ff5ad5f 100644 --- a/containers/react/src/styles/field.css +++ b/containers/react/src/styles/field.css @@ -106,4 +106,4 @@ height: 100%; width: 100%; } */ - /* } */ + /* } */ \ No newline at end of file diff --git a/docker-compose.yml b/docker-compose.yml index 0388b159..fdde8234 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -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 @@ -34,7 +24,11 @@ services: # depends_on: # - nginx ports: +<<<<<<< HEAD - 8081:8081 +======= + - 8001:8001 +>>>>>>> origin/ereali volumes: - ./containers/react:/app # - ./containers/react:/app