MM-63704 Hide priority label if message is deleted (#30718)

* hide priority label if message is deleted

* added unit test

* fix lint issue

* Update panel_body.test.tsx.snap

---------

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

webapp/channels/src/components/drafts/panel/__snapshots__/panel_body.test.tsx.snap

@@ -643,6 +643,7 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1
                             size="xs"
                           >
                             <Memo(Tag)
+                              data-testid="post-priority-label"
                               icon="alert-circle-outline"
                               size="xs"
                               text="Important"
@@ -652,10 +653,12 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1
                               <TagWrapper
                                 as="div"
                                 className="Tag Tag--info Tag--xs"
+                                data-testid="post-priority-label"
                                 uppercase={true}
                               >
                                 <div
                                   className="TagWrapper-keYggn gnIgwl Tag Tag--info Tag--xs"
+                                  data-testid="post-priority-label"
                                 >
                                   <AlertCircleOutlineIcon
                                     size={10}

webapp/channels/src/components/post/post_component.test.tsx

@@ -3,8 +3,11 @@
 
 import React from 'react';
 
+import {PostPriority} from '@mattermost/types/posts';
 import type {DeepPartial} from '@mattermost/types/utilities';
 
+import {Posts} from 'mattermost-redux/constants';
+
 import mergeObjects from 'packages/mattermost-redux/test/merge_objects';
 import {renderWithContext, screen, userEvent} from 'tests/react_testing_utils';
 import {getHistory} from 'utils/browser_history';
@@ -459,4 +462,92 @@ describe('PostComponent', () => {
             expect(screen.queryByTestId('fileAttachmentList')).not.toBeInTheDocument();
         });
     });
+
+    describe('priority labels', () => {
+        test('should show priority label for non-deleted post with priority metadata', () => {
+            const post = TestHelper.getPostMock({
+                metadata: {
+                    priority: {
+                        priority: PostPriority.URGENT,
+                    },
+                },
+            });
+            const props = {
+                ...baseProps,
+                post,
+                isPostPriorityEnabled: true,
+            };
+            renderWithContext(<PostComponent {...props}/>);
+
+            expect(screen.getByTestId('post-priority-label')).toBeInTheDocument();
+        });
+
+        test('should show priority label for non-deleted post with important priority metadata', () => {
+            const post = TestHelper.getPostMock({
+                metadata: {
+                    priority: {
+                        priority: PostPriority.IMPORTANT,
+                    },
+                },
+            });
+            const props = {
+                ...baseProps,
+                post,
+                isPostPriorityEnabled: true,
+            };
+            renderWithContext(<PostComponent {...props}/>);
+
+            expect(screen.getByTestId('post-priority-label')).toBeInTheDocument();
+        });
+
+        test('should not show priority label for deleted post with priority metadata', () => {
+            const post = TestHelper.getPostMock({
+                state: Posts.POST_DELETED as 'DELETED',
+                metadata: {
+                    priority: {
+                        priority: PostPriority.URGENT,
+                    },
+                },
+            });
+            const props = {
+                ...baseProps,
+                post,
+                isPostPriorityEnabled: true,
+            };
+            renderWithContext(<PostComponent {...props}/>);
+
+            expect(screen.queryByTestId('post-priority-label')).not.toBeInTheDocument();
+        });
+
+        test('should not show priority label for deleted post with important priority metadata', () => {
+            const post = TestHelper.getPostMock({
+                state: Posts.POST_DELETED as 'DELETED',
+                metadata: {
+                    priority: {
+                        priority: PostPriority.IMPORTANT,
+                    },
+                },
+            });
+            const props = {
+                ...baseProps,
+                post,
+                isPostPriorityEnabled: true,
+            };
+            renderWithContext(<PostComponent {...props}/>);
+
+            expect(screen.queryByTestId('post-priority-label')).not.toBeInTheDocument();
+        });
+
+        test('should not show priority label for post without priority metadata', () => {
+            const post = TestHelper.getPostMock();
+            const props = {
+                ...baseProps,
+                post,
+                isPostPriorityEnabled: true,
+            };
+            renderWithContext(<PostComponent {...props}/>);
+
+            expect(screen.queryByTestId('post-priority-label')).not.toBeInTheDocument();
+        });
+    });
 });

webapp/channels/src/components/post/post_component.tsx

@@ -505,7 +505,7 @@ function PostComponent(props: Props) {
     };
 
     let priority;
-    if (post.metadata?.priority && props.isPostPriorityEnabled) {
+    if (post.metadata?.priority && props.isPostPriorityEnabled && post.state !== Posts.POST_DELETED) {
         priority = <span className='d-flex mr-2 ml-1'><PriorityLabel priority={post.metadata.priority.priority}/></span>;
     }
 

webapp/channels/src/components/post_priority/post_priority_label.tsx

@@ -29,6 +29,7 @@ export default function PriorityLabel({
                 icon={'alert-outline'}
                 text={formatMessage({id: 'post_priority.priority.urgent', defaultMessage: 'Urgent'})}
                 uppercase={true}
+                data-testid='post-priority-label'
             />
         );
     }
@@ -41,6 +42,7 @@ export default function PriorityLabel({
                 icon={'alert-circle-outline'}
                 text={formatMessage({id: 'post_priority.priority.important', defaultMessage: 'Important'})}
                 uppercase={true}
+                data-testid='post-priority-label'
             />
         );
     }