[MM-56849] Convert `./components/post_view/failed_post_options/failed…

…_post_options.tsx` from Class Component to Function Component (mattermost#26234)

Co-authored-by: Mattermost Build <build@mattermost.com>

webapp/channels/src/components/post_view/failed_post_options/failed_post_options.tsx

@@ -1,7 +1,7 @@
 // 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 type {MouseEvent} from 'react';
 import {FormattedMessage} from 'react-intl';
 
@@ -18,46 +18,49 @@ type Props = {
     };
 };
 
-export default class FailedPostOptions extends React.PureComponent<Props> {
-    retryPost = (e: MouseEvent): void => {
+const FailedPostOptions = ({
+    post,
+    actions,
+}: Props) => {
+    const retryPost = useCallback((e: MouseEvent): void => {
         e.preventDefault();
 
-        const post = {...this.props.post};
-        Reflect.deleteProperty(post, 'id');
-        this.props.actions.createPost(post, []);
-    };
+        const postDetails = {...post};
+        Reflect.deleteProperty(postDetails, 'id');
+        actions.createPost(postDetails, []);
+    }, [actions, post]);
 
-    cancelPost = (e: MouseEvent): void => {
+    const cancelPost = useCallback((e: MouseEvent): void => {
         e.preventDefault();
 
-        this.props.actions.removePost(this.props.post);
-    };
+        actions.removePost(post);
+    }, [actions, post]);
+
+    return (
+        <span className='pending-post-actions'>
+            <a
+                className='post-retry'
+                href='#'
+                onClick={retryPost}
+            >
+                <FormattedMessage
+                    id='pending_post_actions.retry'
+                    defaultMessage='Retry'
+                />
+            </a>
+            {' - '}
+            <a
+                className='post-cancel'
+                href='#'
+                onClick={cancelPost}
+            >
+                <FormattedMessage
+                    id='pending_post_actions.cancel'
+                    defaultMessage='Cancel'
+                />
+            </a>
+        </span>
+    );
+};
 
-    render(): JSX.Element {
-        return (
-            <span className='pending-post-actions'>
-                <a
-                    className='post-retry'
-                    href='#'
-                    onClick={this.retryPost}
-                >
-                    <FormattedMessage
-                        id='pending_post_actions.retry'
-                        defaultMessage='Retry'
-                    />
-                </a>
-                {' - '}
-                <a
-                    className='post-cancel'
-                    href='#'
-                    onClick={this.cancelPost}
-                >
-                    <FormattedMessage
-                        id='pending_post_actions.cancel'
-                        defaultMessage='Cancel'
-                    />
-                </a>
-            </span>
-        );
-    }
-}
+export default memo(FailedPostOptions);