Changed Sign-up label for events

Author: OdaRunde

frontend/src/components/pages/events/EventDetail/SignUp/SignUpButton.tsx

@@ -1,6 +1,9 @@
 import { LoadingButton } from "@mui/lab";
 import { Button, Dialog, DialogActions, DialogContent, Typography } from "@mui/material";
-import { useState } from "react";
+import { useContext, useState } from "react";
+
+import dayjs from "@/lib/date";
+import { UserContext } from "@/pages/events/[id]";
 
 type Event = {
   signupOpenDate: string;
@@ -9,6 +12,10 @@ type Event = {
   isAttendable: boolean;
 };
 
+type User = {
+  gradeYear?: number | null;
+};
+
 type Props = {
   isSignedUp?: boolean | null;
   disabled?: boolean;
@@ -17,9 +24,22 @@ type Props = {
   event: Event;
 };
 
+function isWaitList(event: Event, user: User) {
+  const signUpOpenDate = event.signupOpenDate ? dayjs(event.signupOpenDate) : undefined;
+  const isSignUpOpen = signUpOpenDate && dayjs().isSameOrAfter(signUpOpenDate);
+
+  let canAttend = event.isAttendable && isSignUpOpen;
+  if (user.gradeYear && event.allowedGradeYears) {
+    canAttend = canAttend && event.allowedGradeYears.includes(user.gradeYear);
+  }
+
+  return event.isFull && canAttend;
+}
+
 export const SignUpButton: React.FC<Props> = ({ isSignedUp, onSignUp, onSignOff, disabled, event }) => {
   const [confirmSignOff, setConfirmSignOff] = useState(false);
   const [loading, setLoading] = useState(false);
+  const user = useContext(UserContext);
 
   function handleSignUp() {
     setLoading(true);
@@ -61,7 +81,7 @@ export const SignUpButton: React.FC<Props> = ({ isSignedUp, onSignUp, onSignOff,
       )}
       {!isSignedUp && (
         <LoadingButton fullWidth loading={loading} variant="contained" onClick={handleSignUp} disabled={disabled}>
-          Meld på
+          {user != null && isWaitList(event, user) ? "Meld på venteliste" : "Meld på"}
         </LoadingButton>
       )}
     </>