Skip to content

Commit

Permalink
Merge branch '12.0' of github.com:/haiwen/seahub into 12.0
Browse files Browse the repository at this point in the history
  • Loading branch information
@libra-co
libra-co committed May 17, 2024
2 parents 3d6bcd2 + 0e38b74 commit 3f744b1
Show file tree
Hide file tree
Showing 10 changed files with 170 additions and 145 deletions.
2 changes: 2 additions & 0 deletions frontend/src/components/cur-dir-path/dir-path.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ const propTypes = {
repoID: PropTypes.string.isRequired,
isViewFile: PropTypes.bool,
fileTags: PropTypes.array.isRequired,
toggleTreePanel: PropTypes.func.isRequired
};

class DirPath extends React.Component {
Expand Down Expand Up @@ -78,6 +79,7 @@ class DirPath extends React.Component {

return (
<div className="path-container">
<button className="op-btn mr-2" onClick={this.props.toggleTreePanel}><span className="sf3-font-side-bar sf3-font"></span></button>
{this.props.pathPrefix && this.props.pathPrefix.map((item, index) => {
return (
<Fragment key={index}>
Expand Down
2 changes: 2 additions & 0 deletions frontend/src/components/cur-dir-path/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@ const propTypes = {
updateUsedRepoTags: PropTypes.func.isRequired,
fileTags: PropTypes.array.isRequired,
onDeleteRepoTag: PropTypes.func.isRequired,
toggleTreePanel: PropTypes.func.isRequired,
direntList: PropTypes.array,
sortBy: PropTypes.string,
sortOrder: PropTypes.string,
Expand Down Expand Up @@ -51,6 +52,7 @@ class CurDirPath extends React.Component {
repoID={this.props.repoID}
isViewFile={this.props.isViewFile}
fileTags={this.props.fileTags}
toggleTreePanel={this.props.toggleTreePanel}
/>
{isDesktop &&
<DirTool
Expand Down
53 changes: 29 additions & 24 deletions frontend/src/components/dir-view-mode/dir-column-view.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ import DirListView from './dir-list-view';
import DirGridView from './dir-grid-view';

const propTypes = {
isTreePanelShown: PropTypes.bool.isRequired,
currentMode: PropTypes.string.isRequired,
path: PropTypes.string.isRequired,
repoID: PropTypes.string.isRequired,
Expand Down Expand Up @@ -146,35 +147,39 @@ class DirColumnView extends React.Component {
}

render() {
const { currentMode } = this.props;
const { currentMode, isTreePanelShown } = this.props;
const onResizeMove = this.state.inResizing ? this.onResizeMouseMove : null;
const select = this.state.inResizing ? 'none' : '';
const mainFlex = '1 0 ' + (1 - this.state.navRate - 0.05) * 100 + '%';
return (
<div className="dir-colunm-view" onMouseMove={onResizeMove} onMouseUp={this.onResizeMouseUp} ref="viewModeContainer">
<DirColumnNav
currentPath={this.props.path}
userPerm={this.props.userPerm}
isTreeDataLoading={this.props.isTreeDataLoading}
treeData={this.props.treeData}
currentNode={this.props.currentNode}
onNodeClick={this.props.onNodeClick}
onNodeCollapse={this.props.onNodeCollapse}
onNodeExpanded={this.props.onNodeExpanded}
onAddFolderNode={this.props.onAddFolderNode}
onAddFileNode={this.props.onAddFileNode}
onRenameNode={this.props.onRenameNode}
onDeleteNode={this.props.onDeleteNode}
repoID={this.props.repoID}
navRate={this.state.navRate}
inResizing={this.state.inResizing}
currentRepoInfo={this.props.currentRepoInfo}
onItemMove={this.props.onItemMove}
onItemCopy={this.props.onItemCopy}
selectedDirentList={this.props.selectedDirentList}
onItemsMove={this.props.onItemsMove}
/>
<div className="dir-content-resize" onMouseDown={this.onResizeMouseDown}></div>
{isTreePanelShown && (
<>
<DirColumnNav
currentPath={this.props.path}
userPerm={this.props.userPerm}
isTreeDataLoading={this.props.isTreeDataLoading}
treeData={this.props.treeData}
currentNode={this.props.currentNode}
onNodeClick={this.props.onNodeClick}
onNodeCollapse={this.props.onNodeCollapse}
onNodeExpanded={this.props.onNodeExpanded}
onAddFolderNode={this.props.onAddFolderNode}
onAddFileNode={this.props.onAddFileNode}
onRenameNode={this.props.onRenameNode}
onDeleteNode={this.props.onDeleteNode}
repoID={this.props.repoID}
navRate={this.state.navRate}
inResizing={this.state.inResizing}
currentRepoInfo={this.props.currentRepoInfo}
onItemMove={this.props.onItemMove}
onItemCopy={this.props.onItemCopy}
selectedDirentList={this.props.selectedDirentList}
onItemsMove={this.props.onItemsMove}
/>
<div className="dir-content-resize" onMouseDown={this.onResizeMouseDown}></div>
</>
)}
<div className="dir-content-main" style={{userSelect: select, flex: mainFlex}} onScroll={this.props.isViewFile ? () => {} : this.props.onItemsScroll}>
{this.props.isViewFile ? (
<DirColumnFile
Expand Down
2 changes: 1 addition & 1 deletion frontend/src/css/layout.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,7 @@
.cur-view-path {
position: relative; /* for the ':after' */
padding: 8px 16px;
max-height: 40px;
max-height: 48px;
background: #fff;
display: flex;
align-items: center;
Expand Down
12 changes: 12 additions & 0 deletions frontend/src/css/lib-content-view.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -225,3 +225,15 @@
justify-content: center;
align-items: center;
}

.op-btn {
background: #fff;
border: 1px solid #dbdbdb;
border-radius: 3px;
height: 32px;
padding: 0 .5rem;
}

.op-btn:hover {
background: #f5f5f5;
}
3 changes: 3 additions & 0 deletions frontend/src/pages/lib-content-view/lib-content-container.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import '../../css/lib-content-view.css';
const propTypes = {
pathPrefix: PropTypes.array.isRequired,
isTreePanelShown: PropTypes.bool.isRequired,
toggleTreePanel: PropTypes.func.isRequired,
currentMode: PropTypes.string.isRequired,
path: PropTypes.string.isRequired,
pathExist: PropTypes.bool.isRequired,
Expand Down Expand Up @@ -186,12 +187,14 @@ class LibContentContainer extends React.Component {
sortBy={this.props.sortBy}
sortOrder={this.props.sortOrder}
sortItems={this.props.sortItems}
toggleTreePanel={this.props.toggleTreePanel}
/>
</div>
<div className={`cur-view-content lib-content-container ${this.props.isTreePanelShown ? 'view-mode-container' : ''}`} onScroll={this.onItemsScroll}>
{!this.props.pathExist && this.errMessage}
{this.props.pathExist && (
<DirColumnView
isTreePanelShown={this.props.isTreePanelShown}
currentMode={this.props.currentMode}
path={this.props.path}
repoID={repoID}
Expand Down
7 changes: 7 additions & 0 deletions frontend/src/pages/lib-content-view/lib-content-view.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1945,6 +1945,12 @@ class LibContentView extends React.Component {
e.preventDefault();
};

toggleTreePanel = () => {
this.setState({
isTreePanelShown: !this.state.isTreePanelShown
});
};

render() {
if (this.state.libNeedDecrypt) {
return (
Expand Down Expand Up @@ -2046,6 +2052,7 @@ class LibContentView extends React.Component {
<LibContentContainer
pathPrefix={this.props.pathPrefix}
isTreePanelShown={this.state.isTreePanelShown}
toggleTreePanel={this.toggleTreePanel}
currentMode={this.state.currentMode}
path={this.state.path}
pathExist={this.state.pathExist}
Expand Down
173 changes: 76 additions & 97 deletions frontend/src/pages/libraries/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,37 +36,41 @@ class Libraries extends Component {
isSortOptionsDialogOpen: false,
sortBy: cookie.load('seafile-repo-dir-sort-by') || 'name', // 'name' or 'time' or 'size'
sortOrder: cookie.load('seafile-repo-dir-sort-order') || 'asc', // 'asc' or 'desc'

isGuideForNewDialogOpen: window.app.pageOptions.guideEnabled,

// for 'groups'
isGroupsLoading: true,
groupsErrorMsg: '',
groupList: []
groupList: [],
sharedRepoList:[],
publicRepoList: [],
};
}

componentDidMount() {
this.listMyLibs();
this.listGroups();
}

listMyLibs = () => {
seafileAPI.listRepos({type: 'mine'}).then((res) => {
let repoList = res.data.repos.map((item) => {
return new Repo(item);
});
const promiseListRepos = seafileAPI.listRepos({ 'type': ['mine', 'shared', 'public'] });
const promiseListGroups = seafileAPI.listGroups(true);
Promise.all([promiseListRepos, promiseListGroups]).then(res => {
const [resListRepos, resListGroups] = res;
const allRepoList = resListRepos.data.repos.map((item) => new Repo(item));
const myRepoList = allRepoList.filter(item => item.type === 'mine');
const sharedRepoList = allRepoList.filter(item => item.type === 'shared');
const publicRepoList = allRepoList.filter(item => item.type === 'public');
const groupList = resListGroups.data.map(item => {
let group = new Group(item);
group.repos = item.repos.map(item => new Repo(item));
return group;
}).sort((a, b) => a.name.toLowerCase() < b.name.toLowerCase() ? -1 : 1 );
this.setState({
isLoading: false,
repoList: Utils.sortRepos(repoList, this.state.sortBy, this.state.sortOrder)
groupList,
sharedRepoList,
publicRepoList,
repoList: Utils.sortRepos(myRepoList, this.state.sortBy, this.state.sortOrder),
});
}).catch((error) => {
this.setState({
isLoading: false,
errorMsg: Utils.getErrorMsg(error, true) // true: show login tip if 403
errorMsg: Utils.getErrorMsg(error, true),
});
});
};
}

toggleSortOptionsDialog = () => {
this.setState({
Expand Down Expand Up @@ -146,30 +150,6 @@ class Libraries extends Component {
};

// the following are for 'groups'
listGroups = () => {
seafileAPI.listGroups(true).then((res) => {
// `{'with_repos': 1}`: list repos of every group
let groupList = res.data.map(item => {
let group = new Group(item);
group.repos = item.repos.map(item => {
return new Repo(item);
});
return group;
});
this.setState({
isGroupsLoading: false,
groupList: groupList.sort((a, b) => {
return a.name.toLowerCase() < b.name.toLowerCase() ? -1 : 1;
})
});
}).catch((error) => {
this.setState({
isGroupsLoading: false,
groupsErrorMsg: Utils.getErrorMsg(error, true) // true: show login tip if 403
});
});
};

onCreateGroup = (groupData) => {
const newGroup = new Group(groupData);
const { groupList: newList } = this.state;
Expand All @@ -192,7 +172,7 @@ class Libraries extends Component {
};

render() {

const { isLoading } = this.state;
return (
<Fragment>
<TopToolbar
Expand All @@ -209,33 +189,36 @@ class Libraries extends Component {
<div className="cur-view-path">
<h3 className="sf-heading m-0">{gettext('Files')}</h3>
</div>
<div className="cur-view-content" id="files-content-container">
{isLoading ?
<Loading /> :
<div className="cur-view-content" id="files-content-container">

<table aria-hidden={true} className="my-3">
<thead>
<tr>
<th width="4%"></th>
<th width="3%"><span className="sr-only">{gettext('Library Type')}</span></th>
<th width="35%">{gettext('Name')}</th>
<th width="10%"><span className="sr-only">{gettext('Actions')}</span></th>
<th width="14%">{gettext('Size')}</th>
<th width="17%">{gettext('Last Update')}</th>
<th width="17%">{gettext('Owner')}</th>
</tr>
</thead>
</table>
<table aria-hidden={true} className="my-3">
<thead>
<tr>
<th width="4%"></th>
<th width="3%"><span className="sr-only">{gettext('Library Type')}</span></th>
<th width="35%">{gettext('Name')}</th>
<th width="10%"><span className="sr-only">{gettext('Actions')}</span></th>
<th width="14%">{gettext('Size')}</th>
<th width="17%">{gettext('Last Update')}</th>
<th width="17%">{gettext('Owner')}</th>
</tr>
</thead>
</table>

{canAddRepo && (
<div className="pb-3">
<div className="d-flex justify-content-between mt-3 py-1 sf-border-bottom">
<h4 className="sf-heading m-0">
<span className="sf3-font-mine sf3-font nav-icon" aria-hidden="true"></span>
{gettext('My Libraries')}
</h4>
{(!Utils.isDesktop() && this.state.repoList.length > 0) && <span className="sf3-font sf3-font-sort action-icon" onClick={this.toggleSortOptionsDialog}></span>}
</div>
{this.state.isLoading ? <Loading /> : (
this.state.errorMsg ? <p className="error text-center mt-8">{this.state.errorMsg}</p> : (
{canAddRepo && (
<div className="pb-3">
<div className="d-flex justify-content-between mt-3 py-1 sf-border-bottom">
<h4 className="sf-heading m-0">
<span className="sf3-font-mine sf3-font nav-icon" aria-hidden="true"></span>
{gettext('My Libraries')}
</h4>
{(!Utils.isDesktop() && this.state.repoList.length > 0) &&
<span className="sf3-font sf3-font-sort action-icon" onClick={this.toggleSortOptionsDialog}></span>
}
</div>
{this.state.errorMsg ? <p className="error text-center mt-8">{this.state.errorMsg}</p> : (
this.state.repoList.length === 0 ? (
<p className="libraries-empty-tip">{gettext('No libraries')}</p>
) : (
Expand All @@ -251,39 +234,35 @@ class Libraries extends Component {
sortRepoList={this.sortRepoList}
inAllLibs={true}
/>
)))}
</div>
)}

<div className="pb-3">
<SharedLibs inAllLibs={true} />
</div>

{canViewOrg && (
))
}
</div>
)}
<div className="pb-3">
<SharedWithAll inAllLibs={true} />
<SharedLibs inAllLibs={true} repoList={this.state.sharedRepoList} />
</div>
{canViewOrg &&
<div className="pb-3">
<SharedWithAll inAllLibs={true} repoList={this.state.publicRepoList} />
</div>
}
<div className="group-list-panel">
{this.state.groupList.length > 0 && (
this.state.groupList.map((group, index) => {
return (
<GroupItem
key={index}
group={group}
updateGroup={this.updateGroup}
/>
);
})
)}
</div>
)}

<div className="group-list-panel">
{this.state.isGroupsLoading? <Loading /> : (
this.state.groupsErrorMsg ? <p className="error text-center mt-8">{this.state.groupsErrorMsg}</p> : (
this.state.groupList.length > 0 && (
this.state.groupList.map((group, index) => {
return (
<GroupItem
key={index}
group={group}
updateGroup={this.updateGroup}
/>
);
})
)))}
</div>

</div>
}
</div>
{!this.state.isLoading && !this.state.errorMsg && this.state.isGuideForNewDialogOpen &&
{!isLoading && !this.state.errorMsg && this.state.isGuideForNewDialogOpen &&
<GuideForNewDialog
toggleDialog={this.toggleGuideForNewDialog}
/>
Expand Down
Loading

0 comments on commit 3f744b1

Please sign in to comment.