From f678d37739e0a0bad60d9286e21dd05488a81902 Mon Sep 17 00:00:00 2001 From: kinou-p Date: Wed, 14 Jun 2023 01:45:06 +0200 Subject: [PATCH] add create conv in front, work ! and set good alert for add friend and add blocked, backend for friend and blocked still to do --- containers/api/src/app.controller.ts | 16 +++ containers/api/src/auth/login42.ts | 1 + containers/api/src/model/chat.entity.ts | 11 +- containers/api/src/model/user.entity.ts | 3 + containers/api/src/users/users.service.ts | 12 ++ .../react/src/components/Alert/GreenAlert.jsx | 2 +- .../react/src/components/Alert/RedAlert.jsx | 2 +- .../react/src/components/Messages/Chats.jsx | 128 ++++++++++++++---- .../react/src/components/Messages/Modal.jsx | 102 +++++++------- containers/react/src/styles/chat.css | 12 +- 10 files changed, 208 insertions(+), 81 deletions(-) diff --git a/containers/api/src/app.controller.ts b/containers/api/src/app.controller.ts index e652ec46..b1692d3a 100644 --- a/containers/api/src/app.controller.ts +++ b/containers/api/src/app.controller.ts @@ -76,6 +76,15 @@ export class AppController { return await this.userService.addFriend(user, data.username); } + @UseGuards(JwtAuthGuard) + @Post('/block') + async newBlocked(@Request() req, @Body() data: any) { + // return await this.userService.getFriends(req.user.username); + console.log(`user= ${req.user.username}`) + const user = await this.userService.findOne(req.user.username) + return await this.userService.addBlocked(user, data.username); + } + @UseGuards(JwtAuthGuard) @Get('/invite') async getInvite(@Request() req) { @@ -317,13 +326,20 @@ export class AppController { //======================================================================================================== //======================================================================================================== + @UseGuards(JwtAuthGuard) @Post('/conv') async createConv(@Request() req, @Body() data: any) { ///create conv and return it ? id? console.log(`data post /conv= ${data}`); console.log(`data post /conv= ${data.members}`); console.log(`data post /conv= ${data.name}`); + + // const param = data; + const amIhere = data.members.includes(req.user.username); + if (!amIhere) + data.members.push(req.user.username) // let test = {id: 2, members: "cc"}; + data.owner = req.user.username return await this.chatService.createConv(data); // res.json(messages); } diff --git a/containers/api/src/auth/login42.ts b/containers/api/src/auth/login42.ts index 929afb39..da09b7f3 100644 --- a/containers/api/src/auth/login42.ts +++ b/containers/api/src/auth/login42.ts @@ -73,6 +73,7 @@ export class loginClass { otp_verified: false, friendRequest: null, friends: null, + blocked: null, photo: null, }; await this.usersService.create(user); diff --git a/containers/api/src/model/chat.entity.ts b/containers/api/src/model/chat.entity.ts index 246197ac..eb483c35 100644 --- a/containers/api/src/model/chat.entity.ts +++ b/containers/api/src/model/chat.entity.ts @@ -8,7 +8,7 @@ import { Entity, Column, PrimaryGeneratedColumn, CreateDateColumn, BaseEntity } @Column('text', { array: true, nullable: true }) members: string[]; - @Column({ nullable: true }) + @Column({ default: "Unnamed Conv" }) name: string @Column({ nullable: true }) @@ -17,11 +17,14 @@ import { Entity, Column, PrimaryGeneratedColumn, CreateDateColumn, BaseEntity } // @Column() // members: string;// arry ??? one to many ??? - @Column({ nullable: true }) - banned: string;// arry ??? one to many ??? + @Column('text', { array: true, nullable: true }) + banned: string[]; + + @Column('text', { array: true, nullable: true }) + admin: string[]; @Column({ nullable: true }) - admin: string;// arry ??? one to many ??? + owner: string; @Column({ nullable: true }) messages: string; diff --git a/containers/api/src/model/user.entity.ts b/containers/api/src/model/user.entity.ts index 1928c9fa..5ddd7709 100644 --- a/containers/api/src/model/user.entity.ts +++ b/containers/api/src/model/user.entity.ts @@ -68,6 +68,9 @@ export class User { @Column('text', { array: true, nullable: true }) friends: string[]; + @Column('text', { array: true, nullable: true }) + blocked: string[]; + @OneToMany(() => MatchLog, (child) => child.parent, { eager: true }) children: MatchLog[]; diff --git a/containers/api/src/users/users.service.ts b/containers/api/src/users/users.service.ts index 433cea6f..b8761fcf 100644 --- a/containers/api/src/users/users.service.ts +++ b/containers/api/src/users/users.service.ts @@ -79,9 +79,21 @@ export class UsersService { } async addFriend(user: User, username: string) { + if (!(await this.findOne(username))) + return (0); user.friends = user.friends || []; user.friends.push(username); this.save(user); + return (1); + } + + async addBlocked(user: User, username: string) { + if (!(await this.findOne(username))) + return (0); + user.blocked = user.blocked || []; + user.blocked.push(username); + this.save(user); + return (1); } async getRanking() { diff --git a/containers/react/src/components/Alert/GreenAlert.jsx b/containers/react/src/components/Alert/GreenAlert.jsx index cded387b..4cd27860 100644 --- a/containers/react/src/components/Alert/GreenAlert.jsx +++ b/containers/react/src/components/Alert/GreenAlert.jsx @@ -31,7 +31,7 @@ function GreenAlert ({handleClose, text}){

{text}

- {setTimeout(handleClose, 3000)} + {setTimeout(handleClose, 1500)} ) } diff --git a/containers/react/src/components/Alert/RedAlert.jsx b/containers/react/src/components/Alert/RedAlert.jsx index 3a9104b1..1a61f27d 100644 --- a/containers/react/src/components/Alert/RedAlert.jsx +++ b/containers/react/src/components/Alert/RedAlert.jsx @@ -30,7 +30,7 @@ function RedAlert ({handleClose, text}) {

{text}

- {setTimeout(handleClose, 3000)} + {setTimeout(handleClose, 1500)} ) } diff --git a/containers/react/src/components/Messages/Chats.jsx b/containers/react/src/components/Messages/Chats.jsx index 0fbf3230..b694b9ae 100644 --- a/containers/react/src/components/Messages/Chats.jsx +++ b/containers/react/src/components/Messages/Chats.jsx @@ -224,38 +224,75 @@ function Chats(){ } } + + const [friend, setFriend] = useState(""); const [modalOpen, setModalOpen] = useState(false); const [addFriend, setAddFriend] = useState(false); const [block, setBlock] = useState(false); + + const [showAddFriendAlert, setShowAddFriendAlert] = useState(false); + const [showBlockAlert, setShowBlockAlert] = useState(false); + const close = () => setModalOpen(false); const open = () => setModalOpen(true); - const closeAddFriend = () => setAddFriend(false); - const closeBlock = () => setBlock(false); - const handleFriend = e => { - setFriend(e.target.value) - }; + // const closeAddFriend = () => setAddFriend(false); + // const closeBlock = () => setBlock(false); - // const findValue = () => { - // // setFind(false); - // console.log(friend); - // Rank.map((tab) => { - // if (tab.name === friend) - // { - // console.log("ok bon"); - // setFind(true); - // } - // }) - // console.log(find); - // // if (!find) - // }; + + const handleFriend = (event) => { + setFriend(event.target.value); + }; - // console.log(`data user1= ${user.username}`) - - // while (user === null) - // ; + const handleAddFriend = async () => { + try{ + const res = await api.post("/friend", {username: friend}) + // if (res.data === 1) + // console.log("res in friend= ", res) + console.log("res in friend= ", res.data) + if(res.data === 1) + { + setAddFriend(true); + setBlock(false); // Reset block state + setShowBlockAlert(false); + } + else + setAddFriend(false); + setShowAddFriendAlert(true); + } catch(err) { + console.log(err) + } + }; + + const handleBlockFriend = async () => { + try{ + const res = await api.post("/block", {username: friend}) + // if(1) + if (res.data === 1) + { + setBlock(true); + setAddFriend(false); // Reset addFriend state + setShowAddFriendAlert(false); + } + else + setBlock(false); + setShowBlockAlert(true); + } catch(err) { + console.log(err) + } + }; + + const closeAddFriend = () => { + setAddFriend(false); + setShowAddFriendAlert(false); + }; + + const closeBlock = () => { + setBlock(false); + setShowBlockAlert(false); + }; //======================================================================================================== @@ -290,13 +327,17 @@ function Chats(){

{user.nickname}

)} -
+ + + + {/* work here bitch */} + + {/*
(addFriend ? setAddFriend(false) : setAddFriend(true))}> - {/* {console.log("find = ",find) && setFind(true)} */} {addFriend && } - {/* {console.log("find2 = ", find) && find && } */} -
+
*/} +
+ + + + + + null}> + {showAddFriendAlert && addFriend && ( + + )} + {showAddFriendAlert && !addFriend && ( + + )} + + + + + + + null}> + {showBlockAlert && block && ( + + )} + {showBlockAlert && !block && ( + + )} + + +
+ + + + + + +
diff --git a/containers/react/src/components/Messages/Modal.jsx b/containers/react/src/components/Messages/Modal.jsx index 4dea9b6e..9aa96f79 100644 --- a/containers/react/src/components/Messages/Modal.jsx +++ b/containers/react/src/components/Messages/Modal.jsx @@ -5,6 +5,7 @@ import '../../styles/Messages.css' import { useState } from "react"; import { GrAdd } from "react-icons/gr"; import { Link } from "react-router-dom"; +import api from "../../script/axiosApi"; const dropIn = { hidden:{y:"-100vh", @@ -23,11 +24,12 @@ const dropIn = { }; const Modal = ({handleClose, text}) => { - const [multi, setMulti] = useState(false); + // const [multi, setMulti] = useState(false); const [selectTags, setSelectTag] = useState([{ id: 1, selectedOption: ''}]); const [selectedOptionArray, setSelectedOptionArray] = useState([]); const handleOptionChange = (selectId, selectedOption) => { + console.log("selected Option=", selectedOption) setSelectTag((prevTags) => prevTags.map((tag) => tag.id === selectId ? { ...tag, selectedOption } : tag @@ -38,11 +40,27 @@ const Modal = ({handleClose, text}) => { const addNewSelectedTag = () => { const newSelectedId = Math.max (...selectTags.map((tag) => tag.id)) + 1; setSelectTag([...selectTags, { id: newSelectedId, selectedOption: ''}]); + console.log(selectTags) }; const saveSelectedOptions = () => { - const selectedOptions = selectTags.map((tag) => tag.selectedOption); + // const selectedOptions = selectTags.map((tag) => tag.selectedOption); + const selectedOptions = selectTags.map((tag) => tag.selectedOption).filter((option) => option !== ''); + + console.log("selected= ", selectedOptions); + //do db stuff here + const data = { + members: selectedOptions, + name: "prout" + } + try{ + api.post("/conv", data); + handleClose(); + } catch(err) { + console.log(err); + } setSelectedOptionArray(selectedOptions); + } let new_name; return ( @@ -55,55 +73,43 @@ const Modal = ({handleClose, text}) => { animate="visible" exit="exit" > -

New Convewrstion

+ {/*

New Conversation

*/} -{/* First selection */} + {selectTags.map((selectTag) => ( +
+ +
+ ))} - -{/* Second selection */} - {selectTags.map((selectTag) =>( -
- - -
- )) - } -
-

Selected Option:

-
    - {selectedOptionArray.map((option, index) => ( -
  • {option}
    • - ))} -
-
-
- {multi === true ? ( - ) : " "} -
-
- Submit - - Cancel -
+
+ +
+
+

Selected Option:

+
    + {selectedOptionArray.map((option, index) => ( +
  • {option}
    • + ))} +
+
+
+ Submit + + Cancel +
diff --git a/containers/react/src/styles/chat.css b/containers/react/src/styles/chat.css index cf81842f..1a5681b2 100644 --- a/containers/react/src/styles/chat.css +++ b/containers/react/src/styles/chat.css @@ -156,4 +156,14 @@ bottom: 50px; font-size: 13px; font-style: italic; -} \ No newline at end of file +} + + +/* Messages.css */ +/* import '../../styles/Messages.css' */ + +/* General styles */ +/* Messages.css */ +/* import '../../styles/Messages.css' */ + +/* General styles \ No newline at end of file