From 1f95a8f52b4e480ac627a1328ae4411bf4f0477e Mon Sep 17 00:00:00 2001 From: Harrison Healey Date: Thu, 10 Aug 2023 15:22:48 -0400 Subject: [PATCH] MM-50953 Post textbox cleanup (#23971) * Remove unused code around scrollbarWidth * MM-50953 Remove unused code for popover at mentions * Add tests for messageHtmlToComponent wrapper --- .../__snapshots__/textbox.test.tsx.snap | 9 ----- .../advanced_text_editor.tsx | 17 +-------- .../__snapshots__/at_mention.test.tsx.snap | 7 ---- .../src/components/at_mention/at_mention.tsx | 3 -- .../at_mention/at_mention_group.tsx | 6 --- .../channel_info_rhs/about_area_dm.tsx | 1 - .../channel_invite_modal.test.tsx.snap | 1 - .../components/channel_members_rhs/member.tsx | 2 - .../__snapshots__/panel_body.test.tsx.snap | 16 -------- .../src/components/markdown/markdown.tsx | 8 +--- .../post_markdown/post_markdown.test.tsx | 1 - .../post_markdown/post_markdown.tsx | 7 ---- .../post_profile_picture.tsx | 3 -- .../post_message_view.test.tsx.snap | 5 --- .../post_message_view/post_message_view.tsx | 1 - .../profile_picture.test.tsx.snap | 1 - .../profile_picture/profile_picture.test.tsx | 2 - .../profile_picture/profile_picture.tsx | 3 -- .../profile_popover.test.tsx.snap | 1 - .../profile_popover/profile_popover.tsx | 8 +--- .../sidebar_direct_channel.test.tsx.snap | 3 -- .../suggestion_box/suggestion_box.jsx | 38 ------------------- .../terms_of_service/terms_of_service.tsx | 2 +- .../channels/src/components/textbox.test.tsx | 2 - .../src/components/textbox/textbox.tsx | 7 ---- .../__snapshots__/user_profile.test.tsx.snap | 4 -- .../components/user_profile/user_profile.tsx | 1 - webapp/channels/src/plugins/export.js | 17 ++++++++- webapp/channels/src/plugins/export.test.js | 38 +++++++++++++++++++ .../__snapshots__/post_type.test.jsx.snap | 1 - .../message_html_to_component.test.jsx.snap | 4 -- .../src/utils/message_html_to_component.jsx | 3 +- .../utils/message_html_to_component.test.jsx | 18 ++++----- 33 files changed, 69 insertions(+), 171 deletions(-) create mode 100644 webapp/channels/src/plugins/export.test.js diff --git a/webapp/channels/src/components/__snapshots__/textbox.test.tsx.snap b/webapp/channels/src/components/__snapshots__/textbox.test.tsx.snap index 900f259b54..6d485b9b5c 100644 --- a/webapp/channels/src/components/__snapshots__/textbox.test.tsx.snap +++ b/webapp/channels/src/components/__snapshots__/textbox.test.tsx.snap @@ -16,10 +16,8 @@ exports[`components/TextBox should match snapshot with additional, optional prop "render": [Function], } } - isRHS={true} listComponent={[Function]} listPosition="top" - listenForMentionKeyClick={true} onBlur={[Function]} onChange={[Function]} onComposition={[Function]} @@ -109,7 +107,6 @@ exports[`components/TextBox should match snapshot with additional, optional prop "hideUtilities": true, } } - isRHS={true} mentionKeys={Array []} message="some test text" /> @@ -132,9 +129,7 @@ exports[`components/TextBox should match snapshot with required props 1`] = ` "render": [Function], } } - isRHS={false} listComponent={[Function]} - listenForMentionKeyClick={false} onBlur={[Function]} onChange={[Function]} onKeyDown={[Function]} @@ -225,9 +220,7 @@ exports[`components/TextBox should throw error when new property is too long 1`] "render": [Function], } } - isRHS={false} listComponent={[Function]} - listenForMentionKeyClick={false} onBlur={[Function]} onChange={[Function]} onKeyDown={[Function]} @@ -318,9 +311,7 @@ exports[`components/TextBox should throw error when value is too long 1`] = ` "render": [Function], } } - isRHS={false} listComponent={[Function]} - listenForMentionKeyClick={false} onBlur={[Function]} onChange={[Function]} onKeyDown={[Function]} diff --git a/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.tsx b/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.tsx index 2178fba781..9ab639b7eb 100644 --- a/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.tsx +++ b/webapp/channels/src/components/advanced_text_editor/advanced_text_editor.tsx @@ -1,7 +1,7 @@ // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. // See LICENSE.txt for license information. -import React, {CSSProperties, useCallback, useEffect, useRef, useState} from 'react'; +import React, {useCallback, useEffect, useRef, useState} from 'react'; import classNames from 'classnames'; import {FormattedMessage, useIntl} from 'react-intl'; import {EmoticonHappyOutlineIcon} from '@mattermost/compass-icons/components'; @@ -167,7 +167,6 @@ const AdvanceTextEditor = ({ const editorActionsRef = useRef(null); const editorBodyRef = useRef(null); - const [scrollbarWidth, setScrollbarWidth] = useState(0); const [renderScrollbar, setRenderScrollbar] = useState(false); const [showFormattingSpacer, setShowFormattingSpacer] = useState(shouldShowPreview); const [keepEditorInFocus, setKeepEditorInFocus] = useState(false); @@ -176,13 +175,7 @@ const AdvanceTextEditor = ({ const handleHeightChange = useCallback((height: number, maxHeight: number) => { setRenderScrollbar(height > maxHeight); - - window.requestAnimationFrame(() => { - if (textboxRef.current) { - setScrollbarWidth(Utils.scrollbarWidth(textboxRef.current.getInputBox())); - } - }); - }, [textboxRef]); + }, []); const handleShowFormat = useCallback(() => { setShowPreview(!shouldShowPreview); @@ -429,11 +422,6 @@ const AdvanceTextEditor = ({ 'AdvancedTextEditor__attachment-disabled': !canUploadFiles, scroll: renderScrollbar, })} - style={ - renderScrollbar && scrollbarWidth ? ({ - '--detected-scrollbar-width': `${scrollbarWidth}px`, - } as CSSProperties) : undefined - } >
@@ -97,7 +96,6 @@ exports[`components/AtMention should match snapshot when mentioning user 1`] = ` className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/abc2/image" userId="abc2" /> @@ -130,7 +128,6 @@ exports[`components/AtMention should match snapshot when mentioning user contain className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/abc3/image" userId="abc3" /> @@ -164,7 +161,6 @@ exports[`components/AtMention should match snapshot when mentioning user contain className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/abc3/image" userId="abc3" /> @@ -197,7 +193,6 @@ exports[`components/AtMention should match snapshot when mentioning user followe className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/abc2/image" userId="abc2" /> @@ -231,7 +226,6 @@ exports[`components/AtMention should match snapshot when mentioning user with di className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/abc2/image" userId="abc2" /> @@ -264,7 +258,6 @@ exports[`components/AtMention should match snapshot when mentioning user with mi className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/abc2/image" userId="abc2" /> diff --git a/webapp/channels/src/components/at_mention/at_mention.tsx b/webapp/channels/src/components/at_mention/at_mention.tsx index e8e51ca423..530a3d1413 100644 --- a/webapp/channels/src/components/at_mention/at_mention.tsx +++ b/webapp/channels/src/components/at_mention/at_mention.tsx @@ -30,7 +30,6 @@ type Props = { hasMention?: boolean; disableHighlight?: boolean; disableGroupHighlight?: boolean; - isRHS?: boolean; } type State = { @@ -43,7 +42,6 @@ export default class AtMention extends React.PureComponent { buttonRef: React.RefObject; static defaultProps: Partial = { - isRHS: false, hasMention: false, disableHighlight: false, disableGroupHighlight: false, @@ -124,7 +122,6 @@ export default class AtMention extends React.PureComponent { className='user-profile-popover' userId={user.id} src={Client4.getProfilePictureUrl(user.id, user.last_picture_update)} - isRHS={this.props.isRHS} hasMention={this.props.hasMention} hide={this.hideOverlay} channelId={this.props.channelId} diff --git a/webapp/channels/src/components/at_mention/at_mention_group.tsx b/webapp/channels/src/components/at_mention/at_mention_group.tsx index fa1fd3abd5..c51ca2006a 100644 --- a/webapp/channels/src/components/at_mention/at_mention_group.tsx +++ b/webapp/channels/src/components/at_mention/at_mention_group.tsx @@ -27,10 +27,6 @@ type Props = { */ group: Group; - /** - * Props to be passed through from AtMention to ProfilePopover - */ - isRHS?: boolean; channelId?: string; hasMention?: boolean; } @@ -38,7 +34,6 @@ type Props = { const AtMentionGroup = (props: Props) => { const { group, - isRHS, channelId, hasMention, } = props; @@ -137,7 +132,6 @@ const AtMentionGroup = (props: Props) => { className='user-profile-popover' userId={showUser.id} src={Client4.getProfilePictureUrl(showUser.id, showUser.last_picture_update)} - isRHS={isRHS} channelId={channelId} hasMention={hasMention} hide={hideUserOverlay} diff --git a/webapp/channels/src/components/channel_info_rhs/about_area_dm.tsx b/webapp/channels/src/components/channel_info_rhs/about_area_dm.tsx index d554079d7e..fc047f33c7 100644 --- a/webapp/channels/src/components/channel_info_rhs/about_area_dm.tsx +++ b/webapp/channels/src/components/channel_info_rhs/about_area_dm.tsx @@ -94,7 +94,6 @@ const AboutAreaDM = ({channel, dmUser, actions}: Props) => { src={Client4.getProfilePictureUrl(dmUser.user.id, dmUser.user.last_picture_update)} isBot={dmUser.user.is_bot} status={dmUser.status ? dmUser.status : undefined} - isRHS={true} username={dmUser.display_name} userId={dmUser.user.id} channelId={channel.id} diff --git a/webapp/channels/src/components/channel_invite_modal/__snapshots__/channel_invite_modal.test.tsx.snap b/webapp/channels/src/components/channel_invite_modal/__snapshots__/channel_invite_modal.test.tsx.snap index 06d8fb3d6e..7fdfc7f25a 100644 --- a/webapp/channels/src/components/channel_invite_modal/__snapshots__/channel_invite_modal.test.tsx.snap +++ b/webapp/channels/src/components/channel_invite_modal/__snapshots__/channel_invite_modal.test.tsx.snap @@ -235,7 +235,6 @@ exports[`components/channel_invite_modal should match snapshot for channel_invit } @@ -152,7 +151,6 @@ const Member = ({className, channel, member, index, totalUsers, editing, actions @@ -110,7 +108,6 @@ exports[`components/drafts/panel/panel_body should have called handleFormattedTe "wrapRichTextChunksInFragment": undefined, } } - isRHS={false} src="/api/v4/users/user_id/image?_=0" userId="user_id" /> @@ -244,7 +241,6 @@ exports[`components/drafts/panel/panel_body should have called handleFormattedTe enableFormatting={true} hasImageProxy={false} imagesMetadata={Object {}} - isRHS={false} managedResourcePaths={Array []} mentionKeys={Array []} message="message" @@ -314,7 +310,6 @@ exports[`components/drafts/panel/panel_body should match snapshot 1`] = ` channelId="channel_id" hasMention={false} isEmoji={false} - isRHS={false} popoverPlacement="right" size="md" src="/api/v4/users/user_id/image?_=0" @@ -331,7 +326,6 @@ exports[`components/drafts/panel/panel_body should match snapshot 1`] = ` className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/user_id/image?_=0" userId="user_id" /> @@ -391,7 +385,6 @@ exports[`components/drafts/panel/panel_body should match snapshot 1`] = ` "wrapRichTextChunksInFragment": undefined, } } - isRHS={false} src="/api/v4/users/user_id/image?_=0" userId="user_id" /> @@ -525,7 +518,6 @@ exports[`components/drafts/panel/panel_body should match snapshot 1`] = ` enableFormatting={true} hasImageProxy={false} imagesMetadata={Object {}} - isRHS={false} managedResourcePaths={Array []} mentionKeys={Array []} message="message" @@ -601,7 +593,6 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1 channelId="channel_id" hasMention={false} isEmoji={false} - isRHS={false} popoverPlacement="right" size="md" src="/api/v4/users/user_id/image?_=0" @@ -618,7 +609,6 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1 className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/user_id/image?_=0" userId="user_id" /> @@ -678,7 +668,6 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1 "wrapRichTextChunksInFragment": undefined, } } - isRHS={false} src="/api/v4/users/user_id/image?_=0" userId="user_id" /> @@ -874,7 +863,6 @@ exports[`components/drafts/panel/panel_body should match snapshot for priority 1 enableFormatting={true} hasImageProxy={false} imagesMetadata={Object {}} - isRHS={false} managedResourcePaths={Array []} mentionKeys={Array []} message="message" @@ -950,7 +938,6 @@ exports[`components/drafts/panel/panel_body should match snapshot for requested_ channelId="channel_id" hasMention={false} isEmoji={false} - isRHS={false} popoverPlacement="right" size="md" src="/api/v4/users/user_id/image?_=0" @@ -967,7 +954,6 @@ exports[`components/drafts/panel/panel_body should match snapshot for requested_ className="user-profile-popover" hasMention={false} hide={[Function]} - isRHS={false} src="/api/v4/users/user_id/image?_=0" userId="user_id" /> @@ -1027,7 +1013,6 @@ exports[`components/drafts/panel/panel_body should match snapshot for requested_ "wrapRichTextChunksInFragment": undefined, } } - isRHS={false} src="/api/v4/users/user_id/image?_=0" userId="user_id" /> @@ -1302,7 +1287,6 @@ exports[`components/drafts/panel/panel_body should match snapshot for requested_ enableFormatting={true} hasImageProxy={false} imagesMetadata={Object {}} - isRHS={false} managedResourcePaths={Array []} mentionKeys={Array []} message="message" diff --git a/webapp/channels/src/components/markdown/markdown.tsx b/webapp/channels/src/components/markdown/markdown.tsx index 57f8115a3a..201fecc35c 100644 --- a/webapp/channels/src/components/markdown/markdown.tsx +++ b/webapp/channels/src/components/markdown/markdown.tsx @@ -29,11 +29,6 @@ type Props = { */ enableFormatting?: boolean; - /* - * Whether or not this text is part of the RHS - */ - isRHS?: boolean; - /* * An array of paths on the server that are managed by another server */ @@ -126,7 +121,6 @@ type Props = { export default class Markdown extends React.PureComponent { static defaultProps: Partial = { options: {}, - isRHS: false, proxyImages: true, imagesMetadata: {}, postId: '', // Needed to avoid proptypes console errors for cases like channel header, which doesn't have a proper value @@ -163,7 +157,7 @@ export default class Markdown extends React.PureComponent { const htmlFormattedText = formatText(message, options, this.props.emojiMap); - return messageHtmlToComponent(htmlFormattedText, this.props.isRHS, { + return messageHtmlToComponent(htmlFormattedText, { imageProps: this.props.imageProps, imagesMetadata: this.props.imagesMetadata, hasPluginTooltips: this.props.hasPluginTooltips, diff --git a/webapp/channels/src/components/post_markdown/post_markdown.test.tsx b/webapp/channels/src/components/post_markdown/post_markdown.test.tsx index de8381a97f..091c297109 100644 --- a/webapp/channels/src/components/post_markdown/post_markdown.test.tsx +++ b/webapp/channels/src/components/post_markdown/post_markdown.test.tsx @@ -16,7 +16,6 @@ import PostMarkdown from './post_markdown'; describe('components/PostMarkdown', () => { const baseProps = { imageProps: {}, - isRHS: false, message: 'message', post: TestHelper.getPostMock(), mentionKeys: [{key: 'a'}, {key: 'b'}, {key: 'c'}], diff --git a/webapp/channels/src/components/post_markdown/post_markdown.tsx b/webapp/channels/src/components/post_markdown/post_markdown.tsx index 4826b18b0c..35d96c8d60 100644 --- a/webapp/channels/src/components/post_markdown/post_markdown.tsx +++ b/webapp/channels/src/components/post_markdown/post_markdown.tsx @@ -24,11 +24,6 @@ type Props = { */ imageProps?: Record; - /* - * Whether or not this text is part of the RHS - */ - isRHS?: boolean; - /* * The post text to be rendered */ @@ -72,7 +67,6 @@ type Props = { export default class PostMarkdown extends React.PureComponent { static defaultProps = { - isRHS: false, pluginHooks: [], options: {}, showPostEditedIndicator: true, @@ -135,7 +129,6 @@ export default class PostMarkdown extends React.PureComponent { return ( { availabilityStatusOnPosts, compactDisplay, isBusy, - isRHS, post, user, isBot, @@ -110,7 +108,6 @@ export default class PostProfilePicture extends React.PureComponent { { diff --git a/webapp/channels/src/components/profile_picture/profile_picture.test.tsx b/webapp/channels/src/components/profile_picture/profile_picture.test.tsx index 3323037539..8bb1f12ceb 100644 --- a/webapp/channels/src/components/profile_picture/profile_picture.test.tsx +++ b/webapp/channels/src/components/profile_picture/profile_picture.test.tsx @@ -42,7 +42,6 @@ describe('components/ProfilePicture', () => { const props: Props = { ...baseProps, size: 'xl', - isRHS: true, hasMention: true, }; const wrapper = shallow( @@ -69,7 +68,6 @@ describe('components/ProfilePicture', () => { ...baseProps, username: 'username', size: 'xs', - isRHS: true, hasMention: true, }; const wrapper = shallow( diff --git a/webapp/channels/src/components/profile_picture/profile_picture.tsx b/webapp/channels/src/components/profile_picture/profile_picture.tsx index fa8a7735f2..0746cd6cd4 100644 --- a/webapp/channels/src/components/profile_picture/profile_picture.tsx +++ b/webapp/channels/src/components/profile_picture/profile_picture.tsx @@ -20,7 +20,6 @@ type Props = { hasMention?: boolean; isBusy?: boolean; isEmoji?: boolean; - isRHS?: boolean; profileSrc?: string; size?: ComponentProps['size']; src: string; @@ -42,7 +41,6 @@ type Props = { export default class ProfilePicture extends React.PureComponent { public static defaultProps = { size: 'md', - isRHS: false, isEmoji: false, hasMention: false, wrapperClass: '', @@ -81,7 +79,6 @@ export default class ProfilePicture extends React.PureComponent { src={profileSrc} isBusy={this.props.isBusy} hide={this.hideProfilePopover} - isRHS={this.props.isRHS} channelId={this.props.channelId} hasMention={this.props.hasMention} overwriteIcon={this.props.overwriteIcon} diff --git a/webapp/channels/src/components/profile_popover/__snapshots__/profile_popover.test.tsx.snap b/webapp/channels/src/components/profile_popover/__snapshots__/profile_popover.test.tsx.snap index d6a92da00c..abc34a9dbf 100644 --- a/webapp/channels/src/components/profile_popover/__snapshots__/profile_popover.test.tsx.snap +++ b/webapp/channels/src/components/profile_popover/__snapshots__/profile_popover.test.tsx.snap @@ -3566,7 +3566,6 @@ exports[`components/ProfilePopover should show the start call button when isCall isCustomStatusExpired={false} isInCurrentTeam={true} isMobileView={false} - isRHS={false} isTeamAdmin={false} lastActivityTimestamp={1632146562846} src="src" diff --git a/webapp/channels/src/components/profile_popover/profile_popover.tsx b/webapp/channels/src/components/profile_popover/profile_popover.tsx index bfa700c4b7..c1f1ca8c22 100644 --- a/webapp/channels/src/components/profile_popover/profile_popover.tsx +++ b/webapp/channels/src/components/profile_popover/profile_popover.tsx @@ -94,11 +94,6 @@ export interface ProfilePopoverProps extends Omit void; - /** - * Set to true if the popover was opened from the right-hand - * sidebar (comment thread, search results, etc.) - */ - isRHS?: boolean; isBusy?: boolean; isMobileView: boolean; @@ -211,7 +206,6 @@ class ProfilePopover extends React.PureComponent = ['user', 'userId', 'channelId', 'src', 'status', 'hideStatus', 'isBusy', - 'hide', 'isRHS', 'hasMention', 'enableTimezone', 'currentUserId', 'currentTeamId', 'teamUrl', 'actions', 'isTeamAdmin', + 'hide', 'hasMention', 'enableTimezone', 'currentUserId', 'currentTeamId', 'teamUrl', 'actions', 'isTeamAdmin', 'isChannelAdmin', 'canManageAnyChannelMembersInCurrentTeam', 'intl']; const popoverProps: React.ComponentProps = Utils.deleteKeysFromObject({...this.props}, keysToBeRemoved); diff --git a/webapp/channels/src/components/sidebar/sidebar_channel/sidebar_direct_channel/__snapshots__/sidebar_direct_channel.test.tsx.snap b/webapp/channels/src/components/sidebar/sidebar_channel/sidebar_direct_channel/__snapshots__/sidebar_direct_channel.test.tsx.snap index 47e1444aca..974277850d 100644 --- a/webapp/channels/src/components/sidebar/sidebar_channel/sidebar_direct_channel/__snapshots__/sidebar_direct_channel.test.tsx.snap +++ b/webapp/channels/src/components/sidebar/sidebar_channel/sidebar_direct_channel/__snapshots__/sidebar_direct_channel.test.tsx.snap @@ -26,7 +26,6 @@ exports[`components/sidebar/sidebar_channel/sidebar_direct_channel should match { - if (this.props.isRHS !== isRHS) { - return; - } - - let insertText = '@' + mentionKey; - - // if the current text does not end with a whitespace, then insert a space - if (this.props.value && (/[^\s]$/).test(this.props.value)) { - insertText = ' ' + insertText; - } - - this.addTextAtCaret(insertText, ''); - }; - getTextbox = () => { if (!this.inputRef.current) { return null; @@ -792,7 +756,6 @@ export default class SuggestionBox extends React.PureComponent { Reflect.deleteProperty(props, 'onComposition'); Reflect.deleteProperty(props, 'onItemSelected'); Reflect.deleteProperty(props, 'completeOnTab'); - Reflect.deleteProperty(props, 'isRHS'); Reflect.deleteProperty(props, 'requiredCharacters'); Reflect.deleteProperty(props, 'openOnFocus'); Reflect.deleteProperty(props, 'openWhenEmpty'); @@ -802,7 +765,6 @@ export default class SuggestionBox extends React.PureComponent { Reflect.deleteProperty(props, 'replaceAllInputOnSelect'); Reflect.deleteProperty(props, 'renderDividers'); Reflect.deleteProperty(props, 'contextId'); - Reflect.deleteProperty(props, 'listenForMentionKeyClick'); Reflect.deleteProperty(props, 'forceSuggestionsWhenBlur'); Reflect.deleteProperty(props, 'onSuggestionsReceived'); Reflect.deleteProperty(props, 'actions'); diff --git a/webapp/channels/src/components/terms_of_service/terms_of_service.tsx b/webapp/channels/src/components/terms_of_service/terms_of_service.tsx index 315808a316..7b87bb2e5b 100644 --- a/webapp/channels/src/components/terms_of_service/terms_of_service.tsx +++ b/webapp/channels/src/components/terms_of_service/terms_of_service.tsx @@ -188,7 +188,7 @@ export default class TermsOfService extends React.PureComponent - {messageHtmlToComponent(this.formattedText(this.state.customTermsOfServiceText), false, {mentions: false})} + {messageHtmlToComponent(this.formattedText(this.state.customTermsOfServiceText), {mentions: false})}
diff --git a/webapp/channels/src/components/textbox.test.tsx b/webapp/channels/src/components/textbox.test.tsx index cddc1609d1..5176983fc4 100644 --- a/webapp/channels/src/components/textbox.test.tsx +++ b/webapp/channels/src/components/textbox.test.tsx @@ -71,10 +71,8 @@ describe('components/TextBox', () => { handlePostError={() => {}} suggestionListPosition='top' emojiEnabled={true} - isRHS={true} disabled={true} badConnection={true} - listenForMentionKeyClick={true} preview={true} openWhenEmpty={true} />, diff --git a/webapp/channels/src/components/textbox/textbox.tsx b/webapp/channels/src/components/textbox/textbox.tsx index 641c60b656..d0c9cbc62e 100644 --- a/webapp/channels/src/components/textbox/textbox.tsx +++ b/webapp/channels/src/components/textbox/textbox.tsx @@ -51,11 +51,9 @@ export type Props = { suggestionListPosition?: React.ComponentProps['position']; alignWithTextbox?: boolean; emojiEnabled?: boolean; - isRHS?: boolean; characterLimit: number; disabled?: boolean; badConnection?: boolean; - listenForMentionKeyClick?: boolean; currentUserId: string; currentTeamId: string; preview?: boolean; @@ -84,8 +82,6 @@ export default class Textbox extends React.PureComponent { static defaultProps = { supportsCommands: true, - isRHS: false, - listenForMentionKeyClick: false, inputComponent: AutosizeTextarea, suggestionList: SuggestionList, }; @@ -292,7 +288,6 @@ export default class Textbox extends React.PureComponent { onBlur={this.handleBlur} > { channelId={this.props.channelId} value={this.props.value} renderDividers={ALL} - isRHS={this.props.isRHS} disabled={this.props.disabled} contextId={this.props.channelId} - listenForMentionKeyClick={this.props.listenForMentionKeyClick} openWhenEmpty={this.props.openWhenEmpty} alignWithTextbox={this.props.alignWithTextbox} /> diff --git a/webapp/channels/src/components/user_profile/__snapshots__/user_profile.test.tsx.snap b/webapp/channels/src/components/user_profile/__snapshots__/user_profile.test.tsx.snap index 9fa88cf590..6c737d8f40 100644 --- a/webapp/channels/src/components/user_profile/__snapshots__/user_profile.test.tsx.snap +++ b/webapp/channels/src/components/user_profile/__snapshots__/user_profile.test.tsx.snap @@ -11,7 +11,6 @@ exports[`components/UserProfile should match snapshot 1`] = ` hide={[Function]} hideStatus={false} isBusy={false} - isRHS={false} overwriteName="" src="/api/v4/users/undefined/image?_=0" userId="user_id" @@ -46,7 +45,6 @@ exports[`components/UserProfile should match snapshot, when displayUsername is e hide={[Function]} hideStatus={false} isBusy={false} - isRHS={false} overwriteName="" src="/api/v4/users/undefined/image?_=0" userId="user_id" @@ -89,7 +87,6 @@ exports[`components/UserProfile should match snapshot, when user is shared 1`] = hide={[Function]} hideStatus={false} isBusy={false} - isRHS={false} overwriteName="" src="/api/v4/users/undefined/image?_=0" userId="user_id" @@ -128,7 +125,6 @@ exports[`components/UserProfile should match snapshot, with colorization 1`] = ` hide={[Function]} hideStatus={false} isBusy={false} - isRHS={false} overwriteName="" src="/api/v4/users/undefined/image?_=0" userId="user_id" diff --git a/webapp/channels/src/components/user_profile/user_profile.tsx b/webapp/channels/src/components/user_profile/user_profile.tsx index 59ea50a213..86d006e5a8 100644 --- a/webapp/channels/src/components/user_profile/user_profile.tsx +++ b/webapp/channels/src/components/user_profile/user_profile.tsx @@ -145,7 +145,6 @@ export default class UserProfile extends PureComponent { isBusy={isBusy} hide={this.hideProfilePopover} hideStatus={hideStatus} - isRHS={isRHS} hasMention={hasMention} overwriteName={overwriteName} overwriteIcon={overwriteIcon} diff --git a/webapp/channels/src/plugins/export.js b/webapp/channels/src/plugins/export.js index 4679a50626..6d0f0fae16 100644 --- a/webapp/channels/src/plugins/export.js +++ b/webapp/channels/src/plugins/export.js @@ -45,7 +45,22 @@ window.Luxon = require('luxon'); window.StyledComponents = require('styled-components'); // Functions exposed on window for plugins to use. -window.PostUtils = {formatText, messageHtmlToComponent}; +window.PostUtils = { + formatText, + messageHtmlToComponent: (html, ...otherArgs) => { + // Previously, this function took an extra isRHS argument as the second parameter. For backwards compatibility, + // support calling this as either messageHtmlToComponent(html, options) or messageHtmlToComponent(html, isRhs, options) + + let options; + if (otherArgs.length === 2) { + options = otherArgs[1]; + } else if (otherArgs.length === 1 && typeof otherArgs[0] === 'object') { + options = otherArgs[0]; + } + + return messageHtmlToComponent(html, options); + }, +}; window.openInteractiveDialog = openInteractiveDialog; window.useNotifyAdmin = useNotifyAdmin; window.WebappUtils = { diff --git a/webapp/channels/src/plugins/export.test.js b/webapp/channels/src/plugins/export.test.js new file mode 100644 index 0000000000..d8f7f3bb67 --- /dev/null +++ b/webapp/channels/src/plugins/export.test.js @@ -0,0 +1,38 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import messageHtmlToComponent from 'utils/message_html_to_component'; + +import './export'; + +jest.mock('utils/message_html_to_component'); + +describe('messageHtmlToComponent wrapper', () => { + const message = 'test'; + const options = {emoji: true, images: false}; + const isRHS = false; + + test('should call messageHtmlToComponent properly with only message', () => { + window.PostUtils.messageHtmlToComponent(message); + + expect(messageHtmlToComponent).toHaveBeenCalledWith(message, undefined); + }); + + test('should call messageHtmlToComponent properly with message and options', () => { + window.PostUtils.messageHtmlToComponent(message, options); + + expect(messageHtmlToComponent).toHaveBeenCalledWith(message, options); + }); + + test('should call messageHtmlToComponent properly with only message when deprecated isRHS parameter is passed', () => { + window.PostUtils.messageHtmlToComponent(message, isRHS); + + expect(messageHtmlToComponent).toHaveBeenCalledWith(message, undefined); + }); + + test('should call messageHtmlToComponent properly with message and options when deprecated isRHS parameter is passed', () => { + window.PostUtils.messageHtmlToComponent(message, isRHS, options); + + expect(messageHtmlToComponent).toHaveBeenCalledWith(message, options); + }); +}); diff --git a/webapp/channels/src/plugins/test/__snapshots__/post_type.test.jsx.snap b/webapp/channels/src/plugins/test/__snapshots__/post_type.test.jsx.snap index 33c73c076d..b18f97dc85 100644 --- a/webapp/channels/src/plugins/test/__snapshots__/post_type.test.jsx.snap +++ b/webapp/channels/src/plugins/test/__snapshots__/post_type.test.jsx.snap @@ -84,7 +84,6 @@ exports[`plugins/PostMessageView should match snapshot with no extended post typ "onImageLoaded": [Function], } } - isRHS={false} mentionKeys={Array []} message="this is some text" options={Object {}} diff --git a/webapp/channels/src/utils/__snapshots__/message_html_to_component.test.jsx.snap b/webapp/channels/src/utils/__snapshots__/message_html_to_component.test.jsx.snap index 71ab60dbf6..f814c6eca4 100644 --- a/webapp/channels/src/utils/__snapshots__/message_html_to_component.test.jsx.snap +++ b/webapp/channels/src/utils/__snapshots__/message_html_to_component.test.jsx.snap @@ -12,7 +12,6 @@ exports[`messageHtmlToComponent At mention 1`] = ` disableGroupHighlight={false} disableHighlight={false} hasMention={true} - isRHS={false} mentionName="joram" > @joram @@ -31,7 +30,6 @@ exports[`messageHtmlToComponent At mention 2`] = ` disableGroupHighlight={false} disableHighlight={true} hasMention={true} - isRHS={false} mentionName="joram" > @joram @@ -49,7 +47,6 @@ exports[`messageHtmlToComponent At mention with group highlight disabled 1`] = ` disableGroupHighlight={false} disableHighlight={false} hasMention={true} - isRHS={false} mentionName="developers" > @developers @@ -67,7 +64,6 @@ exports[`messageHtmlToComponent At mention with group highlight disabled 2`] = ` disableGroupHighlight={true} disableHighlight={false} hasMention={true} - isRHS={false} mentionName="developers" > @developers diff --git a/webapp/channels/src/utils/message_html_to_component.jsx b/webapp/channels/src/utils/message_html_to_component.jsx index 5137fddcd3..ebfc33d3b9 100644 --- a/webapp/channels/src/utils/message_html_to_component.jsx +++ b/webapp/channels/src/utils/message_html_to_component.jsx @@ -29,7 +29,7 @@ import AtPlanMention from 'components/at_plan_mention'; * - hasPluginTooltips - If specified, the LinkTooltip component is placed inside links. Defaults to false. * - channelId = If specified, to be passed along to ProfilePopover via AtMention */ -export function messageHtmlToComponent(html, isRHS, options = {}) { +export function messageHtmlToComponent(html, options = {}) { if (!html) { return null; } @@ -101,7 +101,6 @@ export function messageHtmlToComponent(html, isRHS, options = {}) { const callAtMention = ( { `; const html = TextFormatting.formatText(input); - expect(messageHtmlToComponent(html, false, {postId: 'randompostid'})).toMatchSnapshot(); + expect(messageHtmlToComponent(html, {postId: 'randompostid'})).toMatchSnapshot(); }); test('html', () => { @@ -53,7 +53,7 @@ const myFunction = () => { `; const html = TextFormatting.formatText(input); - expect(messageHtmlToComponent(html, false, {postId: 'randompostid'})).toMatchSnapshot(); + expect(messageHtmlToComponent(html, {postId: 'randompostid'})).toMatchSnapshot(); }); test('link without enabled tooltip plugins', () => { @@ -67,14 +67,14 @@ const myFunction = () => { const input = 'lorem ipsum www.dolor.com sit amet'; const html = TextFormatting.formatText(input); - expect(messageHtmlToComponent(html, false, {hasPluginTooltips: true})).toMatchSnapshot(); + expect(messageHtmlToComponent(html, {hasPluginTooltips: true})).toMatchSnapshot(); }); test('Inline markdown image', () => { const options = {markdown: true}; const html = TextFormatting.formatText('![Mattermost](/images/icon.png) and a [link](link)', options); - const component = messageHtmlToComponent(html, false, { + const component = messageHtmlToComponent(html, { hasPluginTooltips: false, postId: 'post_id', postType: Constants.PostTypes.HEADER_CHANGE, @@ -87,7 +87,7 @@ const myFunction = () => { const options = {markdown: true}; const html = TextFormatting.formatText('[![Mattermost](images/icon.png)](images/icon.png)', options); - const component = messageHtmlToComponent(html, false, { + const component = messageHtmlToComponent(html, { hasPluginTooltips: false, postId: 'post_id', postType: Constants.PostTypes.HEADER_CHANGE, @@ -100,7 +100,7 @@ const myFunction = () => { const options = {mentionHighlight: true, atMentions: true, mentionKeys: [{key: '@joram'}]}; let html = TextFormatting.formatText('@joram', options); - let component = messageHtmlToComponent(html, false, {mentionHighlight: true}); + let component = messageHtmlToComponent(html, {mentionHighlight: true}); expect(component).toMatchSnapshot(); expect(shallow(component).find(AtMention).prop('disableHighlight')).toBe(false); @@ -108,7 +108,7 @@ const myFunction = () => { html = TextFormatting.formatText('@joram', options); - component = messageHtmlToComponent(html, false, {mentionHighlight: false}); + component = messageHtmlToComponent(html, {mentionHighlight: false}); expect(component).toMatchSnapshot(); expect(shallow(component).find(AtMention).prop('disableHighlight')).toBe(true); }); @@ -117,7 +117,7 @@ const myFunction = () => { const options = {mentionHighlight: true, atMentions: true, mentionKeys: [{key: '@joram'}]}; let html = TextFormatting.formatText('@developers', options); - let component = messageHtmlToComponent(html, false, {disableGroupHighlight: false}); + let component = messageHtmlToComponent(html, {disableGroupHighlight: false}); expect(component).toMatchSnapshot(); expect(shallow(component).find(AtMention).prop('disableGroupHighlight')).toBe(false); @@ -125,7 +125,7 @@ const myFunction = () => { html = TextFormatting.formatText('@developers', options); - component = messageHtmlToComponent(html, false, {disableGroupHighlight: true}); + component = messageHtmlToComponent(html, {disableGroupHighlight: true}); expect(component).toMatchSnapshot(); expect(shallow(component).find(AtMention).prop('disableGroupHighlight')).toBe(true); });