summaryrefslogtreecommitdiffstats
path: root/web/react/components
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/components')
-rw-r--r--web/react/components/channel_header.jsx8
-rw-r--r--web/react/components/message_wrapper.jsx10
-rw-r--r--web/react/components/navbar.jsx2
-rw-r--r--web/react/components/new_channel_modal.jsx2
-rw-r--r--web/react/components/post_body.jsx8
-rw-r--r--web/react/components/rhs_comment.jsx10
-rw-r--r--web/react/components/rhs_root_post.jsx7
-rw-r--r--web/react/components/search_results_item.jsx16
8 files changed, 41 insertions, 22 deletions
diff --git a/web/react/components/channel_header.jsx b/web/react/components/channel_header.jsx
index db23a5831..0dbbc20d4 100644
--- a/web/react/components/channel_header.jsx
+++ b/web/react/components/channel_header.jsx
@@ -8,6 +8,7 @@ const SocketStore = require('../stores/socket_store.jsx');
const NavbarSearchBox = require('./search_bar.jsx');
const AsyncClient = require('../utils/async_client.jsx');
const Client = require('../utils/client.jsx');
+const TextFormatting = require('../utils/text_formatting.jsx');
const Utils = require('../utils/utils.jsx');
const MessageWrapper = require('./message_wrapper.jsx');
const PopoverListMembers = require('./popover_list_members.jsx');
@@ -107,7 +108,6 @@ export default class ChannelHeader extends React.Component {
}
const channel = this.state.channel;
- const description = Utils.textToJsx(channel.description, {singleline: true, noMentionHighlight: true});
const popoverContent = React.renderToString(<MessageWrapper message={channel.description}/>);
let channelTitle = channel.display_name;
const currentId = UserStore.getCurrentId();
@@ -326,9 +326,9 @@ export default class ChannelHeader extends React.Component {
data-toggle='popover'
data-content={popoverContent}
className='description'
- >
- {description}
- </div>
+ onClick={TextFormatting.handleClick}
+ dangerouslySetInnerHTML={{__html: TextFormatting.formatText(channel.description, {singleline: true, mentionHighlight: false})}}
+ />
</div>
</th>
<th>
diff --git a/web/react/components/message_wrapper.jsx b/web/react/components/message_wrapper.jsx
index bce305853..5adf4f228 100644
--- a/web/react/components/message_wrapper.jsx
+++ b/web/react/components/message_wrapper.jsx
@@ -1,7 +1,7 @@
// Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved.
// See License.txt for license information.
-var Utils = require('../utils/utils.jsx');
+var TextFormatting = require('../utils/text_formatting.jsx');
export default class MessageWrapper extends React.Component {
constructor(props) {
@@ -10,10 +10,7 @@ export default class MessageWrapper extends React.Component {
}
render() {
if (this.props.message) {
- var inner = Utils.textToJsx(this.props.message, this.props.options);
- return (
- <div>{inner}</div>
- );
+ return <div dangerouslySetInnerHTML={{__html: TextFormatting.formatText(this.props.message, this.props.options)}}/>;
}
return <div/>;
@@ -21,8 +18,7 @@ export default class MessageWrapper extends React.Component {
}
MessageWrapper.defaultProps = {
- message: null,
- options: null
+ message: ''
};
MessageWrapper.propTypes = {
message: React.PropTypes.string,
diff --git a/web/react/components/navbar.jsx b/web/react/components/navbar.jsx
index 2258bf2b3..cae9f12e4 100644
--- a/web/react/components/navbar.jsx
+++ b/web/react/components/navbar.jsx
@@ -332,7 +332,7 @@ export default class Navbar extends React.Component {
popoverContent = React.renderToString(
<MessageWrapper
message={channel.description}
- options={{singleline: true, noMentionHighlight: true}}
+ options={{singleline: true, mentionHighlight: false}}
/>
);
isAdmin = this.state.member.roles.indexOf('admin') > -1;
diff --git a/web/react/components/new_channel_modal.jsx b/web/react/components/new_channel_modal.jsx
index 2bf645dc5..f3fb8da2a 100644
--- a/web/react/components/new_channel_modal.jsx
+++ b/web/react/components/new_channel_modal.jsx
@@ -127,7 +127,7 @@ export default class NewChannelModal extends React.Component {
href='#'
onClick={this.props.onChangeURLPressed}
>
- {'change this URL'}
+ {'Edit'}
</a>
{')'}
</p>
diff --git a/web/react/components/post_body.jsx b/web/react/components/post_body.jsx
index d9b8f20ce..df4ed3d57 100644
--- a/web/react/components/post_body.jsx
+++ b/web/react/components/post_body.jsx
@@ -5,6 +5,7 @@ const FileAttachmentList = require('./file_attachment_list.jsx');
const UserStore = require('../stores/user_store.jsx');
const Utils = require('../utils/utils.jsx');
const Constants = require('../utils/constants.jsx');
+const TextFormatting = require('../utils/text_formatting.jsx');
const twemoji = require('twemoji');
export default class PostBody extends React.Component {
@@ -33,7 +34,6 @@ export default class PostBody extends React.Component {
const post = this.props.post;
const filenames = this.props.post.filenames;
const parentPost = this.props.parentPost;
- const inner = Utils.textToJsx(this.state.message);
let comment = '';
let postClass = '';
@@ -135,7 +135,11 @@ export default class PostBody extends React.Component {
key={`${post.id}_message`}
className={postClass}
>
- {loading}<span>{inner}</span>
+ {loading}
+ <span
+ onClick={TextFormatting.handleClick}
+ dangerouslySetInnerHTML={{__html: TextFormatting.formatText(this.state.message)}}
+ />
</p>
{fileAttachmentHolder}
{embed}
diff --git a/web/react/components/rhs_comment.jsx b/web/react/components/rhs_comment.jsx
index f1a90102c..ed136c01f 100644
--- a/web/react/components/rhs_comment.jsx
+++ b/web/react/components/rhs_comment.jsx
@@ -12,6 +12,7 @@ var FileAttachmentList = require('./file_attachment_list.jsx');
var Client = require('../utils/client.jsx');
var AsyncClient = require('../utils/async_client.jsx');
var ActionTypes = Constants.ActionTypes;
+var TextFormatting = require('../utils/text_formatting.jsx');
var twemoji = require('twemoji');
export default class RhsComment extends React.Component {
@@ -84,7 +85,6 @@ export default class RhsComment extends React.Component {
type = 'Comment';
}
- var message = Utils.textToJsx(post.message);
var timestamp = UserStore.getCurrentUser().update_at;
var loading;
@@ -202,7 +202,13 @@ export default class RhsComment extends React.Component {
</li>
</ul>
<div className='post-body'>
- <p className={postClass}>{loading}{message}</p>
+ <p className={postClass}>
+ {loading}
+ <span
+ onClick={TextFormatting.handleClick}
+ dangerouslySetInnerHTML={{__html: TextFormatting.formatText(post.message)}}
+ />
+ </p>
{fileAttachment}
</div>
</div>
diff --git a/web/react/components/rhs_root_post.jsx b/web/react/components/rhs_root_post.jsx
index 83b57b955..85755a85c 100644
--- a/web/react/components/rhs_root_post.jsx
+++ b/web/react/components/rhs_root_post.jsx
@@ -4,6 +4,7 @@
var ChannelStore = require('../stores/channel_store.jsx');
var UserProfile = require('./user_profile.jsx');
var UserStore = require('../stores/user_store.jsx');
+var TextFormatting = require('../utils/text_formatting.jsx');
var utils = require('../utils/utils.jsx');
var FileAttachmentList = require('./file_attachment_list.jsx');
var twemoji = require('twemoji');
@@ -35,7 +36,6 @@ export default class RhsRootPost extends React.Component {
}
render() {
var post = this.props.post;
- var message = utils.textToJsx(post.message);
var isOwner = UserStore.getCurrentId() === post.user_id;
var timestamp = UserStore.getProfile(post.user_id).update_at;
var channel = ChannelStore.get(post.channel_id);
@@ -140,7 +140,10 @@ export default class RhsRootPost extends React.Component {
</li>
</ul>
<div className='post-body'>
- <p>{message}</p>
+ <p
+ onClick={TextFormatting.handleClick}
+ dangerouslySetInnerHTML={{__html: TextFormatting.formatText(post.message)}}
+ />
{fileAttachment}
</div>
</div>
diff --git a/web/react/components/search_results_item.jsx b/web/react/components/search_results_item.jsx
index aa56f1174..0e951f5c6 100644
--- a/web/react/components/search_results_item.jsx
+++ b/web/react/components/search_results_item.jsx
@@ -10,6 +10,7 @@ var client = require('../utils/client.jsx');
var AsyncClient = require('../utils/async_client.jsx');
var AppDispatcher = require('../dispatcher/app_dispatcher.jsx');
var Constants = require('../utils/constants.jsx');
+var TextFormatting = require('../utils/text_formatting.jsx');
var ActionTypes = Constants.ActionTypes;
export default class SearchResultsItem extends React.Component {
@@ -56,7 +57,6 @@ export default class SearchResultsItem extends React.Component {
}
render() {
- var message = utils.textToJsx(this.props.post.message, {searchTerm: this.props.term, noMentionHighlight: !this.props.isMentionSearch});
var channelName = '';
var channel = ChannelStore.get(this.props.post.channel_id);
var timestamp = UserStore.getCurrentUser().update_at;
@@ -68,6 +68,11 @@ export default class SearchResultsItem extends React.Component {
}
}
+ const formattingOptions = {
+ searchTerm: this.props.term,
+ mentionHighlight: this.props.isMentionSearch
+ };
+
return (
<div
className='search-item-container post'
@@ -91,7 +96,12 @@ export default class SearchResultsItem extends React.Component {
</time>
</li>
</ul>
- <div className='search-item-snippet'><span>{message}</span></div>
+ <div className='search-item-snippet'>
+ <span
+ onClick={this.handleClick}
+ dangerouslySetInnerHTML={{__html: TextFormatting.formatText(this.props.post.message, formattingOptions)}}
+ />
+ </div>
</div>
</div>
);
@@ -102,4 +112,4 @@ SearchResultsItem.propTypes = {
post: React.PropTypes.object,
isMentionSearch: React.PropTypes.bool,
term: React.PropTypes.string
-}; \ No newline at end of file
+};