diff --git a/web/modals/threads/members/member.react.js b/web/modals/threads/members/member.react.js --- a/web/modals/threads/members/member.react.js +++ b/web/modals/threads/members/member.react.js @@ -1,17 +1,28 @@ // @flow +import { + faPlusCircle, + faMinusCircle, + faSignOutAlt, +} from '@fortawesome/free-solid-svg-icons'; import classNames from 'classnames'; import * as React from 'react'; -import { memberIsAdmin, memberHasAdminPowers } from 'lib/shared/thread-utils'; +import { + memberIsAdmin, + memberHasAdminPowers, + threadHasPermission, +} from 'lib/shared/thread-utils'; import { stringForUser } from 'lib/shared/user-utils'; import type { SetState } from 'lib/types/hook-types'; import { type RelativeMemberInfo, type ThreadInfo, + threadPermissions, } from 'lib/types/thread-types'; import Label from '../../../components/label.react'; +import MenuItem from '../../../components/menu-item.react'; import Menu from '../../../components/menu.react'; import SWMansionIcon from '../../../SWMansionIcon.react'; import css from './members-modal.css'; @@ -38,7 +49,55 @@ [memberInfo.id, setOpenMenu], ); - const menuItems = []; + const menuItems = React.useMemo(() => { + const { role } = memberInfo; + if (!role) { + return []; + } + + const canRemoveMembers = threadHasPermission( + threadInfo, + threadPermissions.REMOVE_MEMBERS, + ); + const canChangeRoles = threadHasPermission( + threadInfo, + threadPermissions.CHANGE_ROLE, + ); + + const actions = []; + + const isAdmin = memberIsAdmin(memberInfo, threadInfo); + if (canChangeRoles && memberInfo.username && isAdmin) { + actions.push( + , + ); + } else if (canChangeRoles && memberInfo.username) { + actions.push( + , + ); + } + + if ( + canRemoveMembers && + !memberInfo.isViewer && + (canChangeRoles || threadInfo.roles[role]?.isDefault) + ) { + actions.push( + , + ); + } + + return actions; + }, [memberInfo, threadInfo]); const userSettingsIcon = React.useMemo( () => ,