Merge pull request #3812 from Northeastern-Electric-Racing/#3801-person-search

only search for members and fix autocomplete bug

Author: walker-sean

src/backend/src/controllers/users.controllers.ts

@@ -21,6 +21,15 @@ export default class UsersController {
     }
   }
 
+  static async getAllMembers(req: Request, res: Response, next: NextFunction) {
+    try {
+      const users = await UsersService.getAllOrgMembers(req.organization.organizationId);
+      res.status(200).json(users);
+    } catch (error: unknown) {
+      next(error);
+    }
+  }
+
   static async getCurrentUser(req: Request, res: Response, next: NextFunction) {
     try {
       const user = await UsersService.getCurrentUser(req.currentUser);

src/backend/src/routes/users.routes.ts

@@ -8,6 +8,7 @@ const userRouter = express.Router();
 
 userRouter.get('/', UsersController.getAllUsers);
 userRouter.get('/organization', UsersController.getAllOrgUsers);
+userRouter.get('/members', UsersController.getAllMembers);
 userRouter.post(
   '/scheduleSettings',
   body('userIds').isArray(),

src/backend/src/services/users.services.ts

@@ -1,4 +1,4 @@
-import { User_Settings, Organization } from '@prisma/client';
+import { User_Settings, Organization, Role_Type } from '@prisma/client';
 import { OAuth2Client } from 'google-auth-library/build/src/auth/oauth2client';
 import {
   Role,
@@ -59,6 +59,28 @@ export default class UsersService {
     return users.map(userTransformer);
   }
 
+  static async getAllOrgMembers(organizationId: string): Promise<User[]> {
+    const users = await prisma.user.findMany({
+      where: {
+        organizations: {
+          some: {
+            organizationId,
+            roles: {}
+          }
+        },
+        roles: {
+          some: {
+            AND: [{ NOT: { roleType: Role_Type.GUEST } }, { organizationId }]
+          }
+        }
+      },
+      ...getUserQueryArgs(organizationId),
+      orderBy: { lastName: 'asc' }
+    });
+
+    return users.map(userTransformer);
+  }
+
   static async getCurrentUser(user: User): Promise<AuthenticatedUser> {
     const userWithOrgs = await prisma.user.findUnique({ where: { userId: user.userId }, include: { organizations: true } });
 

src/frontend/src/apis/users.api.ts

@@ -44,6 +44,16 @@ export const getAllOrgUsers = () => {
   });
 };
 
+/**
+ * All users in the current organization that are member or higher in role
+ * @returns the members in the current organization with their roles
+ */
+export const getAllOrgMembers = () => {
+  return axios.get<UserWithRole[]>(apiUrls.orgMembers(), {
+    transformResponse: (data) => JSON.parse(data).map(userTransformer)
+  });
+};
+
 /**
  * Fetch a single user.
  *

src/frontend/src/components/NERAutocomplete.tsx

@@ -73,6 +73,8 @@ const NERAutocomplete: React.FC<NERAutocompleteProps> = ({
     <>
       <Autocomplete
         isOptionEqualToValue={(option, value) => option.id === value.id}
+        getOptionLabel={(option) => option.label}
+        getOptionKey={(option) => option.id}
         disablePortal
         id={id}
         onChange={onChange}

src/frontend/src/hooks/users.hooks.ts

@@ -23,7 +23,8 @@ import {
   getCurrentUser,
   logUserOut,
   getManyUsersWithScheduleSettings,
-  getAllOrgUsers
+  getAllOrgUsers,
+  getAllOrgMembers
 } from '../apis/users.api';
 import {
   User,
@@ -61,6 +62,16 @@ export const useAllUsers = () => {
   });
 };
 
+/**
+ * Custom React Hook to supply all members (members and up in the current org)
+ */
+export const useAllMembers = () => {
+  return useQuery<UserWithRole[], Error>(['users', 'members'], async () => {
+    const { data } = await getAllOrgMembers();
+    return data;
+  });
+};
+
 /**
  * Custom React Hook to supply all users for login (no org filtering).
  * @returns all users regardless of org

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

@@ -5,29 +5,29 @@ import { useAllTeams } from '../../hooks/teams.hooks';
 import LoadingIndicator from '../../components/LoadingIndicator';
 import ErrorPage from '../ErrorPage';
 import { fullNamePipe } from '../../utils/pipes';
-import { useAllUsers } from '../../hooks/users.hooks';
+import { useAllMembers } from '../../hooks/users.hooks';
 import { useAllDesignReviews } from '../../hooks/design-reviews.hooks';
 import { DesignReviewStatus } from 'shared';
 
 const AdminToolsAttendeeDesignReviewInfo: React.FC = () => {
   const [searchQuery, setSearchQuery] = useState('');
 
   const { data: allTeams, isLoading: teamsIsLoading, isError: teamsIsError, error: teamsError } = useAllTeams();
-  const { data: allUsers, isLoading: usersIsLoading, isError: usersIsError, error: usersError } = useAllUsers();
+  const { data: allMembers, isLoading: usersIsLoading, isError: usersIsError, error: usersError } = useAllMembers();
   const {
     data: allDesignReviews,
     isLoading: designReviewsIsLoading,
     isError: designReviewsIsError,
     error: designReviewsError
   } = useAllDesignReviews();
 
-  if (!allTeams || teamsIsLoading || !allUsers || usersIsLoading || !allDesignReviews || designReviewsIsLoading)
+  if (!allTeams || teamsIsLoading || !allMembers || usersIsLoading || !allDesignReviews || designReviewsIsLoading)
     return <LoadingIndicator />;
   if (teamsIsError) return <ErrorPage message={teamsError.message} />;
   if (usersIsError) return <ErrorPage message={usersError.message} />;
   if (designReviewsIsError) return <ErrorPage message={designReviewsError.message} />;
 
-  const filteredMembers = allUsers.filter((member) =>
+  const filteredMembers = allMembers.filter((member) =>
     fullNamePipe(member).toLowerCase().includes(searchQuery.toLowerCase())
   );
 

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

@@ -16,7 +16,7 @@ import React, { useState } from 'react';
 import { NERButton } from '../../../components/NERButton';
 import DeleteIcon from '@mui/icons-material/Delete';
 import { useGetFinanceDelegates, useSetFinanceDelegates } from '../../../hooks/organizations.hooks';
-import { useAllUsers } from '../../../hooks/users.hooks';
+import { useAllMembers } from '../../../hooks/users.hooks';
 import { useToast } from '../../../hooks/toasts.hooks';
 import { fullNamePipe } from '../../../utils/pipes';
 
@@ -28,14 +28,14 @@ const FinanceDelegatesTable = () => {
     error: delegatesError
   } = useGetFinanceDelegates();
 
-  const { data: allUsers, isLoading: usersIsLoading, isError: usersIsError, error: usersError } = useAllUsers();
+  const { data: allMembers, isLoading: usersIsLoading, isError: usersIsError, error: usersError } = useAllMembers();
 
   const { mutateAsync: setFinanceDelegates, isLoading: isUpdating } = useSetFinanceDelegates();
   const toast = useToast();
 
   const [selectedUserId, setSelectedUserId] = useState<string>();
 
-  if (!financeDelegates || delegatesIsLoading || !allUsers || usersIsLoading) {
+  if (!financeDelegates || delegatesIsLoading || !allMembers || usersIsLoading) {
     return <LoadingIndicator />;
   }
 
@@ -71,7 +71,7 @@ const FinanceDelegatesTable = () => {
   };
 
   const availableUsers =
-    allUsers?.filter((user) => !financeDelegates.some((delegate) => delegate.userId === user.userId)) || [];
+    allMembers?.filter((user) => !financeDelegates.some((delegate) => delegate.userId === user.userId)) || [];
 
   const userAutocompleteOptions = availableUsers.map((user) => ({
     label: `${fullNamePipe(user)} (${user.email})`,

src/frontend/src/pages/AdminToolsPage/OnboardingConfig/UpdateContactsModal.tsx

@@ -10,7 +10,7 @@ import LoadingIndicator from '../../../components/LoadingIndicator';
 import * as yup from 'yup';
 import { useUpdateOrganizationContacts } from '../../../hooks/organizations.hooks'; // Assume hook exists
 import { Contact } from 'shared';
-import { useAllUsers } from '../../../hooks/users.hooks';
+import { useAllMembers } from '../../../hooks/users.hooks';
 import { fullNamePipe } from '../../../utils/pipes';
 
 const schema = yup.object().shape({
@@ -48,7 +48,7 @@ const UpdateOnboardingContactsModal: React.FC<UpdateOnboardingContactsModalProps
     mutateAsync
   } = useUpdateOrganizationContacts();
 
-  const { isLoading: allUsersIsLoading, isError: allUsersIsError, error: allUsersError, data: users } = useAllUsers();
+  const { isLoading: allUsersIsLoading, isError: allUsersIsError, error: allUsersError, data: users } = useAllMembers();
 
   const contactsAsObjects = useMemo(
     () =>

src/frontend/src/pages/AdminToolsPage/TeamConfig/CreateTeamForm.tsx

@@ -3,7 +3,7 @@ import { useState } from 'react';
 import { Controller, useForm } from 'react-hook-form';
 import { useCreateTeam } from '../../../hooks/teams.hooks';
 import { useToast } from '../../../hooks/toasts.hooks';
-import { useAllUsers } from '../../../hooks/users.hooks';
+import { useAllMembers } from '../../../hooks/users.hooks';
 import * as yup from 'yup';
 import ErrorPage from '../../ErrorPage';
 import LoadingIndicator from '../../../components/LoadingIndicator';
@@ -44,7 +44,7 @@ const CreateTeamForm = () => {
   const theme = useTheme();
   const [showPreview, setShowPreview] = useState(false);
   const { isLoading, mutateAsync } = useCreateTeam();
-  const { isLoading: allUsersIsLoading, isError: allUsersIsError, error: allUsersError, data: users } = useAllUsers();
+  const { isLoading: allUsersIsLoading, isError: allUsersIsError, error: allUsersError, data: users } = useAllMembers();
   const toast = useToast();
   const {
     handleSubmit,