PLT-3506 Added flagged posts functionality (#3679)
* Added flagged posts functionality * UI Improvements to flags (#3697) * Added flag functionality for mobile * Updating flagged text (#3699) * Add back button to RHS thread when coming from flagged posts * Updating position of flags (#3708) * Plt 3506 - Reverting flag position (#3724) * Revert "Updating position of flags (#3708)" This reverts commit aaa05632c5d9eda35a048300a5bd7e99584c5b58. * Fixing the icon in search * Help text and white space improvements (#3730) * Updatng help text and some white spacing. * Updating help text
Этот коммит содержится в:
Joram Wilander
коммит произвёл
enahum
enahum
родитель
9b50b50283
Коммит
0184d6059b
@@ -9,12 +9,14 @@ import TeamStore from 'stores/team_store.jsx';
|
||||
import UserStore from 'stores/user_store.jsx';
|
||||
|
||||
import * as GlobalActions from 'actions/global_actions.jsx';
|
||||
import {flagPost, unflagPost} from 'actions/post_actions.jsx';
|
||||
|
||||
import * as TextFormatting from 'utils/text_formatting.jsx';
|
||||
import * as Utils from 'utils/utils.jsx';
|
||||
import Client from 'client/web_client.jsx';
|
||||
|
||||
import Constants from 'utils/constants.jsx';
|
||||
import {Tooltip, OverlayTrigger} from 'react-bootstrap';
|
||||
|
||||
import {FormattedMessage, FormattedDate} from 'react-intl';
|
||||
|
||||
@@ -27,13 +29,17 @@ export default class RhsComment extends React.Component {
|
||||
super(props);
|
||||
|
||||
this.handlePermalink = this.handlePermalink.bind(this);
|
||||
this.flagPost = this.flagPost.bind(this);
|
||||
this.unflagPost = this.unflagPost.bind(this);
|
||||
|
||||
this.state = {};
|
||||
}
|
||||
|
||||
handlePermalink(e) {
|
||||
e.preventDefault();
|
||||
GlobalActions.showGetPostLinkModal(this.props.post);
|
||||
}
|
||||
|
||||
shouldComponentUpdate(nextProps) {
|
||||
if (nextProps.compactDisplay !== this.props.compactDisplay) {
|
||||
return true;
|
||||
@@ -43,6 +49,10 @@ export default class RhsComment extends React.Component {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (nextProps.isFlagged !== this.props.isFlagged) {
|
||||
return true;
|
||||
}
|
||||
|
||||
if (!Utils.areObjectsEqual(nextProps.post, this.props.post)) {
|
||||
return true;
|
||||
}
|
||||
@@ -53,6 +63,17 @@ export default class RhsComment extends React.Component {
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
flagPost(e) {
|
||||
e.preventDefault();
|
||||
flagPost(this.props.post.id);
|
||||
}
|
||||
|
||||
unflagPost(e) {
|
||||
e.preventDefault();
|
||||
unflagPost(this.props.post.id);
|
||||
}
|
||||
|
||||
createDropdown() {
|
||||
var post = this.props.post;
|
||||
|
||||
@@ -66,6 +87,44 @@ export default class RhsComment extends React.Component {
|
||||
|
||||
var dropdownContents = [];
|
||||
|
||||
if (Utils.isMobile()) {
|
||||
if (this.props.isFlagged) {
|
||||
dropdownContents.push(
|
||||
<li
|
||||
key='mobileFlag'
|
||||
role='presentation'
|
||||
>
|
||||
<a
|
||||
href='#'
|
||||
onClick={this.unflagPost}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='rhs_root.mobile.unflag'
|
||||
defaultMessage='Unflag'
|
||||
/>
|
||||
</a>
|
||||
</li>
|
||||
);
|
||||
} else {
|
||||
dropdownContents.push(
|
||||
<li
|
||||
key='mobileFlag'
|
||||
role='presentation'
|
||||
>
|
||||
<a
|
||||
href='#'
|
||||
onClick={this.flagPost}
|
||||
>
|
||||
<FormattedMessage
|
||||
id='rhs_root.mobile.flag'
|
||||
defaultMessage='Flag'
|
||||
/>
|
||||
</a>
|
||||
</li>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
dropdownContents.push(
|
||||
<li
|
||||
key='rhs-root-permalink'
|
||||
@@ -151,8 +210,10 @@ export default class RhsComment extends React.Component {
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
var post = this.props.post;
|
||||
const flagIcon = Constants.FLAG_ICON_SVG;
|
||||
|
||||
var currentUserCss = '';
|
||||
if (this.props.currentUser === post.user_id) {
|
||||
@@ -225,6 +286,44 @@ export default class RhsComment extends React.Component {
|
||||
);
|
||||
}
|
||||
|
||||
let flag;
|
||||
let flagFunc;
|
||||
let flagVisible = '';
|
||||
let flagTooltip = (
|
||||
<Tooltip id='flagTooltip'>
|
||||
<FormattedMessage
|
||||
id='flag_post.flag'
|
||||
defaultMessage='Flag for follow up'
|
||||
/>
|
||||
</Tooltip>
|
||||
);
|
||||
if (this.props.isFlagged) {
|
||||
flagVisible = 'visible';
|
||||
flag = (
|
||||
<span
|
||||
className='icon'
|
||||
dangerouslySetInnerHTML={{__html: flagIcon}}
|
||||
/>
|
||||
);
|
||||
flagFunc = this.unflagPost;
|
||||
flagTooltip = (
|
||||
<Tooltip id='flagTooltip'>
|
||||
<FormattedMessage
|
||||
id='flag_post.unflag'
|
||||
defaultMessage='Unflag'
|
||||
/>
|
||||
</Tooltip>
|
||||
);
|
||||
} else {
|
||||
flag = (
|
||||
<span
|
||||
className='icon'
|
||||
dangerouslySetInnerHTML={{__html: flagIcon}}
|
||||
/>
|
||||
);
|
||||
flagFunc = this.flagPost;
|
||||
}
|
||||
|
||||
return (
|
||||
<div className={'post post--thread ' + currentUserCss + ' ' + compactClass}>
|
||||
<div className='post__content'>
|
||||
@@ -247,6 +346,20 @@ export default class RhsComment extends React.Component {
|
||||
minute='2-digit'
|
||||
/>
|
||||
</time>
|
||||
<OverlayTrigger
|
||||
key={'commentflagtooltipkey' + flagVisible}
|
||||
delayShow={Constants.OVERLAY_TIME_DELAY}
|
||||
placement='top'
|
||||
overlay={flagTooltip}
|
||||
>
|
||||
<a
|
||||
href='#'
|
||||
className={'flag-icon__container ' + flagVisible}
|
||||
onClick={flagFunc}
|
||||
>
|
||||
{flag}
|
||||
</a>
|
||||
</OverlayTrigger>
|
||||
</li>
|
||||
<li className='col col__reply'>
|
||||
{dropdown}
|
||||
@@ -271,5 +384,6 @@ RhsComment.propTypes = {
|
||||
user: React.PropTypes.object.isRequired,
|
||||
currentUser: React.PropTypes.object.isRequired,
|
||||
compactDisplay: React.PropTypes.bool,
|
||||
useMilitaryTime: React.PropTypes.bool.isRequired
|
||||
useMilitaryTime: React.PropTypes.bool.isRequired,
|
||||
isFlagged: React.PropTypes.bool
|
||||
};
|
||||
|
||||
Ссылка в новой задаче
Block a user