Merge branch 'develop' into #1388-ArinjaySingh-credits

RChandler234 · web-flow · commit e855caefb186 · 2023-09-15T10:16:42.000-04:00
diff --git a/src/backend/src/services/work-packages.services.ts b/src/backend/src/services/work-packages.services.ts
@@ -154,6 +154,12 @@ export default class WorkPackagesService {
       throw new HttpException(400, 'A Work Package cannot have its own project as a blocker');
     }
 
+    blockedBy.forEach((dep: WbsNumber) => {
+      if (dep.workPackageNumber === 0) {
+        throw new HttpException(400, 'A Project cannot be a Blocker');
+      }
+    });
+
     const wbsElem = await prisma.wBS_Element.findUnique({
       where: {
         wbsNumber: {
@@ -287,6 +293,12 @@ export default class WorkPackagesService {
     // verify user is allowed to edit work packages
     if (isGuest(user.role)) throw new AccessDeniedGuestException('edit work packages');
 
+    blockedBy.forEach((dep: WbsNumber) => {
+      if (dep.workPackageNumber === 0) {
+        throw new HttpException(400, 'A Project cannot be a Blocker');
+      }
+    });
+
     const { userId } = user;
 
     // get the original work package so we can compare things
diff --git a/src/frontend/src/hooks/work-packages.hooks.ts b/src/frontend/src/hooks/work-packages.hooks.ts
@@ -37,22 +37,6 @@ export const useSingleWorkPackage = (wbsNum: WbsNumber) => {
   });
 };
 
-/**
- * Custom React Hook to supply multiple work packages
- *
- * @param wbsNums WBS numbers of the requested work packages
- */
-export const useManyWorkPackages = (wbsNums: WbsNumber[]) => {
-  return useQuery<WorkPackage[], Error>(['work packages', wbsNums], async () => {
-    const workPackagePromises = wbsNums.map(async (wbsNum) => {
-      const { data } = await getSingleWorkPackage(wbsNum);
-      return data;
-    });
-    const workPackages = await Promise.all(workPackagePromises);
-    return workPackages;
-  });
-};
-
 /**
  * Custom React Hook to create a new work package.
  *
diff --git a/src/frontend/src/pages/CreditsPage/CreditsPage.tsx b/src/frontend/src/pages/CreditsPage/CreditsPage.tsx
@@ -84,6 +84,7 @@ const CreditsPage: React.FC = () => {
     { name: 'Yechan Na', color: '#C2B078' },
     { name: 'Liam Kosar', color: '#eb66ff' },
     { name: 'Daniel Yu', color: '#bdc0c7' },
+    { name: 'Jake Wu-Chen', color: '#bdc0c7' },
     { name: 'William Seward', color: '#e53774' },
     {
       name: 'Zach Norman',
@@ -95,6 +96,7 @@ const CreditsPage: React.FC = () => {
     },
     { name: 'Ethan Mouri', color: '#00bbff' },
     { name: 'Laith Taher', color: '#000080' },
+    { name: 'Teera Tesharojanasup', color: '#DC143C', sx: { px: 1, backgroundColor: '#E8D8CC', borderRadius: 10 } },
     { name: 'Griffin Cooper', color: '#02d69a' },
     { name: 'Amani Scarborough', color: '#e34db6' },
     { name: 'Peter Moise', color: '#FF0000' },
@@ -103,9 +105,26 @@ const CreditsPage: React.FC = () => {
     { name: 'Waasif Mahmood', color: '#114a13' },
     { name: 'Matthew Wang', color: '#c657f2' },
     { name: 'Sharon Yang', color: '#ed8a5f' },
+    { name: 'Samantha Moy', color: '#d287fa' },
+    { name: 'Benjamin Zhu', color: '#ccccff' },
+    { name: 'Stephanie Xu', color: '#ffcd42' },
     { name: 'Hareg Aderie', color: '#34b46c' },
+    { name: 'Arinjay Singh', color: '#7bb5dc' },
+    { name: 'Aarav Shyamkumar', color: '#FF0000' },
+    { name: 'Raghav Mathur', color: '#009933' },
+    { name: 'Anika Sharma', color: '#ff0000' },
+    {
+      name: 'Kaan Tural',
+      color: 'transparent',
+      sx: {
+        background: 'linear-gradient(90deg, rgba(255,0,0,1) 0%, rgba(0,128,255,1) 100%)',
+        '-webkit-background-clip': 'text',
+        textShadow: '0 0 5px rgba(255,0,0,1), 0 0 10px rgba(0,128,255,1)'
+      }
+    },
     { name: 'Kevin Polackal', color: '#800080' },
-    { name: 'Arinjay Singh', color: '#7bb5dc' }
+    { name: 'Lily Shiomitsu', color: '#008080' },
+    { name: 'Kevin Yang', color: '#0000FF' }
   ];
 
   const snark = ['Add your name!', "Shouldn't you do it yourself?", 'Seriously', 'go', 'do', 'it'];
diff --git a/src/frontend/src/pages/FinancePage/ReimbursementRequestDetailPage/ReimbursementRequestDetailsView.tsx b/src/frontend/src/pages/FinancePage/ReimbursementRequestDetailPage/ReimbursementRequestDetailsView.tsx
@@ -3,6 +3,7 @@
  * See the LICENSE file in the repository root folder for details.
  */
 
+import { expenseTypePipe } from '../../../utils/pipes';
 import { Edit } from '@mui/icons-material';
 import CheckIcon from '@mui/icons-material/Check';
 import ConfirmationNumberIcon from '@mui/icons-material/ConfirmationNumber';
@@ -118,7 +119,7 @@ const ReimbursementRequestDetailsView: React.FC<ReimbursementRequestDetailsViewP
             <VerticalDetailDisplay label="Refund Source" content={`${reimbursementRequest.account}`} />
           </Grid>
           <Grid item sm={6} xs={12}>
-            <VerticalDetailDisplay label="Expense Type" content={`${reimbursementRequest.expenseType.name}`} />
+            <VerticalDetailDisplay label="Expense Type" content={expenseTypePipe(reimbursementRequest.expenseType)} />
           </Grid>
           <Grid item sm={6} xs={12}>
             <VerticalDetailDisplay label="Date Delivered" content={dateUndefinedPipe(reimbursementRequest.dateDelivered)} />
diff --git a/src/frontend/src/pages/FinancePage/ReimbursementRequestForm/ReimbursementFormView.tsx b/src/frontend/src/pages/FinancePage/ReimbursementRequestForm/ReimbursementFormView.tsx
@@ -29,6 +29,7 @@ import NERSuccessButton from '../../../components/NERSuccessButton';
 import { ReimbursementRequestFormInput } from './ReimbursementRequestForm';
 import { useState } from 'react';
 import { useToast } from '../../../hooks/toasts.hooks';
+import { expenseTypePipe } from '../../../utils/pipes';
 
 interface ReimbursementRequestFormViewProps {
   allVendors: Vendor[];
@@ -195,7 +196,7 @@ const ReimbursementRequestFormView: React.FC<ReimbursementRequestFormViewProps>
                     >
                       {allExpenseTypes.map((expenseType) => (
                         <MenuItem key={expenseType.expenseTypeId} value={expenseType.expenseTypeId}>
-                          {expenseType.name}
+                          {expenseTypePipe(expenseType)}
                         </MenuItem>
                       ))}
                     </Select>
diff --git a/src/frontend/src/pages/ProjectDetailPage/ProjectViewContainer/WorkPackageSummary.tsx b/src/frontend/src/pages/ProjectDetailPage/ProjectViewContainer/WorkPackageSummary.tsx
@@ -18,7 +18,7 @@ import Grid from '@mui/material/Grid';
 import { useTheme } from '@mui/material';
 import DetailDisplay from '../../../components/DetailDisplay';
 import WorkPackageStageChip from '../../../components/WorkPackageStageChip';
-import { useManyWorkPackages } from '../../../hooks/work-packages.hooks';
+import { useGetBlockingWorkPackages } from '../../../hooks/work-packages.hooks';
 import LoadingIndicator from '../../../components/LoadingIndicator';
 import ErrorPage from '../../ErrorPage';
 
@@ -37,7 +37,7 @@ const WorkPackageSummary: React.FC<WorkPackageSummaryProps> = ({ workPackage })
     </ul>
   );
 
-  const { data: dependencies, isError, isLoading, error } = useManyWorkPackages(workPackage.blockedBy);
+  const { data: dependencies, isError, isLoading, error } = useGetBlockingWorkPackages(workPackage.wbsNum);
   const theme = useTheme();
 
   if (!dependencies || isLoading) return <LoadingIndicator />;
diff --git a/src/frontend/src/pages/WorkPackageDetailPage/WorkPackageViewContainer/WorkPackageViewContainer.tsx b/src/frontend/src/pages/WorkPackageDetailPage/WorkPackageViewContainer/WorkPackageViewContainer.tsx
@@ -22,7 +22,7 @@ import KeyboardDoubleArrowUpIcon from '@mui/icons-material/KeyboardDoubleArrowUp
 import DoneOutlineIcon from '@mui/icons-material/DoneOutline';
 import Delete from '@mui/icons-material/Delete';
 import DeleteWorkPackage from '../DeleteWorkPackageModalContainer/DeleteWorkPackage';
-import { useManyWorkPackages } from '../../../hooks/work-packages.hooks';
+import { useGetBlockingWorkPackages } from '../../../hooks/work-packages.hooks';
 import PageLayout from '../../../components/PageLayout';
 import LoadingIndicator from '../../../components/LoadingIndicator';
 import ErrorPage from '../../ErrorPage';
@@ -52,7 +52,7 @@ const WorkPackageViewContainer: React.FC<WorkPackageViewContainerProps> = ({
   const [showStageGateModal, setShowStageGateModal] = useState<boolean>(false);
   const [showDeleteModal, setShowDeleteModal] = useState<boolean>(false);
   const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
-  const { data: dependencies, isError, isLoading, error } = useManyWorkPackages(workPackage.blockedBy);
+  const { data: dependencies, isError, isLoading, error } = useGetBlockingWorkPackages(workPackage.wbsNum);
   const dropdownOpen = Boolean(anchorEl);
   const wbsNum = wbsPipe(workPackage.wbsNum);
 
diff --git a/src/frontend/src/tests/pages/ProjectDetailPage/ProjectViewContainer.test.tsx b/src/frontend/src/tests/pages/ProjectDetailPage/ProjectViewContainer.test.tsx
@@ -12,7 +12,7 @@ import { WorkPackageStage } from 'shared/src/types/work-package-types';
 import * as userHooks from '../../../hooks/users.hooks';
 import * as authHooks from '../../../hooks/auth.hooks';
 import * as wpHooks from '../../../hooks/work-packages.hooks';
-import { mockUseManyWorkPackagesReturnValue, mockUseUsersFavoriteProjects } from '../../test-support/mock-hooks';
+import { mockUseGetBlockingWorkPackagesReturnValue, mockUseUsersFavoriteProjects } from '../../test-support/mock-hooks';
 import { exampleAllWorkPackages } from '../../test-support/test-data/work-packages.stub';
 
 vi.mock('../../../utils/axios');
@@ -33,7 +33,9 @@ describe('Rendering Project View Container', () => {
     vi.spyOn(authHooks, 'useAuth').mockReturnValue(mockAuth(false, exampleAdminUser));
     vi.spyOn(userHooks, 'useCurrentUser').mockReturnValue(exampleAdminUser);
     vi.spyOn(userHooks, 'useUsersFavoriteProjects').mockReturnValue(mockUseUsersFavoriteProjects());
-    vi.spyOn(wpHooks, 'useManyWorkPackages').mockReturnValue(mockUseManyWorkPackagesReturnValue(exampleAllWorkPackages));
+    vi.spyOn(wpHooks, 'useGetBlockingWorkPackages').mockReturnValue(
+      mockUseGetBlockingWorkPackagesReturnValue(exampleAllWorkPackages)
+    );
     renderComponent();
   });
 
diff --git a/src/frontend/src/tests/pages/WorkPackageDetailPage/WorkPackagePage.test.tsx b/src/frontend/src/tests/pages/WorkPackageDetailPage/WorkPackagePage.test.tsx
@@ -7,7 +7,7 @@ import { UseQueryResult } from 'react-query';
 import { AuthenticatedUser, WorkPackage } from 'shared';
 import { render, screen, routerWrapperBuilder, act, fireEvent } from '../../test-support/test-utils';
 import { Auth } from '../../../utils/types';
-import { useManyWorkPackages, useSingleWorkPackage } from '../../../hooks/work-packages.hooks';
+import { useGetBlockingWorkPackages, useSingleWorkPackage } from '../../../hooks/work-packages.hooks';
 import { useAuth } from '../../../hooks/auth.hooks';
 import { mockAuth, mockUseQueryResult } from '../../test-support/test-data/test-utils.stub';
 import { exampleDesignWorkPackage, exampleResearchWorkPackage } from '../../test-support/test-data/work-packages.stub';
@@ -25,10 +25,10 @@ const mockSingleWPHook = (isLoading: boolean, isError: boolean, data?: WorkPacka
   mockedUseSingleWorkPackage.mockReturnValue(mockUseQueryResult<WorkPackage>(isLoading, isError, data, error));
 };
 
-const mockedUseManyWorkPackages = useManyWorkPackages as jest.Mock<UseQueryResult<WorkPackage[]>>;
+const mockedGetBlockingWorkPackages = useGetBlockingWorkPackages as jest.Mock<UseQueryResult<WorkPackage[]>>;
 
-const mockManyWorkPackagesHook = (isLoading: boolean, isError: boolean, data?: WorkPackage[], error?: Error) => {
-  mockedUseManyWorkPackages.mockReturnValue(mockUseQueryResult<WorkPackage[]>(isLoading, isError, data, error));
+const mockGetBlockingWorkPackagesHook = (isLoading: boolean, isError: boolean, data?: WorkPackage[], error?: Error) => {
+  mockedGetBlockingWorkPackages.mockReturnValue(mockUseQueryResult<WorkPackage[]>(isLoading, isError, data, error));
 };
 
 vi.mock('../../../hooks/auth.hooks');
@@ -63,7 +63,7 @@ describe('work package container', () => {
     mockSingleWPHook(true, false);
     mockAuthHook();
     mockCurrentUserHook();
-    mockManyWorkPackagesHook(true, false);
+    mockGetBlockingWorkPackagesHook(true, false);
     renderComponent();
 
     expect(screen.queryByText('Loading...')).not.toBeInTheDocument();
@@ -74,7 +74,7 @@ describe('work package container', () => {
     mockSingleWPHook(false, false, exampleResearchWorkPackage);
     mockAuthHook();
     mockCurrentUserHook();
-    mockManyWorkPackagesHook(false, false, [exampleDesignWorkPackage]);
+    mockGetBlockingWorkPackagesHook(false, false, [exampleDesignWorkPackage]);
     renderComponent();
 
     expect(screen.queryByText('Loading...')).not.toBeInTheDocument();
@@ -87,7 +87,7 @@ describe('work package container', () => {
     mockSingleWPHook(false, true, undefined, new Error('404 could not find the requested work package'));
     mockAuthHook();
     mockCurrentUserHook();
-    mockManyWorkPackagesHook(false, false);
+    mockGetBlockingWorkPackagesHook(false, false);
     renderComponent();
 
     expect(screen.queryByText('Loading...')).not.toBeInTheDocument();
@@ -99,7 +99,7 @@ describe('work package container', () => {
     mockSingleWPHook(false, true);
     mockAuthHook();
     mockCurrentUserHook();
-    mockManyWorkPackagesHook(false, false);
+    mockGetBlockingWorkPackagesHook(false, false);
     renderComponent();
 
     expect(screen.queryByText('Loading...')).not.toBeInTheDocument();
@@ -111,7 +111,7 @@ describe('work package container', () => {
     mockSingleWPHook(false, false, exampleResearchWorkPackage);
     mockAuthHook(exampleAdminUser);
     mockCurrentUserHook();
-    mockManyWorkPackagesHook(false, false, [exampleDesignWorkPackage]);
+    mockGetBlockingWorkPackagesHook(false, false, [exampleDesignWorkPackage]);
     renderComponent();
 
     act(() => {
@@ -124,7 +124,7 @@ describe('work package container', () => {
     mockSingleWPHook(false, false, exampleResearchWorkPackage);
     mockAuthHook(exampleGuestUser);
     mockCurrentUserHook(exampleGuestUser);
-    mockManyWorkPackagesHook(false, false, [exampleDesignWorkPackage]);
+    mockGetBlockingWorkPackagesHook(false, false, [exampleDesignWorkPackage]);
     renderComponent();
 
     act(() => {
diff --git a/src/frontend/src/tests/pages/WorkPackageDetailPage/WorkPackageViewContainer/WorkPackageViewContainer.test.tsx b/src/frontend/src/tests/pages/WorkPackageDetailPage/WorkPackageViewContainer/WorkPackageViewContainer.test.tsx
@@ -10,7 +10,7 @@ import * as wpHooks from '../../../../hooks/work-packages.hooks';
 import { exampleAdminUser } from '../../../test-support/test-data/users.stub';
 import AppContextUser from '../../../../app/AppContextUser';
 import * as userHooks from '../../../../hooks/users.hooks';
-import { mockUseManyWorkPackagesReturnValue } from '../../../test-support/mock-hooks';
+import { mockUseGetBlockingWorkPackagesReturnValue } from '../../../test-support/mock-hooks';
 
 // Sets up the component under test with the desired values and renders it.
 const renderComponent = (
@@ -42,8 +42,8 @@ const renderComponent = (
 describe.skip('work package container view', () => {
   beforeEach(() => {
     vi.spyOn(userHooks, 'useCurrentUser').mockReturnValue(exampleAdminUser);
-    vi.spyOn(wpHooks, 'useManyWorkPackages').mockReturnValue(
-      mockUseManyWorkPackagesReturnValue([exampleResearchWorkPackage])
+    vi.spyOn(wpHooks, 'useGetBlockingWorkPackages').mockReturnValue(
+      mockUseGetBlockingWorkPackagesReturnValue([exampleResearchWorkPackage])
     );
   });
 
diff --git a/src/frontend/src/tests/test-support/mock-hooks.ts b/src/frontend/src/tests/test-support/mock-hooks.ts
@@ -83,5 +83,5 @@ export const mockUseAllWorkPackagesReturnValue = (workPackages: WorkPackage[]) =
 export const mockUseAllProjectsReturnValue = (projects: Project[]) =>
   mockUseQueryResult<Project[]>(false, false, projects, new Error());
 
-export const mockUseManyWorkPackagesReturnValue = (workPackages: WorkPackage[]) =>
+export const mockUseGetBlockingWorkPackagesReturnValue = (workPackages: WorkPackage[]) =>
   mockUseQueryResult<WorkPackage[]>(false, false, workPackages, new Error());
diff --git a/src/frontend/src/utils/pipes.ts b/src/frontend/src/utils/pipes.ts
@@ -3,7 +3,7 @@
  * See the LICENSE file in the repository root folder for details.
  */
 
-import { WbsNumber, User, wbsPipe, WbsElement } from 'shared';
+import { WbsNumber, User, wbsPipe, WbsElement, ExpenseType } from 'shared';
 
 /**
  * Pipes:
@@ -85,6 +85,10 @@ export const numberParamPipe = (param: string | null) => {
   }
 };
 
+export const expenseTypePipe = (expenseType: ExpenseType) => {
+  return `${expenseType.code} - ${expenseType.name}`;
+};
+
 /** Display timeline status in readable form
  *  E.G. VERY_BEHIND -> Very Behind
  */
