Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Checked in #219

Closed
wants to merge 16 commits into from
12 changes: 12 additions & 0 deletions app/(pre-dashboard)/(landing)/sections/Hero/Navbar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -160,7 +160,19 @@ function Navbar() {
>
{section}
</button>

))}
<button
style={{
color: '#536F91',
textTransform: 'lowercase',
}}
className="glow-center ms-4 text-lg font-medium uppercase transition-shadow hover:drop-shadow-blueGlow sm:mr-3 sm:text-xl md:mr-4 md:text-2xl lg:mr-5 lg:text-3xl"
onClick={() => router.push('/leaderboard')}
>
Leaderboard
</button>

<Link href="https://linktr.ee/thehackru">
<button
style={{
Expand Down
6 changes: 4 additions & 2 deletions app/(pre-dashboard)/(landing)/sections/Sponsors.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,17 @@ export default async function Sponsors() {
'/sponsors/RHNIC_RED_WHITE_RBG.png',
'/sponsors/CAIT2.png',
'/sponsors/iCIMSWhite.png',
'/sponsors/redbull.png'
'/sponsors/redbull.png',
'/sponsors/GoogleCloud.png'
];

const sponsorsLinks = [
'https://www.njtransit.com/innovation',
'https://www.canva.com/design/DAGSRyhN4jE/q65xcClKrYfxJka-VgXBwA/watch?utm_content=DAGSRyhN4jE&utm_campaign=share_your_design&utm_medium=link&utm_source=shareyourdesignpanel',
'https://cait.rutgers.edu/about/',
'https://www.icims.com',
'https://www.redbull.com/us-en'
'https://www.redbull.com/us-en',
'https://cloud.google.com'
];

return (
Expand Down
89 changes: 37 additions & 52 deletions app/(pre-dashboard)/leaderboard/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,14 @@ import React, { useEffect, useState } from 'react';
import { getLeaderboard } from '@/app/lib/data';
import GenericSection from '../(landing)/sections/GenericSection';
import Image from 'next/image';
import { fuzzy } from '@/app/ui/fonts';

interface LeaderboardEntry {
place: string;
id: string;
points: number;
house: string;
logo: string;
}


function quickSort(
arr: LeaderboardEntry[],
low = 0,
Expand Down Expand Up @@ -40,45 +40,30 @@ function partition(arr: LeaderboardEntry[], low: number, high: number): number {
}

const Leaderboard = () => {
const [leaderboard, setLeaderboard] = useState<any[]>([
{ house: 'Loading...' },
{ house: 'Loading...' },
{ house: 'Loading...' },
{ house: 'Loading...' },
const [leaderboard, setLeaderboard] = useState<LeaderboardEntry[]>([
{ id: 'Loading...', points: 0 },
{ id: 'Loading...', points: 0 },
{ id: 'Loading...', points: 0 },
{ id: 'Loading...', points: 0 },
]);

const logoImage = [
'/landing/bitsprout.png',
'/landing/python.png',
'/landing/pseudoclaw.png',
'/landing/roar.js.png',
];

const fetchData = async () => {
try {
const data = await getLeaderboard();
const updatedData = quickSort(data, 0, data.length - 1);

for (let i = 0; i < updatedData.length; i++) {
if (updatedData[i].house == 'Bitsprout') {
updatedData[i].logo = '/landing/bitsprout.png';
}
if (updatedData[i].house == 'Python') {
updatedData[i].logo = logoImage[1];
}
if (updatedData[i].house == 'Pseudoclaw') {
updatedData[i].logo = logoImage[2];
}
if (updatedData[i].house == 'Roar.js') {
updatedData[i].logo = logoImage[3];
}
}
setLeaderboard(updatedData);
const mappedData = data.map((entry: any) => ({
id: entry._id,
points: entry.total_points,
}));

const sortedData = quickSort(mappedData, 0, mappedData.length - 1);

setLeaderboard(sortedData);
} catch (err) {
// TODO I wanna show this on screen
console.error('Unable to fetch leaderboard data', err);
}
};

useEffect(() => {
fetchData();

Expand All @@ -90,28 +75,30 @@ const Leaderboard = () => {
}, []);

return (
<main className="flex h-[100vh] w-[100vw] flex-col items-center justify-center overflow-hidden md:flex">
<div className="z-10 flex justify-center text-orange-300">
<table className="w-[90vw] border-separate rounded-3xl bg-black bg-opacity-[50%] font-mono [border-spacing:1.00rem]">
<thead className="rounded-3xl ring-1 ring-orange-300 sm:ring-4">
<tr className="text-xs sm:text-lg md:text-xl lg:text-2xl ">
<main className={`flex h-[100vh] w-[100vw] flex-col items-center justify-center overflow-hidden md:flex ${fuzzy.className}`}>
<div className="z-10 flex justify-center text-blue-100">
<div className="h-[60vh] w-[90vw] overflow-y-auto">
<table className="w-[90vw] border-separate rounded-3xl bg-gradient-to-b from-offblack-100 to-[#453148] [border-spacing:1.00rem]">
<thead className="rounded-3xl ring-1 ring-pink-100 sm:ring-4">
<tr className="text-lg sm:text-2xl md:text-3xl lg:text-4xl ">
<th className="w-[20%] py-4 font-extrabold">Place</th>
<th className="w-[20%] font-extrabold">Points</th>
<th className="w-[60%] text-center font-extrabold">House</th>
<th className="w-[20%] font-extrabold">Player</th>
<th className="w-[20%] text-center font-extrabold">Points</th>
</tr>
</thead>
<tbody className="rounded-3xl ring-1 ring-orange-300 sm:ring-4 ">
<tbody className="rounded-3xl ring-1 ring-pink-100 sm:ring-4">
{leaderboard.map((Leaderboard, index) => {
console.log(Leaderboard);
if (Leaderboard.house === 'Loading...') {
if (Leaderboard.id === 'Loading...') {
return (

<tr
key={index}
className=" lx:text-5xl text-xs sm:text-lg md:text-2xl lg:text-4xl"
>
<td className="text-center font-extrabold">
<div className="flex min-h-[90px] items-center">
<div>{Leaderboard.house}</div>
<div>{Leaderboard.id}</div>
</div>
</td>
</tr>
Expand All @@ -123,29 +110,27 @@ const Leaderboard = () => {
className="lx:text-5xl text-xs sm:text-lg md:text-2xl lg:text-4xl"
>
<td className="text-center font-extrabold">{index + 1}</td>
<td className="text-center font-extrabold">
{Leaderboard.points}
</td>
<td className="text-center font-extrabold">
<div className="flex flex-row justify-center">
<div className="flex w-[75%] flex-row items-center justify-between">
{Leaderboard.house}
{Leaderboard.id}
<div className="relative h-[100px] w-[100px]">
<Image
src={Leaderboard.logo}
alt="logo"
layout="fill"
objectFit="contain"
/>

</div>
</div>
</div>
</td>

<td className="text-center font-extrabold">
{Leaderboard.points}
</td>

</tr>
);
})}
</tbody>
</table>
</div>
</div>
</main>
);
Expand Down
13 changes: 8 additions & 5 deletions app/dashboard/components/profileHeader.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,10 @@ export default function ProfileHeader(props: {
onWaiverSubmit: any;
handleChangingFile: any;
waiverState: any;
points: string;
}) {

const { userData, onWaiverSubmit, handleChangingFile, waiverState } = props;
const { userData, onWaiverSubmit, handleChangingFile, waiverState, points } = props;
const [uploadingNewConfirmationStatus, setUploadingNewConfirmationStatus] = useState(false);
const [errorMessage, setErrorMessage] = useState('');
const [loading, setLoading] = useState(false);
Expand Down Expand Up @@ -48,7 +49,9 @@ export default function ProfileHeader(props: {
<div className="grid gap-0.5 text-xs overflow-ellipsis w-full">
<div className="font-medium text-xl ">{userData?.first_name} {userData?.last_name}</div>
<div className="font-medium text-lg ">{userData && Object.keys(userData.role).find(key => userData.role[key])}</div>
<div className=" font-medium text-xl">{points}</div>
<div className=" dark:text-gray-400">{userData?.email}</div>

<Button
className="w-24 h-8 my-2"
onClick={async () => {
Expand All @@ -62,7 +65,7 @@ export default function ProfileHeader(props: {
</div>

<Card className="w-full max-w-2xl">
<form
<form
onSubmit={async (e) => {
setLoading(true);
await onWaiverSubmit(e);
Expand Down Expand Up @@ -114,17 +117,17 @@ export default function ProfileHeader(props: {
</p>
</div>
<div className="flex flex-row items-center justify-left">
<input type="checkbox" className="rounded text-pink-500 mr-3" onChange={(e) => userData.opt_in = e.target.checked} />
<input type="checkbox" className="rounded text-pink-500 mr-3" onChange={(e) => userData.opt_in = e.target.checked} />
<p>I authorize MLH to send me occasional emails about relevant events, career opportunities, and community announcements. (optional)</p>
</div>
<div className="flex flex-row items-center justify-center">
<CardTitle>Unregistered</CardTitle>
<Button type="submit" className="ml-auto" onClick={() => console.log("register button clicked")}>
<Button type="submit" className="ml-auto" onClick={() => console.log("register button clicked")}>
{loading ? 'Loading...' : 'Register'} </Button>
</div>
</>
}
{(userData.registration_status == "checked-in") &&
{(userData.registration_status == "checked_in") &&
<>
<div className="flex flex-row items-center">
<CardTitle>You are now checked in!</CardTitle>
Expand Down
Loading
Loading