correct error,linking,image profile, performeOME

codekatabattle-polimi · Feb 4, 2024 · f307e96 · f307e96
1 parent fd15d21
commit f307e96
Show file tree

Hide file tree

Showing 12 changed files with 121 additions and 96 deletions.
diff --git a/IT/codekatabattle-frontend/src/components/ImageCreator.tsx b/IT/codekatabattle-frontend/src/components/ImageCreator.tsx
@@ -1,26 +1,4 @@
-import {useEffect, useState} from "react";
-import {AuthService, GHUser} from "../services/openapi";
-
 
 export const ImageCreator= ({username}: {username :string}) => {
-    const [user,setUser]=useState<GHUser>();
-
-    useEffect(() => {
-        fetchUser()
-    }, []);
-    async function fetchUser(){
-            const ghuser=await AuthService.getUserInfo(username);
-            setUser(ghuser);
-    }
-
-    if(user){
-        return(
-            <><img src={user.avatar_url}/></>
-
-                )
-            }
-                return(
-                    <>
-                        <span className="loading loading-ring loading-lg"></span>
-                    </>)
+    return(<><img src={`https://github.com/${username}.png`}/></>)
 }
diff --git a/IT/codekatabattle-frontend/src/components/NavBar.tsx b/IT/codekatabattle-frontend/src/components/NavBar.tsx
@@ -66,7 +66,7 @@ export const NavBar= () => {
                 <div className="navbar-end">
                     <form className="input input-bordered  ">
                         <ul className="menu menu-vertical lg:menu-horizontal">
-                                <input type="text" placeholder="Type here..." style={{height:"5%",paddingTop:"4%"}} className="bg-base-100 "
+                                <input type="text" placeholder="Search user..." style={{height:"5%",paddingTop:"4%"}} className="bg-base-100 "
                                        onChange={event => setUsername(event.target.value)}/>
                                 <button className="btm btn-sm btn-ghost btn-circle" style={{right:"70%"}} onClick={()=>navigate("/profile/"+username)}>
                                     <svg xmlns="http://www.w3.org/2000/svg" className="h-5 w-5" fill="none"

diff --git a/...e-frontend/src/components/PerformeOME.tsx → ...le-frontend/src/components/PerformOME.tsx b/...e-frontend/src/components/PerformeOME.tsx → ...le-frontend/src/components/PerformOME.tsx
@@ -1,15 +1,22 @@
-import {Link, useParams} from "react-router-dom";
+import {Link, useNavigate, useParams} from "react-router-dom";
 import {useContext, useEffect, useState} from "react";
 import {AuthContext} from "../context/AuthContext.ts";
-import {Battle, BattleParticipant, BattleParticipantUpdateDTO, BattleService} from "../services/openapi";
+import {
+    Battle,
+    BattleParticipant,
+    BattleParticipantUpdateDTO,
+    BattleService,
+    BattleUpdateDTO
+} from "../services/openapi";
 import {NavBar} from "./NavBar.tsx";
 import nunchaku from "../assets/nunchaku.png";
 
-export const PerformeOME= () => {
+export const PerformOME= () => {
     const params = useParams();
     const {user}=useContext(AuthContext);
     const [battle, setBattle] = useState<Battle | null>(null);
     const [error, setError] = useState<Error | null>(null);
+    const navigate=useNavigate();
     const [OMEs] = useState(
         new Array(battle?.participants?.length).fill(0)
     );
@@ -78,7 +85,7 @@ export const PerformeOME= () => {
                 </td>
                 <td>
                     <label className="btn btn-primary"
-                           onClick={() => performOME(index, participantId)}>Edit</label>
+                           onClick={() => performOME(index, participantId)}>Save</label>
                 </td>
             </>
         )
@@ -105,12 +112,27 @@ export const PerformeOME= () => {
         )
     }
 
+    async function editBattle(){
+        (document.getElementById('my_modal_2') as HTMLDialogElement).showModal();
+        if(!battle)return;
+        const updateBattle:BattleUpdateDTO={startsAt: battle.startsAt, endsAt: battle.endsAt, enableManualEvaluation: false};
+        if(battle.id!=undefined){
+            try{
+                await BattleService.updateById1(battle.id,updateBattle);
+                navigate("/tournaments/"+params.tId+"/battles/"+params.bId);
+            } catch (e) {
+                setError(e as Error);
+                if(error?.message)alert(error.message);
+            }
+        }
+    }
+
     return (
         <>
             <div style={{top: "8%", width: "100%", position: "absolute"}}>
 
                 <div className="navbar bg-base-200" style={{width: "100%"}}>
-                <div className="navbar-start"></div>
+                    <div className="navbar-start"></div>
                     <div className="navbar-center">
                         <div className="w-10 h-10 rounded-full">
                             <img src={nunchaku}/>
@@ -139,6 +161,11 @@ export const PerformeOME= () => {
                         </tbody>
                     </table>
                 </div>
+                <div style={{padding:"1%"}}>
+                    <label style={{width: "100%"}} className="btn btn-error" onClick={() => editBattle()}>Terminate OME
+                        and BATTLE!!</label>
+
+                </div>
             </div>
             <div style={{top: "0%", position: "fixed", width: "100%", height: "10%"}}><NavBar/></div>
 

diff --git a/IT/codekatabattle-frontend/src/components/ProfilePage.tsx b/IT/codekatabattle-frontend/src/components/ProfilePage.tsx
@@ -1,7 +1,7 @@
 //import {useContext} from "react";
 //import {AuthContext} from "../context/AuthContext.ts";
 
-import {useNavigate, useParams} from "react-router-dom";
+import {Link, useNavigate, useParams} from "react-router-dom";
 import {AuthService, GHUser, PageTournament, Tournament, TournamentService} from "../services/openapi";
 import {NavBar} from "./NavBar.tsx";
 import {useEffect, useState} from "react";
@@ -66,19 +66,19 @@ export const ProfilePage= () => {
 
         if (tournaments == null)
             return (<>No tournament found</>);
-        if (tournaments.content == null) return (<>No tournament found 1</>);
-        if (tournaments.content.length == 0) return (<>No tournament found 2</>);
+        if (tournaments.content == null) return (<>No tournament found </>);
+        if (tournaments.content.length == 0) return (<>No tournament found </>);
         return(
             tournaments.content.map((t: Tournament) => (
-                <tr className=" bg-base-200 shadow rounded-box" style={{width: "100%"}} onClick={() => to(t.id?.toString())}>
-                    <th style={{width: "10%", overflow: "auto"}}>
+                <tr className=" bg-base-200 shadow rounded-box" style={{width: "100%"}}>
+                    <th style={{width: "10%", overflow: "auto"}} onClick={() => to(t.id?.toString())}>
                         <div className=" ">
                             <div className="stat-title text-xs">Title</div>
                             <div className="stat-value text-2xl">{t.title}
                             </div>
                         </div>
                     </th>
-                    <th>
+                    <th onClick={() => to(t.id?.toString())}>
                         <div className="" style={{overflow: "auto"}}>
                             <div className="stat-title text-xs">Total Coordinators</div>
                             <div className="navbar " style={{}}>
@@ -90,7 +90,7 @@ export const ProfilePage= () => {
                             <div className="stat-desc"></div>
                         </div>
                     </th>
-                    <th>
+                    <th onClick={() => to(t.id?.toString())}>
                         <div className="" style={{overflow: "auto"}}>
                             <div className="stat-title text-xs">Total Participants</div>
                             <div className="navbar " style={{}}>
@@ -103,7 +103,7 @@ export const ProfilePage= () => {
                         </div>
                     </th>
 
-                    <th>
+                    <th onClick={() => to(t.id?.toString())}>
                         <div className="stat" style={{overflow: "auto"}}>
                             <div className="stat-figure" style={{paddingTop: "25%"}}>
                                 <div
@@ -126,6 +126,7 @@ export const ProfilePage= () => {
                     </th>
 
                     <th>
+                        <Link to={"/profile/"+t.creator}>
                         <div className="stat" style={{overflow: "auto"}}>
                             <div className="stat-figure text-secondary">
                                 <div className="avatar online">
@@ -137,6 +138,7 @@ export const ProfilePage= () => {
                             <div className="stat-title" style={{paddingTop: "10%"}}>created by</div>
                             <div className="stat-desc text-primary">{t.creator}</div>
                         </div>
+                        </Link>
                     </th>
 
 

diff --git a/IT/codekatabattle-frontend/src/components/VisualizeBattle.tsx b/IT/codekatabattle-frontend/src/components/VisualizeBattle.tsx
@@ -1,4 +1,3 @@
-import Avatar from "../assets/avatar2.png"
 import {useContext, useEffect, useState} from "react";
 import {
     Battle,
@@ -40,6 +39,7 @@ export const VisualizeBattle= () => {
         try {
             const battle = await BattleService.findById1(+bId!);
             setBattle(battle);
+            setNewOME((battle.enableManualEvaluation ?? false));
         } catch (error) {
             setError(error as Error);
         }
@@ -62,9 +62,14 @@ export const VisualizeBattle= () => {
     }
 
     function joinOrLeaveButton() {
+        if(!battle?.endsAt) return (<></>);
+        const endAt=new Date(battle.endsAt);
+        const now= new Date();
         if(battle?.participants == undefined )
-            return (<></>)
+            return (<></>);
         if(!user)return (<></>)
+        if(battle.creator == (user.login) && !battle.enableManualEvaluation && compareDate(now,endAt)==1)
+            return (<></>);
         if(battle.creator == (user.login))
             return (editButton())
         if(battle.participants.length == 0 || !battle.participants.map((partcipant) => partcipant.username == user?.login).reduce((boola, boolb) => boola || boolb))
@@ -387,14 +392,22 @@ export const VisualizeBattle= () => {
         let status: string;
         let message: string;
 
-        if (compareDate(now, endDate) == 1) {
+        if (compareDate(now, endDate) == 1 && !battle.enableManualEvaluation) {
             colorBadge = " font-bold badge badge-error";
             colorText = "dropdown-content z-[1] menu p-2 shadow bg-base-300 rounded-box w-52 badge-error badge-outline";
             status = "terminated";
             message = "The battle has ended! :(";
 
 
-        } else if (compareDate(now, startDate) == 1 && compareDate(now, endDate) != 1) {
+        }
+        else if (compareDate(now, endDate) == 1 && battle.enableManualEvaluation) {
+            colorBadge = " font-bold badge badge-secondary";
+            colorText = "dropdown-content z-[1] menu p-2 shadow bg-base-300 rounded-box w-52 badge-secondary badge-outline";
+            status = "Consolidation";
+            message = "The creator is performing manual evaluation";
+
+
+        }else if (compareDate(now, startDate) == 1 && compareDate(now, endDate) != 1) {
             colorBadge = " font-bold badge badge-warning";
             colorText = "dropdown-content z-[1] menu p-2 shadow bg-base-300 rounded-box w-52 badge-warning badge-outline";
             status = "ongoing";
@@ -426,6 +439,7 @@ export const VisualizeBattle= () => {
     }
 
     function upperBar() {
+        if(!battle?.creator)return(<></>);
         return (
             <div className="navbar bg-base-100">
                 <div className="flex-1 navbar-start">
@@ -445,6 +459,7 @@ export const VisualizeBattle= () => {
                     <div style={{padding: "2%"}}>
                         {joinOrLeaveButton()}
                     </div>
+                    <Link to={"/profile/"+battle.creator}>
                     <ul className="menu menu-vertical lg:menu-horizontal bg-base-200 rounded-box">
                         <a>
                             <div style={{paddingRight: "10%", paddingLeft: "1%"}}>
@@ -458,13 +473,14 @@ export const VisualizeBattle= () => {
                         <a>
                             <div style={{padding: "1%"}} className="avatar">
                                 <div className="w-16 h-16 rounded-box" style={{position: "relative", right: "0%"}}>
-                                    <img src={Avatar}/>
+                                    <img src={`https://github.com/${battle.creator}.png`}/>
                                 </div>
                             </div>
                         </a>
 
 
                     </ul>
+                    </Link>
 
                 </div>
             </div>
@@ -487,11 +503,11 @@ export const VisualizeBattle= () => {
                 <>
                     <div style={{paddingLeft: "1%"}}>
                         <div className="stats shadow bg-base-200 border border-base-300">
-                            <Link to={location+"/performe/OME"}>
+                            <Link to={location+"/perform/OME"}>
                                 <div className="stat bg-error">
                                     <div className="stat-title text-black">Click</div>
                                     <div className="stat-value text-black">
-                                        <p className="font-bold">Performe OME</p>
+                                        <p className="font-bold">Perform OME</p>
                                     </div>
                                     <div className="stat-desc text-black">for performing the manual evaluation and terminate the battle</div>
                                 </div>

diff --git a/IT/codekatabattle-frontend/src/components/VisualizeCoordinatedTournaments.tsx b/IT/codekatabattle-frontend/src/components/VisualizeCoordinatedTournaments.tsx
@@ -2,7 +2,7 @@ import {AuthService, PageTournament, Tournament, TournamentService} from "../ser
 import {useContext, useEffect, useState} from "react";
 import {NavBar} from "./NavBar.tsx";
 import five from "../assets/high-five.png"
-import {useNavigate, useParams} from "react-router-dom";
+import {Link, useNavigate, useParams} from "react-router-dom";
 import student from "../assets/reading.png";
 import educator from "../assets/educator.png";
 import {ImageCreator} from "./ImageCreator.tsx";
@@ -135,15 +135,15 @@ export const VisualizeCoordinatedTournaments= () => {
         if (tournaments.content == null) return (<></>);
         return(
             tournaments.content.map((t: Tournament) => (
-                <tr className=" shadow " style={{width: "100%"}} onClick={() => navigate("/tournaments/"+t.id?.toString())}>
-                    <th style={{width: "10%", overflow: "auto"}}>
+                <tr className=" shadow " style={{width: "100%"}} >
+                    <th style={{width: "10%", overflow: "auto"}} onClick={() => navigate("/tournaments/"+t.id?.toString())}>
                         <div className=" ">
                             <div className="stat-title text-xs">Title</div>
                             <div className="stat-value text-2xl">{t.title}
                             </div>
                         </div>
                     </th>
-                    <th>
+                    <th onClick={() => navigate("/tournaments/"+t.id?.toString())}>
                         <div className="" style={{overflow: "auto"}}>
                             <div className="stat-title text-xs">Total Coordinators</div>
                             <div className="navbar " style={{}}>
@@ -155,7 +155,7 @@ export const VisualizeCoordinatedTournaments= () => {
                             <div className="stat-desc"></div>
                         </div>
                     </th>
-                    <th>
+                    <th onClick={() => navigate("/tournaments/"+t.id?.toString())}>
                         <div className="" style={{overflow: "auto"}}>
                             <div className="stat-title text-xs">Total Participants</div>
                             <div className="navbar " style={{}}>
@@ -168,7 +168,7 @@ export const VisualizeCoordinatedTournaments= () => {
                         </div>
                     </th>
 
-                    <th>
+                    <th onClick={() => navigate("/tournaments/"+t.id?.toString())}>
                         <div className="stat" style={{overflow: "auto"}}>
                             <div className="stat-figure" style={{paddingTop: "25%"}}>
                                 <div
@@ -191,6 +191,7 @@ export const VisualizeCoordinatedTournaments= () => {
                     </th>
 
                     <th>
+                        <Link to={"/profile/"+t.creator}>
                         <div className="stat" style={{overflow: "auto"}}>
                             <div className="stat-figure text-secondary">
                                 <div className="avatar online">
@@ -202,6 +203,7 @@ export const VisualizeCoordinatedTournaments= () => {
                             <div className="stat-title" style={{paddingTop: "10%"}}>created by</div>
                             <div className="stat-desc text-primary">{t.creator}</div>
                         </div>
+                        </Link>
                     </th>
 
 
@@ -211,7 +213,6 @@ export const VisualizeCoordinatedTournaments= () => {
 
     }
 
-    if (tournaments == null) return (<>no tournament</>);
     return (
         <>
             <div style={{alignSelf: "end", top: "8%",position:"fixed", width: "100%"}}>