Merge branch 'develop' of https://github.com/Northeastern-Electric-Racing/FinishLine into #2142-misc-tab-page-blocks

Author: walker-sean

src/backend/src/services/design-reviews.services.ts

@@ -162,7 +162,11 @@ export default class DesignReviewsService {
     for (const memberUserSetting of memberUserSettings) {
       if (memberUserSetting.slackId) {
         try {
-          await sendSlackDesignReviewNotification(memberUserSetting.slackId, designReview.designReviewId);
+          await sendSlackDesignReviewNotification(
+            memberUserSetting.slackId,
+            designReview.designReviewId,
+            designReview.wbsElement.name
+          );
         } catch (err: unknown) {
           if (err instanceof Error) {
             throw new HttpException(500, `Failed to send slack notification: ${err.message}`);
@@ -321,19 +325,22 @@ export default class DesignReviewsService {
     if (!isUserOnDesignReview(submitter, designReviewTransformer(designReview)))
       throw new HttpException(400, 'Current user is not in the list of this design reviews members');
 
-    // Update user schedule settings
-    const validAvailability = validateMeetingTimes(availability);
+    availability.forEach((time) => {
+      if (time < 0 || time > 83) {
+        throw new HttpException(400, 'Availability times have to be in range 0-83');
+      }
+    });
 
     await prisma.schedule_Settings.upsert({
       where: { userId: submitter.userId },
       update: {
-        availability: validAvailability
+        availability
       },
       create: {
         userId: submitter.userId,
         personalGmail: '',
         personalZoomLink: '',
-        availability: validAvailability
+        availability
       }
     });
 
@@ -353,7 +360,7 @@ export default class DesignReviewsService {
 
       // If all requested attendees have confirmed their schedule, mark design review as confirmed
       if (
-        designReview.confirmedMembers.length ===
+        updatedDesignReview.confirmedMembers.length ===
         designReview.requiredMembers.length + designReview.optionalMembers.length
       ) {
         await prisma.design_Review.update({

src/backend/src/utils/slack.utils.ts

@@ -91,11 +91,15 @@ export const sendReimbursementRequestDeniedNotification = async (slackId: string
   }
 };
 
-export const sendSlackDesignReviewNotification = async (slackId: string, designReviewId: string) => {
+export const sendSlackDesignReviewNotification = async (
+  slackId: string,
+  designReviewId: string,
+  designReviewName: string
+) => {
   if (process.env.NODE_ENV !== 'production') return; // don't send msgs unless in prod
-  const msg = `You have been invited to a Design Review!`;
-  const fullLink = `https://finishlinebyner.com/design-reviews/${designReviewId}`;
-  const linkButtonText = 'RSVP for the Design Review';
+  const msg = `You have been invited to the ${designReviewName} Design Review!`;
+  const fullLink = `https://finishlinebyner.com/settings/preferences?drId=${designReviewId}`;
+  const linkButtonText = 'Confirm Availability';
 
   try {
     await sendMessage(slackId, msg, fullLink, linkButtonText);

src/backend/tests/design-reviews.test.ts

@@ -535,14 +535,7 @@ describe('Design Reviews', () => {
       vi.spyOn(prisma.design_Review, 'findUnique').mockResolvedValue(prismaDesignReview5);
       await expect(() =>
         DesignReviewsService.markUserConfirmed(prismaDesignReview5.designReviewId, [0, 85], batman)
-      ).rejects.toThrow(new HttpException(400, 'Meeting times have to be in range 0-83'));
-    });
-
-    test('Availabilities were invalid - non-consecutive', async () => {
-      vi.spyOn(prisma.design_Review, 'findUnique').mockResolvedValue(prismaDesignReview5);
-      await expect(() =>
-        DesignReviewsService.markUserConfirmed(prismaDesignReview5.designReviewId, [1, 3], batman)
-      ).rejects.toThrow(new HttpException(400, 'Meeting times have to be consecutive'));
+      ).rejects.toThrow(new HttpException(400, 'Availability times have to be in range 0-83'));
     });
   });
 });

src/frontend/src/apis/design-reviews.api.ts

@@ -57,3 +57,7 @@ export const getSingleDesignReview = async (id: string) => {
     transformResponse: (data) => designReviewTransformer(JSON.parse(data))
   });
 };
+
+export const markUserConfirmed = async (id: string, payload: { availability: number[] }) => {
+  return axios.post<DesignReview>(apiUrls.designReviewMarkUserConfirmed(id), payload);
+};

src/frontend/src/components/Tabs.tsx

@@ -13,9 +13,10 @@ interface TabProps {
   baseUrl: string; //the URL that all the tab URLs extend
   defaultTab: string; //tab that the tabs component defaults to
   id: string;
+  noUnderline?: boolean;
 }
 
-const NERTabs = ({ setTab, tabsLabels, baseUrl, defaultTab, id }: TabProps) => {
+const NERTabs = ({ setTab, tabsLabels, baseUrl, defaultTab, id, noUnderline = false }: TabProps) => {
   const tabUrlValues = tabsLabels.map((tab) => tab.tabUrlValue);
   const match = useRouteMatch<{ tabValueString: string }>(`${baseUrl}/:tabValueString`);
   const tabValueString = match?.params?.tabValueString;
@@ -39,7 +40,7 @@ const NERTabs = ({ setTab, tabsLabels, baseUrl, defaultTab, id }: TabProps) => {
     <Tabs value={tabValue} onChange={handleTabChange} aria-label={`${id}-tabs`}>
       {tabsLabels.map((tab, idx) => (
         <Tab
-          sx={{ borderBottom: 1, borderColor: 'divider' }}
+          sx={noUnderline ? {} : { borderBottom: 1, borderColor: 'divider' }}
           label={tab.tabName}
           aria-label={tab.tabUrlValue}
           value={idx}

src/frontend/src/hooks/design-reviews.hooks.ts

@@ -9,8 +9,10 @@ import {
   createDesignReviews,
   getAllDesignReviews,
   getAllTeamTypes,
-  getSingleDesignReview
+  getSingleDesignReview,
+  markUserConfirmed
 } from '../apis/design-reviews.api';
+import { useCurrentUser } from './users.hooks';
 
 export interface CreateDesignReviewsPayload {
   dateScheduled: Date;
@@ -101,9 +103,31 @@ export const useAllTeamTypes = () => {
  *
  * @returns a single design review
  */
-export const useSingleDesignReview = (id: string) => {
-  return useQuery<DesignReview, Error>(['design-reviews', id], async () => {
-    const { data } = await getSingleDesignReview(id);
-    return data;
-  });
+export const useSingleDesignReview = (id?: string) => {
+  return useQuery<DesignReview, Error>(
+    ['design-reviews', id],
+    async () => {
+      const { data } = await getSingleDesignReview(id!);
+      return data;
+    },
+    { enabled: !!id }
+  );
+};
+
+export const useMarkUserConfirmed = (id: string) => {
+  const user = useCurrentUser();
+  const queryClient = useQueryClient();
+  return useMutation<DesignReview, Error, { availability: number[] }>(
+    ['design-reviews', 'mark-confirmed'],
+    async (designReviewPayload: { availability: number[] }) => {
+      const { data } = await markUserConfirmed(id, designReviewPayload);
+      return data;
+    },
+    {
+      onSuccess: () => {
+        queryClient.invalidateQueries(['design-reviews']);
+        queryClient.invalidateQueries(['users', user.userId, 'schedule-settings']);
+      }
+    }
+  );
 };

src/frontend/src/pages/AdminToolsPage/AdminToolsBOMConfig.tsx

@@ -1,12 +1,15 @@
-import { Grid } from '@mui/material';
-import PageBlock from '../../layouts/PageBlock';
+import { Grid, Typography } from '@mui/material';
 import ManufacturerTable from './BOMConfig/ManufacturerTable';
 import MaterialTypeTable from './BOMConfig/MaterialTypeTable';
 import UnitTable from './BOMConfig/UnitTable';
+import { Box } from '@mui/system';
 
 const AdminToolsBOMConfig: React.FC = () => {
   return (
-    <PageBlock title="Bill of Material Config">
+    <Box>
+      <Typography variant="h5" gutterBottom borderBottom={1} color="red" borderColor={'white'}>
+        Bill of Materials Config
+      </Typography>
       <Grid container spacing="3%">
         <Grid item direction="column" xs={12} md={6}>
           <ManufacturerTable />
@@ -18,7 +21,7 @@ const AdminToolsBOMConfig: React.FC = () => {
           <UnitTable />
         </Grid>
       </Grid>
-    </PageBlock>
+    </Box>
   );
 };
 

src/frontend/src/pages/AdminToolsPage/AdminToolsFinanceConfig.tsx

@@ -5,7 +5,7 @@ import AccountCodesTable from './FinanceConfig/AccountCodesTable';
 const AdminToolsFinanceConfig: React.FC = () => {
   return (
     <Box padding="5px">
-      <Typography marginBottom="15px" variant="h5">
+      <Typography variant="h5" gutterBottom borderBottom={1} color="red" borderColor={'white'}>
         Finance Config
       </Typography>
       <Grid container spacing="3%">

src/frontend/src/pages/AdminToolsPage/AdminToolsPage.tsx

@@ -43,10 +43,12 @@ const AdminToolsPage: React.FC = () => {
 
   const UserManagementTab = () => {
     return isUserAdmin ? (
-      <>
-        <AdminToolsUserManagement />
+      <Box>
+        <Box mb={2}>
+          <AdminToolsUserManagement />
+        </Box>
         <TeamsTools />
-      </>
+      </Box>
     ) : (
       <AdminToolsUserManagement />
     );
@@ -67,13 +69,16 @@ const AdminToolsPage: React.FC = () => {
     <PageLayout
       title="Admin Tools"
       tabs={
-        <NERTabs
-          setTab={setTabIndex}
-          tabsLabels={tabs}
-          baseUrl={routes.ADMIN_TOOLS}
-          defaultTab={defaultTab}
-          id="admin-tools-tabs"
-        />
+        <Box borderBottom={1} borderColor={'divider'} width={'100%'}>
+          <NERTabs
+            noUnderline
+            setTab={setTabIndex}
+            tabsLabels={tabs}
+            baseUrl={routes.ADMIN_TOOLS}
+            defaultTab={defaultTab}
+            id="admin-tools-tabs"
+          />
+        </Box>
       }
     >
       {tabIndex === 0 ? (

src/frontend/src/pages/AdminToolsPage/AdminToolsProjectsConfig.tsx

@@ -1,11 +1,15 @@
-import PageBlock from '../../layouts/PageBlock';
+import { Box } from '@mui/system';
 import LinkTypeTable from './ProjectsConfig/LinkTypeTable';
+import { Typography } from '@mui/material';
 
 const AdminToolsProjectsConfig: React.FC = () => {
   return (
-    <PageBlock title="Projects Config">
+    <Box>
+      <Typography variant="h5" gutterBottom borderBottom={1} color="red" borderColor={'white'}>
+        Links Config
+      </Typography>
       <LinkTypeTable />
-    </PageBlock>
+    </Box>
   );
 };