haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-11 03:41:12 +00:00
Code Issues Releases Wiki Activity

['view mode'] changed the shortcuts to solve the "input !@" problems (#7117)

Browse Source 
- It used 'shift + 1' & 'shift + 2' as shortcuts. That caused problems.
  when a user input '!' or '@' in an input on the page, the 'view mode'
  was changed.
- solution: replaced 'shift + 1/2' to 'ctrl/cmd + shift + 1/2'
This commit is contained in:
llj
2024-11-29 11:29:56 +08:00
committed by GitHub
parent 61fd67b8bb
commit 9048035920
1 changed files with 12 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
frontend/src/components/view-modes.js
View File

@@ -1,6 +1,7 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Dropdown, DropdownMenu, DropdownToggle, DropdownItem } from 'reactstrap';
import { Utils } from '../utils/utils';
import { gettext } from '../utils/constants';
import { GRID_MODE, LIST_MODE } from './dir-view-mode/constants';
@@ -28,11 +29,13 @@ class ViewModes extends React.Component {
document.removeEventListener('keydown', this.onKeyDown);
}
onKeyDown = (event) => {
if (event.shiftKey && event.keyCode === 49) {
this.props.switchViewMode(LIST_MODE);
} else if (event.shiftKey && event.keyCode === 50) {
this.props.switchViewMode(GRID_MODE);
onKeyDown = (e) => {
if ((e.ctrlKey || e.metaKey) && e.shiftKey) {
if (e.keyCode === 49) {
this.props.switchViewMode(LIST_MODE);
} else if (e.keyCode === 50) {
this.props.switchViewMode(GRID_MODE);
}
}
};
@@ -45,9 +48,10 @@ class ViewModes extends React.Component {
render() {
const { isDropdownMenuOpen } = this.state;
const { currentViewMode } = this.props;
const shortcutMain = Utils.isMac() ? '⇧ ⌘' : 'Ctrl + Shift +';
const options = [
{ 'icon': 'list-view', 'text': gettext('List view'), 'value': LIST_MODE, 'shortcut': 'Shift 1' },
{ 'icon': 'grid-view', 'text': gettext('Grid view'), 'value': GRID_MODE, 'shortcut': 'Shift 2' }
{ 'icon': 'list-view', 'text': gettext('List view'), 'value': LIST_MODE, 'shortcut': `${shortcutMain} 1` },
{ 'icon': 'grid-view', 'text': gettext('Grid view'), 'value': GRID_MODE, 'shortcut': `${shortcutMain} 2` }
];
return (
<Dropdown
@@ -79,9 +83,7 @@ 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>
<span className="view-modes-dropdown-shortcut ml-4">{item.shortcut}</span>
</div>
</DropdownItem>
);