summaryrefslogtreecommitdiffstats
path: root/web/react/components
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/components')
-rw-r--r--web/react/components/center_panel.jsx9
-rw-r--r--web/react/components/delete_post_modal.jsx52
-rw-r--r--web/react/components/post_body_additional_content.jsx40
-rw-r--r--web/react/components/post_focus_view.jsx2
-rw-r--r--web/react/components/posts_view.jsx2
-rw-r--r--web/react/components/posts_view_container.jsx16
-rw-r--r--web/react/components/rhs_thread.jsx10
-rw-r--r--web/react/components/search_results.jsx20
-rw-r--r--web/react/components/tutorial/tutorial_intro_screens.jsx42
-rw-r--r--web/react/components/user_settings/manage_command_hooks.jsx2
-rw-r--r--web/react/components/user_settings/manage_incoming_hooks.jsx2
-rw-r--r--web/react/components/user_settings/manage_outgoing_hooks.jsx2
-rw-r--r--web/react/components/user_settings/user_settings_advanced.jsx8
13 files changed, 112 insertions, 95 deletions
diff --git a/web/react/components/center_panel.jsx b/web/react/components/center_panel.jsx
index 97c615768..2422588cf 100644
--- a/web/react/components/center_panel.jsx
+++ b/web/react/components/center_panel.jsx
@@ -33,7 +33,8 @@ export default class CenterPanel extends React.Component {
this.state = {
showTutorialScreens: tutorialStep === TutorialSteps.INTRO_SCREENS,
showPostFocus: ChannelStore.getPostMode() === ChannelStore.POST_MODE_FOCUS,
- user: UserStore.getCurrentUser()
+ user: UserStore.getCurrentUser(),
+ profiles: JSON.parse(JSON.stringify(UserStore.getProfiles()))
};
}
componentDidMount() {
@@ -54,7 +55,7 @@ export default class CenterPanel extends React.Component {
this.setState({showPostFocus: ChannelStore.getPostMode() === ChannelStore.POST_MODE_FOCUS});
}
onUserChange() {
- this.setState({user: UserStore.getCurrentUser()});
+ this.setState({user: UserStore.getCurrentUser(), profiles: JSON.parse(JSON.stringify(UserStore.getProfiles()))});
}
render() {
const channel = ChannelStore.getCurrent();
@@ -65,7 +66,7 @@ export default class CenterPanel extends React.Component {
postsContainer = <TutorialIntroScreens/>;
createPost = null;
} else if (this.state.showPostFocus) {
- postsContainer = <PostFocusView/>;
+ postsContainer = <PostFocusView profiles={this.state.profiles}/>;
handleClick = function clickHandler(e) {
e.preventDefault();
@@ -87,7 +88,7 @@ export default class CenterPanel extends React.Component {
</div>
);
} else {
- postsContainer = <PostsViewContainer/>;
+ postsContainer = <PostsViewContainer profiles={this.state.profiles}/>;
createPost = (
<div
className='post-create__container'
diff --git a/web/react/components/delete_post_modal.jsx b/web/react/components/delete_post_modal.jsx
index f8e3e406a..5b2dd1197 100644
--- a/web/react/components/delete_post_modal.jsx
+++ b/web/react/components/delete_post_modal.jsx
@@ -5,7 +5,6 @@ import * as Client from '../utils/client.jsx';
import PostStore from '../stores/post_store.jsx';
import ModalStore from '../stores/modal_store.jsx';
var Modal = ReactBootstrap.Modal;
-import * as Utils from '../utils/utils.jsx';
import * as AsyncClient from '../utils/async_client.jsx';
import AppDispatcher from '../dispatcher/app_dispatcher.jsx';
import Constants from '../utils/constants.jsx';
@@ -21,9 +20,6 @@ export default class DeletePostModal extends React.Component {
this.handleDelete = this.handleDelete.bind(this);
this.handleToggle = this.handleToggle.bind(this);
this.handleHide = this.handleHide.bind(this);
- this.onListenerChange = this.onListenerChange.bind(this);
-
- this.selectedList = null;
this.state = {
show: false,
@@ -35,11 +31,9 @@ export default class DeletePostModal extends React.Component {
componentDidMount() {
ModalStore.addModalListener(ActionTypes.TOGGLE_DELETE_POST_MODAL, this.handleToggle);
- PostStore.addSelectedPostChangeListener(this.onListenerChange);
}
componentWillUnmount() {
- PostStore.removeSelectedPostChangeListener(this.onListenerChange);
ModalStore.removeModalListener(ActionTypes.TOGGLE_DELETE_POST_MODAL, this.handleToggle);
}
@@ -56,40 +50,15 @@ export default class DeletePostModal extends React.Component {
this.state.post.channel_id,
this.state.post.id,
() => {
- var selectedList = this.selectedList;
-
- if (selectedList && selectedList.order && selectedList.order.length > 0) {
- var selectedPost = selectedList.posts[selectedList.order[0]];
- if ((selectedPost.id === this.state.post.id && !this.state.root_id) || selectedPost.root_id === this.state.post.id) {
- AppDispatcher.handleServerAction({
- type: ActionTypes.RECEIVED_SEARCH,
- results: null
- });
-
- AppDispatcher.handleServerAction({
- type: ActionTypes.RECEIVED_POST_SELECTED,
- postId: null
- });
- } else if (selectedPost.id === this.state.post.id && this.state.root_id) {
- if (selectedPost.root_id && selectedPost.root_id.length > 0 && selectedList.posts[selectedPost.root_id]) {
- selectedList.order = [selectedPost.root_id];
- delete selectedList.posts[selectedPost.id];
-
- AppDispatcher.handleServerAction({
- type: ActionTypes.RECEIVED_POST_SELECTED,
- postId: selectedPost.root_id
- });
-
- AppDispatcher.handleServerAction({
- type: ActionTypes.RECEIVED_SEARCH,
- results: null
- });
- }
- }
- }
-
PostStore.deletePost(this.state.post);
AsyncClient.getPosts(this.state.post.channel_id);
+
+ if (this.state.post.id === PostStore.getSelectedPostId()) {
+ AppDispatcher.handleServerAction({
+ type: ActionTypes.RECEIVED_POST_SELECTED,
+ postId: null
+ });
+ }
},
(err) => {
AsyncClient.dispatchError(err, 'deletePost');
@@ -112,13 +81,6 @@ export default class DeletePostModal extends React.Component {
this.setState({show: false});
}
- onListenerChange() {
- var newList = PostStore.getSelectedPost();
- if (!Utils.areObjectsEqual(this.selectedList, newList)) {
- this.selectedList = newList;
- }
- }
-
render() {
if (!this.state.post) {
return null;
diff --git a/web/react/components/post_body_additional_content.jsx b/web/react/components/post_body_additional_content.jsx
index a76c59fb3..c2a928f3b 100644
--- a/web/react/components/post_body_additional_content.jsx
+++ b/web/react/components/post_body_additional_content.jsx
@@ -16,16 +16,28 @@ export default class PostBodyAdditionalContent extends React.Component {
this.getSlackAttachment = this.getSlackAttachment.bind(this);
this.getOEmbedProvider = this.getOEmbedProvider.bind(this);
+ this.generateEmbed = this.generateEmbed.bind(this);
+ this.toggleEmbedVisibility = this.toggleEmbedVisibility.bind(this);
+
+ this.state = {
+ embedVisible: true
+ };
}
- shouldComponentUpdate(nextProps) {
+ shouldComponentUpdate(nextProps, nextState) {
if (!Utils.areObjectsEqual(nextProps.post, this.props.post)) {
return true;
}
-
+ if (nextState.embedVisible !== this.state.embedVisible) {
+ return true;
+ }
return false;
}
+ toggleEmbedVisibility() {
+ this.setState({embedVisible: !this.state.embedVisible});
+ }
+
getSlackAttachment() {
let attachments = [];
if (this.props.post.props && this.props.post.props.attachments) {
@@ -51,7 +63,7 @@ export default class PostBodyAdditionalContent extends React.Component {
return null;
}
- render() {
+ generateEmbed() {
if (this.props.post.type === 'slack_attachment') {
return this.getSlackAttachment();
}
@@ -98,6 +110,28 @@ export default class PostBodyAdditionalContent extends React.Component {
return null;
}
+
+ render() {
+ var generateEmbed = this.generateEmbed();
+ if (generateEmbed) {
+ return (
+ <div>
+ <a className='post__embed-visibility'
+ data-expanded={this.state.embedVisible}
+ aria-label='Toggle Embed Visibility'
+ onClick={this.toggleEmbedVisibility}
+ >
+ </a>
+ <div className='post__embed-container'
+ hidden={!this.state.embedVisible}
+ >
+ {generateEmbed}
+ </div>
+ </div>
+ );
+ }
+ return null;
+ }
}
PostBodyAdditionalContent.propTypes = {
diff --git a/web/react/components/post_focus_view.jsx b/web/react/components/post_focus_view.jsx
index b9b6acd5f..44a0bae09 100644
--- a/web/react/components/post_focus_view.jsx
+++ b/web/react/components/post_focus_view.jsx
@@ -105,6 +105,7 @@ export default class PostFocusView extends React.Component {
introText={this.getIntroMessage()}
messageSeparatorTime={0}
postsToHighlight={postsToHighlight}
+ profiles={this.props.profiles}
/>
</div>
);
@@ -114,4 +115,5 @@ PostFocusView.defaultProps = {
};
PostFocusView.propTypes = {
+ profiles: React.PropTypes.object
};
diff --git a/web/react/components/posts_view.jsx b/web/react/components/posts_view.jsx
index 1ea7711ea..9a1673483 100644
--- a/web/react/components/posts_view.jsx
+++ b/web/react/components/posts_view.jsx
@@ -321,7 +321,7 @@ export default class PostsView extends React.Component {
if (this.refs.newMessageSeparator) {
var objDiv = this.refs.postlist;
objDiv.scrollTop = this.refs.newMessageSeparator.offsetTop; //scrolls node to top of Div
- } else {
+ } else if (this.refs.postlist) {
this.refs.postlist.scrollTop = this.refs.postlist.scrollHeight;
}
});
diff --git a/web/react/components/posts_view_container.jsx b/web/react/components/posts_view_container.jsx
index 1b14e8681..92d658b55 100644
--- a/web/react/components/posts_view_container.jsx
+++ b/web/react/components/posts_view_container.jsx
@@ -6,7 +6,6 @@ import LoadingScreen from './loading_screen.jsx';
import ChannelStore from '../stores/channel_store.jsx';
import PostStore from '../stores/post_store.jsx';
-import UserStore from '../stores/user_store.jsx';
import * as Utils from '../utils/utils.jsx';
import * as EventHelpers from '../dispatcher/event_helpers.jsx';
@@ -25,13 +24,11 @@ export default class PostsViewContainer extends React.Component {
this.handlePostsViewScroll = this.handlePostsViewScroll.bind(this);
this.loadMorePostsTop = this.loadMorePostsTop.bind(this);
this.handlePostsViewJumpRequest = this.handlePostsViewJumpRequest.bind(this);
- this.onUserChange = this.onUserChange.bind(this);
const currentChannelId = ChannelStore.getCurrentId();
const state = {
scrollType: PostsView.SCROLL_TYPE_BOTTOM,
- scrollPost: null,
- profiles: JSON.parse(JSON.stringify(UserStore.getProfiles()))
+ scrollPost: null
};
if (currentChannelId) {
Object.assign(state, {
@@ -57,14 +54,12 @@ export default class PostsViewContainer extends React.Component {
ChannelStore.addLeaveListener(this.onChannelLeave);
PostStore.addChangeListener(this.onPostsChange);
PostStore.addPostsViewJumpListener(this.handlePostsViewJumpRequest);
- UserStore.addChangeListener(this.onUserChange);
}
componentWillUnmount() {
ChannelStore.removeChangeListener(this.onChannelChange);
ChannelStore.removeLeaveListener(this.onChannelLeave);
PostStore.removeChangeListener(this.onPostsChange);
PostStore.removePostsViewJumpListener(this.handlePostsViewJumpRequest);
- UserStore.removeChangeListener(this.onUserChange);
}
handlePostsViewJumpRequest(type, post) {
switch (type) {
@@ -140,9 +135,6 @@ export default class PostsViewContainer extends React.Component {
atTop[this.state.currentChannelIndex] = PostStore.getVisibilityAtTop(currentChannelId);
this.setState({postLists, atTop});
}
- onUserChange() {
- this.setState({profiles: JSON.parse(JSON.stringify(UserStore.getProfiles()))});
- }
getChannelPosts(id) {
return PostStore.getVisiblePosts(id);
}
@@ -188,7 +180,7 @@ export default class PostsViewContainer extends React.Component {
showMoreMessagesBottom={false}
introText={channel ? createChannelIntroMessage(channel) : null}
messageSeparatorTime={this.state.currentLastViewed}
- profiles={this.state.profiles}
+ profiles={this.props.profiles}
/>
);
if (!postLists[i] && isActive) {
@@ -208,3 +200,7 @@ export default class PostsViewContainer extends React.Component {
);
}
}
+
+PostsViewContainer.propTypes = {
+ profiles: React.PropTypes.object
+};
diff --git a/web/react/components/rhs_thread.jsx b/web/react/components/rhs_thread.jsx
index 4d770287c..292624846 100644
--- a/web/react/components/rhs_thread.jsx
+++ b/web/react/components/rhs_thread.jsx
@@ -91,9 +91,11 @@ export default class RhsThread extends React.Component {
});
}
onPostChange() {
- const selected = PostStore.getSelectedPost();
- const posts = PostStore.getSelectedPostThread();
- this.setState({posts, selected});
+ if (this.mounted) {
+ const selected = PostStore.getSelectedPost();
+ const posts = PostStore.getSelectedPostThread();
+ this.setState({posts, selected});
+ }
}
onUserChange() {
const profiles = JSON.parse(JSON.stringify(UserStore.getProfiles()));
@@ -185,7 +187,7 @@ export default class RhsThread extends React.Component {
<div className='post-right-comments-container'>
{postsArray.map(function mapPosts(comPost) {
let p;
- if (UserStore.getCurrentId() === selected.user_id) {
+ if (UserStore.getCurrentId() === comPost.user_id) {
p = UserStore.getCurrentUser();
} else {
p = profiles[comPost.user_id];
diff --git a/web/react/components/search_results.jsx b/web/react/components/search_results.jsx
index 55ece2c97..8985063a0 100644
--- a/web/react/components/search_results.jsx
+++ b/web/react/components/search_results.jsx
@@ -61,7 +61,15 @@ export default class SearchResults extends React.Component {
}
shouldComponentUpdate(nextProps, nextState) {
- return !Utils.areObjectsEqual(this.props, nextProps) || !Utils.areObjectsEqual(this.state, nextState);
+ if (!Utils.areObjectsEqual(this.props, nextProps)) {
+ return true;
+ }
+
+ if (!Utils.areObjectsEqual(this.state, nextState)) {
+ return true;
+ }
+
+ return false;
}
componentDidUpdate() {
@@ -143,13 +151,19 @@ export default class SearchResults extends React.Component {
);
} else {
ctls = results.order.map(function mymap(id) {
- var post = results.posts[id];
+ const post = results.posts[id];
+ let profile;
+ if (UserStore.getCurrentId() === post.user_id) {
+ profile = UserStore.getCurrentUser();
+ } else {
+ profile = profiles[post.user_id];
+ }
return (
<SearchResultsItem
key={post.id}
channel={this.state.channels.get(post.channel_id)}
post={post}
- user={profiles[post.user_id]}
+ user={profile}
term={searchTerm}
isMentionSearch={this.props.isMentionSearch}
/>
diff --git a/web/react/components/tutorial/tutorial_intro_screens.jsx b/web/react/components/tutorial/tutorial_intro_screens.jsx
index 2bacdeb28..45ebceb28 100644
--- a/web/react/components/tutorial/tutorial_intro_screens.jsx
+++ b/web/react/components/tutorial/tutorial_intro_screens.jsx
@@ -211,26 +211,28 @@ export default class TutorialIntroScreens extends React.Component {
<div className='tutorial__content'>
<div className='tutorial__steps'>
{screen}
- <button
- className='btn btn-primary'
- tabIndex='1'
- onClick={this.handleNext}
- >
- <FormattedMessage
- id='tutorial_intro.next'
- defaultMessage='Next'
- />
- </button>
- <a
- className='tutorial-skip'
- href='#'
- onClick={this.skipTutorial}
- >
- <FormattedMessage
- id='tutorial_intro.skip'
- defaultMessage='Skip tutorial'
- />
- </a>
+ <div className='tutorial__footer'>
+ <button
+ className='btn btn-primary'
+ tabIndex='1'
+ onClick={this.handleNext}
+ >
+ <FormattedMessage
+ id='tutorial_intro.next'
+ defaultMessage='Next'
+ />
+ </button>
+ <a
+ className='tutorial-skip'
+ href='#'
+ onClick={this.skipTutorial}
+ >
+ <FormattedMessage
+ id='tutorial_intro.skip'
+ defaultMessage='Skip tutorial'
+ />
+ </a>
+ </div>
</div>
</div>
</div>
diff --git a/web/react/components/user_settings/manage_command_hooks.jsx b/web/react/components/user_settings/manage_command_hooks.jsx
index bd0659a47..2947138be 100644
--- a/web/react/components/user_settings/manage_command_hooks.jsx
+++ b/web/react/components/user_settings/manage_command_hooks.jsx
@@ -420,7 +420,7 @@ export default class ManageCommandCmds extends React.Component {
<div key='addCommandCmd'>
<FormattedHTMLMessage
id='user.settings.cmds.add_desc'
- defaultMessage='Create slash commands to send events to external integrations and receive a response. For example typing `/patient Joe Smith` could bring back search results from your internal health records management system for the name “Joe Smith”. Please see <a href="http://docs.mattermost.com/developer/slash-commands.html">Slash commands documentation</a> for detailed instructions.'
+ defaultMessage='Create slash commands to send events to external integrations and receive a response. For example typing `/patient Joe Smith` could bring back search results from your internal health records management system for the name “Joe Smith”. Please see <a href="http://docs.mattermost.com/developer/slash-commands.html">Slash commands documentation</a> for detailed instructions. View all slash commands configured on this team below.'
/>
<div><label className='control-label padding-top x2'>
<FormattedMessage
diff --git a/web/react/components/user_settings/manage_incoming_hooks.jsx b/web/react/components/user_settings/manage_incoming_hooks.jsx
index 68e99be7d..79a71b5ac 100644
--- a/web/react/components/user_settings/manage_incoming_hooks.jsx
+++ b/web/react/components/user_settings/manage_incoming_hooks.jsx
@@ -183,7 +183,7 @@ export default class ManageIncomingHooks extends React.Component {
<div key='addIncomingHook'>
<FormattedHTMLMessage
id='user.settings.hooks_in.description'
- defaultMessage='Create webhook URLs for use in external integrations. Please see <a href="http://docs.mattermost.com/developer/webhooks-incoming.html" target="_blank">incoming webhooks documentation</a> to learn more.'
+ defaultMessage='Create webhook URLs for use in external integrations. Please see <a href="http://docs.mattermost.com/developer/webhooks-incoming.html" target="_blank">incoming webhooks documentation</a> to learn more. View all incoming webhooks configured on this team below.'
/>
<div><label className='control-label padding-top x2'>
<FormattedMessage
diff --git a/web/react/components/user_settings/manage_outgoing_hooks.jsx b/web/react/components/user_settings/manage_outgoing_hooks.jsx
index 9c3a60ed5..487254d15 100644
--- a/web/react/components/user_settings/manage_outgoing_hooks.jsx
+++ b/web/react/components/user_settings/manage_outgoing_hooks.jsx
@@ -284,7 +284,7 @@ class ManageOutgoingHooks extends React.Component {
<div key='addOutgoingHook'>
<FormattedHTMLMessage
id='user.settings.hooks_out.addDescription'
- defaultMessage='Create webhooks to send new message events to an external integration. Please see <a href="http://docs.mattermost.com/developer/webhooks-outgoing.html" target="_blank">outgoing webhooks documentation</a> to learn more.'
+ defaultMessage='Create webhooks to send new message events to an external integration. Please see <a href="http://docs.mattermost.com/developer/webhooks-outgoing.html" target="_blank">outgoing webhooks documentation</a> to learn more. View all outgoing webhooks configured on this team below.'
/>
<div><label className='control-label padding-top x2'>
<FormattedMessage
diff --git a/web/react/components/user_settings/user_settings_advanced.jsx b/web/react/components/user_settings/user_settings_advanced.jsx
index e513f81d2..efaf63ada 100644
--- a/web/react/components/user_settings/user_settings_advanced.jsx
+++ b/web/react/components/user_settings/user_settings_advanced.jsx
@@ -47,6 +47,10 @@ const holders = defineMessages({
EMBED_PREVIEW: {
id: 'user.settings.advance.embed_preview',
defaultMessage: 'Show preview snippet of links below message'
+ },
+ EMBED_TOGGLE: {
+ id: 'user.settings.advance.embed_toggle',
+ defaultMessage: 'Show toggle for all embed previews'
}
});
@@ -240,7 +244,7 @@ class AdvancedSettingsDisplay extends React.Component {
this.toggleFeature(feature.label, e.target.checked);
}}
/>
- {formatMessage({id: 'user.settings.advance.' + feature.label})}
+ {formatMessage(holders[key])}
</label>
</div>
</div>
@@ -334,4 +338,4 @@ AdvancedSettingsDisplay.propTypes = {
collapseModal: React.PropTypes.func.isRequired
};
-export default injectIntl(AdvancedSettingsDisplay); \ No newline at end of file
+export default injectIntl(AdvancedSettingsDisplay);
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-09-20 04:26:42 +0000