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 @@ -8,10 +8,16 @@ import classNames from 'classnames'; import * as React from 'react'; +import { + removeUsersFromThread, + changeThreadMemberRoles, +} from 'lib/actions/thread-actions'; import { memberIsAdmin, memberHasAdminPowers, threadHasPermission, + removeMemberFromThread, + switchMemberAdminRoleInThread, } from 'lib/shared/thread-utils'; import { stringForUser } from 'lib/shared/user-utils'; import type { SetState } from 'lib/types/hook-types'; @@ -20,6 +26,10 @@ type ThreadInfo, threadPermissions, } from 'lib/types/thread-types'; +import { + useDispatchActionPromise, + useServerCall, +} from 'lib/utils/action-utils'; import Label from '../../../components/label.react'; import MenuItem from '../../../components/menu-item.react'; @@ -49,6 +59,41 @@ [memberInfo.id, setOpenMenu], ); + const dispatchActionPromise = useDispatchActionPromise(); + const boundRemoveUsersFromThread = useServerCall(removeUsersFromThread); + + const onClickRemoveUser = React.useCallback( + () => + removeMemberFromThread( + threadInfo, + memberInfo, + dispatchActionPromise, + boundRemoveUsersFromThread, + ), + [boundRemoveUsersFromThread, dispatchActionPromise, memberInfo, threadInfo], + ); + + const isCurrentlyAdmin = memberIsAdmin(memberInfo, threadInfo); + const boundChangeThreadMemberRoles = useServerCall(changeThreadMemberRoles); + + const onMemberAdminRoleToggled = React.useCallback( + () => + switchMemberAdminRoleInThread( + threadInfo, + memberInfo, + isCurrentlyAdmin, + dispatchActionPromise, + boundChangeThreadMemberRoles, + ), + [ + boundChangeThreadMemberRoles, + dispatchActionPromise, + isCurrentlyAdmin, + memberInfo, + threadInfo, + ], + ); + const menuItems = React.useMemo(() => { const { role } = memberInfo; if (!role) { @@ -73,11 +118,17 @@ key="remove_admin" text="Remove admin" icon={faMinusCircle} + onClick={onMemberAdminRoleToggled} />, ); } else if (canChangeRoles && memberInfo.username) { actions.push( - , + , ); } @@ -91,13 +142,14 @@ key="remove_user" text="Remove user" icon={faSignOutAlt} + onClick={onClickRemoveUser} dangerous />, ); } return actions; - }, [memberInfo, threadInfo]); + }, [memberInfo, onClickRemoveUser, onMemberAdminRoleToggled, threadInfo]); const userSettingsIcon = React.useMemo( () => ,