Add keyboard shortcut to collapse/uncollapse toots
This commit is contained in:
		
							parent
							
								
									7ed89e9178
								
							
						
					
					
						commit
						02bd678944
					
				
					 3 changed files with 24 additions and 1 deletions
				
			
		|  | @ -367,6 +367,14 @@ export default class Status extends ImmutablePureComponent { | |||
|     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 => { | ||||
|     this.node = c; | ||||
|   } | ||||
|  | @ -556,6 +564,7 @@ export default class Status extends ImmutablePureComponent { | |||
|       moveDown: this.handleHotkeyMoveDown, | ||||
|       toggleSpoiler: this.handleExpandedToggle, | ||||
|       bookmark: this.handleHotkeyBookmark, | ||||
|       toggleCollapse: this.handleHotkeyCollapse, | ||||
|     }; | ||||
| 
 | ||||
|     const computedClass = classNames('status', `status-${status.get('visibility')}`, { | ||||
|  |  | |||
|  | @ -1,6 +1,7 @@ | |||
| import React from 'react'; | ||||
| import Column from 'flavours/glitch/features/ui/components/column'; | ||||
| import ColumnBackButtonSlim from 'flavours/glitch/components/column_back_button_slim'; | ||||
| import { connect } from 'react-redux'; | ||||
| import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; | ||||
| import PropTypes from 'prop-types'; | ||||
| import ImmutablePureComponent from 'react-immutable-pure-component'; | ||||
|  | @ -9,16 +10,22 @@ const messages = defineMessages({ | |||
|   heading: { id: 'keyboard_shortcuts.heading', defaultMessage: 'Keyboard Shortcuts' }, | ||||
| }); | ||||
| 
 | ||||
| const mapStateToProps = state => ({ | ||||
|   collapseEnabled: state.getIn(['local_settings', 'collapsed', 'enabled']), | ||||
| }); | ||||
| 
 | ||||
| @connect(mapStateToProps) | ||||
| @injectIntl | ||||
| export default class KeyboardShortcuts extends ImmutablePureComponent { | ||||
| 
 | ||||
|   static propTypes = { | ||||
|     intl: PropTypes.object.isRequired, | ||||
|     multiColumn: PropTypes.bool, | ||||
|     collapseEnabled: PropTypes.bool, | ||||
|   }; | ||||
| 
 | ||||
|   render () { | ||||
|     const { intl } = this.props; | ||||
|     const { intl, collapseEnabled } = this.props; | ||||
| 
 | ||||
|     return ( | ||||
|       <Column icon='question' heading={intl.formatMessage(messages.heading)}> | ||||
|  | @ -64,6 +71,12 @@ export default class KeyboardShortcuts extends ImmutablePureComponent { | |||
|                 <td><kbd>x</kbd></td> | ||||
|                 <td><FormattedMessage id='keyboard_shortcuts.toggle_hidden' defaultMessage='to show/hide text behind CW' /></td> | ||||
|               </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> | ||||
|                 <td><kbd>up</kbd>, <kbd>k</kbd></td> | ||||
|                 <td><FormattedMessage id='keyboard_shortcuts.up' defaultMessage='to move up in the list' /></td> | ||||
|  |  | |||
|  | @ -99,6 +99,7 @@ const keyMap = { | |||
|   goToRequests: 'g r', | ||||
|   toggleSpoiler: 'x', | ||||
|   bookmark: 'd', | ||||
|   toggleCollapse: 'shift+x', | ||||
| }; | ||||
| 
 | ||||
| @connect(mapStateToProps) | ||||
|  |  | |||
		Loading…
	
		Reference in a new issue