diff --git a/webapp/channels/src/components/post/post_component.tsx b/webapp/channels/src/components/post/post_component.tsx index 15277ed73d..23c0e2ec36 100644 --- a/webapp/channels/src/components/post/post_component.tsx +++ b/webapp/channels/src/components/post/post_component.tsx @@ -407,6 +407,7 @@ function PostComponent(props: Props) { ); } diff --git a/webapp/channels/src/components/post_view/commented_on/commented_on.test.tsx b/webapp/channels/src/components/post_view/commented_on/commented_on.test.tsx index 4dbd705453..47cf319bb7 100644 --- a/webapp/channels/src/components/post_view/commented_on/commented_on.test.tsx +++ b/webapp/channels/src/components/post_view/commented_on/commented_on.test.tsx @@ -282,6 +282,91 @@ describe('components/post_view/CommentedOn', () => { expect(onCommentClick).toHaveBeenCalledTimes(1); }); + + test("should render the root post's overwritten username", () => { + const webhookPost = TestHelper.getPostMock({ + id: 'webhook_post_id', + user_id: user1.id, + message: 'text message', + props: { + from_webhook: 'true', + override_username: 'overridden_username', + }, + }); + + const post1 = TestHelper.getPostMock({ + id: 'post1', + user_id: user1.id, + message: 'text message', + root_id: webhookPost.id, + }); + + renderWithContext( + , + { + entities: { + posts: { + posts: { + post1, + webhook_post_id: webhookPost, + }, + }, + users: { + profiles: { + user1, + }, + }, + }, + }, + ); + + expect(screen.getByText(textInChildren("Commented on overridden_username's message: text message"))).toBeInTheDocument(); + }); + + test("should not render the root post's overwritten username if post is not from webhook", () => { + const webhookPost = TestHelper.getPostMock({ + id: 'webhook_post_id', + user_id: user1.id, + message: 'text message', + props: { + override_username: 'overridden_username', + }, + }); + + const post1 = TestHelper.getPostMock({ + id: 'post1', + user_id: user1.id, + message: 'text message', + root_id: webhookPost.id, + }); + + renderWithContext( + , + { + entities: { + posts: { + posts: { + post1, + webhook_post_id: webhookPost, + }, + }, + users: { + profiles: { + user1, + }, + }, + }, + }, + ); + + expect(screen.getByText(textInChildren("Commented on some-user's message: text message"))).toBeInTheDocument(); + }); }); function textInChildren(matchedText: string) { diff --git a/webapp/channels/src/components/post_view/commented_on/commented_on.tsx b/webapp/channels/src/components/post_view/commented_on/commented_on.tsx index cb66fcbd64..6aec026f8a 100644 --- a/webapp/channels/src/components/post_view/commented_on/commented_on.tsx +++ b/webapp/channels/src/components/post_view/commented_on/commented_on.tsx @@ -1,28 +1,46 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import React, {memo} from 'react'; +import React, {memo, useMemo} from 'react'; import {FormattedMessage} from 'react-intl'; import {isMessageAttachmentArray} from '@mattermost/types/message_attachments'; +import {ensureString} from 'mattermost-redux/utils/post_utils'; + import {usePost} from 'components/common/hooks/usePost'; import {useUser} from 'components/common/hooks/useUser'; import CommentedOnFilesMessage from 'components/post_view/commented_on_files_message'; import UserProfile from 'components/user_profile'; import {stripMarkdown} from 'utils/markdown'; +import {isFromWebhook} from 'utils/post_utils'; import * as Utils from 'utils/utils'; type Props = { onCommentClick?: React.EventHandler; rootId: string; + enablePostUsernameOverride?: boolean; }; -function CommentedOn({onCommentClick, rootId}: Props) { +function CommentedOn({onCommentClick, rootId, enablePostUsernameOverride}: Props) { const rootPost = usePost(rootId); const rootPostUser = useUser(rootPost?.user_id ?? ''); + const rootPostOverriddenUsername = useMemo((): string => { + if (!rootPost) { + return ''; + } + + const rootPostIsFromWebhook = isFromWebhook(rootPost); + if (!rootPostIsFromWebhook) { + return ''; + } + + const propOverrideName = ensureString(rootPost?.props.override_username); + return (propOverrideName && enablePostUsernameOverride ? propOverrideName : ''); + }, [enablePostUsernameOverride, rootPost]); + let message: React.ReactNode = ''; if (!rootPost) { message = ( @@ -46,6 +64,7 @@ function CommentedOn({onCommentClick, rootId}: Props) { const parentUserProfile = ( );