From e79217acf1517bc0898dee09115b33aacae9ec2c Mon Sep 17 00:00:00 2001 From: Carol He Date: Sat, 30 Sep 2023 15:41:26 -0500 Subject: [PATCH 01/11] Draft of leaderboard and CSS --- components/hacker/HackerDash.tsx | 140 +++++++++++++++++++++++++++++++ styles/hacker/Table.module.css | 55 ++++++++++++ 2 files changed, 195 insertions(+) create mode 100644 styles/hacker/Table.module.css diff --git a/components/hacker/HackerDash.tsx b/components/hacker/HackerDash.tsx index 23313ca8..742f227e 100644 --- a/components/hacker/HackerDash.tsx +++ b/components/hacker/HackerDash.tsx @@ -21,6 +21,7 @@ import TeamSetup from './TeamSetup'; import { TeamProfile } from '../../types/client'; import { ApplicationStatus, UserData, JudgingSessionData } from '../../types/database'; import styles from '../../styles/Form.module.css'; +import TableStyles from '../../styles/hacker/Table.module.css'; import { signOut, useSession } from 'next-auth/react'; import moment from 'moment'; import TextArea from 'antd/lib/input/TextArea'; @@ -193,6 +194,90 @@ export default function HackerDash({ userApplicationStatus, setUserApplicationSt getJudgingSessionData(); }, []); + // LEADERBOARD DUMMY DATA + const leaderboard = [ + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + ]; + return ( )} + {/* Leaderboard */} +
+ Leaderboard + {/*
+ + + + + + + + + + {leaderboard.map(entry => ( + + + + + + ))} + +
NameTeamPoints
{entry.name}{entry.team}{entry.points}
+
*/} +
+
Name
+
Team
+
Points
+
+
+
+
+ {leaderboard.map(entry => ( +
+ {entry.name} +
+ ))} +
+
+ {leaderboard.map(entry => ( +
+ {entry.team} +
+ ))} +
+
+ {leaderboard.map(entry => ( +
+ {entry.points} +
+ ))} +
+
+
+
+ {/* Judging Schedule */} {/* Pre-hacking code */} {/*
diff --git a/styles/hacker/Table.module.css b/styles/hacker/Table.module.css new file mode 100644 index 00000000..e1922967 --- /dev/null +++ b/styles/hacker/Table.module.css @@ -0,0 +1,55 @@ +.Container { + background-color: #000000BF; + border-radius: 50px; + padding: 45px 42px; + font-family: 'Inter'; + font-weight: bold; + font-size: 70px; + color: #FFFFFF; +} + +.Table { + font-size: 40px; +} + +.Table:after { + content: ""; + display: table; + clear: both; +} + +.Column { + float: left; + width: 33.33%; +} + +.Entries { + overflow-y: auto; + height: 700px; +} + +.Entry { + color: #C9A76B; +} + +/* attempt 2 */ +.TableContainer { + overflow: auto; + height: 700px; +} + +.TableContainer table { + table-layout: fixed; + width: 100%; +} + +.TableContainer th { + position: sticky; + top: 0; + text-align: left; + background: #000000; +} +/* +.TableContainer tbody { + background: blue; +} */ \ No newline at end of file From a49068060c85665c996e22bf2f405a8a6a42e4cc Mon Sep 17 00:00:00 2001 From: Carol He Date: Sat, 7 Oct 2023 15:11:29 -0500 Subject: [PATCH 02/11] Add judging schedule --- components/hacker/HackerDash.tsx | 290 ++++++++++++++++++++++++++++--- styles/hacker/Table.module.css | 30 +--- 2 files changed, 272 insertions(+), 48 deletions(-) diff --git a/components/hacker/HackerDash.tsx b/components/hacker/HackerDash.tsx index 742f227e..fd5f3cf8 100644 --- a/components/hacker/HackerDash.tsx +++ b/components/hacker/HackerDash.tsx @@ -194,7 +194,7 @@ export default function HackerDash({ userApplicationStatus, setUserApplicationSt getJudgingSessionData(); }, []); - // LEADERBOARD DUMMY DATA + // LEADERBOARD AND JUDGING SCHEDULE DUMMY DATA const leaderboard = [ { name: 'First Last', @@ -278,6 +278,219 @@ export default function HackerDash({ userApplicationStatus, setUserApplicationSt }, ]; + const judgingSchedule = [ + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + loc: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + ]; + + const renderJudgingTime = (time: string) => { + let startTime = new Date(time); + // add 10 minutes + let endTime = new Date(startTime.getTime() + 10 * 60000); + // return <>{startTime.getHours()}:{startTime.getMinutes()} - {endTime.getHours()}:{endTime.getMinutes()} + return ( + <> + {startTime.toLocaleTimeString('default', { + hour: '2-digit', + minute: '2-digit', + })}{' '} + -{' '} + {endTime.toLocaleTimeString('default', { + hour: '2-digit', + minute: '2-digit', + })} + + ); + }; + return ( Signed in as {session?.user?.email}
{!teamData && } - {teamData && ( + {
- + {/* */} - )} + } {/* Leaderboard */}
Leaderboard - {/*
-
- - - - - - - - - {leaderboard.map(entry => ( - - - - - - ))} - -
NameTeamPoints
{entry.name}{entry.team}{entry.points}
-
*/}
-
Name
-
Team
-
Points
+
Name
+
Team
+
Points
@@ -880,6 +1073,49 @@ export default function HackerDash({ userApplicationStatus, setUserApplicationSt
{/* Judging Schedule */} +
+ Judging Schedule + {judgingSessionData?.length === 0 && ( +
+ Schedule will show up here when hacking ends! +
+ )} + {/* Update this to be conditional on when judgingSessionData?.length > 0 */} + {judgingSchedule.length > 0 && ( + <> +
+
Time
+
Table
+
Judge
+
+
+
+
+ {judgingSchedule.map(entry => ( +
+ {renderJudgingTime(entry.time)} +
+ ))} +
+
+ {judgingSchedule.map(entry => ( +
+ {entry.loc.locationNum} +
+ ))} +
+
+ {judgingSchedule.map(entry => ( +
+ {entry.judge.name} +
+ ))} +
+
+
+ + )} +
{/* Pre-hacking code */} {/*
diff --git a/styles/hacker/Table.module.css b/styles/hacker/Table.module.css index e1922967..2dbb8054 100644 --- a/styles/hacker/Table.module.css +++ b/styles/hacker/Table.module.css @@ -18,6 +18,11 @@ clear: both; } +.ColumnHeader { + float: left; + width: 33%; +} + .Column { float: left; width: 33.33%; @@ -32,24 +37,7 @@ color: #C9A76B; } -/* attempt 2 */ -.TableContainer { - overflow: auto; - height: 700px; -} - -.TableContainer table { - table-layout: fixed; - width: 100%; -} - -.TableContainer th { - position: sticky; - top: 0; - text-align: left; - background: #000000; -} -/* -.TableContainer tbody { - background: blue; -} */ \ No newline at end of file +.Placeholder { + font-size: 90px; + color: #FFFFFF80; +} \ No newline at end of file From 259977058df04c92c8ae2b64b3181b15ed8d7d61 Mon Sep 17 00:00:00 2001 From: Carol He Date: Thu, 12 Oct 2023 00:19:26 -0500 Subject: [PATCH 03/11] add endpoint for leaderboard data --- pages/api/leaderboard.ts | 22 ++++++++++++++++++++++ 1 file changed, 22 insertions(+) create mode 100644 pages/api/leaderboard.ts diff --git a/pages/api/leaderboard.ts b/pages/api/leaderboard.ts new file mode 100644 index 00000000..3e0c1caf --- /dev/null +++ b/pages/api/leaderboard.ts @@ -0,0 +1,22 @@ +import type { NextApiRequest, NextApiResponse } from 'next'; +import { getSession } from 'next-auth/react'; +import dbConnect from '../../middleware/database'; +import User from '../../models/user'; + +export default async function handler(req: NextApiRequest, res: NextApiResponse) { + const session = await getSession({ req }); + if (session?.userType !== 'HACKER') return res.status(403).send('Forbidden'); + + await dbConnect(); + switch (req.method) { + case 'GET': + const users = await User.find({ nfcPoints: { $exists: true } }) + .sort({ nfcPoints: -1 }) + .limit(10) + .populate('team'); + + return res.status(200).send(users); + default: + return res.status(405).send('Method not supported brother'); + } +} From 56010510b83c853f3a797ddcc9eaa9d677c778db Mon Sep 17 00:00:00 2001 From: Carol He Date: Thu, 12 Oct 2023 00:20:09 -0500 Subject: [PATCH 04/11] extract leaderboard and judging schedule --- components/hacker/JudgingSchedule.tsx | 254 ++++++++++++++++++++++++++ components/hacker/Leaderboard.tsx | 134 ++++++++++++++ styles/hacker/Table.module.css | 48 +++-- 3 files changed, 417 insertions(+), 19 deletions(-) create mode 100644 components/hacker/JudgingSchedule.tsx create mode 100644 components/hacker/Leaderboard.tsx diff --git a/components/hacker/JudgingSchedule.tsx b/components/hacker/JudgingSchedule.tsx new file mode 100644 index 00000000..4e0bae76 --- /dev/null +++ b/components/hacker/JudgingSchedule.tsx @@ -0,0 +1,254 @@ +import React from 'react'; +import { JudgingSessionData } from '../../types/database'; +import styles from '../../styles/hacker/Table.module.css'; + +interface JudgingScheduleProps { + judgingSessionData: JudgingSessionData[] | undefined; +} + +const judgingSchedule = [ + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, + { + name: 'Test User', + time: 'December 17, 1995 11:40:00', + team: { + locationNum: 11, + }, + judge: { + name: 'Loren Quigley Sr.', + }, + }, +]; + +const renderJudgingTime = (time: string) => { + let startTime = new Date(time); + // add 10 minutes + let endTime = new Date(startTime.getTime() + 10 * 60000); + // return <>{startTime.getHours()}:{startTime.getMinutes()} - {endTime.getHours()}:{endTime.getMinutes()} + return ( + <> + {startTime.toLocaleTimeString('default', { + hour: '2-digit', + minute: '2-digit', + })}{' '} + -{' '} + {endTime.toLocaleTimeString('default', { + hour: '2-digit', + minute: '2-digit', + })} + + ); +}; + +const JudgingSchedule = ({ judgingSessionData }: JudgingScheduleProps) => { + return ( +
+ Judging Schedule + {judgingSessionData?.length !== 0 ? ( +
Schedule will show up here when hacking ends!
+ ) : ( +
+ + + + + + + + + + {judgingSchedule?.map(entry => ( + + + + + + ))} + +
TimeTableJudge
{renderJudgingTime(entry.time.toString())}{entry.team.locationNum}{entry.judge.name}
+
+ )} +
+ ); +}; + +export default JudgingSchedule; diff --git a/components/hacker/Leaderboard.tsx b/components/hacker/Leaderboard.tsx new file mode 100644 index 00000000..2e8e3ae6 --- /dev/null +++ b/components/hacker/Leaderboard.tsx @@ -0,0 +1,134 @@ +import styles from '../../styles/hacker/Table.module.css'; +import { UserData, TeamData } from '../../types/database'; +import { RequestType, useCustomSWR } from '../../utils/request-utils'; + +interface LeaderboardData extends Omit { + team: TeamData; +} + +// LEADERBOARD AND JUDGING SCHEDULE DUMMY DATA +const leaderboard = [ + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, + { + name: 'First Last', + team: 'FooTeam', + points: 1729, + }, +]; + +const Leaderboard = () => { + // Leaderboard data + const { data: leaderboardData, error: leaderboardError } = useCustomSWR({ + url: '/api/leaderboard', + method: RequestType.GET, + errorMessage: 'Failed to get list of hackers on the leaderboard.', + }); + + return ( +
+ Leaderboard + {leaderboardError ? ( +
Failed to load data.
+ ) : !leaderboardData ? ( +
Loading...
+ ) : ( +
+ + + + + + + + + + {leaderboardData?.map(entry => ( + + + + + + ))} + +
NameTeamPoints
{entry.name}{entry.team?.name}{entry.nfcPoints}
+
+ )} +
+ ); +}; + +export default Leaderboard; diff --git a/styles/hacker/Table.module.css b/styles/hacker/Table.module.css index 2dbb8054..306f0b2c 100644 --- a/styles/hacker/Table.module.css +++ b/styles/hacker/Table.module.css @@ -8,36 +8,46 @@ color: #FFFFFF; } -.Table { +.TableContainer { + margin-top: 20px; + overflow-y: auto; + max-height: 700px; font-size: 40px; } -.Table:after { - content: ""; - display: table; - clear: both; -} - -.ColumnHeader { - float: left; - width: 33%; -} - -.Column { - float: left; - width: 33.33%; +.TableContainer table { + table-layout: fixed; + width: 100%; } -.Entries { - overflow-y: auto; - height: 700px; +.TableContainer th { + position: sticky; + top: 0; + text-align: left; + background: #000000; } -.Entry { +.TableContainer td { color: #C9A76B; + padding-bottom: 15px; } .Placeholder { font-size: 90px; color: #FFFFFF80; +} + +/* add media query for mobile screen */ +@media (max-width: 768px) { + .Container { + font-size: 30px; + } + + .TableContainer { + font-size: 20px; + } + + .Placeholder { + font-size: 40px; + } } \ No newline at end of file From 6cbafa4f1301df4644119cdd87d6e3d7a2314400 Mon Sep 17 00:00:00 2001 From: Carol He Date: Thu, 12 Oct 2023 00:21:37 -0500 Subject: [PATCH 05/11] HackerDash update --- components/hacker/HackerDash.tsx | 362 +------------------------------ 1 file changed, 6 insertions(+), 356 deletions(-) diff --git a/components/hacker/HackerDash.tsx b/components/hacker/HackerDash.tsx index 5bd7a3fa..a88027ff 100644 --- a/components/hacker/HackerDash.tsx +++ b/components/hacker/HackerDash.tsx @@ -17,11 +17,12 @@ import { } from 'antd'; import useSWR from 'swr'; import TeamManager from './TeamManager'; +import Leaderboard from './Leaderboard'; +import JudgingSchedule from './JudgingSchedule'; import TeamSetup from './TeamSetup'; import { TeamProfile } from '../../types/client'; import { ApplicationStatus, UserData, JudgingSessionData } from '../../types/database'; import styles from '../../styles/Form.module.css'; -import TableStyles from '../../styles/hacker/Table.module.css'; import { signOut, useSession } from 'next-auth/react'; import TextArea from 'antd/lib/input/TextArea'; import { Content } from 'antd/lib/layout/layout'; @@ -190,283 +191,6 @@ export default function HackerDash({ userApplicationStatus, setUserApplicationSt getJudgingSessionData(); }, [setUserApplicationStatus, user?.applicationStatus]); - // LEADERBOARD AND JUDGING SCHEDULE DUMMY DATA - const leaderboard = [ - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - ]; - - const judgingSchedule = [ - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - name: 'Test User', - time: 'December 17, 1995 11:40:00', - loc: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - ]; - const renderJudgingTime = (time: string) => { let startTime = new Date(time); // add 10 minutes @@ -996,84 +720,10 @@ export default function HackerDash({ userApplicationStatus, setUserApplicationSt {/* */}
} - {/* Leaderboard */} -
- Leaderboard -
-
Name
-
Team
-
Points
-
-
-
-
- {leaderboard.map(entry => ( -
- {entry.name} -
- ))} -
-
- {leaderboard.map(entry => ( -
- {entry.team} -
- ))} -
-
- {leaderboard.map(entry => ( -
- {entry.points} -
- ))} -
-
-
-
- {/* Judging Schedule */} -
- Judging Schedule - {judgingSessionData?.length === 0 && ( -
- Schedule will show up here when hacking ends! -
- )} - {/* Update this to be conditional on when judgingSessionData?.length > 0 */} - {judgingSchedule.length > 0 && ( - <> -
-
Time
-
Table
-
Judge
-
-
-
-
- {judgingSchedule.map(entry => ( -
- {renderJudgingTime(entry.time)} -
- ))} -
-
- {judgingSchedule.map(entry => ( -
- {entry.loc.locationNum} -
- ))} -
-
- {judgingSchedule.map(entry => ( -
- {entry.judge.name} -
- ))} -
-
-
- - )} -
+ + + + {/* Pre-hacking code */} {/*
From d0a2d6920f922d27f8c93ee1c1f537ad5ce542cb Mon Sep 17 00:00:00 2001 From: Carol He Date: Thu, 12 Oct 2023 00:45:20 -0500 Subject: [PATCH 06/11] Fix table padding --- styles/hacker/Table.module.css | 1 + 1 file changed, 1 insertion(+) diff --git a/styles/hacker/Table.module.css b/styles/hacker/Table.module.css index 306f0b2c..f046a4da 100644 --- a/styles/hacker/Table.module.css +++ b/styles/hacker/Table.module.css @@ -25,6 +25,7 @@ top: 0; text-align: left; background: #000000; + padding-bottom: 15px; } .TableContainer td { From 522ca4f4b86bfda117b5087047b9e2f0f91490b0 Mon Sep 17 00:00:00 2001 From: Carol He Date: Thu, 12 Oct 2023 00:45:40 -0500 Subject: [PATCH 07/11] Get rid of leaderboard dummy data --- components/hacker/Leaderboard.tsx | 86 +------------------------------ 1 file changed, 1 insertion(+), 85 deletions(-) diff --git a/components/hacker/Leaderboard.tsx b/components/hacker/Leaderboard.tsx index 2e8e3ae6..e7452225 100644 --- a/components/hacker/Leaderboard.tsx +++ b/components/hacker/Leaderboard.tsx @@ -1,95 +1,11 @@ -import styles from '../../styles/hacker/Table.module.css'; import { UserData, TeamData } from '../../types/database'; import { RequestType, useCustomSWR } from '../../utils/request-utils'; +import styles from '../../styles/hacker/Table.module.css'; interface LeaderboardData extends Omit { team: TeamData; } -// LEADERBOARD AND JUDGING SCHEDULE DUMMY DATA -const leaderboard = [ - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, - { - name: 'First Last', - team: 'FooTeam', - points: 1729, - }, -]; - const Leaderboard = () => { // Leaderboard data const { data: leaderboardData, error: leaderboardError } = useCustomSWR({ From ba437a9a8818a43fa7adf423889650c1027c9436 Mon Sep 17 00:00:00 2001 From: Carol He Date: Thu, 12 Oct 2023 00:46:07 -0500 Subject: [PATCH 08/11] Update judging schedule dummy data --- components/hacker/JudgingSchedule.tsx | 22 +--------------------- 1 file changed, 1 insertion(+), 21 deletions(-) diff --git a/components/hacker/JudgingSchedule.tsx b/components/hacker/JudgingSchedule.tsx index 4e0bae76..4a38042b 100644 --- a/components/hacker/JudgingSchedule.tsx +++ b/components/hacker/JudgingSchedule.tsx @@ -1,4 +1,3 @@ -import React from 'react'; import { JudgingSessionData } from '../../types/database'; import styles from '../../styles/hacker/Table.module.css'; @@ -8,7 +7,6 @@ interface JudgingScheduleProps { const judgingSchedule = [ { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -18,7 +16,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -28,7 +25,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -38,7 +34,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -48,7 +43,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -58,7 +52,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -68,7 +61,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -78,7 +70,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -88,7 +79,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -98,7 +88,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -108,7 +97,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -118,7 +106,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -128,7 +115,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -138,7 +124,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -148,7 +133,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -158,7 +142,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -168,7 +151,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -178,7 +160,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -188,7 +169,6 @@ const judgingSchedule = [ }, }, { - name: 'Test User', time: 'December 17, 1995 11:40:00', team: { locationNum: 11, @@ -223,7 +203,7 @@ const JudgingSchedule = ({ judgingSessionData }: JudgingScheduleProps) => { return (
Judging Schedule - {judgingSessionData?.length !== 0 ? ( + {judgingSessionData?.length === 0 ? (
Schedule will show up here when hacking ends!
) : (
From 9dbd6cd7ea9a60f0301e408b0457620daaefb9b2 Mon Sep 17 00:00:00 2001 From: Carol He Date: Thu, 12 Oct 2023 00:46:43 -0500 Subject: [PATCH 09/11] Add Leaderboard and JudgingSchedule components to HackerDash --- components/hacker/HackerDash.tsx | 65 ++------------------------------ 1 file changed, 3 insertions(+), 62 deletions(-) diff --git a/components/hacker/HackerDash.tsx b/components/hacker/HackerDash.tsx index 462d598d..487db015 100644 --- a/components/hacker/HackerDash.tsx +++ b/components/hacker/HackerDash.tsx @@ -37,6 +37,7 @@ type HackerProps = { userApplicationStatus: number; setUserApplicationStatus: (newType: number) => void; }; + export default function HackerDash({ userApplicationStatus, setUserApplicationStatus }: HackerProps) { const [loading, setLoading] = useState(false); const { data: session, status } = useSession(); @@ -163,48 +164,6 @@ export default function HackerDash({ userApplicationStatus, setUserApplicationSt window.location.reload(); }; - const judgingSessionColumns: ColumnsType = [ - { - title: 'Time', - dataIndex: 'time', - key: 'name', - width: '25vw', - render: time => { - let startTime = new Date(time); - // add 10 minutes - let endTime = new Date(startTime.getTime() + 10 * 60000); - // return <>{startTime.getHours()}:{startTime.getMinutes()} - {endTime.getHours()}:{endTime.getMinutes()} - return ( - <> - {startTime.toLocaleTimeString('default', { - hour: '2-digit', - minute: '2-digit', - })}{' '} - -{' '} - {endTime.toLocaleTimeString('default', { - hour: '2-digit', - minute: '2-digit', - })} - - ); - }, - }, - { - title: 'Table', - dataIndex: 'team', - key: 'team', - width: '25vw', - render: loc => <>{loc.locationNum}, - }, - { - title: 'Judge', - dataIndex: 'judge', - key: 'judge', - width: '50vw', - render: judge => <>{judge.name}, - }, - ]; - const [judgingSessionData, setJudgingSessionData] = useState(); const getJudgingSessionData = () => { @@ -220,26 +179,6 @@ export default function HackerDash({ userApplicationStatus, setUserApplicationSt getJudgingSessionData(); }, [setUserApplicationStatus, user?.applicationStatus]); - const renderJudgingTime = (time: string) => { - let startTime = new Date(time); - // add 10 minutes - let endTime = new Date(startTime.getTime() + 10 * 60000); - // return <>{startTime.getHours()}:{startTime.getMinutes()} - {endTime.getHours()}:{endTime.getMinutes()} - return ( - <> - {startTime.toLocaleTimeString('default', { - hour: '2-digit', - minute: '2-digit', - })}{' '} - -{' '} - {endTime.toLocaleTimeString('default', { - hour: '2-digit', - minute: '2-digit', - })} - - ); - }; - return ( {/* TODO: add Your Team, Leaderboard, Judging Schedule */} + + {/* TODO: remove once ready. placeholder */}
Date: Thu, 12 Oct 2023 01:02:24 -0500 Subject: [PATCH 10/11] Update JudgingSchedule to use judgingSessionData --- components/hacker/JudgingSchedule.tsx | 181 +------------------------- 1 file changed, 6 insertions(+), 175 deletions(-) diff --git a/components/hacker/JudgingSchedule.tsx b/components/hacker/JudgingSchedule.tsx index 4a38042b..375725b1 100644 --- a/components/hacker/JudgingSchedule.tsx +++ b/components/hacker/JudgingSchedule.tsx @@ -5,180 +5,11 @@ interface JudgingScheduleProps { judgingSessionData: JudgingSessionData[] | undefined; } -const judgingSchedule = [ - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, - { - time: 'December 17, 1995 11:40:00', - team: { - locationNum: 11, - }, - judge: { - name: 'Loren Quigley Sr.', - }, - }, -]; - +/** + * Convert the given time into a 10 minute time range + * @param time Start time + * @returns Formatted 10 minute time range starting from the given time + */ const renderJudgingTime = (time: string) => { let startTime = new Date(time); // add 10 minutes @@ -216,7 +47,7 @@ const JudgingSchedule = ({ judgingSessionData }: JudgingScheduleProps) => { - {judgingSchedule?.map(entry => ( + {judgingSessionData?.map(entry => ( {renderJudgingTime(entry.time.toString())} {entry.team.locationNum} From 3eb2e2c34bc88646bb0a76de3f7ae0aa75208ff5 Mon Sep 17 00:00:00 2001 From: carolhe134 Date: Thu, 12 Oct 2023 06:10:45 +0000 Subject: [PATCH 11/11] Run Prettier --- styles/hacker/Table.module.css | 68 +++++++++++++++++----------------- 1 file changed, 34 insertions(+), 34 deletions(-) diff --git a/styles/hacker/Table.module.css b/styles/hacker/Table.module.css index f046a4da..68f145cf 100644 --- a/styles/hacker/Table.module.css +++ b/styles/hacker/Table.module.css @@ -1,54 +1,54 @@ .Container { - background-color: #000000BF; - border-radius: 50px; - padding: 45px 42px; - font-family: 'Inter'; - font-weight: bold; - font-size: 70px; - color: #FFFFFF; + background-color: #000000bf; + border-radius: 50px; + padding: 45px 42px; + font-family: 'Inter'; + font-weight: bold; + font-size: 70px; + color: #ffffff; } .TableContainer { - margin-top: 20px; - overflow-y: auto; - max-height: 700px; - font-size: 40px; + margin-top: 20px; + overflow-y: auto; + max-height: 700px; + font-size: 40px; } .TableContainer table { - table-layout: fixed; - width: 100%; + table-layout: fixed; + width: 100%; } .TableContainer th { - position: sticky; - top: 0; - text-align: left; - background: #000000; - padding-bottom: 15px; + position: sticky; + top: 0; + text-align: left; + background: #000000; + padding-bottom: 15px; } .TableContainer td { - color: #C9A76B; - padding-bottom: 15px; + color: #c9a76b; + padding-bottom: 15px; } .Placeholder { - font-size: 90px; - color: #FFFFFF80; + font-size: 90px; + color: #ffffff80; } /* add media query for mobile screen */ @media (max-width: 768px) { - .Container { - font-size: 30px; - } - - .TableContainer { - font-size: 20px; - } - - .Placeholder { - font-size: 40px; - } -} \ No newline at end of file + .Container { + font-size: 30px; + } + + .TableContainer { + font-size: 20px; + } + + .Placeholder { + font-size: 40px; + } +}