1
0
mirror of https://github.com/haiwen/seahub.git synced 2025-08-09 19:07:40 +00:00

Router optimized (#2565)

This commit is contained in:
杨顺强 2018-11-26 17:53:18 +08:00 committed by Daniel Pan
parent f6a0b30281
commit 50a04fed0c
12 changed files with 143 additions and 201 deletions

View File

@ -16,6 +16,7 @@ import ShareAdminFolders from './pages/share-admin/folders';
import ShareAdminShareLinks from './pages/share-admin/share-links';
import ShareAdminUploadLinks from './pages/share-admin/upload-links';
import SharedLibraries from './pages/shared-libs/shared-libs';
import MainContentWrapper from './components/main-content-wrapper';
import 'seafile-ui';
import './assets/css/fa-solid.css';
@ -25,6 +26,16 @@ import './css/layout.css';
import './css/toolbar.css';
import './css/search.css';
const FilesActivitiesWrapper = MainContentWrapper(FilesActivities);
const DraftsViewWrapper = MainContentWrapper(DraftsView);
const StarredWrapper = MainContentWrapper(Starred);
const LinkedDevicesWrapper = MainContentWrapper(LinkedDevices);
const SharedLibrariesWrapper = MainContentWrapper(SharedLibraries);
const ShareAdminLibrariesWrapper = MainContentWrapper(ShareAdminLibraries);
const ShareAdminFoldersWrapper = MainContentWrapper(ShareAdminFolders);
const ShareAdminShareLinksWrapper = MainContentWrapper(ShareAdminShareLinks);
const ShareAdminUploadLinksWrapper = MainContentWrapper(ShareAdminUploadLinks);
class App extends Component {
constructor(props) {
@ -91,15 +102,14 @@ class App extends Component {
render() {
let { currentTab } = this.state;
return (
<div id="main">
<SidePanel isSidePanelClosed={this.state.isSidePanelClosed} onCloseSidePanel={this.onCloseSidePanel} currentTab={currentTab} tabItemClick={this.tabItemClick} draftCounts={this.state.draftCounts} />
<MainPanel>
<Router>
<FilesActivities path={siteRoot + 'dashboard'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick}/>
<DraftsView path={siteRoot + 'drafts'}
<FilesActivitiesWrapper path={siteRoot + 'dashboard'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<DraftsViewWrapper path={siteRoot + 'drafts'}
currentTab={currentTab}
tabItemClick={this.tabItemClick}
onShowSidePanel={this.onShowSidePanel}
@ -113,14 +123,14 @@ class App extends Component {
updateDraftsList={this.updateDraftsList}
/>
<ReviewContent path='reviews' />
</DraftsView>
<Starred path={siteRoot + 'starred'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<LinkedDevices path={siteRoot + 'linked-devices'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<ShareAdminLibraries path={siteRoot + 'share-admin-libs'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<ShareAdminFolders path={siteRoot + 'share-admin-folders'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<ShareAdminShareLinks path={siteRoot + 'share-admin-share-links'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<ShareAdminUploadLinks path={siteRoot + 'share-admin-upload-links'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<SharedLibraries path={siteRoot + 'shared-libs'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
</DraftsViewWrapper>
<StarredWrapper path={siteRoot + 'starred'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<LinkedDevicesWrapper path={siteRoot + 'linked-devices'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<ShareAdminLibrariesWrapper path={siteRoot + 'share-admin-libs'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<ShareAdminFoldersWrapper path={siteRoot + 'share-admin-folders'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<ShareAdminShareLinksWrapper path={siteRoot + 'share-admin-share-links'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<ShareAdminUploadLinksWrapper path={siteRoot + 'share-admin-upload-links'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
<SharedLibrariesWrapper path={siteRoot + 'shared-libs'} onShowSidePanel={this.onShowSidePanel} onSearchedClick={this.onSearchedClick} />
</Router>
</MainPanel>
</div>

View File

@ -0,0 +1,22 @@
import React, { Fragment } from 'react';
import GeneralToolBar from './toolbar/general-toolbar';
const MainContentWrapper = (WrapperedComponent) => {
return class extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<Fragment>
<GeneralToolBar {...this.props} />
<WrapperedComponent {...this.props} />
</Fragment>
);
}
}
}
export default MainContentWrapper;

View File

@ -13,7 +13,7 @@ class GeneralToolbar extends React.Component {
let { onShowSidePanel, onSearchedClick } = this.props;
let placeHolder = this.props.searchPlaceholder || 'Search files in this library';
return (
<Fragment>
<div className="main-panel-north">
<div className="cur-view-toolbar">
<span
className="sf2-icon-menu side-nav-toggle hidden-md-up d-md-none"
@ -25,7 +25,7 @@ class GeneralToolbar extends React.Component {
searchPlaceholder={placeHolder}
onSearchedClick={onSearchedClick}
/>
</Fragment>
</div>
);
}
}

View File

@ -1,8 +1,7 @@
import React, { Component, Fragment } from 'react';
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { seafileAPI } from '../../utils/seafile-api';
import { gettext, siteRoot } from '../../utils/constants';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
const contentPropTypes = {
data: PropTypes.object.isRequired,
@ -245,14 +244,6 @@ class FilesActivities extends Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-center">
<div className="cur-view-container" id="activities">
<div className="cur-view-path">
@ -263,7 +254,6 @@ class FilesActivities extends Component {
</div>
</div>
</div>
</Fragment>
);
}
}

View File

@ -1,8 +1,7 @@
import React, { Fragment } from 'react';
import React from 'react';
import PropTypes from 'prop-types';
import { siteRoot, gettext } from '../../utils/constants';
import { Link } from '@reach/router';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
const propTypes = {
currentTab: PropTypes.string.isRequired,
@ -21,14 +20,6 @@ class DraftsView extends React.Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-center">
<div className="cur-view-container">
<div className="cur-view-path">
@ -44,7 +35,6 @@ class DraftsView extends React.Component {
{this.props.children}
</div>
</div>
</Fragment>
);
}
}

View File

@ -1,8 +1,7 @@
import React, { Component, Fragment } from 'react';
import React, { Component } from 'react';
import moment from 'moment';
import { seafileAPI } from '../../utils/seafile-api';
import { gettext, loginUrl } from '../../utils/constants';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
import Toast from '../../components/toast';
class Content extends Component {
@ -195,14 +194,6 @@ class LinkedDevices extends Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-center">
<div className="cur-view-container" id="linked-devices">
<div className="cur-view-path">
@ -213,7 +204,6 @@ class LinkedDevices extends Component {
</div>
</div>
</div>
</Fragment>
);
}
}

View File

@ -1,8 +1,7 @@
import React, { Component, Fragment } from 'react';
import React, { Component } from 'react';
import { seafileAPI } from '../../utils/seafile-api';
import { Utils } from '../../utils/utils';
import { gettext, siteRoot, loginUrl, isPro } from '../../utils/constants';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
class Content extends Component {
@ -282,14 +281,6 @@ class ShareAdminFolders extends Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-center">
<div className="cur-view-container" id="share-admin-libs">
<div className="cur-view-path">
@ -300,7 +291,6 @@ class ShareAdminFolders extends Component {
</div>
</div>
</div>
</Fragment>
);
}
}

View File

@ -1,8 +1,7 @@
import React, { Component, Fragment } from 'react';
import React, { Component } from 'react';
import { seafileAPI } from '../../utils/seafile-api';
import { Utils } from '../../utils/utils';
import { gettext, siteRoot, loginUrl, isPro } from '../../utils/constants';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
class Content extends Component {
@ -289,14 +288,6 @@ class ShareAdminLibraries extends Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-center">
<div className="cur-view-container" id="share-admin-libs">
<div className="cur-view-path">
@ -307,7 +298,6 @@ class ShareAdminLibraries extends Component {
</div>
</div>
</div>
</Fragment>
);
}
}

View File

@ -1,11 +1,10 @@
import React, { Component, Fragment } from 'react';
import React, { Component } from 'react';
import { Link } from '@reach/router';
import moment from 'moment';
import { Modal, ModalHeader, ModalBody } from 'reactstrap';
import { seafileAPI } from '../../utils/seafile-api';
import { Utils } from '../../utils/utils';
import { gettext, siteRoot, loginUrl, isPro, canGenerateUploadLink } from '../../utils/constants';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
class Content extends Component {
constructor(props) {
@ -238,14 +237,6 @@ class ShareAdminShareLinks extends Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-cneter">
<div className="cur-view-container">
<div className="cur-view-path">
@ -263,7 +254,6 @@ class ShareAdminShareLinks extends Component {
</div>
</div>
</div>
</Fragment>
);
}
}

View File

@ -1,11 +1,10 @@
import React, { Component, Fragment } from 'react';
import React, { Component } from 'react';
import { Link } from '@reach/router';
import moment from 'moment';
import { Modal, ModalHeader, ModalBody } from 'reactstrap';
import { seafileAPI } from '../../utils/seafile-api';
import { Utils } from '../../utils/utils';
import { gettext, siteRoot, loginUrl, isPro, canGenerateShareLink } from '../../utils/constants';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
class Content extends Component {
constructor(props) {
@ -227,14 +226,6 @@ class ShareAdminUploadLinks extends Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-center">
<div className="cur-view-container">
<div className="cur-view-path">
@ -250,7 +241,6 @@ class ShareAdminUploadLinks extends Component {
</div>
</div>
</div>
</Fragment>
);
}
}

View File

@ -1,10 +1,9 @@
import React, { Component, Fragment } from 'react';
import React, { Component } from 'react';
import moment from 'moment';
import { seafileAPI } from '../../utils/seafile-api';
import { Utils } from '../../utils/utils';
import { gettext, siteRoot, loginUrl, isPro } from '../../utils/constants';
import Loading from '../../components/loading';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
class Content extends Component {
@ -252,14 +251,6 @@ class SharedLibraries extends Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-center">
<div className="cur-view-container">
<div className="cur-view-path">
@ -270,7 +261,6 @@ class SharedLibraries extends Component {
</div>
</div>
</div>
</Fragment>
);
}
}

View File

@ -1,8 +1,7 @@
import React, { Component, Fragment } from 'react';
import React, { Component } from 'react';
import { seafileAPI } from '../../utils/seafile-api';
import { Utils } from '../../utils/utils';
import { gettext, siteRoot, loginUrl } from '../../utils/constants';
import GeneralToolbar from '../../components/toolbar/general-toolbar';
class Content extends Component {
@ -263,14 +262,6 @@ class Starred extends Component {
render() {
return (
<Fragment>
<div className="main-panel-north">
<GeneralToolbar
searchPlaceholder={'Search Files'}
onShowSidePanel={this.props.onShowSidePanel}
onSearchedClick={this.props.onSearchedClick}
/>
</div>
<div className="main-panel-center">
<div className="cur-view-container" id="starred">
<div className="cur-view-path">
@ -281,7 +272,6 @@ class Starred extends Component {
</div>
</div>
</div>
</Fragment>
);
}
}