10 files changed, 47 insertions, 52 deletions

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index d1d501d..c6952b1 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -1,5 +1,5 @@
 import React from 'react';
-import { Routes, Route, useLocation } from "react-router-dom";
+import { Routes, Route } from "react-router-dom";
 
 import { UserProfile } from './types/Profile';
 import Sidebar from './components/Sidebar';
@@ -18,22 +18,15 @@ import { API } from './api/Api';
 import Maplist from './pages/Maplist';
 import Rankings from './pages/Rankings';
 import { get_user_id_from_token, get_user_mod_from_token } from './utils/Jwt';
-import { MapDeleteEndpoint } from './types/Map';
 
 const App: React.FC = () => {
   const [token, setToken] = React.useState<string | undefined>(undefined);
   const [profile, setProfile] = React.useState<UserProfile | undefined>(undefined);
   const [isModerator, setIsModerator] = React.useState<boolean>(false);
 
-  const [msgIsOpen, setMsgIsOpen] = React.useState<boolean>(false);
-
   const [games, setGames] = React.useState<Game[]>([]);
 
   const [uploadRunDialog, setUploadRunDialog] = React.useState<boolean>(false);
-  const [uploadRunDialogMapID, setUploadRunDialogMapID] = React.useState<number | undefined>(undefined);
-
-  const [confirmDialogOpen, setConfirmDialogOpen] = React.useState<boolean>(false);
-  const [currDeleteMapInfo, setCurrDeleteMapInfo] = React.useState<MapDeleteEndpoint>();
 
   const _fetch_token = async () => {
     const token = await API.get_token();
@@ -45,10 +38,9 @@ const App: React.FC = () => {
     setGames(games);
   };
 
-  const _set_profile = async (user_id: string | undefined) => {
-    if (user_id) {
-      setProfile({} as UserProfile); // placeholder before we call actual user profile
-      const user = await API.get_profile(token!);
+  const _set_profile = async (user_id?: string) => {
+    if (user_id && token) {
+      const user = await API.get_profile(token);
       setProfile(user);
     }
   };
@@ -58,6 +50,7 @@ const App: React.FC = () => {
       setProfile(undefined);
       setIsModerator(false);
     } else {
+      setProfile({} as UserProfile); // placeholder before we call actual user profile
       _set_profile(get_user_id_from_token(token))
       const modStatus = get_user_mod_from_token(token)
       if (modStatus) {
@@ -81,15 +74,20 @@ const App: React.FC = () => {
 
   return (
     <>
-      <UploadRunDialog token={token} open={uploadRunDialog} onClose={() => setUploadRunDialog(false)} games={games} />
+      <UploadRunDialog token={token} open={uploadRunDialog} onClose={(updateProfile) => {
+        setUploadRunDialog(false);
+        if (updateProfile) {
+          _set_profile(get_user_id_from_token(token));
+        }
+      }} games={games} />
       <Sidebar setToken={setToken} profile={profile} setProfile={setProfile} onUploadRun={() => setUploadRunDialog(true)} />
       <Routes>
         <Route path="/" element={<Homepage />} />
-        <Route path="/profile" element={<Profile profile={profile} token={token} gameData={games} onDeleteRecord={() => setConfirmDialogOpen(true)} />} />
+        <Route path="/profile" element={<Profile profile={profile} token={token} gameData={games} onDeleteRecord={() => _set_profile(get_user_id_from_token(token))} />} />
         <Route path="/users/*" element={<User profile={profile} token={token} gameData={games} />} />
         <Route path="/games" element={<Games games={games} />} />
         <Route path='/games/:id' element={<Maplist />}></Route>
-        <Route path="/maps/*" element={<Maps token={token} isModerator={isModerator} />}/>
+        <Route path="/maps/*" element={<Maps token={token} isModerator={isModerator} />} />
         <Route path="/rules" element={<Rules />} />
         <Route path="/about" element={<About />} />
         <Route path='/rankings' element={<Rankings />}></Route>
diff --git a/frontend/src/api/Maps.tsx b/frontend/src/api/Maps.tsx
index 2209788..80f88d4 100644
--- a/frontend/src/api/Maps.tsx
+++ b/frontend/src/api/Maps.tsx
@@ -75,7 +75,7 @@ export const delete_map_discussion = async (token: string, map_id: string, discu
   return response.data.success;
 };
 
-export const post_record = async (token: string, run: UploadRunContent): Promise<string> => {
+export const post_record = async (token: string, run: UploadRunContent): Promise<[boolean, string]> => {
   if (run.partner_demo) {
     const response = await axios.postForm(url(`maps/${run.map_id}/record`), {
       "host_demo": run.host_demo,
@@ -85,7 +85,7 @@ export const post_record = async (token: string, run: UploadRunContent): Promise
         "Authorization": token,
       }
     });
-    return response.data.message;
+    return [ response.data.success, response.data.message ];
   } else {
     const response = await axios.postForm(url(`maps/${run.map_id}/record`), {
       "host_demo": run.host_demo,
@@ -94,7 +94,7 @@ export const post_record = async (token: string, run: UploadRunContent): Promise
         "Authorization": token,
       }
     });
-    return response.data.message;
+    return [ response.data.success, response.data.message ];
   }
 }
 
diff --git a/frontend/src/components/Leaderboards.tsx b/frontend/src/components/Leaderboards.tsx
index f4d666d..f86aa7b 100644
--- a/frontend/src/components/Leaderboards.tsx
+++ b/frontend/src/components/Leaderboards.tsx
@@ -40,8 +40,8 @@ const Leaderboards: React.FC<LeaderboardsProps> = ({ data }) => {
 
         {data.map.is_coop ? (
           <div id='runner'>
-            <span>Host</span>
-            <span>Partner</span>
+            <span>Blue</span>
+            <span>Orange</span>
           </div>
         ) : (
           <span>Runner</span>
@@ -87,7 +87,7 @@ const Leaderboards: React.FC<LeaderboardsProps> = ({ data }) => {
 
             {r.kind === "multiplayer" ? (
               <span>
-                <button onClick={() => { window.alert(`Host demo ID: ${r.host_demo_id} \nParnter demo ID: ${r.partner_demo_id}`) }}><img src={ThreedotIcon} alt="demo_id" /></button>
+                <button onClick={() => { window.alert(`Host Demo ID: ${r.host_demo_id} \nParnter Demo ID: ${r.partner_demo_id}`) }}><img src={ThreedotIcon} alt="demo_id" /></button>
                 <button onClick={() => window.location.href = `/api/v1/demos?uuid=${r.partner_demo_id}`}><img src={DownloadIcon} alt="download" style={{ filter: "hue-rotate(160deg) contrast(60%) saturate(1000%)" }} /></button>
                 <button onClick={() => window.location.href = `/api/v1/demos?uuid=${r.host_demo_id}`}><img src={DownloadIcon} alt="download" style={{ filter: "hue-rotate(300deg) contrast(60%) saturate(1000%)" }} /></button>
               </span>
diff --git a/frontend/src/components/MessageDialog.tsx b/frontend/src/components/MessageDialog.tsx
index 0a8db42..17b1258 100644
--- a/frontend/src/components/MessageDialog.tsx
+++ b/frontend/src/components/MessageDialog.tsx
@@ -19,7 +19,7 @@ const MessageDialog: React.FC<MessageDialogProps> = ({ title, subtitle, onClose
                     <span>{subtitle}</span>
                 </div>
                 <div className='dialog-element dialog-btns-container'>
-                    <button onClick={onClose}>Ok</button>
+                    <button onClick={onClose}>Close</button>
                 </div>
             </div>
         </div>
diff --git a/frontend/src/components/UploadRunDialog.tsx b/frontend/src/components/UploadRunDialog.tsx
index 8081643..a0d23e7 100644
--- a/frontend/src/components/UploadRunDialog.tsx
+++ b/frontend/src/components/UploadRunDialog.tsx
@@ -13,18 +13,15 @@ import useConfirm from '../hooks/UseConfirm';
 interface UploadRunDialogProps {
   token?: string;
   open: boolean;
-  onClose: () => void;
+  onClose: (updateProfile: boolean) => void;
   games: Game[];
 }
 
 const UploadRunDialog: React.FC<UploadRunDialogProps> = ({ token, open, onClose, games }) => {
 
-  const [confirmMessage, setConfirmMessage] = React.useState<string>("Are you sure you want to upload this demo?");
-
   const { message, MessageDialogComponent } = useMessage();
   const { confirm, ConfirmDialogComponent } = useConfirm();
 
-
   const navigate = useNavigate();
 
   const [uploadRunContent, setUploadRunContent] = React.useState<UploadRunContent>({
@@ -125,44 +122,41 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({ token, open, onClose,
     if (token) {
       if (games[selectedGameID].is_coop) {
         if (uploadRunContent.host_demo === null) {
-          message("Error", "You must select a host demo to upload.")
+          await message("Error", "You must select a host demo to upload.")
           return
         } else if (uploadRunContent.partner_demo === null) {
-          message("Error", "You must select a partner demo to upload.")
+          await message("Error", "You must select a partner demo to upload.")
           return
         }
       } else {
         if (uploadRunContent.host_demo === null) {
-          message("Error", "You must select a demo to upload.")
+          await message("Error", "You must select a demo to upload.")
           return
         }
       }
       const demo = SourceDemoParser.default()
         .setOptions({ packets: true, header: true })
         .parse(await uploadRunContent.host_demo.arrayBuffer());
-      const scoreboard = demo.findPacket<NetMessages.SvcUserMessage>((message) => {
-        return message instanceof NetMessages.SvcUserMessage && message.userMessage instanceof ScoreboardTempUpdate;
+      const scoreboard = demo.findPacket<NetMessages.SvcUserMessage>((msg) => {
+        return msg instanceof NetMessages.SvcUserMessage && msg.userMessage instanceof ScoreboardTempUpdate;
       })
 
       if (!scoreboard) {
-        message("Error", "Error while processing demo: Unable to get scoreboard result. Either there is a demo that is corrupt or haven't been recorded in challenge mode.")
+        await message("Error", "Error while processing demo: Unable to get scoreboard result. Either there is a demo that is corrupt or haven't been recorded in challenge mode.")
         return
       }
       const { portalScore, timeScore } = scoreboard.userMessage?.as<ScoreboardTempUpdate>() ?? {};
-      console.log(`Map Name: ${demo.mapName}. Portal Count: ${portalScore}. Ticks: ${timeScore}.`);
-
-      setConfirmMessage(`Map Name: ${demo.mapName}\nPortal Count: ${portalScore}\nTicks: ${timeScore}\n\nAre you sure you want to upload this demo?`)
       
-      const userConfirmed = await confirm("Upload demo?", confirmMessage);
+      const userConfirmed = await confirm("Upload Record", `Map Name: ${demo.mapName}\nPortal Count: ${portalScore}\nTicks: ${timeScore}\n\nAre you sure you want to upload this demo?`);
 
       if (!userConfirmed) {
         return;
       }
 
-      const response = await API.post_record(token, uploadRunContent);
-      await message("Message", response);
-      // navigate(0);
-      onClose();
+      const [ success, response ] = await API.post_record(token, uploadRunContent);
+      await message("Upload Record", response);
+      console.log("weweew")
+      onClose(success);
     }
   };
 
@@ -242,7 +236,7 @@ const UploadRunDialog: React.FC<UploadRunDialogProps> = ({ token, open, onClose,
                       </div>
                       <div className='upload-run-buttons-container'>
                         <button onClick={_upload_run}>Submit</button>
-                        <button onClick={() => onClose()}>Cancel</button>
+                        <button onClick={() => onClose(false)}>Cancel</button>
                       </div>
                     </div>
                   </>
diff --git a/frontend/src/css/Dialog.css b/frontend/src/css/Dialog.css
index f16425d..47f070b 100644
--- a/frontend/src/css/Dialog.css
+++ b/frontend/src/css/Dialog.css
@@ -1,10 +1,9 @@
 .dimmer {
     position: fixed;
-    width: calc(100%);
+    width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.5);
     z-index: 4;
-    left: 0px;
 }
 
 .dialog {
diff --git a/frontend/src/css/UploadRunDialog.css b/frontend/src/css/UploadRunDialog.css
index b4667da..c783d2a 100644
--- a/frontend/src/css/UploadRunDialog.css
+++ b/frontend/src/css/UploadRunDialog.css
@@ -13,7 +13,7 @@ div#upload-run{
     left: calc(50% + 160px); top: 130px;
     transform: translateX(-50%);
     background-color: #2b2e46;
-    z-index: 2; color: white;
+    z-index: 3; color: white;
     font-family: BarlowSemicondensed-SemiBold;
 }
 
@@ -36,10 +36,9 @@ div#upload-run{
     position: absolute;
     background-color: black;
     opacity: .3;
-    left: 320px;
-    width: calc(100% - 320px);
+    width: 100%;
     height: 100%;
-    z-index: 2;
+    z-index: 3;
     cursor: no-drop;
 }
 
diff --git a/frontend/src/hooks/UseConfirm.tsx b/frontend/src/hooks/UseConfirm.tsx
index 80a0d51..9a7853b 100644
--- a/frontend/src/hooks/UseConfirm.tsx
+++ b/frontend/src/hooks/UseConfirm.tsx
@@ -3,9 +3,9 @@ import ConfirmDialog from '../components/ConfirmDialog';
 
 const useConfirm = () => {
     const [isOpen, setIsOpen] = useState(false);
-    const [resolvePromise, setResolvePromise] = useState<((value: boolean) => void) | null>(null);
         const [title, setTitle] = useState<string>("");
         const [subtitle, setSubtitle] = useState<string>("");
+    const [resolvePromise, setResolvePromise] = useState<((value: boolean) => void) | null>(null);
 
     const confirm = ( titleN: string, subtitleN: string ) => {
         setIsOpen(true);
diff --git a/frontend/src/hooks/UseMessage.tsx b/frontend/src/hooks/UseMessage.tsx
index ebc4276..602cf65 100644
--- a/frontend/src/hooks/UseMessage.tsx
+++ b/frontend/src/hooks/UseMessage.tsx
@@ -3,10 +3,10 @@ import MessageDialog from "../components/MessageDialog";
 
 const useMessage = () => {
     const [isOpen, setIsOpen] = useState(false);
-        const [resolvePromise, setResolvePromise] = useState<((value: boolean) => void) | null>(null);
 
     const [title, setTitle] = useState<string>("");
     const [subtitle, setSubtitle] = useState<string>("");
+    const [resolvePromise, setResolvePromise] = useState<(() => void) | null>(null);
 
     const message = (title: string, subtitle: string) => {
         setIsOpen(true);
@@ -19,6 +19,10 @@ const useMessage = () => {
 
     const handleClose = () => {
         setIsOpen(false);
+        if (resolvePromise) {
+            resolvePromise();
+            setResolvePromise(null);
+        }
     };
 
     const MessageDialogComponent = isOpen && (
diff --git a/frontend/src/pages/Profile.tsx b/frontend/src/pages/Profile.tsx
index 7559c77..5d1c75d 100644
--- a/frontend/src/pages/Profile.tsx
+++ b/frontend/src/pages/Profile.tsx
@@ -63,7 +63,7 @@ const Profile: React.FC<ProfileProps> = ({ profile, token, gameData, onDeleteRec
   };
 
   const _delete_submission = async (map_id: number, record_id: number) => {
-    const userConfirmed = await confirm("Delete record?", "This action cannot be undone");
+    const userConfirmed = await confirm("Delete Record", "Are you sure you want to delete this record?");
 
     if (!userConfirmed) {
       return;
@@ -71,9 +71,10 @@ const Profile: React.FC<ProfileProps> = ({ profile, token, gameData, onDeleteRec
 
     const api_success = await API.delete_map_record(token!, map_id, record_id);
     if (api_success) {
-      message("Success", "Successfully deleted record");
+      await message("Delete Record", "Successfully deleted record.");
+      onDeleteRecord();
     } else {
-      message("Error", "Could not delete record");
+      await message("Delete Record", "Could not delete record.");
     }
   };