Add keyboard shortcut to collapse/uncollapse toots
This commit is contained in:
		@@ -367,6 +367,14 @@ export default class Status extends ImmutablePureComponent {
 | 
				
			|||||||
    this.props.onMoveDown(this.props.containerId || this.props.id, e.target.getAttribute('data-featured'));
 | 
					    this.props.onMoveDown(this.props.containerId || this.props.id, e.target.getAttribute('data-featured'));
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					  handleHotkeyCollapse = e => {
 | 
				
			||||||
 | 
					    if (!this.props.settings.getIn(['collapsed', 'enabled']))
 | 
				
			||||||
 | 
					      return;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    this.setCollapsed(!this.state.isCollapsed);
 | 
				
			||||||
 | 
					  }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  handleRef = c => {
 | 
					  handleRef = c => {
 | 
				
			||||||
    this.node = c;
 | 
					    this.node = c;
 | 
				
			||||||
  }
 | 
					  }
 | 
				
			||||||
@@ -556,6 +564,7 @@ export default class Status extends ImmutablePureComponent {
 | 
				
			|||||||
      moveDown: this.handleHotkeyMoveDown,
 | 
					      moveDown: this.handleHotkeyMoveDown,
 | 
				
			||||||
      toggleSpoiler: this.handleExpandedToggle,
 | 
					      toggleSpoiler: this.handleExpandedToggle,
 | 
				
			||||||
      bookmark: this.handleHotkeyBookmark,
 | 
					      bookmark: this.handleHotkeyBookmark,
 | 
				
			||||||
 | 
					      toggleCollapse: this.handleHotkeyCollapse,
 | 
				
			||||||
    };
 | 
					    };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    const computedClass = classNames('status', `status-${status.get('visibility')}`, {
 | 
					    const computedClass = classNames('status', `status-${status.get('visibility')}`, {
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -1,6 +1,7 @@
 | 
				
			|||||||
import React from 'react';
 | 
					import React from 'react';
 | 
				
			||||||
import Column from 'flavours/glitch/features/ui/components/column';
 | 
					import Column from 'flavours/glitch/features/ui/components/column';
 | 
				
			||||||
import ColumnBackButtonSlim from 'flavours/glitch/components/column_back_button_slim';
 | 
					import ColumnBackButtonSlim from 'flavours/glitch/components/column_back_button_slim';
 | 
				
			||||||
 | 
					import { connect } from 'react-redux';
 | 
				
			||||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 | 
					import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 | 
				
			||||||
import PropTypes from 'prop-types';
 | 
					import PropTypes from 'prop-types';
 | 
				
			||||||
import ImmutablePureComponent from 'react-immutable-pure-component';
 | 
					import ImmutablePureComponent from 'react-immutable-pure-component';
 | 
				
			||||||
@@ -9,16 +10,22 @@ const messages = defineMessages({
 | 
				
			|||||||
  heading: { id: 'keyboard_shortcuts.heading', defaultMessage: 'Keyboard Shortcuts' },
 | 
					  heading: { id: 'keyboard_shortcuts.heading', defaultMessage: 'Keyboard Shortcuts' },
 | 
				
			||||||
});
 | 
					});
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					const mapStateToProps = state => ({
 | 
				
			||||||
 | 
					  collapseEnabled: state.getIn(['local_settings', 'collapsed', 'enabled']),
 | 
				
			||||||
 | 
					});
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					@connect(mapStateToProps)
 | 
				
			||||||
@injectIntl
 | 
					@injectIntl
 | 
				
			||||||
export default class KeyboardShortcuts extends ImmutablePureComponent {
 | 
					export default class KeyboardShortcuts extends ImmutablePureComponent {
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  static propTypes = {
 | 
					  static propTypes = {
 | 
				
			||||||
    intl: PropTypes.object.isRequired,
 | 
					    intl: PropTypes.object.isRequired,
 | 
				
			||||||
    multiColumn: PropTypes.bool,
 | 
					    multiColumn: PropTypes.bool,
 | 
				
			||||||
 | 
					    collapseEnabled: PropTypes.bool,
 | 
				
			||||||
  };
 | 
					  };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  render () {
 | 
					  render () {
 | 
				
			||||||
    const { intl } = this.props;
 | 
					    const { intl, collapseEnabled } = this.props;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    return (
 | 
					    return (
 | 
				
			||||||
      <Column icon='question' heading={intl.formatMessage(messages.heading)}>
 | 
					      <Column icon='question' heading={intl.formatMessage(messages.heading)}>
 | 
				
			||||||
@@ -64,6 +71,12 @@ export default class KeyboardShortcuts extends ImmutablePureComponent {
 | 
				
			|||||||
                <td><kbd>x</kbd></td>
 | 
					                <td><kbd>x</kbd></td>
 | 
				
			||||||
                <td><FormattedMessage id='keyboard_shortcuts.toggle_hidden' defaultMessage='to show/hide text behind CW' /></td>
 | 
					                <td><FormattedMessage id='keyboard_shortcuts.toggle_hidden' defaultMessage='to show/hide text behind CW' /></td>
 | 
				
			||||||
              </tr>
 | 
					              </tr>
 | 
				
			||||||
 | 
					              {collapseEnabled && (
 | 
				
			||||||
 | 
					                <tr>
 | 
				
			||||||
 | 
					                  <td><kbd>shift</kbd>+<kbd>x</kbd></td>
 | 
				
			||||||
 | 
					                  <td><FormattedMessage id='keyboard_shortcuts.toggle_collapse' defaultMessage='to collapse/uncollapse toots' /></td>
 | 
				
			||||||
 | 
					                </tr>
 | 
				
			||||||
 | 
					              )}
 | 
				
			||||||
              <tr>
 | 
					              <tr>
 | 
				
			||||||
                <td><kbd>up</kbd>, <kbd>k</kbd></td>
 | 
					                <td><kbd>up</kbd>, <kbd>k</kbd></td>
 | 
				
			||||||
                <td><FormattedMessage id='keyboard_shortcuts.up' defaultMessage='to move up in the list' /></td>
 | 
					                <td><FormattedMessage id='keyboard_shortcuts.up' defaultMessage='to move up in the list' /></td>
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -99,6 +99,7 @@ const keyMap = {
 | 
				
			|||||||
  goToRequests: 'g r',
 | 
					  goToRequests: 'g r',
 | 
				
			||||||
  toggleSpoiler: 'x',
 | 
					  toggleSpoiler: 'x',
 | 
				
			||||||
  bookmark: 'd',
 | 
					  bookmark: 'd',
 | 
				
			||||||
 | 
					  toggleCollapse: 'shift+x',
 | 
				
			||||||
};
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
@connect(mapStateToProps)
 | 
					@connect(mapStateToProps)
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user