diff --git a/webapp/channels/src/actions/views/channel.ts b/webapp/channels/src/actions/views/channel.ts index 96eb19045d..79e6061993 100644 --- a/webapp/channels/src/actions/views/channel.ts +++ b/webapp/channels/src/actions/views/channel.ts @@ -57,21 +57,10 @@ import {getSelectedPost, getSelectedPostId} from 'selectors/rhs'; import {getHistory} from 'utils/browser_history'; import {Constants, ActionTypes, EventTypes, PostRequestTypes} from 'utils/constants'; -import {isMobile} from 'utils/utils'; import LocalStorageStore from 'stores/local_storage_store'; import {isArchivedChannel} from 'utils/channel_utils'; import type {GlobalState} from 'types/store'; -export function checkAndSetMobileView() { - return (dispatch: DispatchFunc) => { - dispatch({ - type: ActionTypes.UPDATE_MOBILE_VIEW, - data: isMobile(), - }); - return {data: true}; - }; -} - export function goToLastViewedChannel() { return async (dispatch: DispatchFunc, getState: GetStateFunc) => { const state = getState(); diff --git a/webapp/channels/src/actions/views/rhs.ts b/webapp/channels/src/actions/views/rhs.ts index a5cf9860b2..9c78709dde 100644 --- a/webapp/channels/src/actions/views/rhs.ts +++ b/webapp/channels/src/actions/views/rhs.ts @@ -26,7 +26,6 @@ import {Post} from '@mattermost/types/posts'; import {trackEvent} from 'actions/telemetry_actions.jsx'; import {getSearchTerms, getRhsState, getPluggableId, getFilesSearchExtFilter, getPreviousRhsState} from 'selectors/rhs'; import {ActionTypes, RHSStates, Constants} from 'utils/constants'; -import * as Utils from 'utils/utils'; import {getBrowserUtcOffset, getUtcOffsetForTimeZone} from 'utils/timezone'; import {RhsState} from 'types/store/rhs'; import {GlobalState} from 'types/store'; @@ -37,7 +36,7 @@ import {SidebarSize} from 'components/resizable_sidebar/constants'; function selectPostFromRightHandSideSearchWithPreviousState(post: Post, previousRhsState?: RhsState) { return async (dispatch: DispatchFunc, getState: GetStateFunc) => { - const postRootId = Utils.getRootId(post); + const postRootId = post.root_id || post.id; await dispatch(PostActions.getPostThread(postRootId)); const state = getState() as GlobalState; diff --git a/webapp/channels/src/components/actions_menu/__snapshots__/actions_menu.test.tsx.snap b/webapp/channels/src/components/actions_menu/__snapshots__/actions_menu.test.tsx.snap index 26709a01ad..3f54495e47 100644 --- a/webapp/channels/src/components/actions_menu/__snapshots__/actions_menu.test.tsx.snap +++ b/webapp/channels/src/components/actions_menu/__snapshots__/actions_menu.test.tsx.snap @@ -137,8 +137,8 @@ exports[`components/actions_menu/ActionsMenu has actions - marketplace enabled a /> } id="marketplace_icon_post_id_1" @@ -230,8 +230,8 @@ exports[`components/actions_menu/ActionsMenu no actions - sysadmin - menu should id="marketPlaceButton" onClick={[Function]} > - { className='btn btn-primary visit-marketplace-button' onClick={this.handleOpenMarketplace} > - {Utils.getMenuItemIcon('icon-view-grid-plus-outline visit-marketplace-button-icon')} + { key={`marketplace_${this.props.post.id}`} show={true} text={formatMessage({id: 'post_info.marketplace', defaultMessage: 'App Marketplace'})} - icon={Utils.getMenuItemIcon('icon-view-grid-plus-outline')} + icon={} onClick={this.handleOpenMarketplace} /> diff --git a/webapp/channels/src/components/actions_menu/actions_menu_icon.tsx b/webapp/channels/src/components/actions_menu/actions_menu_icon.tsx new file mode 100644 index 0000000000..66022cef8c --- /dev/null +++ b/webapp/channels/src/components/actions_menu/actions_menu_icon.tsx @@ -0,0 +1,16 @@ +// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved. +// See LICENSE.txt for license information. + +import React from 'react'; + +type Props = { + name: string; + dangerous?: boolean; +} + +export function ActionsMenuIcon({name, dangerous}: Props) { + const colorClass = dangerous ? 'MenuItem__compass-icon-dangerous' : 'MenuItem__compass-icon'; + return ( + + ); +} diff --git a/webapp/channels/src/components/channel_selector_modal/channel_selector_modal.tsx b/webapp/channels/src/components/channel_selector_modal/channel_selector_modal.tsx index 1628ea64e2..c9b9711541 100644 --- a/webapp/channels/src/components/channel_selector_modal/channel_selector_modal.tsx +++ b/webapp/channels/src/components/channel_selector_modal/channel_selector_modal.tsx @@ -5,12 +5,12 @@ import React from 'react'; import {Modal} from 'react-bootstrap'; import {FormattedMessage} from 'react-intl'; -import {ChannelSearchOpts, ChannelWithTeamData} from '@mattermost/types/channels'; +import {Channel, ChannelSearchOpts, ChannelWithTeamData} from '@mattermost/types/channels'; import {ActionResult} from 'mattermost-redux/types/actions'; import Constants from 'utils/constants'; -import {localizeMessage, compareChannels} from 'utils/utils'; +import {localizeMessage} from 'utils/utils'; import MultiSelect, {Value} from 'components/multiselect/multiselect'; @@ -265,3 +265,16 @@ export default class ChannelSelectorModal extends React.PureComponent Promise.resolve({moreToLoad: false})), syncPostsInChannel: jest.fn().mockResolvedValue({}), loadLatestPosts: jest.fn().mockImplementation(() => Promise.resolve({atLatestMessage: true, atOldestmessage: true})), - checkAndSetMobileView: jest.fn(), markChannelAsRead: jest.fn(), updateNewMessagesAtInChannel: jest.fn(), toggleShouldStartFromBottomWhenUnread: jest.fn(), diff --git a/webapp/channels/src/components/post_view/post_list/post_list.tsx b/webapp/channels/src/components/post_view/post_list/post_list.tsx index 4265c3db0c..0b51519b47 100644 --- a/webapp/channels/src/components/post_view/post_list/post_list.tsx +++ b/webapp/channels/src/components/post_view/post_list/post_list.tsx @@ -125,11 +125,6 @@ export interface Props { */ loadPosts: (parameters: LoadPostsParameters) => Promise; - /* - * Used to set mobile view on resize - */ - checkAndSetMobileView: () => Promise; - /* * Used to loading posts since a timestamp to sync the posts */ @@ -157,7 +152,6 @@ export default class PostList extends React.PureComponent { private actionsForPostList: { loadOlderPosts: () => Promise; loadNewerPosts: () => Promise; - checkAndSetMobileView: () => void; canLoadMorePosts: (type: CanLoadMorePosts) => Promise; changeUnreadChunkTimeStamp: (lastViewedAt: number) => void; updateNewMessagesAtInChannel: typeof updateNewMessagesAtInChannel; @@ -182,7 +176,6 @@ export default class PostList extends React.PureComponent { this.actionsForPostList = { loadOlderPosts: this.getPostsBefore, loadNewerPosts: this.getPostsAfter, - checkAndSetMobileView: props.actions.checkAndSetMobileView, canLoadMorePosts: this.canLoadMorePosts, changeUnreadChunkTimeStamp: props.changeUnreadChunkTimeStamp, toggleShouldStartFromBottomWhenUnread: props.toggleShouldStartFromBottomWhenUnread, diff --git a/webapp/channels/src/components/post_view/post_list_virtualized/post_list_virtualized.test.tsx b/webapp/channels/src/components/post_view/post_list_virtualized/post_list_virtualized.test.tsx index 2b1358785f..c6004917b9 100644 --- a/webapp/channels/src/components/post_view/post_list_virtualized/post_list_virtualized.test.tsx +++ b/webapp/channels/src/components/post_view/post_list_virtualized/post_list_virtualized.test.tsx @@ -16,7 +16,6 @@ import PostList from './post_list_virtualized'; describe('PostList', () => { const baseActions = { - checkAndSetMobileView: jest.fn(), loadOlderPosts: jest.fn(), loadNewerPosts: jest.fn(), canLoadMorePosts: jest.fn(), diff --git a/webapp/channels/src/components/post_view/post_list_virtualized/post_list_virtualized.tsx b/webapp/channels/src/components/post_view/post_list_virtualized/post_list_virtualized.tsx index 843696d8c9..38c538175d 100644 --- a/webapp/channels/src/components/post_view/post_list_virtualized/post_list_virtualized.tsx +++ b/webapp/channels/src/components/post_view/post_list_virtualized/post_list_virtualized.tsx @@ -112,11 +112,6 @@ type Props = { */ canLoadMorePosts: (type: CanLoadMorePosts) => Promise; - /* - * Function to check and set if app is in mobile view - */ - checkAndSetMobileView: () => void; - /* * Function to change the post selected for postList */ @@ -208,7 +203,6 @@ export default class PostList extends React.PureComponent { componentDidMount() { this.mounted = true; - this.props.actions.checkAndSetMobileView(); window.addEventListener('resize', this.handleWindowResize); EventEmitter.addListener(EventTypes.POST_LIST_SCROLL_TO_BOTTOM, this.scrollToLatestMessages); @@ -318,7 +312,6 @@ export default class PostList extends React.PureComponent { }; handleWindowResize = () => { - this.props.actions.checkAndSetMobileView(); this.showSearchHintThreshold = this.getShowSearchHintThreshold(); }; diff --git a/webapp/channels/src/components/post_view/post_message_view/post_message_view.tsx b/webapp/channels/src/components/post_view/post_message_view/post_message_view.tsx index 35ec9c0ec0..8044ac7460 100644 --- a/webapp/channels/src/components/post_view/post_message_view/post_message_view.tsx +++ b/webapp/channels/src/components/post_view/post_message_view/post_message_view.tsx @@ -8,6 +8,7 @@ import {Posts} from 'mattermost-redux/constants'; import {Post} from '@mattermost/types/posts'; import {Theme} from 'mattermost-redux/selectors/entities/preferences'; +import {isPostEphemeral} from 'mattermost-redux/utils/post_utils'; import * as Utils from 'utils/utils'; @@ -129,7 +130,7 @@ export default class PostMessageView extends React.PureComponent { } let message = post.message; - const isEphemeral = Utils.isPostEphemeral(post); + const isEphemeral = isPostEphemeral(post); if (compactDisplay && isEphemeral) { const visibleMessage = Utils.localizeMessage('post_info.message.visible.compact', ' (Only visible to you)'); message = message.concat(visibleMessage); diff --git a/webapp/channels/src/utils/utils.tsx b/webapp/channels/src/utils/utils.tsx index 76b318ab00..a522e404c2 100644 --- a/webapp/channels/src/utils/utils.tsx +++ b/webapp/channels/src/utils/utils.tsx @@ -25,7 +25,7 @@ import { import {getPost as getPostAction} from 'mattermost-redux/actions/posts'; import {getTeamByName as getTeamByNameAction} from 'mattermost-redux/actions/teams'; import {Client4} from 'mattermost-redux/client'; -import {Posts, Preferences, General} from 'mattermost-redux/constants'; +import {Preferences, General} from 'mattermost-redux/constants'; import { getChannel, getChannelsNameMapInTeam, @@ -56,7 +56,6 @@ import {getIsMobileView} from 'selectors/views/browser'; import {FileInfo} from '@mattermost/types/files'; import {Team} from '@mattermost/types/teams'; -import {Post} from '@mattermost/types/posts'; import {UserProfile} from '@mattermost/types/users'; import {Channel} from '@mattermost/types/channels'; @@ -309,13 +308,6 @@ export function getIconClassName(fileTypeIn: string) { return 'generic'; } -export function getMenuItemIcon(name: string, dangerous?: boolean) { - const colorClass = dangerous ? 'MenuItem__compass-icon-dangerous' : 'MenuItem__compass-icon'; - return ( - - ); -} - export function toTitleCase(str: string): string { function doTitleCase(txt: string) { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase(); @@ -851,10 +843,6 @@ export function setCaretPosition(input: HTMLInputElement, pos: number) { setSelectionRange(input, pos, pos); } -export function scrollbarWidth(el: HTMLElement) { - return el.offsetWidth - el.clientWidth; -} - export function isValidUsername(name: string) { let error; if (!name) { @@ -1231,18 +1219,6 @@ export function clearFileInput(elm: HTMLInputElement) { } } -export function isPostEphemeral(post: Post) { - return post.type === Constants.PostTypes.EPHEMERAL || post.state === Posts.POST_DELETED; -} - -export function getRootId(post: Post) { - return post.root_id === '' ? post.id : post.root_id; -} - -export function getRootPost(postList: Post[]) { - return postList.find((post) => post.root_id === ''); -} - export function localizeMessage(id: string, defaultMessage?: string) { const state = store.getState(); @@ -1545,19 +1521,6 @@ export function moveCursorToEnd(e: React.MouseEvent | React.FocusEvent) { } } -export function compareChannels(a: Channel, b: Channel) { - const aDisplayName = a.display_name.toUpperCase(); - const bDisplayName = b.display_name.toUpperCase(); - const result = aDisplayName.localeCompare(bDisplayName); - if (result !== 0) { - return result; - } - - const aName = a.name.toUpperCase(); - const bName = b.name.toUpperCase(); - return aName.localeCompare(bName); -} - export function setCSRFFromCookie() { if (typeof document !== 'undefined' && typeof document.cookie !== 'undefined') { const cookies = document.cookie.split(';');