diff --git a/webapp/channels/src/components/admin_console/system_user_detail/team_list/team_list_dropdown.tsx b/webapp/channels/src/components/admin_console/system_user_detail/team_list/team_list_dropdown.tsx
index bdfa48180c..5971466fd5 100644
--- a/webapp/channels/src/components/admin_console/system_user_detail/team_list/team_list_dropdown.tsx
+++ b/webapp/channels/src/components/admin_console/system_user_detail/team_list/team_list_dropdown.tsx
@@ -1,14 +1,13 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import React from 'react';
+import React, {memo, useCallback} from 'react';
+import {useIntl} from 'react-intl';
 
 import EllipsisHorizontalIcon from 'components/widgets/icons/ellipsis_h_icon';
 import Menu from 'components/widgets/menu/menu';
 import MenuWrapper from 'components/widgets/menu/menu_wrapper';
 
-import {localizeMessage} from 'utils/utils';
-
 import type {TeamWithMembership} from './types';
 
 type Props = {
@@ -19,66 +18,63 @@ type Props = {
     isDisabled?: boolean;
 }
 
-type State = {
-    serverError: string | null;
-}
+const TeamListDropdown = ({
+    team,
+    doRemoveUserFromTeam,
+    doMakeUserTeamAdmin,
+    doMakeUserTeamMember,
+    isDisabled,
+}: Props) => {
+    const intl = useIntl();
 
-export default class TeamListDropdown extends React.PureComponent<Props, State> {
-    public constructor(props: Props) {
-        super(props);
+    const isAdmin = team.scheme_admin;
+    const isMember = team.scheme_user && !team.scheme_admin;
+    const isGuest = team.scheme_guest;
+    const showMakeTeamAdmin = !isAdmin && !isGuest;
+    const showMakeTeamMember = !isMember && !isGuest;
 
-        this.state = {
-            serverError: null,
-        };
-    }
+    const makeTeamAdminOnClick = useCallback(() => doMakeUserTeamAdmin(team.id), [team.id, doMakeUserTeamAdmin]);
+    const makeTeamMemberOnClick = useCallback(() => doMakeUserTeamMember(team.id), [team.id, doMakeUserTeamMember]);
+    const removeUserTeamOnClick = useCallback(() => doRemoveUserFromTeam(team.id), [team.id, doRemoveUserFromTeam]);
 
-    public render(): JSX.Element {
-        const {team} = this.props;
-        const isAdmin = team.scheme_admin;
-        const isMember = team.scheme_user && !team.scheme_admin;
-        const isGuest = team.scheme_guest;
-        const showMakeTeamAdmin = !isAdmin && !isGuest;
-        const showMakeTeamMember = !isMember && !isGuest;
-
-        return (
-            <MenuWrapper
-                isDisabled={this.props.isDisabled}
+    return (
+        <MenuWrapper isDisabled={isDisabled}>
+            <button
+                type='button'
+                id={`teamListDropdown_${team.id}`}
+                className='dropdown-toggle theme color--link style--none'
+                aria-expanded='true'
             >
-                <button
-                    type='button'
-                    id={`teamListDropdown_${team.id}`}
-                    className='dropdown-toggle theme color--link style--none'
-                    aria-expanded='true'
+                <span className='SystemUserDetail__actions-menu-icon'><EllipsisHorizontalIcon/></span>
+            </button>
+            <div>
+                <Menu
+                    openLeft={true}
+                    openUp={false}
+                    ariaLabel={intl.formatMessage({id: 'team_members_dropdown.menuAriaLabel', defaultMessage: 'Change the role of a team member'})}
                 >
-                    <span className='SystemUserDetail__actions-menu-icon'><EllipsisHorizontalIcon/></span>
-                </button>
-                <div>
-                    <Menu
-                        openLeft={true}
-                        openUp={false}
-                        ariaLabel={localizeMessage('team_members_dropdown.menuAriaLabel', 'Change the role of a team member')}
-                    >
-                        <Menu.ItemAction
-                            id='makeTeamAdmin'
-                            show={showMakeTeamAdmin}
-                            onClick={() => this.props.doMakeUserTeamAdmin(team.id)}
-                            text={localizeMessage('team_members_dropdown.makeAdmin', 'Make Team Admin')}
-                        />
-                        <Menu.ItemAction
-                            show={showMakeTeamMember}
-                            onClick={() => this.props.doMakeUserTeamMember(team.id)}
-                            text={localizeMessage('team_members_dropdown.makeMember', 'Make Team Member')}
-                        />
-                        <Menu.ItemAction
-                            id='removeFromTeam'
-                            show={true}
-                            onClick={() => this.props.doRemoveUserFromTeam(team.id)}
-                            text={localizeMessage('team_members_dropdown.leave_team', 'Remove from Team')}
-                            buttonClass='SystemUserDetail__action-remove-team'
-                        />
-                    </Menu>
-                </div>
-            </MenuWrapper>
-        );
-    }
-}
+                    <Menu.ItemAction
+                        id='makeTeamAdmin'
+                        show={showMakeTeamAdmin}
+                        onClick={makeTeamAdminOnClick}
+                        text={intl.formatMessage({id: 'team_members_dropdown.makeAdmin', defaultMessage: 'Make Team Admin'})}
+                    />
+                    <Menu.ItemAction
+                        show={showMakeTeamMember}
+                        onClick={makeTeamMemberOnClick}
+                        text={intl.formatMessage({id: 'team_members_dropdown.makeMember', defaultMessage: 'Make Team Member'})}
+                    />
+                    <Menu.ItemAction
+                        id='removeFromTeam'
+                        show={true}
+                        onClick={removeUserTeamOnClick}
+                        text={intl.formatMessage({id: 'team_members_dropdown.leave_team', defaultMessage: 'Remove from Team'})}
+                        buttonClass='SystemUserDetail__action-remove-team'
+                    />
+                </Menu>
+            </div>
+        </MenuWrapper>
+    );
+};
+
+export default memo(TeamListDropdown);