- {canCreatePublicChannel ? publicChannelDesc : null}
- {canCreatePrivateChannel ? privateChannelDesc : null}
+
+
+ {canCreatePublicChannel ? publicChannelDesc : null}
+ {canCreatePrivateChannel ? privateChannelDesc : null}
+
);
}
diff --git a/components/pdf_preview.jsx b/components/pdf_preview.jsx
index 679c21799f99..71ed84851346 100644
--- a/components/pdf_preview.jsx
+++ b/components/pdf_preview.jsx
@@ -6,8 +6,7 @@ import React from 'react';
import {FormattedMessage} from 'react-intl';
import PDFJS from 'pdfjs-dist';
-import loadingGif from 'images/load.gif';
-
+import LoadingBars from 'components/widgets/loading/loading_bars.jsx';
import FileInfoPreview from 'components/file_info_preview';
const MAX_PDF_PAGES = 5;
@@ -131,10 +130,7 @@ export default class PDFPreview extends React.PureComponent {
if (this.state.loading) {
return (
-
+
);
}
diff --git a/components/permalink_view/actions.js b/components/permalink_view/actions.js
new file mode 100644
index 000000000000..4709819595e0
--- /dev/null
+++ b/components/permalink_view/actions.js
@@ -0,0 +1,71 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import {getChannel, selectChannel, joinChannel, getChannelStats} from 'mattermost-redux/actions/channels';
+import {getPostThread} from 'mattermost-redux/actions/posts';
+import {getCurrentTeamId} from 'mattermost-redux/selectors/entities/teams';
+import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
+
+import {loadChannelsForCurrentUser} from 'actions/channel_actions.jsx';
+import {loadNewDMIfNeeded, loadNewGMIfNeeded} from 'actions/user_actions.jsx';
+import {browserHistory} from 'utils/browser_history';
+import {ActionTypes, Constants, ErrorPageTypes} from 'utils/constants.jsx';
+
+export function focusPost(postId, returnTo = '') {
+ return async (dispatch, getState) => {
+ const {data} = await dispatch(getPostThread(postId));
+
+ if (!data) {
+ browserHistory.replace(`/error?type=${ErrorPageTypes.PERMALINK_NOT_FOUND}&returnTo=${returnTo}`);
+ return;
+ }
+
+ const state = getState();
+ const channelId = data.posts[data.order[0]].channel_id;
+ let channel = state.entities.channels.channels[channelId];
+ const teamId = getCurrentTeamId(state);
+
+ if (!channel) {
+ const {data: channelData} = await dispatch(getChannel(channelId));
+
+ if (!channelData) {
+ browserHistory.replace(`/error?type=${ErrorPageTypes.PERMALINK_NOT_FOUND}&returnTo=${returnTo}`);
+ return;
+ }
+
+ channel = channelData;
+ }
+
+ const myMember = state.entities.channels.myMembers[channelId];
+
+ if (!myMember) {
+ // If it's a DM or GM channel and we don't have a channel member for it already, user is not a member
+ if (channel.type === Constants.DM_CHANNEL || channel.type === Constants.GM_CHANNEL) {
+ browserHistory.replace(`/error?type=${ErrorPageTypes.PERMALINK_NOT_FOUND}&returnTo=${returnTo}`);
+ return;
+ }
+
+ await dispatch(joinChannel(getCurrentUserId(getState()), null, channelId));
+ }
+
+ if (channel.team_id && channel.team_id !== teamId) {
+ browserHistory.replace(`/error?type=${ErrorPageTypes.PERMALINK_NOT_FOUND}&returnTo=${returnTo}`);
+ return;
+ }
+
+ if (channel && channel.type === Constants.DM_CHANNEL) {
+ loadNewDMIfNeeded(channel.id);
+ } else if (channel && channel.type === Constants.GM_CHANNEL) {
+ loadNewGMIfNeeded(channel.id);
+ }
+
+ dispatch(selectChannel(channelId));
+ dispatch({
+ type: ActionTypes.RECEIVED_FOCUSED_POST,
+ data: postId,
+ });
+
+ dispatch(loadChannelsForCurrentUser());
+ dispatch(getChannelStats(channelId));
+ };
+}
diff --git a/components/permalink_view/index.js b/components/permalink_view/index.js
index 0b230c7ee719..ff2e2e8dcd37 100644
--- a/components/permalink_view/index.js
+++ b/components/permalink_view/index.js
@@ -2,10 +2,12 @@
// See LICENSE.txt for license information.
import {connect} from 'react-redux';
+import {bindActionCreators} from 'redux';
import {getCurrentChannel} from 'mattermost-redux/selectors/entities/channels';
import {getCurrentTeam} from 'mattermost-redux/selectors/entities/teams';
+import {focusPost} from './actions';
import PermalinkView from './permalink_view.jsx';
function mapStateToProps(state) {
@@ -33,4 +35,12 @@ function mapStateToProps(state) {
};
}
-export default connect(mapStateToProps)(PermalinkView);
+function mapDispatchToProps(dispatch) {
+ return {
+ actions: bindActionCreators({
+ focusPost,
+ }, dispatch),
+ };
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(PermalinkView);
diff --git a/components/permalink_view/permalink_view.jsx b/components/permalink_view/permalink_view.jsx
index b635ebb6cc1a..9d47392bf34d 100644
--- a/components/permalink_view/permalink_view.jsx
+++ b/components/permalink_view/permalink_view.jsx
@@ -9,7 +9,6 @@ import {Link} from 'react-router-dom';
import ChannelHeader from 'components/channel_header';
import {localizeMessage} from 'utils/utils.jsx';
import PostView from 'components/post_view';
-import {emitPostFocusEvent} from 'actions/global_actions.jsx';
import FormattedMarkdownMessage from 'components/formatted_markdown_message';
export default class PermalinkView extends React.PureComponent {
@@ -28,6 +27,9 @@ export default class PermalinkView extends React.PureComponent {
}).isRequired,
returnTo: PropTypes.string.isRequired,
teamName: PropTypes.string,
+ actions: PropTypes.shape({
+ focusPost: PropTypes.func.isRequired,
+ }).isRequired,
};
constructor(props) {
@@ -53,7 +55,7 @@ export default class PermalinkView extends React.PureComponent {
doPermalinkEvent = async (props) => {
this.setState({valid: false});
const postId = props.match.params.postid;
- await emitPostFocusEvent(postId, this.props.returnTo);
+ await this.props.actions.focusPost(postId, this.props.returnTo);
this.setState({valid: true});
}
diff --git a/components/permalink_view/permalink_view.test.jsx b/components/permalink_view/permalink_view.test.jsx
index 2a2e4d72e004..bbfe353a36c1 100644
--- a/components/permalink_view/permalink_view.test.jsx
+++ b/components/permalink_view/permalink_view.test.jsx
@@ -3,13 +3,65 @@
import React from 'react';
import {shallow} from 'enzyme';
+import thunk from 'redux-thunk';
+import configureStore from 'redux-mock-store';
-import {emitPostFocusEvent} from 'actions/global_actions.jsx';
+import {getPostThread} from 'mattermost-redux/actions/posts';
+import {ErrorPageTypes} from 'utils/constants';
+import {browserHistory} from 'utils/browser_history';
+
+import {focusPost} from 'components/permalink_view/actions';
import PermalinkView from 'components/permalink_view/permalink_view.jsx';
-jest.mock('actions/global_actions.jsx', () => ({
- emitPostFocusEvent: jest.fn(),
+const mockStore = configureStore([thunk]);
+
+jest.mock('utils/browser_history', () => ({
+ browserHistory: {
+ replace: jest.fn(),
+ },
+}));
+
+jest.mock('actions/channel_actions.jsx', () => ({
+ loadChannelsForCurrentUser: jest.fn(() => {
+ return {type: 'MOCK_LOAD_CHANNELS_FOR_CURRENT_USER'};
+ }),
+}));
+
+jest.mock('mattermost-redux/actions/posts', () => ({
+ getPostThread: jest.fn((postId) => {
+ const post = {id: 'postid1', message: 'some message', channel_id: 'channelid1'};
+ const post2 = {id: 'postid2', message: 'some message', channel_id: 'channelid2'};
+ const dmPost = {id: 'dmpostid1', message: 'some message', channel_id: 'dmchannelid'};
+ const gmPost = {id: 'gmpostid1', message: 'some message', channel_id: 'gmchannelid'};
+
+ switch (postId) {
+ case 'postid1':
+ return {type: 'MOCK_GET_POST_THREAD', data: {posts: {postid1: post}, order: [post.id]}};
+ case 'postid2':
+ return {type: 'MOCK_GET_POST_THREAD', data: {posts: {postid2: post2}, order: [post2.id]}};
+ case 'dmpostid1':
+ return {type: 'MOCK_GET_POST_THREAD', data: {posts: {dmpostid1: dmPost}, order: [dmPost.id]}};
+ case 'gmpostid1':
+ return {type: 'MOCK_GET_POST_THREAD', data: {posts: {gmpostid1: gmPost}, order: [gmPost.id]}};
+ default:
+ return {type: 'MOCK_GET_POST_THREAD'};
+ }
+ }),
+}));
+
+jest.mock('mattermost-redux/actions/channels', () => ({
+ selectChannel: (...args) => ({type: 'MOCK_SELECT_CHANNEL', args}),
+ joinChannel: (...args) => ({type: 'MOCK_JOIN_CHANNEL', args}),
+ getChannelStats: (...args) => ({type: 'MOCK_GET_CHANNEL_STATS', args}),
+ getChannel: jest.fn((channelId) => {
+ switch (channelId) {
+ case 'channelid2':
+ return {type: 'MOCK_GET_CHANNEL', data: {id: 'channelid2', type: 'O', team_id: 'current_team_id'}};
+ default:
+ return {type: 'MOCK_GET_CHANNEL', args: [channelId]};
+ }
+ }),
}));
describe('components/PermalinkView', () => {
@@ -19,6 +71,9 @@ describe('components/PermalinkView', () => {
match: {params: {postid: 'post_id'}},
returnTo: 'return_to',
teamName: 'team_name',
+ actions: {
+ focusPost: jest.fn(),
+ },
};
test('should match snapshot', () => {
@@ -30,15 +85,17 @@ describe('components/PermalinkView', () => {
expect(wrapper).toMatchSnapshot();
});
- test('should call emitPostFocusEvent on doPermalinkEvent', () => {
+ test('should call baseProps.actions.focusPost on doPermalinkEvent', async () => {
const wrapper = shallow(
);
+ expect(baseProps.actions.focusPost).toHaveBeenCalledTimes(1);
+
wrapper.setState({valid: false});
- wrapper.instance().doPermalinkEvent();
- expect(emitPostFocusEvent).toHaveBeenCalledTimes(1);
- expect(emitPostFocusEvent).toBeCalledWith(baseProps.match.params.postid, baseProps.returnTo);
+ await wrapper.instance().doPermalinkEvent(baseProps);
+ expect(baseProps.actions.focusPost).toHaveBeenCalledTimes(2);
+ expect(baseProps.actions.focusPost).toBeCalledWith(baseProps.match.params.postid, baseProps.returnTo);
});
test('should match snapshot with archived channel', () => {
@@ -51,4 +108,79 @@ describe('components/PermalinkView', () => {
wrapper.setState({valid: true});
expect(wrapper).toMatchSnapshot();
});
-});
\ No newline at end of file
+
+ describe('actions', () => {
+ const initialState = {
+ entities: {
+ users: {
+ currentUserId: 'current_user_id',
+ },
+ channels: {
+ channels: {
+ channelid1: {id: 'channelid1', name: 'channel1', type: 'O', team_id: 'current_team_id'},
+ dmchannelid: {id: 'dmchannelid', name: 'dmchannel', type: 'D'},
+ gmchannelid: {id: 'gmchannelid', name: 'gmchannel', type: 'G'},
+ },
+ myMembers: {channelid1: {channel_id: 'channelid1', user_id: 'current_user_id'}},
+ },
+ teams: {
+ currentTeamId: 'current_team_id',
+ },
+ },
+ };
+
+ describe('focusPost', async () => {
+ test('should focus post in already loaded channel', async () => {
+ const testStore = await mockStore(initialState);
+ await testStore.dispatch(focusPost('postid1'));
+
+ expect(getPostThread).toHaveBeenCalledWith('postid1');
+ expect(testStore.getActions()).toEqual([
+ {type: 'MOCK_GET_POST_THREAD', data: {posts: {postid1: {id: 'postid1', message: 'some message', channel_id: 'channelid1'}}, order: ['postid1']}},
+ {type: 'MOCK_SELECT_CHANNEL', args: ['channelid1']},
+ {type: 'RECEIVED_FOCUSED_POST', data: 'postid1'},
+ {type: 'MOCK_LOAD_CHANNELS_FOR_CURRENT_USER'},
+ {type: 'MOCK_GET_CHANNEL_STATS', args: ['channelid1']},
+ ]);
+ });
+
+ test('should focus post in not loaded channel', async () => {
+ const testStore = await mockStore(initialState);
+ await testStore.dispatch(focusPost('postid2'));
+
+ expect(getPostThread).toHaveBeenCalledWith('postid2');
+ expect(testStore.getActions()).toEqual([
+ {type: 'MOCK_GET_POST_THREAD', data: {posts: {postid2: {id: 'postid2', message: 'some message', channel_id: 'channelid2'}}, order: ['postid2']}},
+ {type: 'MOCK_GET_CHANNEL', data: {id: 'channelid2', type: 'O', team_id: 'current_team_id'}},
+ {type: 'MOCK_JOIN_CHANNEL', args: ['current_user_id', null, 'channelid2']},
+ {type: 'MOCK_SELECT_CHANNEL', args: ['channelid2']},
+ {type: 'RECEIVED_FOCUSED_POST', data: 'postid2'},
+ {type: 'MOCK_LOAD_CHANNELS_FOR_CURRENT_USER'},
+ {type: 'MOCK_GET_CHANNEL_STATS', args: ['channelid2']},
+ ]);
+ });
+
+ test('should redirect to error page for DM channel not a member of', async () => {
+ const testStore = await mockStore(initialState);
+ await testStore.dispatch(focusPost('dmpostid1'));
+
+ expect(getPostThread).toHaveBeenCalledWith('dmpostid1');
+ expect(testStore.getActions()).toEqual([
+ {type: 'MOCK_GET_POST_THREAD', data: {posts: {dmpostid1: {id: 'dmpostid1', message: 'some message', channel_id: 'dmchannelid'}}, order: ['dmpostid1']}},
+ ]);
+ expect(browserHistory.replace).toHaveBeenCalledWith(`/error?type=${ErrorPageTypes.PERMALINK_NOT_FOUND}&returnTo=`);
+ });
+
+ test('should redirect to error page for GM channel not a member of', async () => {
+ const testStore = await mockStore(initialState);
+ await testStore.dispatch(focusPost('gmpostid1'));
+
+ expect(getPostThread).toHaveBeenCalledWith('gmpostid1');
+ expect(testStore.getActions()).toEqual([
+ {type: 'MOCK_GET_POST_THREAD', data: {posts: {gmpostid1: {id: 'gmpostid1', message: 'some message', channel_id: 'gmchannelid'}}, order: ['gmpostid1']}},
+ ]);
+ expect(browserHistory.replace).toHaveBeenCalledWith(`/error?type=${ErrorPageTypes.PERMALINK_NOT_FOUND}&returnTo=`);
+ });
+ });
+ });
+});
diff --git a/components/post_emoji/index.jsx b/components/post_emoji/index.jsx
index a303f49a4cbe..19238e68c259 100644
--- a/components/post_emoji/index.jsx
+++ b/components/post_emoji/index.jsx
@@ -12,6 +12,7 @@ import {getEmojiMap} from 'selectors/emojis';
import PostEmoji from './post_emoji.jsx';
function mapStateToProps(state, ownProps) {
+ const config = getConfig(state);
const emojiMap = getEmojiMap(state);
const emoji = emojiMap.get(ownProps.name);
@@ -21,7 +22,8 @@ function mapStateToProps(state, ownProps) {
imageUrl = getEmojiImageUrl(emoji);
} else {
displayTextOnly = state.entities.emojis.nonExistentEmoji.has(ownProps.name) ||
- getConfig(state).EnableCustomEmoji !== 'true' ||
+ config.EnableCustomEmoji !== 'true' ||
+ config.ExperimentalEnablePostMetadata === 'true' ||
getCurrentUserId(state) === '';
}
diff --git a/components/post_markdown/post_markdown.jsx b/components/post_markdown/post_markdown.jsx
index a85b0b54a7fe..58ada2667ac7 100644
--- a/components/post_markdown/post_markdown.jsx
+++ b/components/post_markdown/post_markdown.jsx
@@ -12,7 +12,7 @@ export default class PostMarkdown extends React.PureComponent {
static propTypes = {
/*
- * Any extra props that should be passed into the MarkdownImage component
+ * Any extra props that should be passed into the image component
*/
imageProps: PropTypes.object,
@@ -71,7 +71,7 @@ export default class PostMarkdown extends React.PureComponent {
proxyImages={proxyImages}
options={this.props.options}
channelNamesMap={channelNamesMap}
- imagesMetadata={this.props.post.metadata && this.props.post.metadata.images}
+ imagesMetadata={this.props.post && this.props.post.metadata && this.props.post.metadata.images}
/>
);
}
diff --git a/components/post_markdown/post_markdown.test.jsx b/components/post_markdown/post_markdown.test.jsx
index 13a2feeb327a..f55d85dad547 100644
--- a/components/post_markdown/post_markdown.test.jsx
+++ b/components/post_markdown/post_markdown.test.jsx
@@ -15,6 +15,13 @@ describe('components/PostMarkdown', () => {
post: {},
};
+ test('should not error when rendering without a post', () => {
+ const props = {...baseProps};
+ Reflect.deleteProperty(props, 'post');
+
+ shallow(
);
+ });
+
test('should render properly with an empty post', () => {
const wrapper = shallow(
diff --git a/components/post_view/commented_on_files_message/__snapshots__/commented_on_files_message.test.jsx.snap b/components/post_view/commented_on_files_message/__snapshots__/commented_on_files_message.test.jsx.snap
new file mode 100644
index 000000000000..1ea25a51cd9d
--- /dev/null
+++ b/components/post_view/commented_on_files_message/__snapshots__/commented_on_files_message.test.jsx.snap
@@ -0,0 +1,24 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`components/CommentedOnFilesMessage Should call snapshot when no files and call getFilesForPost 1`] = `""`;
+
+exports[`components/CommentedOnFilesMessage should match snapshot for multiple files 1`] = `
+
+ image_3.png
+
+
+`;
+
+exports[`components/CommentedOnFilesMessage should match snapshot for single file 1`] = `
+
+ image_1.png
+
+`;
diff --git a/components/post_view/commented_on_files_message/commented_on_files_message.jsx b/components/post_view/commented_on_files_message/commented_on_files_message.jsx
index fcaf4d280f71..6bd6dc970a28 100644
--- a/components/post_view/commented_on_files_message/commented_on_files_message.jsx
+++ b/components/post_view/commented_on_files_message/commented_on_files_message.jsx
@@ -17,6 +17,19 @@ export default class CommentedOnFilesMessage extends React.PureComponent {
* An array of file metadata for the parent post
*/
fileInfos: PropTypes.arrayOf(PropTypes.object),
+ actions: PropTypes.shape({
+
+ /*
+ * Function to get file metadata for a post
+ */
+ getFilesForPost: PropTypes.func.isRequired,
+ }).isRequired,
+ }
+
+ componentDidMount() {
+ if (!this.props.fileInfos || this.props.fileInfos.length === 0) {
+ this.props.actions.getFilesForPost(this.props.parentPostId);
+ }
}
render() {
diff --git a/components/post_view/commented_on_files_message/commented_on_files_message.test.jsx b/components/post_view/commented_on_files_message/commented_on_files_message.test.jsx
new file mode 100644
index 000000000000..b6783b2e71b5
--- /dev/null
+++ b/components/post_view/commented_on_files_message/commented_on_files_message.test.jsx
@@ -0,0 +1,58 @@
+// Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
+// See LICENSE.txt for license information.
+
+import React from 'react';
+import {shallow} from 'enzyme';
+
+import CommentedOnFilesMessage from './commented_on_files_message.jsx';
+
+describe('components/CommentedOnFilesMessage', () => {
+ const parentPostId = 'parentPostId';
+ const actions = {getFilesForPost: jest.fn()};
+
+ const baseProps = {
+ parentPostId,
+ actions,
+ };
+
+ test('Should call snapshot when no files and call getFilesForPost', () => {
+ const wrapper = shallow(
+
+ );
+
+ expect(wrapper).toMatchSnapshot();
+ expect(actions.getFilesForPost).toHaveBeenCalledTimes(1);
+ });
+
+ test('should match snapshot for single file', () => {
+ const props = {
+ ...baseProps,
+ fileInfos: [{id: 'file_id_1', name: 'image_1.png', extension: 'png', create_at: 1}],
+ };
+
+ const wrapper = shallow(
+
+ );
+
+ expect(wrapper).toMatchSnapshot();
+ });
+
+ test('should match snapshot for multiple files', () => {
+ const fileInfos = [
+ {id: 'file_id_3', name: 'image_3.png', extension: 'png', create_at: 3},
+ {id: 'file_id_2', name: 'image_2.png', extension: 'png', create_at: 2},
+ {id: 'file_id_1', name: 'image_1.png', extension: 'png', create_at: 1},
+ ];
+
+ const props = {
+ ...baseProps,
+ fileInfos,
+ };
+
+ const wrapper = shallow(
+
+ );
+
+ expect(wrapper).toMatchSnapshot();
+ });
+});
diff --git a/components/post_view/commented_on_files_message/index.js b/components/post_view/commented_on_files_message/index.js
index 39d88b5daa04..6ee04a36fd1f 100644
--- a/components/post_view/commented_on_files_message/index.js
+++ b/components/post_view/commented_on_files_message/index.js
@@ -2,6 +2,8 @@
// See LICENSE.txt for license information.
import {connect} from 'react-redux';
+import {bindActionCreators} from 'redux';
+import {getFilesForPost} from 'mattermost-redux/actions/files';
import {makeGetFilesForPost} from 'mattermost-redux/selectors/entities/files';
import CommentedOnFilesMessage from './commented_on_files_message.jsx';
@@ -21,4 +23,12 @@ function makeMapStateToProps() {
};
}
-export default connect(makeMapStateToProps)(CommentedOnFilesMessage);
+function mapDispatchToProps(dispatch) {
+ return {
+ actions: bindActionCreators({
+ getFilesForPost,
+ }, dispatch),
+ };
+}
+
+export default connect(makeMapStateToProps, mapDispatchToProps)(CommentedOnFilesMessage);
diff --git a/components/post_view/message_attachments/message_attachment/__snapshots__/message_attachment.test.jsx.snap b/components/post_view/message_attachments/message_attachment/__snapshots__/message_attachment.test.jsx.snap
index ba53fa030370..ca9bb9e5c0a1 100644
--- a/components/post_view/message_attachments/message_attachment/__snapshots__/message_attachment.test.jsx.snap
+++ b/components/post_view/message_attachments/message_attachment/__snapshots__/message_attachment.test.jsx.snap
@@ -73,12 +73,21 @@ exports[`components/post_view/MessageAttachment should call actions.doPostAction
message="short text"
/>
-
+
+
+
@@ -97,10 +106,15 @@ exports[`components/post_view/MessageAttachment should call actions.doPostAction
-
-
+
+
+
-
+
+
+
);
}
let thumb;
if (attachment.thumb_url) {
- const imageDimensions = getFileDimensionsForDisplay(this.props.imagesMetadata[attachment.thumb_url], MAX_DIMENSIONS_THUMB_URL);
thumb = (
-
);
diff --git a/components/post_view/post_attachment_opengraph/index.js b/components/post_view/post_attachment_opengraph/index.js
index fb5f664eebd8..df46fb454161 100644
--- a/components/post_view/post_attachment_opengraph/index.js
+++ b/components/post_view/post_attachment_opengraph/index.js
@@ -3,6 +3,7 @@
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
+import {getOpenGraphMetadata} from 'mattermost-redux/actions/posts';
import {getOpenGraphMetadataForUrl} from 'mattermost-redux/selectors/entities/posts';
import {getCurrentUser} from 'mattermost-redux/selectors/entities/users';
@@ -21,6 +22,7 @@ function mapDispatchToProps(dispatch) {
return {
actions: bindActionCreators({
editPost,
+ getOpenGraphMetadata,
}, dispatch),
};
}
diff --git a/components/post_view/post_attachment_opengraph/post_attachment_opengraph.jsx b/components/post_view/post_attachment_opengraph/post_attachment_opengraph.jsx
index 2528c4003507..b688212217eb 100644
--- a/components/post_view/post_attachment_opengraph/post_attachment_opengraph.jsx
+++ b/components/post_view/post_attachment_opengraph/post_attachment_opengraph.jsx
@@ -55,41 +55,67 @@ export default class PostAttachmentOpenGraph extends React.PureComponent {
actions: PropTypes.shape({
editPost: PropTypes.func.isRequired,
+
+ /**
+ * The function to get open graph data for a link
+ */
+ getOpenGraphMetadata: PropTypes.func.isRequired,
}).isRequired,
}
constructor(props) {
super(props);
- this.handleRemovePreview = this.handleRemovePreview.bind(this);
const removePreview = this.isRemovePreview(props.post, props.currentUser);
const imageUrl = this.getBestImageUrl(props.openGraphData);
const {metadata} = props.post;
const hasLargeImage = metadata && metadata.images && metadata.images[imageUrl] && imageUrl ? this.hasLargeImage(metadata.images[imageUrl]) : false;
+
this.state = {
+ imageLoaded: Boolean(metadata),
hasLargeImage,
removePreview,
imageUrl,
};
}
+ componentDidMount() {
+ if (!this.props.post.metadata) {
+ this.fetchData(this.props.link);
+ if (this.state.imageUrl) {
+ this.loadImage(this.state.imageUrl);
+ }
+ }
+ }
+
UNSAFE_componentWillReceiveProps(nextProps) { // eslint-disable-line camelcase
if (!Utils.areObjectsEqual(nextProps.post, this.props.post)) {
const removePreview = this.isRemovePreview(nextProps.post, nextProps.currentUser);
+ this.setState({
+ removePreview,
+ });
+ }
+
+ if (!Utils.areObjectsEqual(nextProps.openGraphData, this.props.openGraphData)) {
const imageUrl = this.getBestImageUrl(nextProps.openGraphData);
const {metadata} = nextProps.post;
const hasLargeImage = metadata && metadata.images && metadata.images[imageUrl] && imageUrl ? this.hasLargeImage(metadata.images[imageUrl]) : false;
this.setState({
hasLargeImage,
- removePreview,
imageUrl,
});
}
+
+ if (nextProps.link !== this.props.link && !nextProps.post.metadata) {
+ this.fetchData(nextProps.link);
+ }
}
- componentDidUpdate() {
- setTimeout(postListScrollChange, 0);
+ componentDidUpdate(prevProps, prevState) {
+ if (!this.props.post.metadata && (this.state.imageUrl !== prevState.imageUrl)) {
+ this.loadImage(this.state.imageUrl);
+ }
}
fetchData = (url) => {
@@ -122,8 +148,20 @@ export default class PostAttachmentOpenGraph extends React.PureComponent {
return hasLargeImage;
}
+ onImageLoad = (image) => {
+ const hasLargeImage = this.hasLargeImage({width: image.target.naturalWidth, height: image.target.naturalHeight});
+
+ this.setState({
+ hasLargeImage,
+ imageLoaded: true,
+ });
+
+ postListScrollChange();
+ }
+
loadImage(src) {
const img = new Image();
+ img.onload = this.onImageLoad;
img.src = src;
}
@@ -152,32 +190,39 @@ export default class PostAttachmentOpenGraph extends React.PureComponent {
imageTag(imageUrl, renderingForLargeImage = false) {
let element = null;
const {metadata} = this.props.post;
- if (!metadata) {
- return element;
- }
if (
imageUrl && renderingForLargeImage === this.state.hasLargeImage &&
(!renderingForLargeImage || (renderingForLargeImage && this.props.isEmbedVisible))
) {
- if (renderingForLargeImage) {
- const imageDimensions = getFileDimensionsForDisplay(metadata.images && metadata.images[imageUrl], MAX_DIMENSIONS_LARGE_IMAGE);
-
- element = (
-
- );
+ if (this.state.imageLoaded) {
+ const imagesDimensions = metadata && metadata.images && metadata.images[imageUrl];
+
+ if (renderingForLargeImage) {
+ const imageDimensions = getFileDimensionsForDisplay(imagesDimensions, MAX_DIMENSIONS_LARGE_IMAGE);
+
+ element = (
+
+ );
+ } else {
+ const imageDimensions = getFileDimensionsForDisplay(imagesDimensions, MAX_DIMENSIONS_SMALL_IMAGE);
+ element = this.wrapInSmallImageContainer(
+
+ );
+ }
+ } else if (renderingForLargeImage) {
+ element =
![]()
;
} else {
- const imageDimensions = getFileDimensionsForDisplay(metadata.images && metadata.images[imageUrl], MAX_DIMENSIONS_SMALL_IMAGE);
element = this.wrapInSmallImageContainer(
-
+
![]()
);
}
}
diff --git a/components/post_view/post_body/post_body.jsx b/components/post_view/post_body/post_body.jsx
index 8450e54fba2b..067883168412 100644
--- a/components/post_view/post_body/post_body.jsx
+++ b/components/post_view/post_body/post_body.jsx
@@ -14,9 +14,8 @@ import FileAttachmentListContainer from 'components/file_attachment_list';
import FailedPostOptions from 'components/post_view/failed_post_options';
import PostBodyAdditionalContent from 'components/post_view/post_body_additional_content';
import PostMessageView from 'components/post_view/post_message_view';
-import ReactionListContainer from 'components/post_view/reaction_list';
-
-import loadingGif from 'images/load.gif';
+import ReactionList from 'components/post_view/reaction_list';
+import LoadingBars from 'components/widgets/loading/loading_bars.jsx';
const SENDING_ANIMATION_DELAY = 3000;
@@ -163,22 +162,14 @@ export default class PostBody extends React.PureComponent {
);
}
- let sending;
if (this.state.sending) {
- sending = (
-
- );
-
postClass += ' post-waiting';
}
const messageWrapper = (
{failedOptions}
- {sending}
+ {this.state.sending && }
{messageWithAdditionalContent}
{fileAttachmentHolder}
-
diff --git a/components/post_view/post_body_additional_content/post_body_additional_content.jsx b/components/post_view/post_body_additional_content/post_body_additional_content.jsx
index 7e85474a1466..5518c5beaf3d 100644
--- a/components/post_view/post_body_additional_content/post_body_additional_content.jsx
+++ b/components/post_view/post_body_additional_content/post_body_additional_content.jsx
@@ -134,7 +134,7 @@ export default class PostBodyAdditionalContent extends React.PureComponent {
postId={this.props.post.id}
key={this.props.post.id}
options={this.props.options}
- imagesMetadata={this.props.post.metadata.images}
+ imagesMetadata={this.props.post.metadata && this.props.post.metadata.images}
/>
);
}
@@ -227,7 +227,7 @@ export default class PostBodyAdditionalContent extends React.PureComponent {
}
if (this.isLinkImage(link)) {
- const {metadata} = this.props.post;
+ const dimensions = this.props.post.metadata && this.props.post.metadata.images && this.props.post.metadata.images[link];
return (
);
}
diff --git a/components/post_view/post_image/post_image.jsx b/components/post_view/post_image/post_image.jsx
index aea80776ffe0..b2e67a7cf60e 100644
--- a/components/post_view/post_image/post_image.jsx
+++ b/components/post_view/post_image/post_image.jsx
@@ -4,6 +4,7 @@
import PropTypes from 'prop-types';
import React from 'react';
+import {postListScrollChange} from 'actions/global_actions';
import LoadingImagePreview from 'components/loading_image_preview';
import * as PostUtils from 'utils/post_utils.jsx';
import {getFileDimensionsForDisplay} from 'utils/file_utils';
@@ -91,6 +92,7 @@ export default class PostImageEmbed extends React.PureComponent {
errored: false,
});
+ postListScrollChange();
if (this.props.onLinkLoaded) {
this.props.onLinkLoaded();
}
@@ -114,6 +116,9 @@ export default class PostImageEmbed extends React.PureComponent {
render() {
const imageDimensions = getFileDimensionsForDisplay(this.props.dimensions, MAX_IMAGE_DIMENSIONS);
if (this.state.errored || !this.state.loaded) {
+ if (!this.props.dimensions) {
+ return null;
+ }
return (
-
- {
const postList = this.postListRef.current;
const messageSeparator = this.refs.newMessageSeparator;
- const doScrollToBottom = this.checkBottom() || forceScrollToBottom;
+ const doScrollToBottom = this.atBottom || forceScrollToBottom;
if (postList) {
if (doScrollToBottom) {
@@ -367,9 +376,10 @@ export default class PostList extends React.PureComponent {
} else if (!this.hasScrolled && messageSeparator) {
const element = ReactDOM.findDOMNode(messageSeparator);
element.scrollIntoView();
+ this.atBottom = this.checkBottom();
}
+ this.previousScrollHeight = postList.scrollHeight;
}
-
this.props.actions.checkAndSetMobileView();
});
}
@@ -435,6 +445,11 @@ export default class PostList extends React.PureComponent {
// Only count as user scroll if we've already performed our first load scroll
this.hasScrolled = this.hasScrolledToNewMessageSeparator || this.hasScrolledToFocusedPost;
const postList = this.postListRef.current;
+ const postListScrollTop = postList.scrollTop;
+
+ if (postList.scrollHeight === this.previousScrollHeight) {
+ this.atBottom = this.checkBottom();
+ }
this.updateFloatingTimestamp();
@@ -452,7 +467,16 @@ export default class PostList extends React.PureComponent {
});
}
- if (postList.scrollTop <= 0.5 * postList.clientHeight && !this.state.loadingPosts && !this.state.atEnd && this.state.autoRetryEnable) {
+ let shouldLoadPosts = false;
+ const scrollHeightAoveFoldForLoad = LOADPOSTS_SCROLL_RATIO * (postList.scrollHeight - postList.clientHeight);
+
+ if (postListScrollTop < LOADPOSTS_MIN_HEIGHT) {
+ shouldLoadPosts = true;
+ } else if ((postListScrollTop < LOADPOSTS_MAX_HEIGHT) && (postListScrollTop < scrollHeightAoveFoldForLoad)) {
+ shouldLoadPosts = true;
+ }
+
+ if (shouldLoadPosts && !this.state.loadingPosts && !this.state.atEnd && this.state.autoRetryEnable) {
this.setState({loadingPosts: true});
this.loadMorePosts();
}
diff --git a/components/post_view/reaction/index.js b/components/post_view/reaction/index.js
index d43274eb565e..d1755860055f 100644
--- a/components/post_view/reaction/index.js
+++ b/components/post_view/reaction/index.js
@@ -3,10 +3,12 @@
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
+
import {removeReaction} from 'mattermost-redux/actions/posts';
import {getMissingProfilesByIds} from 'mattermost-redux/actions/users';
import {getCurrentUserId, makeGetProfilesForReactions, getCurrentUser} from 'mattermost-redux/selectors/entities/users';
import {getChannel} from 'mattermost-redux/selectors/entities/channels';
+import {getCustomEmojisByName} from 'mattermost-redux/selectors/entities/emojis';
import {getEmojiImageUrl} from 'mattermost-redux/utils/emoji_utils';
import {haveIChannelPermission} from 'mattermost-redux/selectors/entities/roles';
import Permissions from 'mattermost-redux/constants/permissions';
@@ -32,7 +34,8 @@ function makeMapStateToProps() {
if (Emoji.EmojiIndicesByAlias.has(ownProps.emojiName)) {
emoji = Emoji.Emojis[Emoji.EmojiIndicesByAlias.get(ownProps.emojiName)];
} else {
- emoji = ownProps.emojis.get(ownProps.emojiName);
+ const emojis = getCustomEmojisByName(state);
+ emoji = emojis.get(ownProps.emojiName);
}
let emojiImageUrl = '';
diff --git a/components/post_view/reaction_list/__snapshots__/reactions_list.test.jsx.snap b/components/post_view/reaction_list/__snapshots__/reactions_list.test.jsx.snap
new file mode 100644
index 000000000000..fc6493e2b809
--- /dev/null
+++ b/components/post_view/reaction_list/__snapshots__/reactions_list.test.jsx.snap
@@ -0,0 +1,91 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`components/ReactionList Should match snapshot for reactions and should call getReactionsForPost as there is no metadata 1`] = `
+
+
+
+
+
+
+
+
+ }
+ placement="top"
+ trigger={
+ Array [
+ "hover",
+ "focus",
+ ]
+ }
+ >
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+`;
diff --git a/components/profile_popover/index.js b/components/profile_popover/index.js
index 2ec4e94f1ff0..5ff7bcdfb1b8 100644
--- a/components/profile_popover/index.js
+++ b/components/profile_popover/index.js
@@ -5,19 +5,55 @@ import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
import {getCurrentUserId} from 'mattermost-redux/selectors/entities/users';
-import {getCurrentTeam} from 'mattermost-redux/selectors/entities/teams';
+import {
+ getCurrentTeam,
+ getCurrentRelativeTeamUrl,
+ getTeamMember,
+} from 'mattermost-redux/selectors/entities/teams';
+import {getCurrentChannel, getChannelMembersInChannels} from 'mattermost-redux/selectors/entities/channels';
import {openDirectChannelToUserId} from 'actions/channel_actions.jsx';
+import {getMembershipForCurrentEntities} from 'actions/views/profile_popover';
import {openModal} from 'actions/views/modals';
+
import {areTimezonesEnabledAndSupported} from 'selectors/general';
+import {getSelectedPost, getRhsState} from 'selectors/rhs';
import ProfilePopover from './profile_popover.jsx';
-function mapStateToProps(state) {
+function mapStateToProps(state, ownProps) {
+ const team = getCurrentTeam(state);
+ const teamMember = getTeamMember(state, team.id, ownProps.user.id) || {};
+
+ let isTeamAdmin = false;
+ if (teamMember != null && teamMember.scheme_admin) {
+ isTeamAdmin = true;
+ }
+
+ const selectedPost = getSelectedPost(state);
+ const currentChannel = getCurrentChannel(state);
+
+ let channelId;
+ if (selectedPost.exists === false) {
+ channelId = currentChannel.id;
+ } else {
+ channelId = selectedPost.channel_id;
+ }
+
+ const channelMember = getChannelMembersInChannels(state)[channelId][ownProps.user.id] || {};
+
+ let isChannelAdmin = false;
+ if (getRhsState(state) !== 'search' && channelMember != null && channelMember.scheme_admin) {
+ isChannelAdmin = true;
+ }
+
return {
- enableTimezone: areTimezonesEnabledAndSupported(state),
+ currentTeamId: team.id,
currentUserId: getCurrentUserId(state),
- teamUrl: '/' + getCurrentTeam(state).name,
+ enableTimezone: areTimezonesEnabledAndSupported(state),
+ isTeamAdmin,
+ isChannelAdmin,
+ teamUrl: getCurrentRelativeTeamUrl(state),
};
}
@@ -26,6 +62,7 @@ function mapDispatchToProps(dispatch) {
actions: bindActionCreators({
openDirectChannelToUserId,
openModal,
+ getMembershipForCurrentEntities,
}, dispatch),
};
}
diff --git a/components/profile_popover/profile_popover.jsx b/components/profile_popover/profile_popover.jsx
index ac51704a54f7..16edf4c30746 100644
--- a/components/profile_popover/profile_popover.jsx
+++ b/components/profile_popover/profile_popover.jsx
@@ -7,6 +7,7 @@ import {OverlayTrigger, Popover, Tooltip} from 'react-bootstrap';
import {FormattedMessage} from 'react-intl';
import EventEmitter from 'mattermost-redux/utils/event_emitter';
+import {Permissions} from 'mattermost-redux/constants';
import LocalDateTime from 'components/local_date_time';
import UserSettingsModal from 'components/user_settings/modal';
@@ -16,11 +17,15 @@ import Constants, {ModalIdentifiers} from 'utils/constants.jsx';
import * as Utils from 'utils/utils.jsx';
import Pluggable from 'plugins/pluggable';
+import AddUserToChannelModal from 'components/add_user_to_channel_modal';
+import ToggleModalButtonRedux from 'components/toggle_modal_button_redux';
+import TeamPermissionGate from 'components/permissions_gates/team_permission_gate';
+
/**
* The profile popover, or hovercard, that appears with user information when clicking
* on the username or profile picture of a user.
*/
-class ProfilePopover extends React.Component {
+class ProfilePopover extends React.PureComponent {
static getComponentName() {
return 'ProfilePopover';
}
@@ -53,20 +58,43 @@ class ProfilePopover extends React.Component {
*/
isRHS: PropTypes.bool,
+ currentTeamId: PropTypes.string.isRequired,
+
/**
* @internal
*/
hasMention: PropTypes.bool,
+ /**
+ * @internal
+ */
currentUserId: PropTypes.string.isRequired,
+
+ /**
+ * @internal
+ */
teamUrl: PropTypes.string.isRequired,
- ...Popover.propTypes,
+ /**
+ * @internal
+ */
+ isTeamAdmin: PropTypes.bool.isRequired,
+
+ /**
+ * @internal
+ */
+ isChannelAdmin: PropTypes.bool.isRequired,
+ /**
+ * @internal
+ */
actions: PropTypes.shape({
+ getMembershipForCurrentEntities: PropTypes.func.isRequired,
openDirectChannelToUserId: PropTypes.func.isRequired,
- openModal: PropTypes.func.isRequred,
+ openModal: PropTypes.func.isRequired,
}).isRequired,
+
+ ...Popover.propTypes,
}
static defaultProps = {
@@ -84,41 +112,9 @@ class ProfilePopover extends React.Component {
loadingDMChannel: -1,
};
}
- shouldComponentUpdate(nextProps) {
- if (!Utils.areObjectsEqual(nextProps.user, this.props.user)) {
- return true;
- }
-
- if (nextProps.src !== this.props.src) {
- return true;
- }
-
- if (nextProps.status !== this.props.status) {
- return true;
- }
-
- if (nextProps.isBusy !== this.props.isBusy) {
- return true;
- }
-
- // React-Bootstrap Forwarded Props from OverlayTrigger to Popover
- if (nextProps.arrowOffsetLeft !== this.props.arrowOffsetLeft) {
- return true;
- }
-
- if (nextProps.arrowOffsetTop !== this.props.arrowOffsetTop) {
- return true;
- }
-
- if (nextProps.positionLeft !== this.props.positionLeft) {
- return true;
- }
- if (nextProps.positionTop !== this.props.positionTop) {
- return true;
- }
-
- return false;
+ componentDidMount() {
+ this.props.actions.getMembershipForCurrentEntities(this.props.user.id);
}
handleShowDirectChannel(e) {
@@ -160,7 +156,7 @@ class ProfilePopover extends React.Component {
if (this.props.hide) {
this.props.hide();
}
- EventEmitter.emit('mention_key_click', this.props.user.username);
+ EventEmitter.emit('mention_key_click', this.props.user.username, this.props.isRHS);
}
handleEditAccountSettings(e) {
@@ -187,8 +183,11 @@ class ProfilePopover extends React.Component {
delete popoverProps.dispatch;
delete popoverProps.enableTimezone;
delete popoverProps.currentUserId;
+ delete popoverProps.currentTeamId;
delete popoverProps.teamUrl;
delete popoverProps.actions;
+ delete popoverProps.isTeamAdmin;
+ delete popoverProps.isChannelAdmin;
var dataContent = [];
dataContent.push(
@@ -203,6 +202,16 @@ class ProfilePopover extends React.Component {
);
const fullname = Utils.getFullName(this.props.user);
+
+ if (fullname || this.props.user.position) {
+ dataContent.push(
+
+ );
+ }
+
if (fullname) {
dataContent.push(
{fullname}
@@ -242,7 +251,7 @@ class ProfilePopover extends React.Component {
if (email) {
dataContent.push(
);
@@ -334,6 +343,42 @@ class ProfilePopover extends React.Component {
);
+
+ dataContent.push(
+
+
+
+ );
}
dataContent.push(
@@ -345,10 +390,20 @@ class ProfilePopover extends React.Component {
/>
);
+ let roleTitle;
+ if (Utils.isSystemAdmin(this.props.user.roles)) {
+ roleTitle = {Utils.localizeMessage('admin.permissions.roles.system_admin.name', 'System Admin')};
+ } else if (this.props.isTeamAdmin) {
+ roleTitle = {Utils.localizeMessage('admin.permissions.roles.team_admin.name', 'Team Admin')};
+ } else if (this.props.isChannelAdmin) {
+ roleTitle = {Utils.localizeMessage('admin.permissions.roles.channel_admin.name', 'Channel Admin')};
+ }
+
let title = `@${this.props.user.username}`;
if (this.props.hasMention) {
title = {title};
}
+ title = {title} {roleTitle};
return (
{
+ const baseProps = {
+ user: {
+ name: 'some name',
+ username: 'some_username',
+ },
+ src: 'src',
+ currentUserId: '',
+ currentTeamId: 'team_id',
+ isChannelAdmin: false,
+ isTeamAdmin: false,
+ teamUrl: '',
+ actions: {
+ getMembershipForCurrentEntities: jest.fn(),
+ openDirectChannelToUserId: jest.fn(),
+ openModal: jest.fn(),
+ },
+ };
+
+ test('should match snapshot', () => {
+ const props = {...baseProps};
+
+ const wrapper = shallow(
+
+ );
+ expect(wrapper).toMatchSnapshot();
+ });
+});
diff --git a/components/quick_switch_modal/__snapshots__/quick_switch_modal.test.jsx.snap b/components/quick_switch_modal/__snapshots__/quick_switch_modal.test.jsx.snap
index 5b4e8a837c0a..861a201b04d7 100644
--- a/components/quick_switch_modal/__snapshots__/quick_switch_modal.test.jsx.snap
+++ b/components/quick_switch_modal/__snapshots__/quick_switch_modal.test.jsx.snap
@@ -38,6 +38,7 @@ exports[`components/QuickSwitchModal should match snapshot 1`] = `
>
{
this.switchBox = input;
this.focusTextbox();
- }
+ };
onShow = () => {
this.setState({
@@ -91,7 +92,7 @@ export default class QuickSwitchModal extends React.PureComponent {
}
});
}
- }
+ };
onChange = (e) => {
this.setState({text: e.target.value});
@@ -104,14 +105,19 @@ export default class QuickSwitchModal extends React.PureComponent {
}
};
- handleSubmit = (selected) => {
+ handleSubmit = async (selected) => {
if (!selected) {
return;
}
if (this.state.mode === CHANNEL_MODE) {
+ const {joinChannelById, switchToChannel} = this.props.actions;
const selectedChannel = selected.channel;
- this.props.actions.switchToChannelById(selectedChannel.id).then((result) => {
+
+ if (selected.type === Constants.MENTION_MORE_CHANNELS && selectedChannel.type === Constants.OPEN_CHANNEL) {
+ await joinChannelById(selectedChannel.id);
+ }
+ switchToChannel(selectedChannel).then((result) => {
if (result.data) {
this.onHide();
}
@@ -258,10 +264,14 @@ export default class QuickSwitchModal extends React.PureComponent {
{header}
-
+
{help}
{
onHide: jest.fn(),
showTeamSwitcher: false,
actions: {
- switchToChannelById: jest.fn().mockImplementation(() => {
+ joinChannelById: jest.fn().mockResolvedValue({data: true}),
+ switchToChannel: jest.fn().mockImplementation(() => {
const error = {
message: 'Failed',
};
@@ -40,7 +41,7 @@ describe('components/QuickSwitchModal', () => {
wrapper.instance().handleSubmit();
expect(baseProps.onHide).not.toBeCalled();
- expect(props.actions.switchToChannelById).not.toBeCalled();
+ expect(props.actions.switchToChannel).not.toBeCalled();
});
it('should fail to switch to a channel', (done) => {
@@ -50,7 +51,7 @@ describe('components/QuickSwitchModal', () => {
const channel = {id: 'channel_id', userId: 'user_id', type: Constants.DM_CHANNEL};
wrapper.instance().handleSubmit({channel});
- expect(baseProps.actions.switchToChannelById).toBeCalledWith(channel.id);
+ expect(baseProps.actions.switchToChannel).toBeCalledWith(channel);
process.nextTick(() => {
expect(baseProps.onHide).not.toBeCalled();
done();
@@ -61,7 +62,8 @@ describe('components/QuickSwitchModal', () => {
const props = {
...baseProps,
actions: {
- switchToChannelById: jest.fn().mockImplementation(() => {
+ ...baseProps.actions,
+ switchToChannel: jest.fn().mockImplementation(() => {
const data = true;
return Promise.resolve({data});
}),
@@ -74,7 +76,66 @@ describe('components/QuickSwitchModal', () => {
const channel = {id: 'channel_id', userId: 'user_id', type: Constants.DM_CHANNEL};
wrapper.instance().handleSubmit({channel});
- expect(props.actions.switchToChannelById).toBeCalledWith(channel.id);
+ expect(props.actions.switchToChannel).toBeCalledWith(channel);
+ process.nextTick(() => {
+ expect(baseProps.onHide).toBeCalled();
+ done();
+ });
+ });
+
+ it('should join the channel before switching', (done) => {
+ const props = {
+ ...baseProps,
+ actions: {
+ ...baseProps.actions,
+ switchToChannel: jest.fn().mockImplementation(() => {
+ const data = true;
+ return Promise.resolve({data});
+ }),
+ },
+ };
+
+ const wrapper = shallow(
+
+ );
+
+ const channel = {id: 'channel_id', name: 'test', type: Constants.OPEN_CHANNEL};
+ const selected = {
+ type: Constants.MENTION_MORE_CHANNELS,
+ channel,
+ };
+ wrapper.instance().handleSubmit(selected);
+ expect(props.actions.joinChannelById).toBeCalledWith(channel.id);
+ process.nextTick(() => {
+ expect(props.actions.switchToChannel).toBeCalledWith(channel);
+ done();
+ });
+ });
+
+ it('should not join the channel before switching if channel is DM', (done) => {
+ const props = {
+ ...baseProps,
+ actions: {
+ ...baseProps.actions,
+ switchToChannel: jest.fn().mockImplementation(() => {
+ const data = true;
+ return Promise.resolve({data});
+ }),
+ },
+ };
+
+ const wrapper = shallow(
+
+ );
+
+ const channel = {id: 'channel_id', name: 'test', type: Constants.DM_CHANNEL};
+ const selected = {
+ type: Constants.MENTION_MORE_CHANNELS,
+ channel,
+ };
+ wrapper.instance().handleSubmit(selected);
+ expect(props.actions.joinChannelById).not.toHaveBeenCalled();
+ expect(props.actions.switchToChannel).toBeCalledWith(channel);
process.nextTick(() => {
expect(baseProps.onHide).toBeCalled();
done();
diff --git a/components/rhs_comment/rhs_comment.jsx b/components/rhs_comment/rhs_comment.jsx
index 356420597d61..28957aed807f 100644
--- a/components/rhs_comment/rhs_comment.jsx
+++ b/components/rhs_comment/rhs_comment.jsx
@@ -21,7 +21,7 @@ import PostProfilePicture from 'components/post_profile_picture';
import FailedPostOptions from 'components/post_view/failed_post_options';
import PostFlagIcon from 'components/post_view/post_flag_icon';
import PostTime from 'components/post_view/post_time';
-import ReactionListContainer from 'components/post_view/reaction_list';
+import ReactionList from 'components/post_view/reaction_list';
import EmojiIcon from 'components/svg/emoji_icon';
import ChannelPermissionGate from 'components/permissions_gates/channel_permission_gate';
import MessageWithAdditionalContent from 'components/message_with_additional_content';
@@ -477,7 +477,7 @@ export default class RhsComment extends React.Component {
/>
{fileAttachment}
-
diff --git a/components/root/root.jsx b/components/root/root.jsx
index 31d952367e8c..a9b80ff4afd6 100644
--- a/components/root/root.jsx
+++ b/components/root/root.jsx
@@ -146,7 +146,7 @@ export default class Root extends React.Component {
const diagnosticId = this.props.diagnosticId;
/*eslint-disable */
- if (segmentKey != null && segmentKey !== '' && this.props.diagnosticsEnabled) {
+ if (segmentKey != null && segmentKey !== '' && !segmentKey.startsWith('placeholder') && this.props.diagnosticsEnabled) {
!function(){var analytics=global.window.analytics=global.window.analytics||[];if(!analytics.initialize)if(analytics.invoked)window.console&&console.error&&console.error("Segment snippet included twice.");else{analytics.invoked=!0;analytics.methods=["trackSubmit","trackClick","trackLink","trackForm","pageview","identify","group","track","ready","alias","page","once","off","on"];analytics.factory=function(t){return function(...args){var e=Array.prototype.slice.call(args);e.unshift(t);analytics.push(e);return analytics}};for(var t=0;t {
initializePlugins();
+ if (this.props.location.pathname === '/' && this.props.noAccounts) {
+ this.props.history.push('/signup_user_complete');
+ }
+
this.setState({configLoaded: true});
};
if (global.Intl) {
diff --git a/components/root/root.test.jsx b/components/root/root.test.jsx
index 75b308f41b52..1273e5eef8d4 100644
--- a/components/root/root.test.jsx
+++ b/components/root/root.test.jsx
@@ -33,6 +33,27 @@ describe('components/Root', () => {
},
};
+ test('should load config and license on mount and redirect to sign-up page', () => {
+ const props = {
+ ...baseProps,
+ noAccounts: true,
+ actions: {
+ ...baseProps.actions,
+ loadMeAndConfig: jest.fn(async () => [{}, {}, {}]),
+ },
+ history: {
+ push: jest.fn(),
+ },
+ };
+
+ const wrapper = shallow();
+
+ expect(props.actions.loadMeAndConfig).toHaveBeenCalledTimes(1);
+
+ wrapper.instance().onConfigLoaded();
+ expect(props.history.push).toHaveBeenCalledWith('/signup_user_complete');
+ });
+
test('should load user, config, and license on mount and redirect to defaultTeam on success', (done) => {
const props = {
...baseProps,
diff --git a/components/save_button.jsx b/components/save_button.jsx
index 73bfd3f6fcc4..8f4255b3c2ff 100644
--- a/components/save_button.jsx
+++ b/components/save_button.jsx
@@ -6,6 +6,8 @@ import React from 'react';
import {localizeMessage} from 'utils/utils.jsx';
+import LoadingWrapper from 'components/widgets/loading/loading_wrapper.jsx';
+
export default class SaveButton extends React.PureComponent {
static propTypes = {
saving: PropTypes.bool.isRequired,
@@ -27,21 +29,6 @@ export default class SaveButton extends React.PureComponent {
render() {
const {saving, disabled, savingMessage, defaultMessage, btnClass, extraClasses, ...props} = this.props; // eslint-disable-line no-use-before-define
- let contents;
- if (saving) {
- contents = (
-
-
- {savingMessage}
-
- );
- } else {
- contents = defaultMessage;
- }
-
let className = 'save-button btn';
if (!disabled || saving) {
className += ' ' + btnClass;
@@ -59,7 +46,12 @@ export default class SaveButton extends React.PureComponent {
disabled={disabled}
{...props}
>
- {contents}
+
+ {defaultMessage}
+
);
}
diff --git a/components/save_button.test.jsx b/components/save_button.test.jsx
index 7fb15977493a..7de5f635524b 100644
--- a/components/save_button.test.jsx
+++ b/components/save_button.test.jsx
@@ -17,11 +17,10 @@ describe('components/SaveButton', () => {
);
expect(wrapper).toMatchSnapshot();
- expect(wrapper.find('button').first().text()).toBe('Save');
expect(wrapper.find('button').first().props().disabled).toBe(false);
wrapper.setProps({defaultMessage: 'Go'});
- expect(wrapper.find('button').first().text()).toBe('Go');
+ expect(wrapper).toMatchSnapshot();
});
test('should match snapshot, on savingMessage', () => {
@@ -31,11 +30,10 @@ describe('components/SaveButton', () => {
);
expect(wrapper).toMatchSnapshot();
- expect(wrapper.find('button').first().text()).toBe('Saving');
expect(wrapper.find('button').first().props().disabled).toBe(true);
wrapper.setProps({savingMessage: 'Saving Config...'});
- expect(wrapper.find('button').first().text()).toBe('Saving Config...');
+ expect(wrapper).toMatchSnapshot();
});
test('should match snapshot, extraClasses', () => {
diff --git a/components/search_bar/search_bar.jsx b/components/search_bar/search_bar.jsx
index ef983307f361..e8b821a1177d 100644
--- a/components/search_bar/search_bar.jsx
+++ b/components/search_bar/search_bar.jsx
@@ -19,6 +19,7 @@ import SearchHint from 'components/search_hint/search_hint';
import FlagIcon from 'components/svg/flag_icon';
import MentionsIcon from 'components/svg/mentions_icon';
import SearchIcon from 'components/svg/search_icon';
+import LoadingSpinner from 'components/widgets/loading/loading_spinner.jsx';
const {KeyCodes} = Constants;
@@ -86,7 +87,7 @@ export default class SearchBar extends React.Component {
// when focus is released from the search box.
setTimeout(() => {
this.setState({focused: false});
- }, 100);
+ }, 200);
}
handleClear = () => {
@@ -167,16 +168,6 @@ export default class SearchBar extends React.Component {
}
render() {
- var isSearchingTerm = null;
- if (this.props.isSearchingTerm) {
- isSearchingTerm = (
-
- );
- }
-
let mentionBtn;
let flagBtn;
if (this.props.showMentionFlagBtns) {
@@ -212,10 +203,7 @@ export default class SearchBar extends React.Component {
);
}
- let clearClass = 'sidebar__search-clear';
- if (!this.props.isSearchingTerm && this.props.searchTerms && this.props.searchTerms.trim() !== '') {
- clearClass += ' visible';
- }
+ const showClear = !this.props.isSearchingTerm && this.props.searchTerms && this.props.searchTerms.trim() !== '';
let searchFormClass = 'search__form';
if (this.state.focused) {
@@ -278,26 +266,27 @@ export default class SearchBar extends React.Component {
delayInputUpdate={true}
renderDividers={true}
/>
-
- {isSearchingTerm}
+
+ {'×'}
+
+
+ 