Merge pull request #176 from Decatur-Robotics/check-in

Check In

Author: renatodellosso

components/Avatar.tsx

@@ -11,6 +11,7 @@ export default function Avatar(props: {
   borderThickness?: number | undefined;
   onClick?: () => void | undefined;
   className?: string | undefined;
+  online?: boolean;
 }) {
   const { session, status } = useCurrentSession();
   const user = props.user ?? session?.user;
@@ -19,7 +20,7 @@ export default function Avatar(props: {
   const admin = user?.admin;
 
   return (
-    <div className={"avatar " + (props.scale ?? "") + " " + props.className}>
+    <div className={`avatar ${props.online && "online"} ${props.scale} ${props.className}`}>
       { (props.showLevel ?? true) &&
         <div className="absolute z-10 bg-base-100 rounded-tl-xl rounded-br-xl h-6 w-14 text-center text-sm font-semibold">
           LVL: {user?.level}

lib/API.ts

@@ -560,7 +560,6 @@ export namespace API {
 
       form.data = data.formData;
       form.submitted = true;
-      form.checkedIn = false;
       form.submitter = data.userId;
 
       await db.updateObjectById(
@@ -649,19 +648,11 @@ export namespace API {
       );
     },
 
-    updateCheckIn: async (req, res, { db, data }) => {
+    checkInForReport: async (req, res, { db, data }) => {
       await db.updateObjectById<Report>(
         Collections.Reports,
         new ObjectId(data.reportId),
-        { checkedIn: true }
-      );
-    },
-
-    updateCheckOut: async (req, res, { db, data }) => {
-      await db.updateObjectById<Report>(
-        Collections.Reports,
-        new ObjectId(data.reportId),
-        { checkedIn: false }
+        { checkInTimestamp: new Date().toISOString() }
       );
     },
 

lib/CompetitionHandeling.ts

@@ -98,8 +98,7 @@ export async function generateReportsForMatch(match: string | Match, scouters?:
         teamNumber,
         color,
         String(match._id),
-        0,
-        false,
+        0
       );
 
       reports.push(

lib/Types.ts

@@ -6,6 +6,7 @@ import {
 } from "next-auth";
 import { TheBlueAlliance } from "./TheBlueAlliance";
 import { Statbotics } from "./Statbotics";
+import { DatasetJsonLdProps } from "next-seo";
 import Subjective from '../pages/[teamSlug]/[seasonSlug]/[competitonSlug]/[reportId]/subjective';
 
 /**
@@ -339,7 +340,7 @@ export class Report {
   submitted: boolean = false;
   data: FormData;
 
-  checkedIn: boolean = false;
+  checkInTimestamp: string | undefined;
 
   constructor(
     user: string | undefined,
@@ -348,15 +349,15 @@ export class Report {
     color: AllianceColor,
     match: string,
     timestamp: number = 0,
-    checkedIn: boolean
+    checkInTimestamp: string | undefined = undefined
   ) {
     this.timestamp = timestamp;
     this.user = user;
     this.data = data;
     this.robotNumber = robotNumber;
     this.match = match;
     this.color = color;
-    this.checkedIn = checkedIn;
+    this.checkInTimestamp = checkInTimestamp;
   }
 }
 

lib/client/ClientAPI.ts

@@ -309,8 +309,8 @@ export default class ClientAPI {
     return await this.request("/matchReports", { matchId: matchId });
   }
 
-  async updateCheckIn(reportId: string | undefined) {
-    return await this.request("/updateCheckIn", { reportId });
+  async checkInForReport(reportId: string | undefined) {
+    return await this.request("/checkInForReport", { reportId });
   }
 
   async updateCheckOut(reportId: string | undefined) {

pages/[teamSlug]/[seasonSlug]/[competitonSlug]/[reportId]/index.tsx

@@ -4,6 +4,9 @@ import Form from "@/components/forms/Form";
 import { GetServerSideProps } from "next";
 import UrlResolver, { ResolvedUrlData } from "@/lib/UrlResolver";
 import { useEffect } from "react";
+import ClientAPI from "@/lib/client/ClientAPI";
+
+const api = new ClientAPI("gearboxiscool");
 
 export default function Homepage(props: ResolvedUrlData) {
   const team = props?.team;
@@ -14,6 +17,11 @@ export default function Homepage(props: ResolvedUrlData) {
   const { session, status } = useCurrentSession();
   const hide = status === "authenticated";
 
+  useEffect(() => {
+    if (report)
+      setInterval(() => api.checkInForReport(report._id), 5000);
+  }, []);
+
   return (
     <Container requireAuthentication={false} hideMenu={!hide}>
       {report ? (

pages/[teamSlug]/[seasonSlug]/[competitonSlug]/index.tsx

@@ -136,6 +136,7 @@ export default function Home(props: ResolvedUrlData) {
   const loadMatches = async (silent: boolean = false) => {
     if (!silent)
       setLoadingMatches(true);
+    
     window.location.hash = "";
     const matches: Match[] = await api.allCompetitionMatches(comp?._id);
     matches.sort((a, b) => {
@@ -156,13 +157,15 @@ export default function Home(props: ResolvedUrlData) {
     );
 
     setMatches(matches);
+    
     if (!silent)
       setLoadingMatches(false);
   };
 
-  const loadReports = async () => {
+  const loadReports = async (silent: boolean = false) => {
     const scoutingStats = (reps: Report[]) => {
-      setLoadingScoutStats(true);
+      if (!silent)
+        setLoadingScoutStats(true);
       let submittedCount = 0;
       reps.forEach((report) => {
         if (report.submitted) {
@@ -171,10 +174,12 @@ export default function Home(props: ResolvedUrlData) {
       });
 
       setSubmittedReports(submittedCount);
-      setLoadingScoutStats(false);
+      if (!silent)
+        setLoadingScoutStats(false);
     };
 
-    setLoadingReports(true);
+    if (!silent)
+      setLoadingReports(true);
     const newReports: Report[] = await api.competitionReports(
       comp?._id,
       false
@@ -188,10 +193,15 @@ export default function Home(props: ResolvedUrlData) {
       newReportId[report._id] = report;
     });
     setReportsById(newReportId);
-    setLoadingReports(false);
+    if (!silent)
+      setLoadingReports(false);
     scoutingStats(newReports);
   };
 
+  useEffect(() => {
+    setInterval(() => loadReports(true), 5000);
+  }, []);
+
   useEffect(() => {
     const loadUsers = async () => {
       setLoadingUsers(true);
@@ -887,6 +897,11 @@ export default function Home(props: ResolvedUrlData) {
                                       : "bg-blue-500"
                                     : "bg-slate-500";
                                   color = ours ? !report.submitted ? "bg-purple-500" : "bg-purple-300" : color;
+
+                                  if (!report) return <></>;
+
+                                  const timeSinceCheckIn = report.checkInTimestamp && (new Date().getTime() - new Date(report.checkInTimestamp as any).getTime()) / 1000;
+                              
                                   return (
                                     <Link
                                       href={`/${team?.slug}/${season?.slug}/${comp?.slug}/${reportId}`}
@@ -895,7 +910,7 @@ export default function Home(props: ResolvedUrlData) {
                                         mine && !submitted
                                           ? "border-4"
                                           : "border-2"
-                                      }  rounded-lg w-12 h-12 flex items-center justify-center text-white  border-white`}
+                                      } ${timeSinceCheckIn && timeSinceCheckIn < 10 && "avatar online"} rounded-lg w-12 h-12 flex items-center justify-center text-white  border-white`}
                                     >
                                       <h1>{report.robotNumber}</h1>
                                     </Link>