haiwen/seahub
1
0
Fork 0
mirror of https://github.com/haiwen/seahub.git synced 2025-09-02 23:48:47 +00:00
Code Issues Releases Wiki Activity

[dir view] removed related info & function for 'readme.md' in the top info bar (#5720)

Browse Source
This commit is contained in:
llj
2023-10-31 10:13:48 +08:00
committed by GitHub
parent 0fd1c69deb
commit 2e97b4e341
7 changed files with 7 additions and 151 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
frontend/src/components/dialog/readme-dialog.js
View File

@@ -1,69 +0,0 @@
import React from 'react';
import PropTypes from 'prop-types';
import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap';
import { MarkdownViewer } from '@seafile/seafile-editor';
import Loading from '../../components/loading';
import { seafileAPI } from '../../utils/seafile-api';
import { gettext, mediaUrl } from '../../utils/constants';
import { Utils } from '../../utils/utils';
import toaster from '../toast';
const propTypes = {
repoID: PropTypes.string.isRequired,
filePath: PropTypes.string.isRequired,
fileName: PropTypes.string.isRequired,
href: PropTypes.string,
toggleCancel: PropTypes.func.isRequired,
};
class ReadmeDialog extends React.Component {
constructor(props) {
super(props);
this.state = {
readmeContent: null,
isLoading: true,
};
}
componentDidMount() {
seafileAPI.getFileDownloadLink(this.props.repoID, this.props.filePath).then(res => {
seafileAPI.getFileContent(res.data).then(res => {
this.setState({
readmeContent: res.data,
isLoading: false,
});
});
}).catch(error => {
let errMessage = Utils.getErrorMsg(error);
toaster.danger(errMessage);
});
}
render() {
return (
<Modal isOpen={true} toggle={this.props.toggleCancel} className="readme-dialog" size="lg">
<ModalHeader>{this.props.fileName}
<a className="readme-dialog-edit" href={this.props.href} target='_blank' rel="noreferrer"><i className="fa fa-pencil-alt"></i></a>
</ModalHeader>
<ModalBody>
{this.state.isLoading ?
<Loading />:
<MarkdownViewer
markdownContent={this.state.readmeContent}
showTOC={false}
scriptSource={mediaUrl + 'js/mathjax/tex-svg.js'}
/>
}
</ModalBody>
<ModalFooter>
<Button color="secondary" onClick={this.props.toggleCancel}>{gettext('Close')}</Button>
</ModalFooter>
</Modal>
);
}
}
ReadmeDialog.propTypes = propTypes;
export default ReadmeDialog;

2
frontend/src/components/dir-view-mode/dir-column-view.js
View File

@@ -40,7 +40,6 @@ const propTypes = {
isRepoInfoBarShow: PropTypes.bool.isRequired, isRepoInfoBarShow: PropTypes.bool.isRequired,
draftCounts: PropTypes.number.isRequired, draftCounts: PropTypes.number.isRequired,
usedRepoTags: PropTypes.array.isRequired, usedRepoTags: PropTypes.array.isRequired,
readmeMarkdown: PropTypes.object,
updateUsedRepoTags: PropTypes.func.isRequired, updateUsedRepoTags: PropTypes.func.isRequired,
// list // list
isDirentListLoading: PropTypes.bool.isRequired, isDirentListLoading: PropTypes.bool.isRequired,
@@ -201,7 +200,6 @@ class DirColumnView extends React.Component {
enableDirPrivateShare={this.props.enableDirPrivateShare} enableDirPrivateShare={this.props.enableDirPrivateShare}
isRepoInfoBarShow={this.props.isRepoInfoBarShow} isRepoInfoBarShow={this.props.isRepoInfoBarShow}
usedRepoTags={this.props.usedRepoTags} usedRepoTags={this.props.usedRepoTags}
readmeMarkdown={this.props.readmeMarkdown}
draftCounts={this.props.draftCounts} draftCounts={this.props.draftCounts}
updateUsedRepoTags={this.props.updateUsedRepoTags} updateUsedRepoTags={this.props.updateUsedRepoTags}
isDirentListLoading={this.props.isDirentListLoading} isDirentListLoading={this.props.isDirentListLoading}

2
frontend/src/components/dir-view-mode/dir-grid-view.js
View File

@@ -8,7 +8,6 @@ const propTypes = {
path: PropTypes.string.isRequired, path: PropTypes.string.isRequired,
repoID: PropTypes.string.isRequired, repoID: PropTypes.string.isRequired,
currentRepoInfo: PropTypes.object.isRequired, currentRepoInfo: PropTypes.object.isRequired,
readmeMarkdown: PropTypes.object,
draftCounts: PropTypes.number, draftCounts: PropTypes.number,
usedRepoTags: PropTypes.array.isRequired, usedRepoTags: PropTypes.array.isRequired,
updateUsedRepoTags: PropTypes.func.isRequired, updateUsedRepoTags: PropTypes.func.isRequired,
@@ -53,7 +52,6 @@ class DirGridView extends React.Component {
<RepoInfoBar <RepoInfoBar
repoID={this.props.repoID} repoID={this.props.repoID}
currentPath={this.props.path} currentPath={this.props.path}
readmeMarkdown={this.props.readmeMarkdown}
draftCounts={this.props.draftCounts} draftCounts={this.props.draftCounts}
usedRepoTags={this.props.usedRepoTags} usedRepoTags={this.props.usedRepoTags}
updateUsedRepoTags={this.props.updateUsedRepoTags} updateUsedRepoTags={this.props.updateUsedRepoTags}

2
frontend/src/components/dir-view-mode/dir-list-view.js
View File

@@ -13,7 +13,6 @@ const propTypes = {
enableDirPrivateShare: PropTypes.bool.isRequired, enableDirPrivateShare: PropTypes.bool.isRequired,
isRepoInfoBarShow: PropTypes.bool.isRequired, isRepoInfoBarShow: PropTypes.bool.isRequired,
usedRepoTags: PropTypes.array.isRequired, usedRepoTags: PropTypes.array.isRequired,
readmeMarkdown: PropTypes.object,
draftCounts: PropTypes.number, draftCounts: PropTypes.number,
updateUsedRepoTags: PropTypes.func.isRequired, updateUsedRepoTags: PropTypes.func.isRequired,
isDirentListLoading: PropTypes.bool.isRequired, isDirentListLoading: PropTypes.bool.isRequired,
@@ -64,7 +63,6 @@ class DirListView extends React.Component {
<RepoInfoBar <RepoInfoBar
repoID={this.props.repoID} repoID={this.props.repoID}
currentPath={this.props.path} currentPath={this.props.path}
readmeMarkdown={this.props.readmeMarkdown}
draftCounts={this.props.draftCounts} draftCounts={this.props.draftCounts}
usedRepoTags={this.props.usedRepoTags} usedRepoTags={this.props.usedRepoTags}
updateUsedRepoTags={this.props.updateUsedRepoTags} updateUsedRepoTags={this.props.updateUsedRepoTags}

49
frontend/src/components/repo-info-bar.js
View File

@@ -3,17 +3,13 @@ import PropTypes from 'prop-types';
import ModalPortal from './modal-portal'; import ModalPortal from './modal-portal';
import ListTaggedFilesDialog from './dialog/list-taggedfiles-dialog'; import ListTaggedFilesDialog from './dialog/list-taggedfiles-dialog';
import ListRepoDraftsDialog from './dialog/list-repo-drafts-dialog'; import ListRepoDraftsDialog from './dialog/list-repo-drafts-dialog';
import ReadmeDialog from './dialog/readme-dialog'; import { gettext } from '../utils/constants';
import { siteRoot, gettext } from '../utils/constants';
import { Utils } from '../utils/utils';
import '../css/repo-info-bar.css'; import '../css/repo-info-bar.css';
const propTypes = { const propTypes = {
repoID: PropTypes.string.isRequired, repoID: PropTypes.string.isRequired,
currentPath: PropTypes.string.isRequired,
usedRepoTags: PropTypes.array.isRequired, usedRepoTags: PropTypes.array.isRequired,
readmeMarkdown: PropTypes.object,
draftCounts: PropTypes.number, draftCounts: PropTypes.number,
updateUsedRepoTags: PropTypes.func, updateUsedRepoTags: PropTypes.func,
onFileTagChanged: PropTypes.func, onFileTagChanged: PropTypes.func,
@@ -29,15 +25,14 @@ class RepoInfoBar extends React.Component {
this.state = { this.state = {
currentTag: null, currentTag: null,
isListTaggedFileShow: false, isListTaggedFileShow: false,
showRepoDrafts: false, showRepoDrafts: false
showReadmeDialog: false,
}; };
} }
onListTaggedFiles = (currentTag) => { onListTaggedFiles = (currentTag) => {
this.setState({ this.setState({
currentTag: currentTag, currentTag: currentTag,
isListTaggedFileShow: !this.state.isListTaggedFileShow, isListTaggedFileShow: !this.state.isListTaggedFileShow
}); });
}; };
@@ -53,25 +48,14 @@ class RepoInfoBar extends React.Component {
}); });
}; };
toggleReadme = () => {
this.setState({
showReadmeDialog: !this.state.showReadmeDialog
});
};
render() { render() {
let { repoID, currentPath, usedRepoTags, readmeMarkdown, draftCounts, className } = this.props; let { repoID, usedRepoTags, draftCounts, className } = this.props;
// to be compatible with the existing code // to be compatible with the existing code
if (readmeMarkdown === undefined) {
readmeMarkdown = null;
}
if (draftCounts === undefined) { if (draftCounts === undefined) {
draftCounts = 0; draftCounts = 0;
} }
let href = readmeMarkdown !== null ? siteRoot + 'lib/' + repoID + '/file' + Utils.joinPath(currentPath, readmeMarkdown.name) + '?mode=edit' : '';
let filePath = readmeMarkdown !== null ? currentPath + readmeMarkdown.name : '';
return ( return (
<div className={`repo-info-bar ${className ? className : ''}`}> <div className={`repo-info-bar ${className ? className : ''}`}>
{usedRepoTags.length > 0 && ( {usedRepoTags.length > 0 && (
@@ -89,19 +73,7 @@ class RepoInfoBar extends React.Component {
})} })}
</ul> </ul>
)} )}
<div className={(usedRepoTags.length > 0 && readmeMarkdown) ? 'file-info-list mt-1' : 'file-info-list'}> <div className={usedRepoTags.length > 0 ? 'file-info-list mt-1' : 'file-info-list'}>
{(readmeMarkdown !== null && parseInt(readmeMarkdown.size) > 1) &&
<span className="file-info" onClick={this.toggleReadme}>
<span className="info-icon sf2-icon-readme"></span>
<span className="used-tag-name">{readmeMarkdown.name}</span>
</span>
}
{(readmeMarkdown !== null && parseInt(readmeMarkdown.size) < 2) &&
<span className="file-info">
<span className="info-icon sf2-icon-readme"></span>
<a className="used-tag-name" href={href} target='_blank' rel="noreferrer">{readmeMarkdown.name}</a>
</span>
}
{draftCounts > 0 && {draftCounts > 0 &&
<span className="file-info"> <span className="file-info">
<span className="info-icon sf2-icon-drafts"></span> <span className="info-icon sf2-icon-drafts"></span>
@@ -136,17 +108,6 @@ class RepoInfoBar extends React.Component {
</ModalPortal> </ModalPortal>
)} )}
{this.state.showReadmeDialog && (
<ModalPortal>
<ReadmeDialog
toggleCancel={this.toggleReadme}
repoID={repoID}
filePath={filePath}
href={href}
fileName={readmeMarkdown.name}
/>
</ModalPortal>
)}
</div> </div>
); );
} }

8
frontend/src/pages/lib-content-view/lib-content-container.js
View File

@@ -52,7 +52,6 @@ const propTypes = {
// repo content // repo content
draftCounts: PropTypes.number, draftCounts: PropTypes.number,
usedRepoTags: PropTypes.array.isRequired, usedRepoTags: PropTypes.array.isRequired,
readmeMarkdown: PropTypes.object,
updateUsedRepoTags: PropTypes.func.isRequired, updateUsedRepoTags: PropTypes.func.isRequired,
// list // list
isDirentListLoading: PropTypes.bool.isRequired, isDirentListLoading: PropTypes.bool.isRequired,
@@ -164,10 +163,10 @@ class LibContentContainer extends React.Component {
}; };
render() { render() {
let { path, repoID, usedRepoTags, readmeMarkdown, draftCounts } = this.props; let { path, repoID, usedRepoTags, draftCounts } = this.props;
let isRepoInfoBarShow = false; let isRepoInfoBarShow = false;
if (path === '/') { if (path === '/') {
if (usedRepoTags.length !== 0 || readmeMarkdown !== null || draftCounts !== 0) { if (usedRepoTags.length !== 0 || draftCounts !== 0) {
isRepoInfoBarShow = true; isRepoInfoBarShow = true;
} }
} }
@@ -213,7 +212,6 @@ class LibContentContainer extends React.Component {
enableDirPrivateShare={this.props.enableDirPrivateShare} enableDirPrivateShare={this.props.enableDirPrivateShare}
isRepoInfoBarShow={isRepoInfoBarShow} isRepoInfoBarShow={isRepoInfoBarShow}
usedRepoTags={this.props.usedRepoTags} usedRepoTags={this.props.usedRepoTags}
readmeMarkdown={this.props.readmeMarkdown}
draftCounts={this.props.draftCounts} draftCounts={this.props.draftCounts}
updateUsedRepoTags={this.props.updateUsedRepoTags} updateUsedRepoTags={this.props.updateUsedRepoTags}
isDirentListLoading={this.props.isDirentListLoading} isDirentListLoading={this.props.isDirentListLoading}
@@ -255,7 +253,6 @@ class LibContentContainer extends React.Component {
onRenameNode={this.props.onRenameNode} onRenameNode={this.props.onRenameNode}
isRepoInfoBarShow={isRepoInfoBarShow} isRepoInfoBarShow={isRepoInfoBarShow}
usedRepoTags={this.props.usedRepoTags} usedRepoTags={this.props.usedRepoTags}
readmeMarkdown={this.props.readmeMarkdown}
draftCounts={this.props.draftCounts} draftCounts={this.props.draftCounts}
updateUsedRepoTags={this.props.updateUsedRepoTags} updateUsedRepoTags={this.props.updateUsedRepoTags}
isDirentListLoading={this.props.isDirentListLoading} isDirentListLoading={this.props.isDirentListLoading}
@@ -308,7 +305,6 @@ class LibContentContainer extends React.Component {
onLinkClick={this.props.onLinkClick} onLinkClick={this.props.onLinkClick}
isRepoInfoBarShow={isRepoInfoBarShow} isRepoInfoBarShow={isRepoInfoBarShow}
usedRepoTags={this.props.usedRepoTags} usedRepoTags={this.props.usedRepoTags}
readmeMarkdown={this.props.readmeMarkdown}
draftCounts={this.props.draftCounts} draftCounts={this.props.draftCounts}
updateUsedRepoTags={this.props.updateUsedRepoTags} updateUsedRepoTags={this.props.updateUsedRepoTags}
isDirentListLoading={this.props.isDirentListLoading} isDirentListLoading={this.props.isDirentListLoading}

26
frontend/src/pages/lib-content-view/lib-content-view.js
View File

@@ -53,7 +53,6 @@ class LibContentView extends React.Component {
draftID: '', draftID: '',
draftCounts: 0, draftCounts: 0,
usedRepoTags: [], usedRepoTags: [],
readmeMarkdown: null,
isTreeDataLoading: true, isTreeDataLoading: true,
treeData: treeHelper.buildTree(), treeData: treeHelper.buildTree(),
currentNode: null, currentNode: null,
@@ -279,17 +278,6 @@ class LibContentView extends React.Component {
}); });
}; };
updateReadmeMarkdown = (direntList) => {
this.setState({readmeMarkdown: null});
direntList.forEach(item => {
let fileName = item.name.toLowerCase();
if (fileName === 'readme.md' || fileName === 'readme.markdown') {
this.setState({readmeMarkdown: item});
return true;
}
});
};
updateColumnMarkdownData = (filePath) => { updateColumnMarkdownData = (filePath) => {
let repoID = this.props.repoID; let repoID = this.props.repoID;
// update state // update state
@@ -482,12 +470,7 @@ class LibContentView extends React.Component {
let repoID = this.props.repoID; let repoID = this.props.repoID;
seafileAPI.listDir(repoID, path, {'with_thumbnail': true}).then(res => { seafileAPI.listDir(repoID, path, {'with_thumbnail': true}).then(res => {
let direntList = []; let direntList = [];
let markdownItem = null;
res.data.dirent_list.forEach(item => { res.data.dirent_list.forEach(item => {
let fileName = item.name.toLowerCase();
if (fileName === 'readme.md' || fileName === 'readme.markdown') {
markdownItem = item;
}
let dirent = new Dirent(item); let dirent = new Dirent(item);
direntList.push(dirent); direntList.push(dirent);
}); });
@@ -498,7 +481,6 @@ class LibContentView extends React.Component {
isDirentListLoading: false, isDirentListLoading: false,
direntList: Utils.sortDirents(direntList, this.state.sortBy, this.state.sortOrder), direntList: Utils.sortDirents(direntList, this.state.sortBy, this.state.sortOrder),
dirID: res.data.dir_id, dirID: res.data.dir_id,
readmeMarkdown: markdownItem,
path: path, path: path,
isSessionExpired: false, isSessionExpired: false,
}); });
@@ -1425,7 +1407,6 @@ class LibContentView extends React.Component {
this.setState({direntList: [dirent, ...this.state.direntList]}); this.setState({direntList: [dirent, ...this.state.direntList]});
} else { } else {
this.setState({direntList: [...this.state.direntList, dirent]}); this.setState({direntList: [...this.state.direntList, dirent]});
this.updateReadmeMarkdown(this.state.direntList);
} }
} }
}; };
@@ -1455,7 +1436,6 @@ class LibContentView extends React.Component {
} }
} }
this.setState({direntList: direntList}); this.setState({direntList: direntList});
this.updateReadmeMarkdown(direntList);
}; };
renameDirent = (direntPath, newName) => { renameDirent = (direntPath, newName) => {
@@ -1480,7 +1460,6 @@ class LibContentView extends React.Component {
return item; return item;
}); });
this.setState({ direntList: direntList }); this.setState({ direntList: direntList });
this.updateReadmeMarkdown(direntList);
} else if (Utils.isAncestorPath(direntPath, this.state.path)) { } else if (Utils.isAncestorPath(direntPath, this.state.path)) {
// example: direntPath = /A/B, state.path = /A/B/C // example: direntPath = /A/B, state.path = /A/B/C
let newPath = Utils.renameAncestorPath(this.state.path, direntPath, newDirentPath); let newPath = Utils.renameAncestorPath(this.state.path, direntPath, newDirentPath);
@@ -1508,7 +1487,6 @@ class LibContentView extends React.Component {
this.recaculateSelectedStateAfterDirentDeleted(name, direntList); this.recaculateSelectedStateAfterDirentDeleted(name, direntList);
this.setState({direntList: direntList}); this.setState({direntList: direntList});
this.updateReadmeMarkdown(direntList);
} else if (Utils.isAncestorPath(direntPath, this.state.path)) { } else if (Utils.isAncestorPath(direntPath, this.state.path)) {
// the deleted item is ancester of the current item // the deleted item is ancester of the current item
let parentPath = Utils.getDirName(direntPath); let parentPath = Utils.getDirName(direntPath);
@@ -1527,7 +1505,6 @@ class LibContentView extends React.Component {
this.recaculateSelectedStateAfterDirentDeleted(name, direntList); this.recaculateSelectedStateAfterDirentDeleted(name, direntList);
this.setState({direntList: direntList}); this.setState({direntList: direntList});
this.updateReadmeMarkdown(direntList);
}; };
moveDirent = (direntPath, moveToDirentPath = null) => { moveDirent = (direntPath, moveToDirentPath = null) => {
@@ -1544,7 +1521,6 @@ class LibContentView extends React.Component {
this.recaculateSelectedStateAfterDirentDeleted(name, direntList); this.recaculateSelectedStateAfterDirentDeleted(name, direntList);
this.setState({direntList: direntList}); this.setState({direntList: direntList});
this.updateReadmeMarkdown(direntList);
}; };
// only one scence: The moved items are inside current path // only one scence: The moved items are inside current path
@@ -1562,7 +1538,6 @@ class LibContentView extends React.Component {
isDirentSelected: false, isDirentSelected: false,
isAllDirentSelected: false, isAllDirentSelected: false,
}); });
this.updateReadmeMarkdown(direntList);
}; };
updateDirent = (dirent, paramKey, paramValue) => { updateDirent = (dirent, paramKey, paramValue) => {
@@ -2047,7 +2022,6 @@ class LibContentView extends React.Component {
onDeleteNode={this.onDeleteTreeNode} onDeleteNode={this.onDeleteTreeNode}
draftCounts={this.state.draftCounts} draftCounts={this.state.draftCounts}
usedRepoTags={this.state.usedRepoTags} usedRepoTags={this.state.usedRepoTags}
readmeMarkdown={this.state.readmeMarkdown}
updateUsedRepoTags={this.updateUsedRepoTags} updateUsedRepoTags={this.updateUsedRepoTags}
isDirentListLoading={this.state.isDirentListLoading} isDirentListLoading={this.state.isDirentListLoading}
direntList={direntItemsList} direntList={direntItemsList}