Project member management

backend/routes/users/find.js

@@ -1,30 +1,33 @@
 const express = require('express');
 const router = express.Router();
 const defineUser = require('../../models/users');
+const defineMember = require('../../models/members');
 const { DataTypes, Op } = require('sequelize');
 
 module.exports = function (sequelize) {
   const { verifySignedIn } = require('../../middleware/auth')(sequelize);
   const User = defineUser(sequelize, DataTypes);
+  const Member = defineMember(sequelize, DataTypes);
 
   router.get('/find', verifySignedIn, async (req, res) => {
     try {
-      const { search, excludeIds } = req.query;
-      if (!search) {
-        return res.status(400).json({ error: 'search text is required' });
+      const { projectId, search } = req.query;
+      if (!projectId || !search) {
+        return res.status(400).json({ error: 'projectId and search text are required' });
       }
 
-      let where = {};
-      if (search) {
-        where = {
-          [Op.or]: [{ email: { [Op.like]: `%${search}%` } }, { username: { [Op.like]: `%${search}%` } }],
-        };
-      }
+      let where = {
+        [Op.or]: [{ email: { [Op.like]: `%${search}%` } }, { username: { [Op.like]: `%${search}%` } }],
+      };
 
-      if (excludeIds) {
-        const excludeIdArray = excludeIds.split(',').map((id) => parseInt(id, 10));
-        where.id = { [Op.notIn]: excludeIdArray };
-      }
+      let excludeIdArray = [];
+      const members = await Member.findAll({
+        where: { projectId },
+        attributes: ['userId'],
+      });
+      excludeIdArray = members.map((member) => member.userId);
+      excludeIdArray.push(req.userId);
+      where.id = { [Op.notIn]: excludeIdArray };
 
       const users = await User.findAll({
         where,

backend/seeders/seed.js

@@ -504,14 +504,14 @@ module.exports = {
 
     await queryInterface.bulkInsert('members', [
       {
-        userId: 1,
+        userId: 2,
         projectId: 1,
         role: 0,
         createdAt: new Date(),
         updatedAt: new Date(),
       },
       {
-        userId: 1,
+        userId: 3,
         projectId: 2,
         role: 0,
         createdAt: new Date(),

frontend/src/app/[locale]/projects/[projectId]/settings/AddMemberDialog.tsx

@@ -4,44 +4,19 @@ import { useState, useEffect, useContext } from 'react';
 import { Button, Input, Modal, ModalContent, ModalHeader, ModalBody, ModalFooter } from '@nextui-org/react';
 import { SettingsMessages } from '@/types/settings';
 import { TokenContext } from '@/utils/TokenProvider';
-import Config from '@/config/config';
-import { MemberType, UserType } from '@/types/user';
+import { UserType } from '@/types/user';
+import { searchUsers } from './membersControl';
 import CandidatesTable from './CandidatesTable';
-const apiServer = Config.apiServer;
 
 type Props = {
   isOpen: boolean;
-  members: MemberType[];
+  projectId: string;
   onCancel: () => void;
   onAddMember: (memberAdded: UserType) => void;
   messages: SettingsMessages;
 };
 
-// User Search by username
-async function searchUsers(jwt: string, text: string, excludeIdsParam: string) {
-  const fetchOptions = {
-    method: 'GET',
-    headers: {
-      'Content-Type': 'application/json',
-      Authorization: `Bearer ${jwt}`,
-    },
-  };
-
-  const url = `${apiServer}/users/find?search=${text}&excludeIds=${excludeIdsParam}`;
-
-  try {
-    const response = await fetch(url, fetchOptions);
-    if (!response.ok) {
-      throw new Error(`HTTP error! Status: ${response.status}`);
-    }
-    const data = await response.json();
-    return data;
-  } catch (error: any) {
-    console.error('Error fetching data:', error.message);
-  }
-}
-
-export default function AddMemberDialog({ isOpen, members, onCancel, onAddMember, messages }: Props) {
+export default function AddMemberDialog({ isOpen, projectId, onCancel, onAddMember, messages }: Props) {
   const context = useContext(TokenContext);
   const [searchText, setSearchText] = useState('');
   const [candidates, setCandidates] = useState<UserType[]>([]);
@@ -57,11 +32,7 @@ export default function AddMemberDialog({ isOpen, members, onCancel, onAddMember
       }
 
       try {
-        const excludeIds = members.map((member) => {
-          return member.id;
-        });
-        const excludeIdsParam = excludeIds.join(',');
-        const data = await searchUsers(context.token.access_token, searchText, excludeIdsParam);
+        const data = await searchUsers(context.token.access_token, projectId, searchText);
         setCandidates(data);
       } catch (error: any) {
         console.error('Error in effect:', error.message);

frontend/src/app/[locale]/projects/[projectId]/settings/MembersTable.tsx

@@ -1,4 +1,4 @@
-import { useState, useMemo, useCallback } from 'react';
+import { useState, useMemo } from 'react';
 import {
   Button,
   Table,
@@ -50,7 +50,7 @@ export default function MembersTable({ members, onChangeRole, onDeleteMember, me
     });
   }, [sortDescriptor, members]);
 
-  const renderCell = useCallback((member: UserType, columnKey: Key) => {
+  const renderCell = (member: UserType, columnKey: Key) => {
     const cellValue = member[columnKey as keyof UserType];
 
     switch (columnKey) {
@@ -93,7 +93,7 @@ export default function MembersTable({ members, onChangeRole, onDeleteMember, me
       default:
         return cellValue;
     }
-  }, []);
+  };
 
   const classNames = useMemo(
     () => ({

frontend/src/app/[locale]/projects/[projectId]/settings/SettingsPage.tsx

@@ -83,7 +83,7 @@ export default function SettingsPage({ projectId, messages, locale }: Props) {
 
       <AddMemberDialog
         isOpen={isDialogOpen}
-        members={members}
+        projectId={projectId}
         onCancel={() => setIsDialogOpen(false)}
         onAddMember={handleAddMember}
         messages={messages}

frontend/src/app/[locale]/projects/[projectId]/settings/membersControl.ts

@@ -24,6 +24,29 @@ async function fetchProjectMembers(jwt: string, projectId: string) {
   }
 }
 
+async function searchUsers(jwt: string, projectId: string, searchText: string) {
+  const fetchOptions = {
+    method: 'GET',
+    headers: {
+      'Content-Type': 'application/json',
+      Authorization: `Bearer ${jwt}`,
+    },
+  };
+
+  const url = `${apiServer}/users/find?projectId=${projectId}&search=${searchText}`;
+
+  try {
+    const response = await fetch(url, fetchOptions);
+    if (!response.ok) {
+      throw new Error(`HTTP error! Status: ${response.status}`);
+    }
+    const data = await response.json();
+    return data;
+  } catch (error: any) {
+    console.error('Error fetching data:', error.message);
+  }
+}
+
 async function addMember(jwt: string, userId: string, projectId: string) {
   const fetchOptions = {
     method: 'POST',
@@ -63,9 +86,6 @@ async function deleteMember(jwt: string, userId: string, projectId: string) {
     if (!response.ok) {
       throw new Error(`HTTP error! Status: ${response.status}`);
     }
-    const data = await response.json();
-    console.log(data);
-    return data;
   } catch (error: any) {
     console.error('Error fetching data:', error.message);
   }
@@ -94,4 +114,4 @@ async function updateMember(jwt: string, userId: string, projectId: string, role
   }
 }
 
-export { fetchProjectMembers, addMember, deleteMember, updateMember };
+export { fetchProjectMembers, searchUsers, addMember, deleteMember, updateMember };