feat: view customize on member's role

frontend/src/app/[locale]/projects/[projectId]/folders/FolderEditMenu.tsx

@@ -1,3 +1,4 @@
+import { useState, useEffect } from 'react';
 import { Button, Dropdown, DropdownTrigger, DropdownMenu, DropdownItem } from '@nextui-org/react';
 import { MoreVertical } from 'lucide-react';
 import { FolderType, FoldersMessages } from '@/types/folder';
@@ -11,14 +12,24 @@ type Props = {
 };
 
 export default function FolderEditMenu({ folder, isDisabled, onEditClick, onDeleteClick, messages }: Props) {
+  const [disabledKeys, setDisabledKeys] = useState<string[]>([]);
+
+  useEffect(() => {
+    if (isDisabled) {
+      setDisabledKeys(['edit', 'delete']);
+    } else {
+      setDisabledKeys([]);
+    }
+  }, [isDisabled]);
+
   return (
     <Dropdown>
       <DropdownTrigger>
-        <Button isIconOnly isDisabled={isDisabled} size="sm" className="bg-transparent rounded-full">
+        <Button isIconOnly size="sm" className="bg-transparent rounded-full">
           <MoreVertical size={16} />
         </Button>
       </DropdownTrigger>
-      <DropdownMenu aria-label="Static Actions">
+      <DropdownMenu aria-label="Static Actions" disabledKeys={disabledKeys}>
         <DropdownItem key="edit" onClick={() => onEditClick(folder)}>
           {messages.editFolder}
         </DropdownItem>

frontend/src/app/[locale]/projects/[projectId]/folders/FoldersPane.tsx

@@ -118,7 +118,7 @@ export default function FoldersPane({ projectId, messages, locale }: Props) {
           size="sm"
           variant="bordered"
           className="m-2"
-          isDisabled={!context.isProjectEditable(Number(projectId))}
+          isDisabled={!context.isProjectDeveloper(Number(projectId))}
           onClick={openDialogForCreate}
         >
           {messages.newFolder}
@@ -133,7 +133,7 @@ export default function FoldersPane({ projectId, messages, locale }: Props) {
               endContent={
                 <FolderEditMenu
                   folder={folder}
-                  isDisabled={!context.isProjectEditable(Number(projectId))}
+                  isDisabled={!context.isProjectDeveloper(Number(projectId))}
                   onEditClick={onEditClick}
                   onDeleteClick={onDeleteClick}
                   messages={messages}

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

@@ -21,12 +21,13 @@ import Avatar from 'boring-avatars';
 
 type Props = {
   members: MemberType[];
+  isDisabled: boolean;
   onChangeRole: (userEdit: UserType, role: number) => void;
   onDeleteMember: (userDeleted: UserType) => void;
   messages: SettingsMessages;
 };
 
-export default function MembersTable({ members, onChangeRole, onDeleteMember, messages }: Props) {
+export default function MembersTable({ members, isDisabled, onChangeRole, onDeleteMember, messages }: Props) {
   const headerColumns = [
     { name: messages.avatar, uid: 'avatar' },
     { name: messages.email, uid: 'email', sortable: true },
@@ -71,7 +72,7 @@ export default function MembersTable({ members, onChangeRole, onDeleteMember, me
         return (
           <Dropdown>
             <DropdownTrigger>
-              <Button size="sm" variant="light" endContent={<ChevronDown size={16} />}>
+              <Button size="sm" isDisabled={isDisabled} variant="light" endContent={<ChevronDown size={16} />}>
                 <span className="w-12">{messages[memberRoles[cellValue].uid]}</span>
               </Button>
             </DropdownTrigger>
@@ -86,7 +87,13 @@ export default function MembersTable({ members, onChangeRole, onDeleteMember, me
         );
       case 'delete':
         return (
-          <Button size="sm" color="danger" variant="light" onClick={() => onDeleteMember(member.User)}>
+          <Button
+            size="sm"
+            isDisabled={isDisabled}
+            color="danger"
+            variant="light"
+            onClick={() => onDeleteMember(member.User)}
+          >
             {messages.deleteMember}
           </Button>
         );

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

@@ -69,13 +69,20 @@ export default function SettingsPage({ projectId, messages, locale }: Props) {
     <div className="container mx-auto max-w-3xl pt-16 px-6 flex-grow">
       <div className="w-full p-3 flex items-center justify-between">
         <h3 className="font-bold">{messages.memberManagement}</h3>
-        <Button startContent={<Plus size={16} />} size="sm" color="primary" onClick={() => setIsDialogOpen(true)}>
+        <Button
+          startContent={<Plus size={16} />}
+          size="sm"
+          color="primary"
+          isDisabled={!context.isProjectManager(Number(projectId))}
+          onClick={() => setIsDialogOpen(true)}
+        >
           {messages.addMember}
         </Button>
       </div>
 
       <MembersTable
         members={members}
+        isDisabled={!context.isProjectManager(Number(projectId))}
         onChangeRole={handleChangeRole}
         onDeleteMember={handleDeleteMember}
         messages={messages}