[MM-54821] Convert "revoke_token_button.tsx" from Class Component to Function Component (#24943)

webapp/channels/src/components/admin_console/revoke_token_button/revoke_token_button.tsx

@@ -10,30 +10,31 @@ import {trackEvent} from 'actions/telemetry_actions.jsx';
 
 interface RevokeTokenButtonProps {
     actions: {
-        revokeUserAccessToken: (tokenId: string) => Promise<ActionFunc | ActionResult> | ActionFunc | ActionResult;
+        revokeUserAccessToken: (
+            tokenId: string
+        ) => Promise<ActionFunc | ActionResult> | ActionFunc | ActionResult;
     };
     tokenId: string;
     onError: (errorMessage: string) => void;
 }
 
-export default class RevokeTokenButton extends React.PureComponent<RevokeTokenButtonProps> {
+const RevokeTokenButton = (props: RevokeTokenButtonProps) => {
-    private handleClick = async (e: React.MouseEvent) => {
+    const handleClick = async (e: React.MouseEvent) => {
         e.preventDefault();
 
-        const response = await this.props.actions.revokeUserAccessToken(this.props.tokenId);
+        const response = await props.actions.revokeUserAccessToken(props.tokenId);
         trackEvent('system_console', 'revoke_user_access_token');
 
         if ('error' in response) {
-            this.props.onError(response.error.message);
+            props.onError(response.error.message);
         }
     };
 
-    render() {
     return (
         <button
             type='button'
             className='btn btn-danger'
-                onClick={this.handleClick}
+            onClick={handleClick}
         >
             <FormattedMessage
                 id='admin.revoke_token_button.delete'
@@ -41,5 +42,6 @@ export default class RevokeTokenButton extends React.PureComponent<RevokeTokenBu
             />
         </button>
     );
-    }
+};
-}
+
+export default React.memo(RevokeTokenButton);