haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-31 22:54:11 +00:00
Code Issues Releases Wiki Activity

[dir view] redesign: moved 'list/grid' view mode icons down to the 'cur path'bar, grouped 'properties', 'tags', 'history', 'trash' icons into a 'more' dropdown menu (#6102)

Browse Source
This commit is contained in:
llj
2024-05-21 21:06:50 +08:00
committed by GitHub
parent 708184d713
commit af1ad767ca
10 changed files with 156 additions and 145 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/src/components/toolbar/dir-operation-toolbar.js
View File

@@ -7,7 +7,6 @@ import ModalPortal from '../modal-portal';
import CreateFolder from '../../components/dialog/create-folder-dialog';
import CreateFile from '../../components/dialog/create-file-dialog';
import ShareDialog from '../../components/dialog/share-dialog';
import ViewModeToolbar from './view-mode-toolbar';
const propTypes = {
path: PropTypes.string.isRequired,
@@ -244,7 +243,6 @@ class DirOperationToolbar extends React.Component {
{content}
</div>
)}
{Utils.isDesktop() && <ViewModeToolbar currentMode={this.props.currentMode} switchViewMode={this.props.switchViewMode} isCustomPermission={isCustomPermission} />}
{this.state.isCreateFileDialogShow && (
<ModalPortal>
<CreateFile

2
frontend/src/components/toolbar/multiple-dir-operation-toolbar.js
View File

@@ -12,7 +12,6 @@ import EditFileTagDialog from '../dialog/edit-filetag-dialog';
import ZipDownloadDialog from '../dialog/zip-download-dialog';
import Rename from '../dialog/rename-dirent';
import LibSubFolderPermissionDialog from '../dialog/lib-sub-folder-permission-dialog';
import ViewModeToolbar from './view-mode-toolbar';
import ModalPortal from '../modal-portal';
import ItemDropdownMenu from '../dropdown-menu/item-dropdown-menu';
@@ -356,7 +355,6 @@ class MultipleDirOperationToolbar extends React.Component {
</ButtonGroup>
</div>
</div>
{Utils.isDesktop() && <ViewModeToolbar currentMode={this.props.currentMode} switchViewMode={this.props.switchViewMode} isCustomPermission={isCustomPermission} />}
{this.state.isMoveDialogShow &&
<MoveDirentDialog
path={this.props.path}

46
frontend/src/components/toolbar/view-mode-toolbar.js
View File

@@ -1,46 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
import { gettext } from '../../utils/constants';
const propTypes = {
currentMode: PropTypes.string.isRequired,
switchViewMode: PropTypes.func.isRequired,
isCustomPermission: PropTypes.bool,
};
class ViewModeToolbar extends React.Component {
static defaultProps = {
isCustomPermission: false,
};
switchViewMode = (e) => {
e.preventDefault();
let id = e.target.id;
if (id === this.props.currentMode) {
return;
}
this.props.switchViewMode(id);
};
render() {
let baseClass = 'btn btn-secondary btn-icon sf-view-mode-btn ';
return (
<React.Fragment>
<div className="view-mode btn-group">
<button className={`${baseClass} sf2-icon-list-view ${this.props.currentMode === 'list' ? 'current-mode' : ''}`} id='list' title={gettext('List')} aria-label={gettext('List')} onClick={this.switchViewMode}></button>
<button className={`${baseClass} sf2-icon-grid-view ${this.props.currentMode === 'grid' ? 'current-mode' : ''}`} id='grid' title={gettext('Grid')} aria-label={gettext('Grid')} onClick={this.switchViewMode}></button>
</div>
{!this.props.isCustomPermission && (
<div className="detail-btn btn-group">
<button className="btn btn-secondary btn-icon ml-1 fas fa-info" id='detail' title={gettext('Properties')} aria-label={gettext('Properties')} onClick={this.switchViewMode}></button>
</div>
)}
</React.Fragment>
);
}
}
ViewModeToolbar.propTypes = propTypes;
export default ViewModeToolbar;