1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-05 08:53:14 +00:00

add layout toggle shortcut (#6610)

* add layout toggle shortcut

* add switch mode shortcut on libraries page

* delete useless codes

---------

Co-authored-by: Michael An <2331806369@qq.com>
This commit is contained in:
Aries
2024-08-23 11:30:45 +08:00
committed by GitHub
parent 0ac1cb51ac
commit f8bebb6d91
2 changed files with 31 additions and 2 deletions

View File

@@ -19,6 +19,22 @@ class ViewModes extends React.Component {
};
}
componentDidMount() {
document.addEventListener('keydown', this.onKeyDown);
}
componentWillUnmount() {
document.removeEventListener('keydown', this.onKeyDown);
}
onKeyDown = (event) => {
if (event.shiftKey && event.keyCode === 49) {
this.props.switchViewMode('list');
} else if (event.shiftKey && event.keyCode === 50) {
this.props.switchViewMode('grid');
}
};
toggleDropdownMenu = () => {
this.setState({
isDropdownMenuOpen: !this.state.isDropdownMenuOpen
@@ -29,8 +45,8 @@ class ViewModes extends React.Component {
const { isDropdownMenuOpen } = this.state;
const { currentViewMode } = this.props;
const options = [
{ 'icon': 'list-view', 'text': gettext('List view'), 'value': 'list' },
{ 'icon': 'grid-view', 'text': gettext('Grid view'), 'value': 'grid' }
{ 'icon': 'list-view', 'text': gettext('List view'), 'value': 'list', 'shortcut': 'Shift 1' },
{ 'icon': 'grid-view', 'text': gettext('Grid view'), 'value': 'grid', 'shortcut': 'Shift 2' }
];
return (
<Dropdown
@@ -62,6 +78,9 @@ class ViewModes extends React.Component {
<span className={`sf3-font-${item.icon} sf3-font mr-2`}></span>
<span>{item.text}</span>
</span>
<span className="view-modes-dropdown-shortcut">
<span>{item.shortcut}</span>
</span>
</div>
</DropdownItem>
);