got rid of checklist on RR creation and fixed autocomplete for delegates

Author: chpy04

src/frontend/src/pages/AdminToolsPage/FinanceConfig/FinanceDelegatesTable.tsx

@@ -13,7 +13,6 @@ import {
 import LoadingIndicator from '../../../components/LoadingIndicator';
 import ErrorPage from '../../ErrorPage';
 import React, { useState } from 'react';
-import { User } from 'shared';
 import { NERButton } from '../../../components/NERButton';
 import DeleteIcon from '@mui/icons-material/Delete';
 import { useGetFinanceDelegates, useSetFinanceDelegates } from '../../../hooks/organizations.hooks';
@@ -34,9 +33,9 @@ const FinanceDelegatesTable = () => {
   const { mutateAsync: setFinanceDelegates, isLoading: isUpdating } = useSetFinanceDelegates();
   const toast = useToast();
 
-  const [selectedUser, setSelectedUser] = useState<User | null>(null);
+  const [selectedUserId, setSelectedUserId] = useState<string>();
 
-  if (!financeDelegates || delegatesIsLoading || usersIsLoading) {
+  if (!financeDelegates || delegatesIsLoading || !allUsers || usersIsLoading) {
     return <LoadingIndicator />;
   }
 
@@ -49,12 +48,12 @@ const FinanceDelegatesTable = () => {
   }
 
   const handleAddDelegate = async () => {
-    if (!selectedUser) return;
+    if (!selectedUserId) return;
 
     try {
-      const updatedUserIds = [...financeDelegates.map((u) => u.userId), selectedUser.userId];
+      const updatedUserIds = [...financeDelegates.map((u) => u.userId), selectedUserId];
       await setFinanceDelegates(updatedUserIds);
-      setSelectedUser(null);
+      setSelectedUserId(undefined);
       toast.success('Finance delegate added successfully');
     } catch (error: any) {
       toast.error(error.message);
@@ -75,9 +74,8 @@ const FinanceDelegatesTable = () => {
     allUsers?.filter((user) => !financeDelegates.some((delegate) => delegate.userId === user.userId)) || [];
 
   const userAutocompleteOptions = availableUsers.map((user) => ({
-    label: fullNamePipe(user),
-    id: user.userId,
-    user
+    label: `${fullNamePipe(user)} (${user.email})`,
+    id: user.userId
   }));
 
   const delegateTableRows = financeDelegates.map((delegate, index) => (
@@ -107,18 +105,18 @@ const FinanceDelegatesTable = () => {
         <Autocomplete
           sx={{ width: 300 }}
           options={userAutocompleteOptions}
-          value={selectedUser ? { label: fullNamePipe(selectedUser), id: selectedUser.userId, user: selectedUser } : null}
+          getOptionLabel={(option) => option.label}
+          value={userAutocompleteOptions.find((option) => option.id === selectedUserId) || null}
           onChange={(_event, newValue) => {
-            setSelectedUser(newValue?.user || null);
+            setSelectedUserId(newValue?.id || undefined);
           }}
           renderInput={(params) => <TextField {...params} variant="standard" placeholder="Select a User" />}
-          isOptionEqualToValue={(option, value) => option.id === value.id}
         />
         <NERButton
           style={{ color: 'white' }}
           variant="contained"
           onClick={handleAddDelegate}
-          disabled={!selectedUser || isUpdating}
+          disabled={!selectedUserId || isUpdating}
         >
           Add Delegate
         </NERButton>

src/frontend/src/pages/FinancePage/ReimbursementRequestForm/ReimbursementFormView.tsx

@@ -54,8 +54,6 @@ import { Link as RouterLink } from 'react-router-dom';
 import { routes } from '../../../utils/routes';
 import { wbsNumComparator } from 'shared/src/validate-wbs';
 import { codeAndRefundSourceName, accountCodePipe, fullNamePipe } from '../../../utils/pipes';
-import NERModal from '../../../components/NERModal';
-import CheckList from '../../../components/CheckList';
 import { useCreateVendor } from '../../../hooks/finance.hooks';
 import { useGetFinanceDelegates } from '../../../hooks/organizations.hooks';
 import LoadingIndicator from '../../../components/LoadingIndicator';
@@ -226,7 +224,6 @@ const ReimbursementRequestFormView: React.FC<ReimbursementRequestFormViewProps>
   const calculatedTotalCost = products
     .reduce((acc: number, product: ReimbursementProductFormArgs) => acc + Number(product.cost), 0)
     .toFixed(2);
-  const [showReimbursementGuidelinesModal, setShowReimbursementGuidelinesModal] = useState(true);
 
   const wbsElementAutocompleteOptions = allWbsElements.map((wbsElement) => ({
     label: wbsPipe(wbsElement.wbsNum) + ' - ' + wbsElement.wbsName,
@@ -292,46 +289,6 @@ const ReimbursementRequestFormView: React.FC<ReimbursementRequestFormViewProps>
     </FormControl>
   );
 
-  const ReimbursementGuidelinesModal = () => (
-    <NERModal
-      open={showReimbursementGuidelinesModal}
-      onHide={() => setShowReimbursementGuidelinesModal(false)}
-      title="Finance Checklist"
-      cancelText="No"
-      submitText="Yes"
-      onSubmit={() => setShowReimbursementGuidelinesModal(false)}
-    >
-      <CheckList
-        title="Receipts must have the following: "
-        items={[
-          {
-            resolved: false,
-            detail: `I certify that I have a Concur account${financeDelegates.length > 0 ? ', and have assigned ' + financeDelegates.map(fullNamePipe).join(', ') + ' as delegate(s) to submit this reimbursement request on my behalf.' : '.'}`,
-            id: '1'
-          },
-          {
-            resolved: false,
-            detail:
-              'I certify my receipts with expenses greater than $75 include an itemized description of goods or service purchased.',
-            id: '2'
-          },
-          {
-            resolved: false,
-            detail: `This reimbursement request is "NOT" for a faculty or full-time staff member.`,
-            id: '3'
-          },
-          {
-            resolved: false,
-            detail: `The reimbursement does not include sales tax unless it is for a prepared meal or hotel.`,
-            id: '4'
-          }
-        ]}
-        isDisabled={false}
-        checkDescriptionBullets={false}
-      />
-    </NERModal>
-  );
-
   const accountCodesToAutocomplete = (accountCode: AccountCode): { label: string; id: string } => {
     return {
       label: accountCodePipe(accountCode),
@@ -356,7 +313,6 @@ const ReimbursementRequestFormView: React.FC<ReimbursementRequestFormViewProps>
         justifyContent: 'space-between'
       }}
     >
-      <ReimbursementGuidelinesModal />
       {!hasSecureSettingsSet && (
         <Snackbar anchorOrigin={{ vertical: 'top', horizontal: 'center' }} open={true}>
           <Alert variant="filled" severity="warning">