diff --git a/webapp/channels/src/components/post_view/message_attachments/message_attachment_list.tsx b/webapp/channels/src/components/post_view/message_attachments/message_attachment_list.tsx
index d5d414949e..9d59641541 100644
--- a/webapp/channels/src/components/post_view/message_attachments/message_attachment_list.tsx
+++ b/webapp/channels/src/components/post_view/message_attachments/message_attachment_list.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} from 'react';
 
 import type {MessageAttachment as MessageAttachmentType} from '@mattermost/types/message_attachments';
 import type {PostImage} from '@mattermost/types/posts';
@@ -33,32 +33,28 @@ type Props = {
     imagesMetadata?: Record<string, PostImage>;
 }
 
-export default class MessageAttachmentList extends React.PureComponent<Props> {
-    static defaultProps = {
-        imagesMetadata: {},
-    };
+const EMPTY_METADATA: Record<string, PostImage> = {};
 
-    render() {
-        const content = [] as JSX.Element[];
-        this.props.attachments.forEach((attachment, i) => {
-            content.push(
-                <MessageAttachment
-                    attachment={attachment}
-                    postId={this.props.postId}
-                    key={'att_' + i}
-                    options={this.props.options}
-                    imagesMetadata={this.props.imagesMetadata}
-                />,
-            );
-        });
+const MessageAttachmentList = ({
+    imagesMetadata = EMPTY_METADATA,
+    attachments,
+    postId,
+    options,
+}: Props) => (
+    <div
+        id={`messageAttachmentList_${postId}`}
+        className='attachment__list'
+    >
+        {attachments.map((attachment, i) => (
+            <MessageAttachment
+                attachment={attachment}
+                postId={postId}
+                key={'att_' + i}
+                options={options}
+                imagesMetadata={imagesMetadata}
+            />
+        ))}
+    </div>
+);
 
-        return (
-            <div
-                id={`messageAttachmentList_${this.props.postId}`}
-                className='attachment__list'
-            >
-                {content}
-            </div>
-        );
-    }
-}
+export default memo(MessageAttachmentList);
diff --git a/webapp/channels/src/components/post_view/post_body_additional_content/__snapshots__/post_body_additional_content.test.tsx.snap b/webapp/channels/src/components/post_view/post_body_additional_content/__snapshots__/post_body_additional_content.test.tsx.snap
index 996ef936a8..63ed6ad116 100644
--- a/webapp/channels/src/components/post_view/post_body_additional_content/__snapshots__/post_body_additional_content.test.tsx.snap
+++ b/webapp/channels/src/components/post_view/post_body_additional_content/__snapshots__/post_body_additional_content.test.tsx.snap
@@ -60,9 +60,8 @@ exports[`PostBodyAdditionalContent with a message attachment should render corre
   <span>
     some children
   </span>
-  <MessageAttachmentList
+  <Memo(MessageAttachmentList)
     attachments={Array []}
-    imagesMetadata={Object {}}
     postId="post_id_1"
   />
 </div>