Merge pull request #780 from FIRSTIsrael/disable-non-ready-switching

Author: johnmeshulam

apps/backend/src/lib/schedule/division-users.ts

@@ -21,7 +21,9 @@ export const getDivisionUsers = (
   rooms: Array<WithId<JudgingRoom>>
 ): User[] => {
   const users = [];
-  const roles = RoleTypes.filter(role => !event.eventUsers.includes(role as EventUserAllowedRoles));
+  const roles = RoleTypes.filter(
+    role => !event.eventUsers?.includes(role as EventUserAllowedRoles)
+  );
 
   roles.forEach(role => {
     const user: User = {

apps/frontend/components/general/division-dropdown.tsx

@@ -12,12 +12,13 @@ interface DropdownOptionProps {
   id: string;
   name: string;
   color: CSSProperties['color'];
+  disabled: boolean;
 }
 
-const DropdownOption: React.FC<DropdownOptionProps> = ({ id, name, color }) => {
+const DropdownOption: React.FC<DropdownOptionProps> = ({ id, name, color, disabled }) => {
   const { getRootProps, highlighted } = useOption({
     value: id,
-    disabled: false,
+    disabled: disabled,
     label: name
   });
 
@@ -29,13 +30,14 @@ const DropdownOption: React.FC<DropdownOptionProps> = ({ id, name, color }) => {
       display="flex"
       flexDirection="row"
       gap={1}
-      justifyContent="center"
+      justifyContent="flex-start"
       alignItems="center"
       borderRadius={1}
       paddingX={2}
-      sx={{ cursor: 'pointer', '&:hover': { bgcolor: '#e5eaf2' } }}
+      minWidth={110}
+      sx={disabled ? {} : { cursor: 'pointer', '&:hover': { bgcolor: '#e5eaf2' } }}
     >
-      <Box height={10} width={10} borderRadius="50%" bgcolor={color} />
+      <Box height={10} width={10} borderRadius="50%" bgcolor={disabled ? '#666' : color} />
       <Typography>{name}</Typography>
     </Box>
   );
@@ -107,6 +109,7 @@ const DivisionDropdown: React.FC<DivisionDropdownProps> = ({ event, selected, on
               id={division._id.toString()}
               name={division.name}
               color={division.color}
+              disabled={!division.hasState}
             />
           ))}
         </SelectProvider>

apps/frontend/lib/utils/fetch.ts

@@ -1,4 +1,6 @@
+import { ObjectId, WithId } from 'mongodb';
 import { GetServerSidePropsContext } from 'next';
+import { Division } from '@lems/types';
 
 export const getApiBase = (forceClient = false) => {
   const isSsr = !forceClient && typeof window === 'undefined';
@@ -33,13 +35,18 @@ export const apiFetch = (
 
 export const getUserAndDivision = async (ctx: GetServerSidePropsContext) => {
   const user = await apiFetch(`/api/me`, undefined, ctx).then(res => res?.json());
+  const divisions: Array<WithId<Division>> = await apiFetch(`/public/divisions`).then(res =>
+    res?.json()
+  );
   let divisionId = user.divisionId;
   if (!divisionId && user.eventId && user.assignedDivisions.length > 0) {
     const idFromQuery = (ctx.query.divisionId as string) || undefined;
     if (user.assignedDivisions.includes(idFromQuery)) {
       divisionId = idFromQuery;
     } else {
-      divisionId = user.assignedDivisions[0];
+      divisionId = user.assignedDivisions.filter(
+        (id: ObjectId) => divisions.find(d => d._id === id)?.hasState
+      )[0];
     }
   }
   return { user, divisionId };