- {backButton}
+ {hasTitle && backButton}
+ {extraButton}
{ notifCleaning ? (
diff --git a/app/javascript/flavours/glitch/components/status_content.js b/app/javascript/flavours/glitch/components/status_content.js
index 26d5b7c0ff..32b0770cba 100644
--- a/app/javascript/flavours/glitch/components/status_content.js
+++ b/app/javascript/flavours/glitch/components/status_content.js
@@ -12,7 +12,7 @@ export default class StatusContent extends React.PureComponent {
status: ImmutablePropTypes.map.isRequired,
expanded: PropTypes.bool,
collapsed: PropTypes.bool,
- setExpansion: PropTypes.func,
+ onExpandedToggle: PropTypes.func,
media: PropTypes.element,
mediaIcon: PropTypes.string,
parseClick: PropTypes.func,
@@ -112,8 +112,8 @@ export default class StatusContent extends React.PureComponent {
handleSpoilerClick = (e) => {
e.preventDefault();
- if (this.props.setExpansion) {
- this.props.setExpansion(!this.props.expanded);
+ if (this.props.onExpandedToggle) {
+ this.props.onExpandedToggle();
} else {
this.setState({ hidden: !this.state.hidden });
}
@@ -132,7 +132,7 @@ export default class StatusContent extends React.PureComponent {
disabled,
} = this.props;
- const hidden = this.props.setExpansion ? !this.props.expanded : this.state.hidden;
+ const hidden = this.props.onExpandedToggle ? !this.props.expanded : this.state.hidden;
const content = { __html: status.get('contentHtml') };
const spoilerContent = { __html: status.get('spoilerHtml') };
diff --git a/app/javascript/flavours/glitch/features/status/components/detailed_status.js b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
index dddfd36b07..16f7ae830e 100644
--- a/app/javascript/flavours/glitch/features/status/components/detailed_status.js
+++ b/app/javascript/flavours/glitch/features/status/components/detailed_status.js
@@ -24,6 +24,8 @@ export default class DetailedStatus extends ImmutablePureComponent {
settings: ImmutablePropTypes.map.isRequired,
onOpenMedia: PropTypes.func.isRequired,
onOpenVideo: PropTypes.func.isRequired,
+ onToggleHidden: PropTypes.func.isRequired,
+ expanded: PropTypes.bool,
};
handleAccountClick = (e) => {
@@ -41,7 +43,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
render () {
const status = this.props.status.get('reblog') ? this.props.status.get('reblog') : this.props.status;
- const { expanded, setExpansion, settings } = this.props;
+ const { expanded, onToggleHidden, settings } = this.props;
let media = '';
let mediaIcon = null;
@@ -115,7 +117,7 @@ export default class DetailedStatus extends ImmutablePureComponent {
mediaIcon={mediaIcon}
expanded={expanded}
collapsed={false}
- setExpansion={setExpansion}
+ onExpandedToggle={onToggleHidden}
/>
diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js
index a1783d94ac..7e1658dbb4 100644
--- a/app/javascript/flavours/glitch/features/status/index.js
+++ b/app/javascript/flavours/glitch/features/status/index.js
@@ -29,6 +29,7 @@ import { initReport } from 'flavours/glitch/actions/reports';
import { makeGetStatus } from 'flavours/glitch/selectors';
import { ScrollContainer } from 'react-router-scroll-4';
import ColumnBackButton from 'flavours/glitch/components/column_back_button';
+import ColumnHeader from '../../components/column_header';
import StatusContainer from 'flavours/glitch/containers/status_container';
import { openModal } from 'flavours/glitch/actions/modal';
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
@@ -41,6 +42,8 @@ const messages = defineMessages({
deleteConfirm: { id: 'confirmations.delete.confirm', defaultMessage: 'Delete' },
deleteMessage: { id: 'confirmations.delete.message', defaultMessage: 'Are you sure you want to delete this status?' },
blockConfirm: { id: 'confirmations.block.confirm', defaultMessage: 'Block' },
+ revealAll: { id: 'status.show_more_all', defaultMessage: 'Show more for all' },
+ hideAll: { id: 'status.show_less_all', defaultMessage: 'Show less for all' },
});
const makeMapStateToProps = () => {
@@ -77,6 +80,7 @@ export default class Status extends ImmutablePureComponent {
state = {
fullscreen: false,
isExpanded: false,
+ threadExpanded: null,
};
componentWillMount () {
@@ -190,6 +194,11 @@ export default class Status extends ImmutablePureComponent {
}
}
+ handleToggleAll = () => {
+ const { isExpanded } = this.state;
+ this.setState({ isExpanded: !isExpanded, threadExpanded: !isExpanded });
+ }
+
handleBlockClick = (account) => {
const { dispatch, intl } = this.props;
@@ -285,6 +294,7 @@ export default class Status extends ImmutablePureComponent {
@@ -327,7 +337,7 @@ export default class Status extends ImmutablePureComponent {
render () {
let ancestors, descendants;
const { setExpansion } = this;
- const { status, settings, ancestorsIds, descendantsIds } = this.props;
+ const { status, settings, ancestorsIds, descendantsIds, intl } = this.props;
const { fullscreen, isExpanded } = this.state;
if (status === null) {
@@ -360,7 +370,12 @@ export default class Status extends ImmutablePureComponent {
return (
-
+
+ )}
+ />
@@ -374,7 +389,7 @@ export default class Status extends ImmutablePureComponent {
onOpenVideo={this.handleOpenVideo}
onOpenMedia={this.handleOpenMedia}
expanded={isExpanded}
- setExpansion={setExpansion}
+ onToggleHidden={this.handleExpandedToggle}
/>
.column-header__back-button {
+ color: $ui-highlight-color;
+ }
+
&.active {
box-shadow: 0 1px 0 rgba($ui-highlight-color, 0.3);