Sidepot Totals and Clockcount down working (#265)

Co-authored-by: Fiona Truong <151110138+fionaa-truong@users.noreply.github.com>
Co-authored-by: burtonjong <burtonjong05@gmail.com>
Co-authored-by: Burton Jong <108391733+burtonjong@users.noreply.github.com>
Co-authored-by: simar kandola <simarkandola51@gmail.com>
Co-authored-by: Anthony <88424536+anthonyych4n@users.noreply.github.com>
Co-authored-by: Fiona <fionat119@icloud.com>

Author: 5 people

amplify/data/resource.ts

@@ -131,6 +131,7 @@ const schema = a
         id: a.id().required(),
         time: a.datetime().required(),
         zoomLink: a.string().required(),
+        duration: a.integer(),
         teamId: a.id().required(),
         roomId: a.id().required(),
         team: a.belongsTo("Team", "teamId"),

amplify/function/BusinessLogic/ScheduleTeamsAndJudges/handler.ts

@@ -118,6 +118,7 @@ export const handler: Schema["ScheduleTeamsAndJudges"]["functionHandler"] =
                 time: currTime.toISOString(),
                 roomId: roomIds[column],
                 zoomLink: "",
+                duration: presentationDuration,
               },
             },
           }),

amplify/graphql/API.ts

@@ -122,6 +122,7 @@ export type TeamRoom = {
   time: string;
   updatedAt: string;
   zoomLink: string;
+  duration?: number | null;
 };
 
 export type Room = {
@@ -493,6 +494,7 @@ export type CreateTeamRoomInput = {
   teamId: string;
   time: string;
   zoomLink: string;
+  duration?: number | null;
 };
 
 export type ModelUserConditionInput = {
@@ -623,6 +625,7 @@ export type UpdateTeamRoomInput = {
   teamId?: string | null;
   time?: string | null;
   zoomLink?: string | null;
+  duration?: number | null;
 };
 
 export type UpdateUserInput = {

amplify/graphql/mutations.ts

@@ -342,6 +342,7 @@ export const createTeamRoom = /* GraphQL */ `mutation CreateTeamRoom(
     time
     updatedAt
     zoomLink
+    duration
     __typename
   }
 }

amplify/graphql/queries.ts

@@ -186,6 +186,7 @@ export const getTeamRoom = /* GraphQL */ `query GetTeamRoom($id: ID!) {
     time
     updatedAt
     zoomLink
+    duration
     __typename
   }
 }
@@ -427,6 +428,7 @@ export const listTeamRooms = /* GraphQL */ `query ListTeamRooms(
       time
       updatedAt
       zoomLink
+      duration
       __typename
     }
     nextToken

src/components/LandingPage/HeroSection.tsx

@@ -19,8 +19,8 @@ export default async function HeroSection() {
     return <div>Hackathon hasn't been created yet</div>;
   }
 
-  const eventStartDate = new Date(hackathonData[0].startDate);
-  const eventEndDate = new Date(hackathonData[0].endDate);
+  const eventStartDate = new Date(2025, 10, 8, 9, 0, 0); // Month is 0-indexed → 10 = November
+  const eventEndDate = new Date(2025, 10, 9, 17, 0, 0); // Example: Sunday 5 PM
 
   return (
     <div className="relative flex flex-col items-center justify-center md:px-8 md:py-16 lg:px-32">

src/components/admin/Judging/JudgingSchedule.tsx

@@ -168,7 +168,10 @@ export default function JudgingSchedule() {
               .join(", ") || "No Team Name",
           room_id: teamRoom.roomId,
           start: new Date(teamRoom.time),
-          end: new Date(new Date(teamRoom.time).getTime() + 15 * 60 * 1000),
+          end: new Date(
+            new Date(teamRoom.time).getTime() +
+              (teamRoom.duration ?? 10) * 60 * 1000,
+          ),
           zoomLink: teamRoom.zoomLink,
         }))
       : [];

src/components/admin/Judging/JudgingTimeline.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { Scheduler } from "@aldabil/react-scheduler";
+import RedirectIcon from "../../RedirectIcon";
 
 type JudgeRoom = {
   roomName: string;
@@ -48,11 +49,14 @@ export default function JudgingTimeline({
           deletable={false}
           viewerExtraComponent={(fields, event) => {
             return (
-              <p>
+              <a
+                href={event.zoomLink}
+                className="inline-flex flex-row items-center gap-1 text-dark-green hover:underline"
+              >
                 {/* Replace with actual zoom link not the room id */}
-                <span className="font-bold">Zoom Link:</span>{" "}
-                <a href={event.zoomLink}>{event.title}</a>
-              </p>
+                <span className="font-bold">Zoom Link</span>
+                <RedirectIcon />
+              </a>
             );
           }}
         />

src/components/admin/Judging/RoomAssigner.tsx

@@ -21,6 +21,8 @@ export default function RoomAssigner({
   const [loading, setLoading] = useState<boolean>(false);
   const [error, setError] = useState<string | null>(null);
 
+  const ZOOM_LINK = process.env.NEXT_PUBLIC_ZOOM_LINK;
+
   const handleInputChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     setInputValue(e.target.value);
   };
@@ -48,13 +50,21 @@ export default function RoomAssigner({
         presentationDuration: Number(duration),
       });
 
-      const meetingData = await createZoomMeeting(
-        formattedDate,
-        Number(duration),
-      );
+      // dynamically create zoom links
+      // const meetingData = await createZoomMeeting(
+      //   formattedDate,
+      //   Number(duration),
+      // );
+
+      // setMeetingLink(meetingData.join_url);
+      // updateTeamRoomsWithZoomLink();
+
+      // temporary hardcoded zoom link
+      if (!ZOOM_LINK) {
+        throw new Error("Zoom link missing in .env.");
+      }
 
-      setMeetingLink(meetingData.join_url);
-      updateTeamRoomsWithZoomLink(meetingData.join_url);
+      updateTeamRoomsWithZoomLink(ZOOM_LINK);
     } catch (err) {
       setError("Failed to create Zoom meeting.");
     } finally {
@@ -72,7 +82,7 @@ export default function RoomAssigner({
           >
             <div className="flex w-full flex-col gap-4 md:flex-row">
               <div className="flex w-full flex-col gap-2 md:w-1/4">
-                <label htmlFor="numberOfRooms">Enter Number of Room:</label>
+                <label htmlFor="numberOfRooms">Enter Number of Rooms:</label>
                 <input
                   className="flex items-center justify-between rounded-lg border-2 border-awesome-purple bg-white p-4 font-bold text-black duration-100 hover:border-awesomer-purple active:border-awesome-purple active:text-black"
                   type="number"
@@ -82,7 +92,7 @@ export default function RoomAssigner({
                 />
               </div>
               <div className="flex w-full flex-col gap-2 md:w-1/4">
-                <label htmlFor="duration">Enter Judging Duration:</label>
+                <label htmlFor="duration">Enter Duration (minutes):</label>
                 <input
                   id="duration"
                   className="flex items-center justify-between rounded-lg border-2 border-awesome-purple bg-white p-4 font-bold text-black duration-100 hover:border-awesomer-purple active:border-awesome-purple active:text-black"

src/components/admin/RankingTable.tsx

@@ -29,31 +29,47 @@ function TableRow({
   components = {},
   index = 0,
   total = 0,
+  scoringMetrics,
 }: {
   teamName?: string;
   components?: ITeamScores[string]["components"];
   index?: number;
   total?: number;
+  scoringMetrics: Schema["Hackathon"]["type"]["scoringComponents"];
 }) {
   const bgColor = index % 2 === 1 ? "bg-white" : "bg-dashboard-grey";
   return (
     <tr className={twMerge("border-b", bgColor)}>
       <td className="truncate whitespace-nowrap px-6 py-4 font-medium text-dark-grey">
         {teamName}
       </td>
-      {Object.keys(components).map((componentId) => {
-        return (
-          <td
-            key={componentId}
-            className="border-l-2 border-l-white px-6 py-4 text-black"
-          >
-            {components[componentId]}
-          </td>
-        );
-      })}
+      {scoringMetrics
+        .filter((metric) => !metric.isSidepot)
+        .map((metric) => {
+          return (
+            <td
+              key={metric.id}
+              className="border-l-2 border-l-white px-6 py-4 text-black"
+            >
+              {components[metric.id] || 0}
+            </td>
+          );
+        })}
       <td className="border-l-2 border-l-white px-6 py-4 text-black">
         {total}
       </td>
+      {scoringMetrics
+        .filter((metric) => metric.isSidepot)
+        .map((metric) => {
+          return (
+            <td
+              key={metric.id}
+              className="border-l-2 border-l-white px-6 py-4 text-black"
+            >
+              {components[metric.id] || 0}
+            </td>
+          );
+        })}
     </tr>
   );
 }
@@ -101,7 +117,11 @@ export default function RankingTable({
             Number(score.score[scoreComponentId])
           : score.score[scoreComponentId];
 
-        return total + Number(score.score[scoreComponentId]);
+        // Only add to total if it's not a sidepot
+        if (!metric.isSidepot) {
+          return total + Number(score.score[scoreComponentId]);
+        }
+        return total;
       }, 0);
 
       acc[score.teamId].total += teamScore;
@@ -145,24 +165,25 @@ export default function RankingTable({
           <th className=" px-6 py-3">
             <div className="flex items-center capitalize">Team</div>
           </th>
-          {scoringMetrics.map((metric) => {
-            return (
-              <th key={metric.id} className=" px-6 py-3">
-                <div className="flex items-center capitalize">
-                  {metric.friendlyName}
-                  {metric.isSidepot ? " (Sidepot)" : null}
-                  <button
-                    onClick={() => {
-                      setSortKey(metric.id);
-                      setSortAscending(!sortAscending);
-                    }}
-                  >
-                    <FilterIcon />
-                  </button>
-                </div>
-              </th>
-            );
-          })}
+          {scoringMetrics
+            .filter((metric) => !metric.isSidepot)
+            .map((metric) => {
+              return (
+                <th key={metric.id} className=" px-6 py-3">
+                  <div className="flex items-center capitalize">
+                    {metric.friendlyName}
+                    <button
+                      onClick={() => {
+                        setSortKey(metric.id);
+                        setSortAscending(!sortAscending);
+                      }}
+                    >
+                      <FilterIcon />
+                    </button>
+                  </div>
+                </th>
+              );
+            })}
           <th className=" px-6 py-3">
             <div className="flex items-center capitalize">
               Total
@@ -176,6 +197,25 @@ export default function RankingTable({
               </button>
             </div>
           </th>
+          {scoringMetrics
+            .filter((metric) => metric.isSidepot)
+            .map((metric) => {
+              return (
+                <th key={metric.id} className=" px-6 py-3">
+                  <div className="flex items-center capitalize">
+                    {metric.friendlyName} (Sidepot)
+                    <button
+                      onClick={() => {
+                        setSortKey(metric.id);
+                        setSortAscending(!sortAscending);
+                      }}
+                    >
+                      <FilterIcon />
+                    </button>
+                  </div>
+                </th>
+              );
+            })}
         </tr>
       </thead>
       <tbody>
@@ -185,6 +225,7 @@ export default function RankingTable({
               teamName={computedScores[teamId].name}
               components={computedScores[teamId].components}
               total={computedScores[teamId].total}
+              scoringMetrics={scoringMetrics}
               key={index}
               index={index}
             />