Merge branch 'master' into french-translation
This commit is contained in:
@ -246,7 +246,8 @@ export function blockAccount(id) {
|
||||
dispatch(blockAccountRequest(id));
|
||||
|
||||
api(getState).post(`/api/v1/accounts/${id}/block`).then(response => {
|
||||
dispatch(blockAccountSuccess(response.data));
|
||||
// Pass in entire statuses map so we can use it to filter stuff in different parts of the reducers
|
||||
dispatch(blockAccountSuccess(response.data, getState().get('statuses')));
|
||||
}).catch(error => {
|
||||
dispatch(blockAccountFail(id, error));
|
||||
});
|
||||
@ -272,10 +273,11 @@ export function blockAccountRequest(id) {
|
||||
};
|
||||
};
|
||||
|
||||
export function blockAccountSuccess(relationship) {
|
||||
export function blockAccountSuccess(relationship, statuses) {
|
||||
return {
|
||||
type: ACCOUNT_BLOCK_SUCCESS,
|
||||
relationship
|
||||
relationship,
|
||||
statuses
|
||||
};
|
||||
};
|
||||
|
||||
|
@ -22,6 +22,8 @@ export const COMPOSE_SUGGESTION_SELECT = 'COMPOSE_SUGGESTION_SELECT';
|
||||
export const COMPOSE_MOUNT = 'COMPOSE_MOUNT';
|
||||
export const COMPOSE_UNMOUNT = 'COMPOSE_UNMOUNT';
|
||||
|
||||
export const COMPOSE_SENSITIVITY_CHANGE = 'COMPOSE_SENSITIVITY_CHANGE';
|
||||
|
||||
export function changeCompose(text) {
|
||||
return {
|
||||
type: COMPOSE_CHANGE,
|
||||
@ -62,7 +64,8 @@ export function submitCompose() {
|
||||
api(getState).post('/api/v1/statuses', {
|
||||
status: getState().getIn(['compose', 'text'], ''),
|
||||
in_reply_to_id: getState().getIn(['compose', 'in_reply_to'], null),
|
||||
media_ids: getState().getIn(['compose', 'media_attachments']).map(item => item.get('id'))
|
||||
media_ids: getState().getIn(['compose', 'media_attachments']).map(item => item.get('id')),
|
||||
sensitive: getState().getIn(['compose', 'sensitive'])
|
||||
}).then(function (response) {
|
||||
dispatch(submitComposeSuccess(response.data));
|
||||
dispatch(updateTimeline('home', response.data));
|
||||
@ -197,3 +200,10 @@ export function unmountCompose() {
|
||||
type: COMPOSE_UNMOUNT
|
||||
};
|
||||
};
|
||||
|
||||
export function changeComposeSensitivity(checked) {
|
||||
return {
|
||||
type: COMPOSE_SENSITIVITY_CHANGE,
|
||||
checked
|
||||
};
|
||||
};
|
||||
|
@ -7,7 +7,14 @@ const Button = React.createClass({
|
||||
onClick: React.PropTypes.func,
|
||||
disabled: React.PropTypes.bool,
|
||||
block: React.PropTypes.bool,
|
||||
secondary: React.PropTypes.bool
|
||||
secondary: React.PropTypes.bool,
|
||||
size: React.PropTypes.number,
|
||||
},
|
||||
|
||||
getDefaultProps () {
|
||||
return {
|
||||
size: 36
|
||||
};
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
@ -32,16 +39,16 @@ const Button = React.createClass({
|
||||
fontWeight: '500',
|
||||
letterSpacing: '0',
|
||||
textTransform: 'uppercase',
|
||||
padding: '0 16px',
|
||||
height: '36px',
|
||||
padding: `0 ${this.props.size / 2.25}px`,
|
||||
height: `${this.props.size}px`,
|
||||
cursor: 'pointer',
|
||||
lineHeight: '36px',
|
||||
lineHeight: `${this.props.size}px`,
|
||||
borderRadius: '4px',
|
||||
textDecoration: 'none'
|
||||
};
|
||||
|
||||
|
||||
return (
|
||||
<button className={`button ${this.props.secondary ? 'button-secondary' : ''}`} disabled={this.props.disabled} onClick={this.handleClick} style={style}>
|
||||
<button className={`button ${this.props.secondary ? 'button-secondary' : ''}`} disabled={this.props.disabled} onClick={this.handleClick} style={{ ...style, ...this.props.style }}>
|
||||
{this.props.text || this.props.children}
|
||||
</button>
|
||||
);
|
||||
|
@ -1,9 +1,47 @@
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
|
||||
const outerStyle = {
|
||||
marginTop: '8px',
|
||||
overflow: 'hidden',
|
||||
width: '100%',
|
||||
boxSizing: 'border-box'
|
||||
};
|
||||
|
||||
const spoilerStyle = {
|
||||
background: '#000',
|
||||
color: '#fff',
|
||||
textAlign: 'center',
|
||||
height: '100%',
|
||||
cursor: 'pointer',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
flexDirection: 'column'
|
||||
};
|
||||
|
||||
const spoilerSpanStyle = {
|
||||
display: 'block',
|
||||
fontSize: '14px',
|
||||
};
|
||||
|
||||
const spoilerSubSpanStyle = {
|
||||
display: 'block',
|
||||
fontSize: '11px',
|
||||
fontWeight: '500'
|
||||
};
|
||||
|
||||
const MediaGallery = React.createClass({
|
||||
|
||||
getInitialState () {
|
||||
return {
|
||||
visible: false
|
||||
};
|
||||
},
|
||||
|
||||
propTypes: {
|
||||
sensitive: React.PropTypes.bool,
|
||||
media: ImmutablePropTypes.list.isRequired,
|
||||
height: React.PropTypes.number.isRequired,
|
||||
onOpenMedia: React.PropTypes.func.isRequired
|
||||
@ -20,69 +58,85 @@ const MediaGallery = React.createClass({
|
||||
e.stopPropagation();
|
||||
},
|
||||
|
||||
handleOpen () {
|
||||
this.setState({ visible: true });
|
||||
},
|
||||
|
||||
render () {
|
||||
var children = this.props.media.take(4);
|
||||
var size = children.size;
|
||||
const { media, sensitive } = this.props;
|
||||
|
||||
children = children.map((attachment, i) => {
|
||||
let width = 50;
|
||||
let height = 100;
|
||||
let top = 'auto';
|
||||
let left = 'auto';
|
||||
let bottom = 'auto';
|
||||
let right = 'auto';
|
||||
let children;
|
||||
|
||||
if (size === 1) {
|
||||
width = 100;
|
||||
}
|
||||
|
||||
if (size === 4 || (size === 3 && i > 0)) {
|
||||
height = 50;
|
||||
}
|
||||
|
||||
if (size === 2) {
|
||||
if (i === 0) {
|
||||
right = '2px';
|
||||
} else {
|
||||
left = '2px';
|
||||
}
|
||||
} else if (size === 3) {
|
||||
if (i === 0) {
|
||||
right = '2px';
|
||||
} else if (i > 0) {
|
||||
left = '2px';
|
||||
}
|
||||
|
||||
if (i === 1) {
|
||||
bottom = '2px';
|
||||
} else if (i > 1) {
|
||||
top = '2px';
|
||||
}
|
||||
} else if (size === 4) {
|
||||
if (i === 0 || i === 2) {
|
||||
right = '2px';
|
||||
}
|
||||
|
||||
if (i === 1 || i === 3) {
|
||||
left = '2px';
|
||||
}
|
||||
|
||||
if (i < 2) {
|
||||
bottom = '2px';
|
||||
} else {
|
||||
top = '2px';
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div key={attachment.get('id')} style={{ boxSizing: 'border-box', position: 'relative', left: left, top: top, right: right, bottom: bottom, float: 'left', border: 'none', display: 'block', width: `${width}%`, height: `${height}%` }}>
|
||||
<a href={attachment.get('url')} onClick={this.handleClick.bind(this, attachment.get('url'))} target='_blank' style={{ display: 'block', width: '100%', height: '100%', background: `url(${attachment.get('preview_url')}) no-repeat center`, textDecoration: 'none', backgroundSize: 'cover', cursor: 'zoom-in' }} />
|
||||
if (sensitive && !this.state.visible) {
|
||||
children = (
|
||||
<div style={spoilerStyle} onClick={this.handleOpen}>
|
||||
<span style={spoilerSpanStyle}><FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' /></span>
|
||||
<span style={spoilerSubSpanStyle}><FormattedMessage id='status.sensitive_toggle' defaultMessage='Click to view' /></span>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
} else {
|
||||
const size = media.take(4).size;
|
||||
|
||||
children = media.take(4).map((attachment, i) => {
|
||||
let width = 50;
|
||||
let height = 100;
|
||||
let top = 'auto';
|
||||
let left = 'auto';
|
||||
let bottom = 'auto';
|
||||
let right = 'auto';
|
||||
|
||||
if (size === 1) {
|
||||
width = 100;
|
||||
}
|
||||
|
||||
if (size === 4 || (size === 3 && i > 0)) {
|
||||
height = 50;
|
||||
}
|
||||
|
||||
if (size === 2) {
|
||||
if (i === 0) {
|
||||
right = '2px';
|
||||
} else {
|
||||
left = '2px';
|
||||
}
|
||||
} else if (size === 3) {
|
||||
if (i === 0) {
|
||||
right = '2px';
|
||||
} else if (i > 0) {
|
||||
left = '2px';
|
||||
}
|
||||
|
||||
if (i === 1) {
|
||||
bottom = '2px';
|
||||
} else if (i > 1) {
|
||||
top = '2px';
|
||||
}
|
||||
} else if (size === 4) {
|
||||
if (i === 0 || i === 2) {
|
||||
right = '2px';
|
||||
}
|
||||
|
||||
if (i === 1 || i === 3) {
|
||||
left = '2px';
|
||||
}
|
||||
|
||||
if (i < 2) {
|
||||
bottom = '2px';
|
||||
} else {
|
||||
top = '2px';
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div key={attachment.get('id')} style={{ boxSizing: 'border-box', position: 'relative', left: left, top: top, right: right, bottom: bottom, float: 'left', border: 'none', display: 'block', width: `${width}%`, height: `${height}%` }}>
|
||||
<a href={attachment.get('url')} onClick={this.handleClick.bind(this, attachment.get('url'))} target='_blank' style={{ display: 'block', width: '100%', height: '100%', background: `url(${attachment.get('preview_url')}) no-repeat center`, textDecoration: 'none', backgroundSize: 'cover', cursor: 'zoom-in' }} />
|
||||
</div>
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={{ marginTop: '8px', overflow: 'hidden', width: '100%', height: `${this.props.height}px`, boxSizing: 'border-box' }}>
|
||||
<div style={{ ...outerStyle, height: `${this.props.height}px` }}>
|
||||
{children}
|
||||
</div>
|
||||
);
|
||||
|
@ -34,6 +34,7 @@ const Status = React.createClass({
|
||||
onReblog: React.PropTypes.func,
|
||||
onDelete: React.PropTypes.func,
|
||||
onOpenMedia: React.PropTypes.func,
|
||||
onBlock: React.PropTypes.func,
|
||||
me: React.PropTypes.number,
|
||||
muted: React.PropTypes.bool
|
||||
},
|
||||
@ -83,9 +84,9 @@ const Status = React.createClass({
|
||||
|
||||
if (status.get('media_attachments').size > 0) {
|
||||
if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
|
||||
media = <VideoPlayer media={status.getIn(['media_attachments', 0])} />;
|
||||
media = <VideoPlayer media={status.getIn(['media_attachments', 0])} sensitive={status.get('sensitive')} />;
|
||||
} else {
|
||||
media = <MediaGallery media={status.get('media_attachments')} height={110} onOpenMedia={this.props.onOpenMedia} />;
|
||||
media = <MediaGallery media={status.get('media_attachments')} sensitive={status.get('sensitive')} height={110} onOpenMedia={this.props.onOpenMedia} />;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -7,6 +7,7 @@ import { defineMessages, injectIntl } from 'react-intl';
|
||||
const messages = defineMessages({
|
||||
delete: { id: 'status.delete', defaultMessage: 'Delete' },
|
||||
mention: { id: 'status.mention', defaultMessage: 'Mention' },
|
||||
block: { id: 'account.block', defaultMessage: 'Block' },
|
||||
reply: { id: 'status.reply', defaultMessage: 'Reply' },
|
||||
reblog: { id: 'status.reblog', defaultMessage: 'Reblog' },
|
||||
favourite: { id: 'status.favourite', defaultMessage: 'Favourite' }
|
||||
@ -24,7 +25,8 @@ const StatusActionBar = React.createClass({
|
||||
onFavourite: React.PropTypes.func,
|
||||
onReblog: React.PropTypes.func,
|
||||
onDelete: React.PropTypes.func,
|
||||
onMention: React.PropTypes.func
|
||||
onMention: React.PropTypes.func,
|
||||
onBlock: React.PropTypes.func
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
@ -49,6 +51,10 @@ const StatusActionBar = React.createClass({
|
||||
this.props.onMention(this.props.status.get('account'));
|
||||
},
|
||||
|
||||
handleBlockClick () {
|
||||
this.props.onBlock(this.props.status.get('account'));
|
||||
},
|
||||
|
||||
render () {
|
||||
const { status, me, intl } = this.props;
|
||||
let menu = [];
|
||||
@ -57,6 +63,7 @@ const StatusActionBar = React.createClass({
|
||||
menu.push({ text: intl.formatMessage(messages.delete), action: this.handleDeleteClick });
|
||||
} else {
|
||||
menu.push({ text: intl.formatMessage(messages.mention), action: this.handleMentionClick });
|
||||
menu.push({ text: intl.formatMessage(messages.block), action: this.handleBlockClick });
|
||||
}
|
||||
|
||||
return (
|
||||
|
@ -1,7 +1,7 @@
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import IconButton from './icon_button';
|
||||
import { defineMessages, injectIntl } from 'react-intl';
|
||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
|
||||
const messages = defineMessages({
|
||||
toggle_sound: { id: 'video_player.toggle_sound', defaultMessage: 'Toggle sound' }
|
||||
@ -25,6 +25,30 @@ const muteStyle = {
|
||||
zIndex: '5'
|
||||
};
|
||||
|
||||
const spoilerStyle = {
|
||||
marginTop: '8px',
|
||||
background: '#000',
|
||||
color: '#fff',
|
||||
textAlign: 'center',
|
||||
height: '100%',
|
||||
cursor: 'pointer',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
flexDirection: 'column'
|
||||
};
|
||||
|
||||
const spoilerSpanStyle = {
|
||||
display: 'block',
|
||||
fontSize: '14px'
|
||||
};
|
||||
|
||||
const spoilerSubSpanStyle = {
|
||||
display: 'block',
|
||||
fontSize: '11px',
|
||||
fontWeight: '500'
|
||||
};
|
||||
|
||||
const VideoPlayer = React.createClass({
|
||||
propTypes: {
|
||||
media: ImmutablePropTypes.map.isRequired,
|
||||
@ -41,6 +65,7 @@ const VideoPlayer = React.createClass({
|
||||
|
||||
getInitialState () {
|
||||
return {
|
||||
visible: false,
|
||||
muted: true
|
||||
};
|
||||
},
|
||||
@ -63,8 +88,21 @@ const VideoPlayer = React.createClass({
|
||||
}
|
||||
},
|
||||
|
||||
handleOpen () {
|
||||
this.setState({ visible: true });
|
||||
},
|
||||
|
||||
render () {
|
||||
const { media, intl, width, height } = this.props;
|
||||
const { media, intl, width, height, sensitive } = this.props;
|
||||
|
||||
if (sensitive && !this.state.visible) {
|
||||
return (
|
||||
<div style={{...spoilerStyle, width: `${width}px`, height: `${height}px` }} onClick={this.handleOpen}>
|
||||
<span style={spoilerSpanStyle}><FormattedMessage id='status.sensitive_warning' defaultMessage='Sensitive content' /></span>
|
||||
<span style={spoilerSubSpanStyle}><FormattedMessage id='status.sensitive_toggle' defaultMessage='Click to view' /></span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<div style={{ cursor: 'default', marginTop: '8px', overflow: 'hidden', width: `${width}px`, height: `${height}px`, boxSizing: 'border-box', background: '#000', position: 'relative' }}>
|
||||
|
@ -75,11 +75,6 @@ const Mastodon = React.createClass({
|
||||
return store.dispatch(updateTimeline(data.timeline, JSON.parse(data.message)));
|
||||
case 'delete':
|
||||
return store.dispatch(deleteFromTimelines(data.id));
|
||||
case 'merge':
|
||||
case 'unmerge':
|
||||
return store.dispatch(refreshTimeline('home', true));
|
||||
case 'block':
|
||||
return store.dispatch(refreshTimeline('mentions', true));
|
||||
case 'notification':
|
||||
return store.dispatch(updateNotifications(JSON.parse(data.message), getMessagesForLocale(locale), locale));
|
||||
}
|
||||
|
@ -1,18 +1,19 @@
|
||||
import { connect } from 'react-redux';
|
||||
import Status from '../components/status';
|
||||
import { connect } from 'react-redux';
|
||||
import Status from '../components/status';
|
||||
import { makeGetStatus } from '../selectors';
|
||||
import {
|
||||
replyCompose,
|
||||
mentionCompose
|
||||
} from '../actions/compose';
|
||||
} from '../actions/compose';
|
||||
import {
|
||||
reblog,
|
||||
favourite,
|
||||
unreblog,
|
||||
unfavourite
|
||||
} from '../actions/interactions';
|
||||
import { deleteStatus } from '../actions/statuses';
|
||||
import { openMedia } from '../actions/modal';
|
||||
} from '../actions/interactions';
|
||||
import { blockAccount } from '../actions/accounts';
|
||||
import { deleteStatus } from '../actions/statuses';
|
||||
import { openMedia } from '../actions/modal';
|
||||
import { createSelector } from 'reselect'
|
||||
|
||||
const mapStateToProps = (state, props) => ({
|
||||
@ -91,6 +92,10 @@ const mapDispatchToProps = (dispatch) => ({
|
||||
|
||||
onOpenMedia (url) {
|
||||
dispatch(openMedia(url));
|
||||
},
|
||||
|
||||
onBlock (account) {
|
||||
dispatch(blockAccount(account.get('id')));
|
||||
}
|
||||
|
||||
});
|
||||
|
@ -58,10 +58,8 @@ const ActionBar = React.createClass({
|
||||
} else if (account.getIn(['relationship', 'blocking'])) {
|
||||
menu.push({ text: intl.formatMessage(messages.unblock), action: this.props.onBlock });
|
||||
} else if (account.getIn(['relationship', 'following'])) {
|
||||
menu.push({ text: intl.formatMessage(messages.unfollow), action: this.props.onFollow });
|
||||
menu.push({ text: intl.formatMessage(messages.block), action: this.props.onBlock });
|
||||
} else {
|
||||
menu.push({ text: intl.formatMessage(messages.follow), action: this.props.onFollow });
|
||||
menu.push({ text: intl.formatMessage(messages.block), action: this.props.onBlock });
|
||||
}
|
||||
|
||||
|
@ -2,22 +2,30 @@ import PureRenderMixin from 'react-addons-pure-render-mixin';
|
||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||
import emojify from '../../../emoji';
|
||||
import escapeTextContentForBrowser from 'react/lib/escapeTextContentForBrowser';
|
||||
import { FormattedMessage } from 'react-intl';
|
||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import IconButton from '../../../components/icon_button';
|
||||
|
||||
const messages = defineMessages({
|
||||
unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },
|
||||
follow: { id: 'account.follow', defaultMessage: 'Follow' },
|
||||
});
|
||||
|
||||
const Header = React.createClass({
|
||||
|
||||
propTypes: {
|
||||
account: ImmutablePropTypes.map.isRequired,
|
||||
me: React.PropTypes.number.isRequired
|
||||
me: React.PropTypes.number.isRequired,
|
||||
onFollow: React.PropTypes.func.isRequired
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
|
||||
render () {
|
||||
const { account, me } = this.props;
|
||||
const { account, me, intl } = this.props;
|
||||
|
||||
let displayName = account.get('display_name');
|
||||
let info = '';
|
||||
let actionBtn = '';
|
||||
|
||||
if (displayName.length === 0) {
|
||||
displayName = account.get('username');
|
||||
@ -27,6 +35,14 @@ const Header = React.createClass({
|
||||
info = <span style={{ position: 'absolute', top: '10px', right: '10px', opacity: '0.7', display: 'inline-block', verticalAlign: 'top', background: 'rgba(0, 0, 0, 0.4)', color: '#fff', textTransform: 'uppercase', fontSize: '11px', fontWeight: '500', padding: '4px', borderRadius: '4px' }}><FormattedMessage id='account.follows_you' defaultMessage='Follows you' /></span>
|
||||
}
|
||||
|
||||
if (me !== account.get('id')) {
|
||||
actionBtn = (
|
||||
<div style={{ position: 'absolute', top: '10px', left: '20px' }}>
|
||||
<IconButton size={26} icon={account.getIn(['relationship', 'following']) ? 'user-times' : 'user-plus'} active={account.getIn(['relationship', 'following'])} title={intl.formatMessage(account.getIn(['relationship', 'following']) ? messages.unfollow : messages.follow)} onClick={this.props.onFollow} />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
const content = { __html: emojify(account.get('note')) };
|
||||
const displayNameHTML = { __html: emojify(escapeTextContentForBrowser(displayName)) };
|
||||
|
||||
@ -45,6 +61,7 @@ const Header = React.createClass({
|
||||
<div style={{ color: '#616b86', fontSize: '14px' }} className='account__header__content' dangerouslySetInnerHTML={content} />
|
||||
|
||||
{info}
|
||||
{actionBtn}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
@ -52,4 +69,4 @@ const Header = React.createClass({
|
||||
|
||||
});
|
||||
|
||||
export default Header;
|
||||
export default injectIntl(Header);
|
||||
|
@ -87,9 +87,8 @@ const Account = React.createClass({
|
||||
return (
|
||||
<Column>
|
||||
<ColumnBackButton />
|
||||
<Header account={account} me={me} />
|
||||
|
||||
<ActionBar account={account} me={me} onFollow={this.handleFollow} onBlock={this.handleBlock} onMention={this.handleMention} />
|
||||
<Header account={account} me={me} onFollow={this.handleFollow} />
|
||||
<ActionBar account={account} me={me} onBlock={this.handleBlock} onMention={this.handleMention} />
|
||||
|
||||
{this.props.children}
|
||||
</Column>
|
||||
|
@ -8,7 +8,8 @@ import Autosuggest from 'react-autosuggest';
|
||||
import AutosuggestAccountContainer from '../../compose/containers/autosuggest_account_container';
|
||||
import { debounce } from 'react-decoration';
|
||||
import UploadButtonContainer from '../containers/upload_button_container';
|
||||
import { defineMessages, injectIntl } from 'react-intl';
|
||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||
import Toggle from 'react-toggle';
|
||||
|
||||
const messages = defineMessages({
|
||||
placeholder: { id: 'compose_form.placeholder', defaultMessage: 'What is on your mind?' },
|
||||
@ -67,6 +68,7 @@ const ComposeForm = React.createClass({
|
||||
text: React.PropTypes.string.isRequired,
|
||||
suggestion_token: React.PropTypes.string,
|
||||
suggestions: React.PropTypes.array,
|
||||
sensitive: React.PropTypes.bool,
|
||||
is_submitting: React.PropTypes.bool,
|
||||
is_uploading: React.PropTypes.bool,
|
||||
in_reply_to: ImmutablePropTypes.map,
|
||||
@ -75,7 +77,8 @@ const ComposeForm = React.createClass({
|
||||
onCancelReply: React.PropTypes.func.isRequired,
|
||||
onClearSuggestions: React.PropTypes.func.isRequired,
|
||||
onFetchSuggestions: React.PropTypes.func.isRequired,
|
||||
onSuggestionSelected: React.PropTypes.func.isRequired
|
||||
onSuggestionSelected: React.PropTypes.func.isRequired,
|
||||
onChangeSensitivity: React.PropTypes.func.isRequired
|
||||
},
|
||||
|
||||
mixins: [PureRenderMixin],
|
||||
@ -139,6 +142,10 @@ const ComposeForm = React.createClass({
|
||||
this.autosuggest = c;
|
||||
},
|
||||
|
||||
handleChangeSensitivity (e) {
|
||||
this.props.onChangeSensitivity(e.target.checked);
|
||||
},
|
||||
|
||||
render () {
|
||||
const { intl } = this.props;
|
||||
let replyArea = '';
|
||||
@ -178,6 +185,11 @@ const ComposeForm = React.createClass({
|
||||
<div style={{ float: 'right', marginRight: '16px', lineHeight: '36px' }}><CharacterCounter max={500} text={this.props.text} /></div>
|
||||
<UploadButtonContainer style={{ paddingTop: '4px' }} />
|
||||
</div>
|
||||
|
||||
<label style={{ display: 'block', lineHeight: '24px', verticalAlign: 'middle', marginTop: '10px', borderTop: '1px solid #616b86', paddingTop: '10px' }}>
|
||||
<Toggle checked={this.props.sensitive} onChange={this.handleChangeSensitivity} />
|
||||
<span style={{ display: 'inline-block', verticalAlign: 'middle', marginBottom: '14px', marginLeft: '8px', color: '#9baec8' }}><FormattedMessage id='compose_form.sensitive' defaultMessage='Mark content as sensitive' /></span>
|
||||
</label>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -6,7 +6,8 @@ import {
|
||||
cancelReplyCompose,
|
||||
clearComposeSuggestions,
|
||||
fetchComposeSuggestions,
|
||||
selectComposeSuggestion
|
||||
selectComposeSuggestion,
|
||||
changeComposeSensitivity
|
||||
} from '../../../actions/compose';
|
||||
import { makeGetStatus } from '../../../selectors';
|
||||
|
||||
@ -18,6 +19,7 @@ const makeMapStateToProps = () => {
|
||||
text: state.getIn(['compose', 'text']),
|
||||
suggestion_token: state.getIn(['compose', 'suggestion_token']),
|
||||
suggestions: state.getIn(['compose', 'suggestions']).toJS(),
|
||||
sensitive: state.getIn(['compose', 'sensitive']),
|
||||
is_submitting: state.getIn(['compose', 'is_submitting']),
|
||||
is_uploading: state.getIn(['compose', 'is_uploading']),
|
||||
in_reply_to: getStatus(state, state.getIn(['compose', 'in_reply_to']))
|
||||
@ -51,6 +53,10 @@ const mapDispatchToProps = function (dispatch) {
|
||||
|
||||
onSuggestionSelected (position, accountId) {
|
||||
dispatch(selectComposeSuggestion(position, accountId));
|
||||
},
|
||||
|
||||
onChangeSensitivity (checked) {
|
||||
dispatch(changeComposeSensitivity(checked));
|
||||
}
|
||||
}
|
||||
};
|
||||
|
@ -36,9 +36,9 @@ const DetailedStatus = React.createClass({
|
||||
|
||||
if (status.get('media_attachments').size > 0) {
|
||||
if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
|
||||
media = <VideoPlayer media={status.getIn(['media_attachments', 0])} width={317} height={178} />;
|
||||
media = <VideoPlayer sensitive={status.get('sensitive')} media={status.getIn(['media_attachments', 0])} width={317} height={178} />;
|
||||
} else {
|
||||
media = <MediaGallery media={status.get('media_attachments')} height={300} onOpenMedia={this.props.onOpenMedia} />;
|
||||
media = <MediaGallery sensitive={status.get('sensitive')} media={status.get('media_attachments')} height={300} onOpenMedia={this.props.onOpenMedia} />;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -8,6 +8,8 @@ const en = {
|
||||
"status.reblog": "Reblog",
|
||||
"status.favourite": "Favourite",
|
||||
"status.reblogged_by": "{name} reblogged",
|
||||
"status.sensitive_warning": "Sensitive content",
|
||||
"status.sensitive_toggle": "Click to view",
|
||||
"video_player.toggle_sound": "Toggle sound",
|
||||
"account.mention": "Mention",
|
||||
"account.edit_profile": "Edit profile",
|
||||
@ -35,6 +37,7 @@ const en = {
|
||||
"tabs_bar.notifications": "Notifications",
|
||||
"compose_form.placeholder": "What is on your mind?",
|
||||
"compose_form.publish": "Toot",
|
||||
"compose_form.sensitive": "Mark content as sensitive",
|
||||
"navigation_bar.settings": "Settings",
|
||||
"navigation_bar.public_timeline": "Public timeline",
|
||||
"navigation_bar.logout": "Logout",
|
||||
|
@ -15,7 +15,8 @@ import {
|
||||
COMPOSE_UPLOAD_PROGRESS,
|
||||
COMPOSE_SUGGESTIONS_CLEAR,
|
||||
COMPOSE_SUGGESTIONS_READY,
|
||||
COMPOSE_SUGGESTION_SELECT
|
||||
COMPOSE_SUGGESTION_SELECT,
|
||||
COMPOSE_SENSITIVITY_CHANGE
|
||||
} from '../actions/compose';
|
||||
import { TIMELINE_DELETE } from '../actions/timelines';
|
||||
import { ACCOUNT_SET_SELF } from '../actions/accounts';
|
||||
@ -23,6 +24,7 @@ import Immutable from 'immutable';
|
||||
|
||||
const initialState = Immutable.Map({
|
||||
mounted: false,
|
||||
sensitive: false,
|
||||
text: '',
|
||||
in_reply_to: null,
|
||||
is_submitting: false,
|
||||
@ -87,6 +89,8 @@ export default function compose(state = initialState, action) {
|
||||
return state.set('mounted', true);
|
||||
case COMPOSE_UNMOUNT:
|
||||
return state.set('mounted', false);
|
||||
case COMPOSE_SENSITIVITY_CHANGE:
|
||||
return state.set('sensitive', action.checked);
|
||||
case COMPOSE_CHANGE:
|
||||
return state.set('text', action.text);
|
||||
case COMPOSE_REPLY:
|
||||
|
@ -3,6 +3,7 @@ import {
|
||||
NOTIFICATIONS_REFRESH_SUCCESS,
|
||||
NOTIFICATIONS_EXPAND_SUCCESS
|
||||
} from '../actions/notifications';
|
||||
import { ACCOUNT_BLOCK_SUCCESS } from '../actions/accounts';
|
||||
import Immutable from 'immutable';
|
||||
|
||||
const initialState = Immutable.Map({
|
||||
@ -43,6 +44,10 @@ const appendNormalizedNotifications = (state, notifications, next) => {
|
||||
return state.update('items', list => list.push(...items)).set('next', next);
|
||||
};
|
||||
|
||||
const filterNotifications = (state, relationship) => {
|
||||
return state.update('items', list => list.filterNot(item => item.get('account') === relationship.id));
|
||||
};
|
||||
|
||||
export default function notifications(state = initialState, action) {
|
||||
switch(action.type) {
|
||||
case NOTIFICATIONS_UPDATE:
|
||||
@ -51,6 +56,8 @@ export default function notifications(state = initialState, action) {
|
||||
return normalizeNotifications(state, action.notifications, action.next);
|
||||
case NOTIFICATIONS_EXPAND_SUCCESS:
|
||||
return appendNormalizedNotifications(state, action.notifications, action.next);
|
||||
case ACCOUNT_BLOCK_SUCCESS:
|
||||
return filterNotifications(state, action.relationship);
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
|
@ -1,7 +1,11 @@
|
||||
import {
|
||||
REBLOG_REQUEST,
|
||||
REBLOG_SUCCESS,
|
||||
REBLOG_FAIL,
|
||||
UNREBLOG_SUCCESS,
|
||||
FAVOURITE_REQUEST,
|
||||
FAVOURITE_SUCCESS,
|
||||
FAVOURITE_FAIL,
|
||||
UNFAVOURITE_SUCCESS
|
||||
} from '../actions/interactions';
|
||||
import {
|
||||
@ -16,7 +20,8 @@ import {
|
||||
} from '../actions/timelines';
|
||||
import {
|
||||
ACCOUNT_TIMELINE_FETCH_SUCCESS,
|
||||
ACCOUNT_TIMELINE_EXPAND_SUCCESS
|
||||
ACCOUNT_TIMELINE_EXPAND_SUCCESS,
|
||||
ACCOUNT_BLOCK_SUCCESS
|
||||
} from '../actions/accounts';
|
||||
import {
|
||||
NOTIFICATIONS_UPDATE,
|
||||
@ -56,6 +61,18 @@ const deleteStatus = (state, id, references) => {
|
||||
return state.delete(id);
|
||||
};
|
||||
|
||||
const filterStatuses = (state, relationship) => {
|
||||
state.forEach(status => {
|
||||
if (status.get('account') !== relationship.id) {
|
||||
return;
|
||||
}
|
||||
|
||||
state = deleteStatus(state, status.get('id'), state.filter(item => item.get('reblog') === status.get('id')));
|
||||
});
|
||||
|
||||
return state;
|
||||
};
|
||||
|
||||
const initialState = Immutable.Map();
|
||||
|
||||
export default function statuses(state = initialState, action) {
|
||||
@ -69,6 +86,14 @@ export default function statuses(state = initialState, action) {
|
||||
case FAVOURITE_SUCCESS:
|
||||
case UNFAVOURITE_SUCCESS:
|
||||
return normalizeStatus(state, action.response);
|
||||
case FAVOURITE_REQUEST:
|
||||
return state.setIn([action.status.get('id'), 'favourited'], true);
|
||||
case FAVOURITE_FAIL:
|
||||
return state.setIn([action.status.get('id'), 'favourited'], false);
|
||||
case REBLOG_REQUEST:
|
||||
return state.setIn([action.status.get('id'), 'reblogged'], true);
|
||||
case REBLOG_FAIL:
|
||||
return state.setIn([action.status.get('id'), 'reblogged'], false);
|
||||
case TIMELINE_REFRESH_SUCCESS:
|
||||
case TIMELINE_EXPAND_SUCCESS:
|
||||
case ACCOUNT_TIMELINE_FETCH_SUCCESS:
|
||||
@ -79,6 +104,8 @@ export default function statuses(state = initialState, action) {
|
||||
return normalizeStatuses(state, action.statuses);
|
||||
case TIMELINE_DELETE:
|
||||
return deleteStatus(state, action.id, action.references);
|
||||
case ACCOUNT_BLOCK_SUCCESS:
|
||||
return filterStatuses(state, action.relationship);
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
|
@ -13,7 +13,8 @@ import {
|
||||
import {
|
||||
ACCOUNT_FETCH_SUCCESS,
|
||||
ACCOUNT_TIMELINE_FETCH_SUCCESS,
|
||||
ACCOUNT_TIMELINE_EXPAND_SUCCESS
|
||||
ACCOUNT_TIMELINE_EXPAND_SUCCESS,
|
||||
ACCOUNT_BLOCK_SUCCESS
|
||||
} from '../actions/accounts';
|
||||
import {
|
||||
STATUS_FETCH_SUCCESS,
|
||||
@ -140,6 +141,21 @@ const deleteStatus = (state, id, accountId, references) => {
|
||||
return state;
|
||||
};
|
||||
|
||||
const filterTimelines = (state, relationship, statuses) => {
|
||||
let references;
|
||||
|
||||
statuses.forEach(status => {
|
||||
if (status.get('account') !== relationship.id) {
|
||||
return;
|
||||
}
|
||||
|
||||
references = statuses.filter(item => item.get('reblog') === status.get('id')).map(item => [item.get('id'), item.get('account')]);
|
||||
state = deleteStatus(state, status.get('id'), status.get('account'), references);
|
||||
});
|
||||
|
||||
return state;
|
||||
};
|
||||
|
||||
const normalizeContext = (state, id, ancestors, descendants) => {
|
||||
const ancestorsIds = ancestors.map(ancestor => ancestor.get('id'));
|
||||
const descendantsIds = descendants.map(descendant => descendant.get('id'));
|
||||
@ -166,6 +182,8 @@ export default function timelines(state = initialState, action) {
|
||||
return normalizeAccountTimeline(state, action.id, Immutable.fromJS(action.statuses), action.replace);
|
||||
case ACCOUNT_TIMELINE_EXPAND_SUCCESS:
|
||||
return appendNormalizedAccountTimeline(state, action.id, Immutable.fromJS(action.statuses));
|
||||
case ACCOUNT_BLOCK_SUCCESS:
|
||||
return filterTimelines(state, action.relationship, action.statuses);
|
||||
default:
|
||||
return state;
|
||||
}
|
||||
|
Reference in New Issue
Block a user