diff --git a/frontend/package.json b/frontend/package.json index c5e15b240a..0e50865d2d 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -6,54 +6,30 @@ "@reach/router": "^1.2.0", "@seafile/seafile-editor": "^0.1.26", "autoprefixer": "7.1.6", - "chalk": "1.1.3", "css-loader": "0.28.7", - "dayjs": "^1.6.2", - "deep-equal": "^1.0.1", - "deepmerge": "^2.1.0", "dotenv": "4.0.0", "dotenv-expand": "4.2.0", "file-loader": "1.1.5", - "filesize": "^3.6.1", - "fs-extra": "3.0.1", - "hast-util-sanitize": "^1.1.2", "html-webpack-plugin": "2.29.0", - "immutable": "^3.8.2", "jest": "20.0.4", - "lodash": "^4.17.5", - "markup-it": "^7.0.0", - "mdast-util-definitions": "^1.2.2", "moment": "^2.22.2", "object-assign": "4.1.1", "postcss-flexbugs-fixes": "3.2.0", "postcss-loader": "2.0.8", "prismjs": "^1.15.0", - "promise": "8.0.1", "prop-types": "^15.6.2", "raf": "3.4.0", "react": "^16.4.2", "react-cookies": "^0.1.0", "react-dom": "^16.5.2", "react-moment": "^0.7.9", - "react-s-alert": "^1.4.1", "reactstrap": "^6.4.0", - "rehype-format": "^2.2.0", - "rehype-raw": "^2.0.0", - "rehype-stringify": "^3.0.0", - "remark": "^9.0.0", - "remark-breaks": "^1.0.0", - "remark-parse": "^5.0.0", - "remark-rehype": "^3.0.0", - "remark-slug": "^5.0.0", - "seafile-js": "^0.2.18", + "seafile-js": "^0.2.20", "seafile-ui": "^0.1.10", "sw-precache-webpack-plugin": "0.11.4", - "unified": "^6.1.6", "url-loader": "0.6.2", "url-parse": "^1.4.0", - "valid-url": "^1.0.9", - "whatwg-fetch": "2.0.3", - "xtend": "^4.0.1" + "whatwg-fetch": "2.0.3" }, "scripts": { "start": "node scripts/start.js", diff --git a/frontend/src/app.js b/frontend/src/app.js index 8306e26033..a6ffa086f0 100644 --- a/frontend/src/app.js +++ b/frontend/src/app.js @@ -1,6 +1,6 @@ import React, { Component } from 'react'; import ReactDOM from 'react-dom'; -import { Router } from '@reach/router' +import { Router } from '@reach/router'; import { siteRoot } from './components/constants'; import SidePanel from './components/side-panel'; import MainPanel from './components/main-panel'; @@ -12,7 +12,6 @@ import './assets/css/fa-solid.css'; import './assets/css/fa-regular.css'; import './assets/css/fontawesome.css'; import './css/layout.css'; -import './css/common.css'; import './css/toolbar.css'; import './css/search.css'; diff --git a/frontend/src/components/common/account.js b/frontend/src/components/common/account.js index 2f54848a93..e8a1705945 100644 --- a/frontend/src/components/common/account.js +++ b/frontend/src/components/common/account.js @@ -17,7 +17,7 @@ class Account extends Component { isStaff: false, usageRate: '', avatarURL: '', - } + }; } componentDidMount(){ @@ -62,34 +62,34 @@ class Account extends Component { this.setState({ showInfo: !this.state.showInfo, - }) + }); } onClickAccount = () => { - this.setState({ - showInfo: !this.state.showInfo, - }) + this.setState({ + showInfo: !this.state.showInfo, + }); } getAccountInfo = () => { editorUtilities.getAccountInfo().then(resp => { - this.setState({ - userName: resp.data.name, - contactEmail: resp.data.email, - usageRate: resp.data.space_usage, - quotaUsage: bytesToSize(resp.data.usage), - quotaTotal: bytesToSize(resp.data.total), - isStaff: resp.data.is_staff, - avatarURL: resp.data.avatar_url - }) - }) + this.setState({ + userName: resp.data.name, + contactEmail: resp.data.email, + usageRate: resp.data.space_usage, + quotaUsage: bytesToSize(resp.data.usage), + quotaTotal: bytesToSize(resp.data.total), + isStaff: resp.data.is_staff, + avatarURL: resp.data.avatar_url + }); + }); } renderMenu = () => { if(this.state.isStaff){ return ( - {gettext("System Admin")} - ) + {gettext('System Admin')} + ); } } @@ -97,46 +97,43 @@ class Account extends Component { if (this.state.avatarURL) { return ( - ) + ); } return ( - ) + ); } render() { return (
- - - + +
-
-
-
- {this.renderAvatar()} -
- {this.state.userName} -
-
-
-
-

{gettext("Used")}: {this.state.quotaUsage} / {this.state.quotaTotal}

-
- -
-
-
- {gettext("Settings")} - {this.renderMenu()} - {gettext("Log out")} -
+
+
+
+
+
+ {this.renderAvatar()} +
{this.state.userName}
+
+
+
+

{gettext('Used')}: {this.state.quotaUsage} / {this.state.quotaTotal}

+
+
+
+ {gettext('Settings')} + {this.renderMenu()} + {gettext('Log out')} +
- ) + ); } } diff --git a/frontend/src/components/dialog/zip-download-dialog.js b/frontend/src/components/dialog/zip-download-dialog.js index d64abdac6b..21cdd6ccce 100644 --- a/frontend/src/components/dialog/zip-download-dialog.js +++ b/frontend/src/components/dialog/zip-download-dialog.js @@ -1,4 +1,4 @@ -import React from 'react' +import React from 'react'; import { Modal, ModalHeader, ModalBody } from 'reactstrap'; class ZipDownloadDialog extends React.Component { @@ -15,7 +15,7 @@ class ZipDownloadDialog extends React.Component {
{this.props.progress}
- ) + ); } } diff --git a/frontend/src/components/dirent-operation/operation-menu.js b/frontend/src/components/dirent-operation/operation-menu.js index 7d3ca79cdd..184f5b0688 100644 --- a/frontend/src/components/dirent-operation/operation-menu.js +++ b/frontend/src/components/dirent-operation/operation-menu.js @@ -1,6 +1,12 @@ import React from 'react'; +import PropTypes from 'prop-types'; import { gettext } from '../constants'; +const propTypes = { + currentItem: PropTypes.object.isRequired, + menuPosition: PropTypes.object.isRequired, +}; + class OperationMenu extends React.Component { getItemType() { @@ -31,12 +37,11 @@ class OperationMenu extends React.Component { {gettext('Details')}
  • -
  • {gettext('Open via Client')}
    • - ) + ); } if (this.props.currentItem.permission === 'r') { @@ -49,7 +54,7 @@ class OperationMenu extends React.Component { {gettext('Details')} - ) + ); } } @@ -79,7 +84,6 @@ class OperationMenu extends React.Component { {gettext('New Draft')}
  • -
  • {gettext('Comment')}
    • @@ -98,7 +102,7 @@ class OperationMenu extends React.Component { {gettext('Open via Client')} - ) + ); } if (this.props.currentItem.permission === "r") { @@ -117,7 +121,7 @@ class OperationMenu extends React.Component { {gettext('Details')} - ) + ); } } @@ -139,4 +143,6 @@ class OperationMenu extends React.Component { } } +OperationMenu.propTypes = propTypes; + export default OperationMenu; diff --git a/frontend/src/components/draft-list-view/draft-list-item.js b/frontend/src/components/draft-list-view/draft-list-item.js index c23f0e2463..e9a0611a3a 100644 --- a/frontend/src/components/draft-list-view/draft-list-item.js +++ b/frontend/src/components/draft-list-view/draft-list-item.js @@ -8,7 +8,8 @@ moment.locale(lang); const propTypes = { isItemFreezed: PropTypes.bool.isRequired, onMenuToggleClick: PropTypes.func.isRequired, -} +}; + class DraftListItem extends React.Component { constructor(props) { @@ -51,7 +52,7 @@ class DraftListItem extends React.Component { } getFileName(filePath) { - let lastIndex = filePath.lastIndexOf("/"); + let lastIndex = filePath.lastIndexOf('/'); return filePath.slice(lastIndex+1); } @@ -62,7 +63,7 @@ class DraftListItem extends React.Component { localTime = moment(localTime).fromNow(); return ( - + {fileName} {draft.owner} {localTime} diff --git a/frontend/src/components/draft-list-view/draft-list-menu.js b/frontend/src/components/draft-list-view/draft-list-menu.js index 53fc1e4e59..6541d14e69 100644 --- a/frontend/src/components/draft-list-view/draft-list-menu.js +++ b/frontend/src/components/draft-list-view/draft-list-menu.js @@ -12,10 +12,10 @@ const propTypes = { class DraftListMenu extends React.Component { render() { - let style = ''; + let style = {}; let {isMenuShow, menuPosition} = this.props; if (isMenuShow) { - style = {position: 'fixed', top: menuPosition.top, left: menuPosition.left, display: 'block'} + style = {position: 'fixed', top: menuPosition.top, left: menuPosition.left, display: 'block'}; } return (
    diff --git a/frontend/src/components/draft-list-view/draft-list-view.js b/frontend/src/components/draft-list-view/draft-list-view.js index 6d8bb5dedc..520b8259ca 100644 --- a/frontend/src/components/draft-list-view/draft-list-view.js +++ b/frontend/src/components/draft-list-view/draft-list-view.js @@ -38,7 +38,7 @@ class DraftListView extends React.Component { })} -
    + ); } } diff --git a/frontend/src/components/history-list-view/history-list-item.js b/frontend/src/components/history-list-view/history-list-item.js index b3116c376d..6d34373e89 100644 --- a/frontend/src/components/history-list-view/history-list-item.js +++ b/frontend/src/components/history-list-view/history-list-item.js @@ -7,6 +7,7 @@ moment.locale(window.app.config.lang); const propTypes = { isItemFrezeed: PropTypes.bool.isRequired, isFirstItem: PropTypes.bool.isRequired, + preCommitID: PropTypes.string.isRequired, item: PropTypes.object.isRequired, currentItem: PropTypes.object.isRequired, onMenuControlClick: PropTypes.func.isRequired, diff --git a/frontend/src/components/history-list-view/history-list-view.js b/frontend/src/components/history-list-view/history-list-view.js index 082e3246bf..22de5f492a 100644 --- a/frontend/src/components/history-list-view/history-list-view.js +++ b/frontend/src/components/history-list-view/history-list-view.js @@ -16,6 +16,7 @@ const propTypes = { reloadMore: PropTypes.func.isRequired, onMenuControlClick: PropTypes.func.isRequired, onHistoryItemClick: PropTypes.func.isRequired, + setDiffContent: PropTypes.func.isRequired, }; class HistoryListView extends React.Component { diff --git a/frontend/src/components/main-panel.js b/frontend/src/components/main-panel.js index b4dae2f68b..3ea0fdd9af 100644 --- a/frontend/src/components/main-panel.js +++ b/frontend/src/components/main-panel.js @@ -7,7 +7,6 @@ class MainPanel extends Component { //todos; } - render() { return (
    @@ -20,8 +19,8 @@ class MainPanel extends Component {
    {this.props.children}
    -
    - ) + + ); } } diff --git a/frontend/src/components/markdown-viewer.js b/frontend/src/components/markdown-viewer.js index 22d116d452..2a5f5458a7 100644 --- a/frontend/src/components/markdown-viewer.js +++ b/frontend/src/components/markdown-viewer.js @@ -1,6 +1,5 @@ import React from 'react'; import { processor, processorGetAST } from '@seafile/seafile-editor/src/lib/seafile-markdown2html'; -import TreeView from './tree-view/tree-view'; import Prism from 'prismjs'; import WikiOutline from './wiki-outline'; diff --git a/frontend/src/components/menu-component/menu-dialog/create-fileforder-dialog.js b/frontend/src/components/menu-component/menu-dialog/create-fileforder-dialog.js index c1ff97638b..ee3dbea640 100644 --- a/frontend/src/components/menu-component/menu-dialog/create-fileforder-dialog.js +++ b/frontend/src/components/menu-component/menu-dialog/create-fileforder-dialog.js @@ -1,6 +1,6 @@ import React from 'react'; +import { gettext } from '../../constants'; import { Button, Modal, ModalHeader, Input, ModalBody, ModalFooter, Form, FormGroup, Label, Col, FormText } from 'reactstrap'; -const gettext = window.gettext; class CreateFileForder extends React.Component { constructor(props) { diff --git a/frontend/src/components/menu-component/menu-dialog/delete-dialog.js b/frontend/src/components/menu-component/menu-dialog/delete-dialog.js index d2c3fe872f..fad0d6565e 100644 --- a/frontend/src/components/menu-component/menu-dialog/delete-dialog.js +++ b/frontend/src/components/menu-component/menu-dialog/delete-dialog.js @@ -1,7 +1,13 @@ import React from 'react'; +import PropTypes from 'prop-types'; +import { gettext } from '../../constants'; import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from 'reactstrap'; -const gettext = window.gettext; +const propTypes = { + currentNode: PropTypes.object.isRequired, + toggleCancel: PropTypes.func.isRequired, + handleSubmit: PropTypes.func.isRequired, +}; class Delete extends React.Component { @@ -13,17 +19,19 @@ class Delete extends React.Component { let name = this.props.currentNode.name; return ( - {gettext("Delete")} + {gettext('Delete')} -

    {gettext("Are you sure to delete")}{' '}{name} ?

    +

    {gettext('Are you sure to delete')}{' '}{name} ?

     - - + +     - ) + ); } } +Delete.propTypes = propTypes; + export default Delete; diff --git a/frontend/src/components/menu-component/menu-dialog/rename-dialog.js b/frontend/src/components/menu-component/menu-dialog/rename-dialog.js index 05d46668e8..85988e66aa 100644 --- a/frontend/src/components/menu-component/menu-dialog/rename-dialog.js +++ b/frontend/src/components/menu-component/menu-dialog/rename-dialog.js @@ -1,6 +1,6 @@ import React from 'react'; +import { gettext } from '../../constants'; import { Button, Modal, ModalHeader, Input, ModalBody, ModalFooter } from 'reactstrap'; -const gettext = window.gettext; class Rename extends React.Component { constructor(props) { @@ -23,7 +23,7 @@ class Rename extends React.Component { handleKeyPress = (e) => { if (e.key === 'Enter') { - this.handleSubmit() + this.handleSubmit(); } } @@ -34,16 +34,16 @@ class Rename extends React.Component { componentWillMount() { this.setState({ newName: this.props.currentNode.name - }) + }); } componentDidMount() { this.changeState(this.props.currentNode); this.newInput.focus(); let type = this.props.currentNode.type; - if (type === "file") { - var endIndex = this.props.currentNode.name.lastIndexOf(".md"); - this.newInput.setSelectionRange(0, endIndex, "forward"); + if (type === 'file') { + var endIndex = this.props.currentNode.name.lastIndexOf('.md'); + this.newInput.setSelectionRange(0, endIndex, 'forward'); } else { this.newInput.setSelectionRange(0, -1); } @@ -61,17 +61,17 @@ class Rename extends React.Component { let type = this.props.currentNode.type; return ( - {type === 'file' ? gettext("Rename File") : gettext("Rename Folder") } + {type === 'file' ? gettext('Rename File') : gettext('Rename Folder') } -

    {type === 'file' ? gettext("Enter the new file name:"): gettext("Enter the new folder name:")}

    - {this.newInput = input}} placeholder="newName" value={this.state.newName} onChange={this.handleChange} /> +

    {type === 'file' ? gettext('Enter the new file name:'): gettext('Enter the new folder name:')}

    + {this.newInput = input;}} placeholder="newName" value={this.state.newName} onChange={this.handleChange} />     - - + +     - ) + ); } } diff --git a/frontend/src/components/menu-component/node-menu.js b/frontend/src/components/menu-component/node-menu.js index b5ff5974a9..a4d891d039 100644 --- a/frontend/src/components/menu-component/node-menu.js +++ b/frontend/src/components/menu-component/node-menu.js @@ -1,6 +1,5 @@ -import React from 'react' - -const gettext = window.gettext; +import React from 'react'; +import { gettext } from '../constants'; class NodeMenu extends React.Component { @@ -18,47 +17,46 @@ class NodeMenu extends React.Component { renderNodeMenu() { let position = this.props.menuPosition; - let style = {position: "fixed",left: position.left, top: position.top, display: 'block'}; + let style = {position: 'fixed',left: position.left, top: position.top, display: 'block'}; - if (this.props.currentNode.type === "dir") { - - if (this.props.currentNode.name === "/") { + if (this.props.currentNode.type === 'dir') { + if (this.props.currentNode.name === '/') { return ( - ) + ); } return ( - ) + ); } return ( - ) + ); } render() { if (!this.props.currentNode) { - return (
    ) + return (
    ); } return (
    {this.renderNodeMenu()}
    - ) + ); } } diff --git a/frontend/src/components/more.js b/frontend/src/components/more.js index fc4beb26b4..ae53dfb3b7 100644 --- a/frontend/src/components/more.js +++ b/frontend/src/components/more.js @@ -13,7 +13,7 @@ class More extends React.Component {
  • {gettext('show more')}
    • - ) + ); } } diff --git a/frontend/src/components/search/search-result-item.js b/frontend/src/components/search/search-result-item.js index 1492526d9a..407ddb219a 100644 --- a/frontend/src/components/search/search-result-item.js +++ b/frontend/src/components/search/search-result-item.js @@ -1,4 +1,10 @@ import React from 'react'; +import PropTypes from 'prop-types'; + +const propTypes = { + item: PropTypes.object.isRequired, + onItemClickHandler: PropTypes.func.isRequired, +}; class SearchResultItem extends React.Component { @@ -11,12 +17,14 @@ class SearchResultItem extends React.Component { let item = this.props.item; return (
  • - {item.name} - {item.link_content} -
    + {item.name} + {item.link_content} +
    • - ) + ); } } +SearchResultItem.propTypes = propTypes; + export default SearchResultItem; diff --git a/frontend/src/components/search/search.js b/frontend/src/components/search/search.js index c1c55df335..2a40408701 100644 --- a/frontend/src/components/search/search.js +++ b/frontend/src/components/search/search.js @@ -1,5 +1,5 @@ import React, { Component } from 'react'; -import { gettext, repoID, siteRoot } from '../constants'; +import { repoID, siteRoot } from '../constants'; import SearchResultItem from './search-result-item'; import editorUtilities from '../../utils/editor-utilties'; import More from '../more'; @@ -26,7 +26,7 @@ class Search extends Component { width: '30rem', isMaskShow: true, isCloseShow: true - }) + }); } onCloseHandler = () => { @@ -51,7 +51,7 @@ class Search extends Component { this.setState({ isResultShow: false, isResultGetted: false - }) + }); return false; } @@ -61,7 +61,7 @@ class Search extends Component { search_ftypes: repoID ? 'custom' : 'all', ftype: repoID ? 'Markdown' : '', input_fexts: repoID ? 'md' : '' - } + }; if (this.timer) { clearTimeout(this.timer); @@ -78,7 +78,7 @@ class Search extends Component { this.setState({ isResultShow: true, isResultGetted: false - }) + }); this.source = editorUtilities.getSource(); this.sendRequest(queryData, this.source.token); @@ -91,7 +91,7 @@ class Search extends Component { _this.setState({ resultItems: [], isResultGetted: true - }) + }); _this.source = null; return; } @@ -100,15 +100,17 @@ class Search extends Component { _this.setState({ resultItems: items, isResultGetted: true - }) + }); _this.source = null; }).catch(res => { + /* eslint-disable */ console.log(res); - }) + /* eslint-enable */ + }); } cancelRequest() { - this.source.cancel("prev request is cancelled"); + this.source.cancel('prev request is cancelled'); } getValueLength(str) { @@ -153,7 +155,7 @@ class Search extends Component { isResultShow: false, isResultGetted: false, resultItems: [] - }) + }); } onShowMore = () => { @@ -180,12 +182,12 @@ class Search extends Component { if (!this.state.isResultGetted || this.getValueLength(this.inputValue) < 3) { return ( - ) + ); } if (!this.state.resultItems.length) { return (
    No results matching.
    - ) + ); } let isShowMore = this.state.resultItems.length >= 5 ? true : false; return ( @@ -197,11 +199,11 @@ class Search extends Component { item={item} onItemClickHandler={_this.onItemClickHandler} /> - ) + ); })} {isShowMore && } - ) + ); } render() { @@ -209,7 +211,7 @@ class Search extends Component { let style = {'width': width}; return (
    -
    +
    @@ -231,7 +233,7 @@ class Search extends Component {
    - ) + ); } } diff --git a/frontend/src/components/toolbar/path-toolbar.js b/frontend/src/components/toolbar/path-toolbar.js index 74eca2b623..26ec714c1c 100644 --- a/frontend/src/components/toolbar/path-toolbar.js +++ b/frontend/src/components/toolbar/path-toolbar.js @@ -40,7 +40,7 @@ class PathToolbar extends React.Component { - ) + ); } return ''; } diff --git a/frontend/src/components/tree-dir-view/tree-dir-list.js b/frontend/src/components/tree-dir-view/tree-dir-list.js index 72c237f897..ef9c923aee 100644 --- a/frontend/src/components/tree-dir-view/tree-dir-list.js +++ b/frontend/src/components/tree-dir-view/tree-dir-list.js @@ -1,4 +1,4 @@ -import React, { Component } from 'react'; +import React from 'react'; import { serviceUrl } from '../constants'; import OperationGroup from '../dirent-operation/operation-group'; @@ -66,9 +66,9 @@ class TreeDirList extends React.Component { render() { let node = this.props.node; return ( - + - + {node.name} { @@ -89,7 +89,7 @@ class TreeDirList extends React.Component { {node.size} {node.last_update_time} - ) + ); } } diff --git a/frontend/src/components/tree-dir-view/tree-dir-view.js b/frontend/src/components/tree-dir-view/tree-dir-view.js index 62262f8e78..9de86e324e 100644 --- a/frontend/src/components/tree-dir-view/tree-dir-view.js +++ b/frontend/src/components/tree-dir-view/tree-dir-view.js @@ -1,10 +1,17 @@ -import React from "react"; +import React from 'react'; +import PropTypes from 'prop-types'; import { gettext, repoID } from '../constants'; import editorUtilities from '../../utils/editor-utilties'; import URLDecorator from '../../utils/url-decorator'; import ZipDownloadDialog from '../dialog/zip-download-dialog'; -import TreeDirList from './tree-dir-list' -import "../../css/common.css"; +import TreeDirList from './tree-dir-list'; + +const propTypes = { + needOperationGroup: PropTypes.bool.isRequired, + node: PropTypes.object.isRequired, + onMainNodeClick: PropTypes.func.isRequired, + onDeleteItem: PropTypes.func.isRequired, +} class TreeDirView extends React.Component { @@ -61,13 +68,13 @@ class TreeDirView extends React.Component { this.setState({ isProgressDialogShow: false, }); - }) + }); } onItemMenuShow = () => { this.setState({ isItemFreezed: true, - }) + }); } onItemMenuHide = () => { @@ -84,21 +91,20 @@ class TreeDirView extends React.Component {
    - { - this.props.needOperationGroup ? + {this.props.needOperationGroup ? - - - - - + + + + + : - - - - + + + + } @@ -116,7 +122,7 @@ class TreeDirView extends React.Component { onDelete={this.props.onDeleteItem} needOperationGroup={this.props.needOperationGroup} /> - ) + ); })}
    {gettext('Name')}{gettext('Size')}{gettext('Last Update')}{gettext('Name')}{gettext('Size')}{gettext('Last Update')}
    {gettext('Name')}{gettext('Size')}{gettext('Last Update')}{gettext('Name')}{gettext('Size')}{gettext('Last Update')}
    @@ -125,8 +131,10 @@ class TreeDirView extends React.Component { }
    - ) + ); } } +TreeDirView.propTypes = propTypes; + export default TreeDirView; \ No newline at end of file diff --git a/frontend/src/components/tree-view/node.js b/frontend/src/components/tree-view/node.js index 8871445989..1a523ddf4d 100644 --- a/frontend/src/components/tree-view/node.js +++ b/frontend/src/components/tree-view/node.js @@ -52,7 +52,7 @@ class Node { return this.name; } else { let p = this.parent.path; - return p === "/" ? (p + this.name) : (p + "/" + this.name); + return p === '/' ? (p + this.name) : (p + '/' + this.name); } } @@ -65,12 +65,12 @@ class Node { } isMarkdown() { - let index = this.name.lastIndexOf("."); + let index = this.name.lastIndexOf('.'); if (index == -1) { return false; } else { let type = this.name.substring(index).toLowerCase(); - if (type == ".md" || type == ".markdown") { + if (type == '.md' || type == '.markdown') { return true; } else { return false; @@ -79,16 +79,16 @@ class Node { } isDir() { - return this.type == "dir"; + return this.type == 'dir'; } isImage() { - let index = this.name.lastIndexOf("."); + let index = this.name.lastIndexOf('.'); if (index == -1) { return false; } else { let type = this.name.substring(index).toLowerCase(); - if (type == ".png" || type == ".jpg") { + if (type == '.png' || type == '.jpg') { return true; } else { return false; @@ -97,7 +97,7 @@ class Node { } serializeToJson() { - var children = [] + var children = []; if (this.hasChildren()) { children = this.children.map(m => m.toJSON()); } @@ -111,9 +111,9 @@ class Node { parent_path: this.parent_path, isExpanded: this.isExpanded, children: children - } + }; - return object + return object; } } diff --git a/frontend/src/components/tree-view/tree-node-view.js b/frontend/src/components/tree-view/tree-node-view.js index 0997eebbeb..81ee7d3264 100644 --- a/frontend/src/components/tree-view/tree-node-view.js +++ b/frontend/src/components/tree-view/tree-node-view.js @@ -3,9 +3,9 @@ import MenuControl from '../menu-component/node-menu-control'; import { permission } from '../constants'; function sortByType(a, b) { - if (a.type == "dir" && b.type != "dir") { + if (a.type == 'dir' && b.type != 'dir') { return -1; - } else if (a.type != "dir" && b.type == "dir") { + } else if (a.type != 'dir' && b.type == 'dir') { return 1; } else { return a.name.localeCompare(b.name); @@ -18,7 +18,7 @@ class TreeNodeView extends React.Component { super(props); this.state = { isMenuIconShow: false - } + }; } onClick = (e) => { @@ -31,7 +31,7 @@ class TreeNodeView extends React.Component { if (!this.props.isNodeItemFrezee) { this.setState({ isMenuIconShow: true - }) + }); } } @@ -39,7 +39,7 @@ class TreeNodeView extends React.Component { if (!this.props.isNodeItemFrezee) { this.setState({ isMenuIconShow: false - }) + }); } } @@ -133,7 +133,7 @@ class TreeNodeView extends React.Component { onClick={this.onMenuControlClick} /> - ) + ); } return; } @@ -146,13 +146,13 @@ class TreeNodeView extends React.Component { icon = ; type = 'dir'; } else { - let index = node.name.lastIndexOf("."); + let index = node.name.lastIndexOf('.'); if (index === -1) { icon = ; type = 'file'; } else { type = node.name.substring(index).toLowerCase(); - if (type === ".png" || type === ".jpg") { + if (type === '.png' || type === '.jpg') { icon = ; type = 'image'; } else { @@ -163,17 +163,15 @@ class TreeNodeView extends React.Component { } return { type, icon }; - - } render() { const styles = {}; let node = this.props.node; let { type, icon } = this.getNodeTypeAndIcon(); - let hlClass = ""; + let hlClass = ''; if (node.path === this.props.currentFilePath) { - hlClass = "tree-node-hight-light"; + hlClass = 'tree-node-hight-light'; } return ( diff --git a/frontend/src/components/tree-view/tree-view.js b/frontend/src/components/tree-view/tree-view.js index 7603caf234..78ea211c83 100644 --- a/frontend/src/components/tree-view/tree-view.js +++ b/frontend/src/components/tree-view/tree-view.js @@ -1,6 +1,6 @@ import React from 'react'; import TreeNodeView from './tree-node-view'; -import editorUtilities from '../../utils/editor-utilties' +import editorUtilities from '../../utils/editor-utilties'; class TreeView extends React.PureComponent { @@ -17,8 +17,8 @@ class TreeView extends React.PureComponent { onDragStart = (e, node) => { const url = editorUtilities.getFileURL(node); - e.dataTransfer.setData("text/uri-list", url); - e.dataTransfer.setData("text/plain", url); + e.dataTransfer.setData('text/uri-list', url); + e.dataTransfer.setData('text/plain', url); } onNodeClick = (e, node) => { diff --git a/frontend/src/components/tree-view/tree.js b/frontend/src/components/tree-view/tree.js index 62d22f61c9..55090d4d5a 100644 --- a/frontend/src/components/tree-view/tree.js +++ b/frontend/src/components/tree-view/tree.js @@ -3,7 +3,7 @@ import moment from 'moment'; import { bytesToSize } from '../utils'; const lang = window.app.config.lang; -moment.locale(lang) +moment.locale(lang); class Tree { @@ -201,7 +201,7 @@ class Tree { parseListToTree(nodeList) { function getNodePath(parentPath, nodeName) { - return parentPath === "/" ? (parentPath + nodeName) : (parentPath + "/" + nodeName); + return parentPath === '/' ? (parentPath + nodeName) : (parentPath + '/' + nodeName); } let root = new Node({name: '/', type: 'dir', isExpanded: true}); @@ -230,7 +230,9 @@ class Tree { for (let node of treeNodeList) { let p = map.get(node.parent_path); if (p === undefined) { - console.log("warning: node " + node.parent_path + " not exist"); + /* eslint-disable */ + console.log('warning: node ' + node.parent_path + ' not exist'); + /* eslint-enable */ } else { this.addNodeToParent(node, p); } @@ -239,7 +241,7 @@ class Tree { } parseNodeToTree(node) { - var node = new Node({ + var newNode = new Node({ name: node.name, type: node.type, size: bytesToSize(node.size), @@ -250,10 +252,10 @@ class Tree { }); if (node.children instanceof Array) { for (let child of node.children) { - this.addNodeToParent(this.parseNodeToTree(child), node); + this.addNodeToParent(this.parseNodeToTree(child), newNode); } } - return node; + return newNode; } } diff --git a/frontend/src/components/wiki-outline.js b/frontend/src/components/wiki-outline.js index f8d3d8b1a4..7b02c4155f 100644 --- a/frontend/src/components/wiki-outline.js +++ b/frontend/src/components/wiki-outline.js @@ -1,4 +1,11 @@ import React from 'react'; +import PropTypes from 'prop-types'; + +const itemPropTypes = { + activeIndex: PropTypes.number.isRequired, + item: PropTypes.object.isRequired, + handleNavItemClick: PropTypes.func.isRequired, +}; class WikiOutlineItem extends React.Component { @@ -17,11 +24,18 @@ class WikiOutlineItem extends React.Component {
  • {item.text}
    • - ) + ); } } +WikiOutlineItem.propTypes = itemPropTypes; + +const outlinePropTypes = { + navItems: PropTypes.array.isRequired, + handleNavItemClick: PropTypes.func.isRequired, +} + class WikiOutline extends React.Component { constructor(props) { @@ -79,4 +93,6 @@ class WikiOutline extends React.Component { } } +WikiOutline.propTypes = outlinePropTypes; + export default WikiOutline; diff --git a/frontend/src/css/common.css b/frontend/src/css/common.css deleted file mode 100644 index 7868570705..0000000000 --- a/frontend/src/css/common.css +++ /dev/null @@ -1,211 +0,0 @@ -/* begin top logo */ -.top-logo { - display: flex; - justify-content: space-between; - flex: 1; -} - -/* end top logo */ -.panel-heading { - position: relative; - padding: .5rem 1rem; - width: 100%; - height: 2.5rem; - font-size: 1rem; - font-weight: normal; - line-height: 1.5; - text-align: center; -} - -.text-left { - text-align: left; -} - -.text-right { - text-align: right; -} - -.a-simulate { - color: #eb8205 !important; - text-decoration: none; - font-weight: normal; - cursor: pointer; -} - -.a-simulate:hover { - text-decoration: underline; -} - -.flex-right { - justify-content: flex-end; -} - -/* begin path navigation */ -.path-containter { /* for the real path */ - font-size:16px; - word-break: break-all; -} - -.path-split { - display: inline-block; - padding: 0 5px; - color: #818a91; -} - -.path-link { - color: #eb8205 !important; - text-decoration: none; -} - -.path-link:hover { - cursor: pointer; - text-decoration: underline !important; -} -/* end path navigation */ - -/* begin main table list style */ - -.table-container { - flex: 1; - padding: 10px 16px 20px; - overflow: auto; -} - -.table-container table { - width: 100%; -} - -.table-container table th { - text-align: left; - font-weight: normal; - font-size: 13px; - line-height: 1.6; - color: #9c9c9c; -} - -.table-container table td { - color: #333; - font-size: 14px; - word-break: break-all; -} - -.table-container table th, .table-container table td { - padding: 5px 3px; - border-bottom: 1px solid #eee; -} - -.table-container table th { - padding-top: 1rem; -} - -.table-container table .icon { - text-align: center; -} - -.table-container table .icon img { - width: 1.5rem; - height: 1.5rem; -} -/* specific handler */ -.table-container table .menu-toggle { - text-align: center; - cursor: pointer; -} - -.tr-highlight { - background-color: #f8f8f8; -} - -/* end main list style */ - -/* begin dropdown-menu style */ -.dropdown-menu { - min-width: 8rem; -} - -.dropdown-item { - cursor: pointer; -} - -.dropdown-item.menu-inner-divider { - margin: 0.25rem 0; - border-bottom: 1px solid #ddd; -} - -/* end dropdown-menu style */ - -/* begin tip */ -.empty-tip { - margin: auto 1rem; - padding: 30px 40px; - background-color: #FAFAFA; - border: solid 1px #DDD; - border-radius: 3px; - box-shadow: inset 0 0 8px #EEE; - margin-top: 5.5em; -} - -.empty-tip h2 { - font-size: 1.25rem; - text-align: center; - color: #222; - font-weight: bold; - -} - -/* end tip */ - -/* begin more component */ -.list-show-more { - padding: 0.25rem 0.75rem; - line-height: 2rem; - text-align: center; - color: #eb8205; - cursor: pointer; -} -.list-show-more:hover { - background-color: #eee; -} - -.list-show-more .more-message { - font-size: 0.875rem; - color: #888; - text-decoration: underline; -} -/* end more component */ - -/* begin operation menu */ -.operation { - display: flex; -} - -.operation .operation-group { - list-style: none; -} - -.operation-group .operation-group-item { - display: inline-block; - color: #f89a68; - margin-right: 0.5rem; -} - -.operation-group-item i { - font-style: normal; - font-size: 1.25rem; - line-height: 1; - cursor: pointer; - vertical-align: middle; -} -.operation-group-item i:hover { - text-decoration: underline; -} - -.operation-group-item .sf-dropdown-toggle { - font-size: 0.85rem; - color: #888; -} - -.operation-group-item .sf-dropdown-toggle:hover { - text-decoration: none; -} -/* end operaton menu */ diff --git a/frontend/src/file-history.js b/frontend/src/file-history.js index bf72bb5c92..127ad171b6 100644 --- a/frontend/src/file-history.js +++ b/frontend/src/file-history.js @@ -39,7 +39,6 @@ class FileHistory extends React.Component { onHistoryItemClick = (item, preCommitID)=> { - let _this = this; let objID = item.rev_file_id; let downLoadURL = URLDecorator.getUrl({type: 'download_historic_file', filePath: filePath, objID: objID}); let downLoadURL1 = URLDecorator.getUrl({type: 'download_historic_file', filePath: filePath, objID: preCommitID}); diff --git a/frontend/src/markdown-editor.js b/frontend/src/markdown-editor.js index 22a8829c44..4fd7d28a60 100644 --- a/frontend/src/markdown-editor.js +++ b/frontend/src/markdown-editor.js @@ -22,7 +22,7 @@ seafileAPI.initForSeahubUsage({ siteRoot, xcsrfHeaders }); function getImageFileNameWithTimestamp() { var d = Date.now(); - return "image-" + d.toString() + ".png"; + return 'image-' + d.toString() + '.png'; } class EditorUtilities { @@ -37,26 +37,26 @@ class EditorUtilities { return ( seafileAPI.getUpdateLink(repoID, dirPath).then((res) => { const uploadLink = res.data; - return seafileAPI.updateFile(uploadLink, filePath, fileName, content) + return seafileAPI.updateFile(uploadLink, filePath, fileName, content); }) - ) + ); } unStarFile () { return ( seafileAPI.unStarFile(repoID, this.filePath) - ) + ); } starFile() { return ( seafileAPI.starFile(this.repoID, this.filePath) - ) + ); } getParentDectionaryUrl() { let parentPath = this.filePath.substring(0, this.filePath.lastIndexOf('/')); - return this.serviceUrl + "/#common/lib/" + this.repoID + parentPath; + return this.serviceUrl + '/#common/lib/' + this.repoID + parentPath; } _getImageURL(fileName) { @@ -68,47 +68,47 @@ class EditorUtilities { return ( seafileAPI.getUploadLink(repoID, dirPath).then((res) => { let uploadLinkComponent = res.data; - const uploadLink = uploadLinkComponent + "?ret-json=1"; + const uploadLink = uploadLinkComponent + '?ret-json=1'; const name = getImageFileNameWithTimestamp(); const blob = imageFile.slice(0, -1, 'image/png'); const newFile = new File([blob], name, {type: 'image/png'}); const formData = new FormData(); - formData.append("parent_dir", "/"); - formData.append("relative_path", "images"); - formData.append("file", newFile); - return {uploadLink, formData} + formData.append('parent_dir', '/'); + formData.append('relative_path', 'images'); + formData.append('file', newFile); + return {uploadLink, formData}; }).then(({ uploadLink, formData}) => { - return seafileAPI.uploadImage(uploadLink, formData) + return seafileAPI.uploadImage(uploadLink, formData); }).then ((res) => { let resArr = res.data[0]; let filename = resArr.name; return this._getImageURL(filename); }) - ) + ); } getFileURL(fileNode) { var url; if (fileNode.type === 'file') { if (fileNode.isImage()) { - url = serviceUrl + "/lib/" + repoID + "/file" + encodeURIComponent(fileNode.path()) + "?raw=1"; + url = serviceUrl + '/lib/' + repoID + '/file' + encodeURIComponent(fileNode.path()) + '?raw=1'; } else { - url = serviceUrl + "/lib/" + repoID + "/file" + encodeURIComponent(fileNode.path()); + url = serviceUrl + '/lib/' + repoID + '/file' + encodeURIComponent(fileNode.path()); } } else { - url = serviceUrl + "/#common/lib/" + repoID + encodeURIComponent(fileNode.path()); + url = serviceUrl + '/#common/lib/' + repoID + encodeURIComponent(fileNode.path()); } return url; } isInternalFileLink(url) { - var re = new RegExp(this.serviceUrl + "/lib/[0-9a-f-]{36}/file.*"); + var re = new RegExp(this.serviceUrl + '/lib/[0-9a-f-]{36}/file.*'); return re.test(url); } isInternalDirLink(url) { - var re = new RegExp(serviceUrl + "/#[a-z\-]*?/lib/" + "[0-9a-f\-]{36}.*"); + var re = new RegExp(serviceUrl + '/#[a-z\-]*?/lib/' + '[0-9a-f\-]{36}.*'); return re.test(url); } @@ -119,26 +119,26 @@ class EditorUtilities { name: item.name, type: item.type === 'dir' ? 'dir' : 'file', parent_path: item.parent_dir - } - }) + }; + }); return files; - }) + }); } getFileHistory() { return ( seafileAPI.getFileHistory(repoID, filePath) - ) + ); } getFileInfo() { return ( seafileAPI.getFileInfo(repoID, filePath) - ) + ); } getInternalLink() { - return seafileAPI.getInternalLink(repoID, filePath) + return seafileAPI.getInternalLink(repoID, filePath); } getShareLink() { @@ -146,16 +146,16 @@ class EditorUtilities { } createShareLink (repoID, filePath, userPassword, userValidDays) { - return seafileAPI.createShareLink(repoID, filePath, userPassword, userValidDays); + return seafileAPI.createShareLink(repoID, filePath, userPassword, userValidDays); } deleteShareLink(token){ - return seafileAPI.deleteShareLink(token) + return seafileAPI.deleteShareLink(token); } getDraftKey() { - return (repoID + filePath); - } + return (repoID + filePath); + } getFileContent(url) { return seafileAPI.getFileContent(url); @@ -164,7 +164,7 @@ class EditorUtilities { listFileHistoryRecords(page, perPage) { return ( seafileAPI.listFileHistoryRecords(repoID, filePath, page, perPage) - ) + ); } getFileHistoryVersion(commitID) { @@ -178,30 +178,30 @@ const editorUtilities = new EditorUtilities(); class MarkdownEditor extends React.Component { constructor(props) { - super(props); - this.state = { - markdownContent: "", - loading: true, - mode: "editor", - fileInfo: { - repoID: repoID, - name: fileName, - path: filePath, - mtime: null, - size: 0, - starred: false, - permission: '', - lastModifier: '', - }, - collabServer: seafileCollabServer ? seafileCollabServer : null, - }; - } + super(props); + this.state = { + markdownContent: '', + loading: true, + mode: 'editor', + fileInfo: { + repoID: repoID, + name: fileName, + path: filePath, + mtime: null, + size: 0, + starred: false, + permission: '', + lastModifier: '', + }, + collabServer: seafileCollabServer ? seafileCollabServer : null, + }; + } componentDidMount() { seafileAPI.getFileInfo(repoID, filePath).then((res) => { let { mtime, size, starred, permission, last_modifier_name } = res.data; - let lastModifier = last_modifier_name + let lastModifier = last_modifier_name; this.setState((prevState, props) => ({ fileInfo: { @@ -220,10 +220,10 @@ class MarkdownEditor extends React.Component { this.setState({ markdownContent: res.data, loading: false - }) - }) + }); + }); }); - }) + }); } render() { @@ -232,8 +232,8 @@ class MarkdownEditor extends React.Component {
    - ) - } else if (this.state.mode === "editor") { + ); + } else if (this.state.mode === 'editor') { return ( ); } } } + export default MarkdownEditor; diff --git a/frontend/src/pages/dashboard/files-activities.js b/frontend/src/pages/dashboard/files-activities.js index a4777a1b48..7015d66b56 100644 --- a/frontend/src/pages/dashboard/files-activities.js +++ b/frontend/src/pages/dashboard/files-activities.js @@ -2,8 +2,6 @@ import React, { Component } from 'react'; import { seafileAPI } from '../../utils/seafile-api'; import { gettext, siteRoot } from '../../components/constants'; -const per_page = 25; // default - class FileActivitiesContent extends Component { render() { @@ -19,10 +17,10 @@ class FileActivitiesContent extends Component { {/* avatar */} - {gettext("User")} - {gettext("Operation")} - {gettext("File")} / {gettext("Library")} - {gettext("Time")} + {gettext('User')} + {gettext('Operation')} + {gettext('File')} / {gettext('Library')} + {gettext('Time')} @@ -202,13 +200,13 @@ class FilesActivities extends Component { const pageNum = this.state.page + 1; this.setState({ page: pageNum - }) + }); seafileAPI.listActivities(pageNum) .then(res => { if (res.status == 403) { this.setState({ loading: false, - error_msg: gettext("Permission denied") + error_msg: gettext('Permission denied') }); } else { // {"events":[...]} @@ -235,7 +233,7 @@ class FilesActivities extends Component { return (
    -

    {gettext("Activities")}

    +

    {gettext('Activities')}

    diff --git a/frontend/src/pages/file-history/main-panel.js b/frontend/src/pages/file-history/main-panel.js index 27eb83e51c..2ef55e8886 100644 --- a/frontend/src/pages/file-history/main-panel.js +++ b/frontend/src/pages/file-history/main-panel.js @@ -12,6 +12,8 @@ const contentClass = 'markdown-viewer-render-content'; const propTypes = { renderingContent: PropTypes.bool.isRequired, content: PropTypes.string.isRequired, + markdownContent: PropTypes.string.isRequired, + markdownContentOld: PropTypes.string.isRequired, }; class MainPanel extends React.Component { diff --git a/frontend/src/pages/repo-wiki-mode/main-panel.js b/frontend/src/pages/repo-wiki-mode/main-panel.js index 76f3f50c25..8a4b561d73 100644 --- a/frontend/src/pages/repo-wiki-mode/main-panel.js +++ b/frontend/src/pages/repo-wiki-mode/main-panel.js @@ -1,5 +1,5 @@ import React, { Component } from 'react'; -import { gettext, repoID, serviceUrl, slug, siteRoot, isPro } from '../../components/constants'; +import { gettext, repoID, serviceUrl, slug, siteRoot } from '../../components/constants'; import CommonToolbar from '../../components/toolbar/common-toolbar'; import PathToolbar from '../../components/toolbar/path-toolbar'; import MarkdownViewer from '../../components/markdown-viewer'; @@ -30,7 +30,7 @@ class MainPanel extends Component { } switchViewMode = (e) => { - e.preventDefault(); + e.preventDefault(); if (e.target.id === 'wiki') { return; } @@ -41,17 +41,17 @@ class MainPanel extends Component { render() { let filePathList = this.props.filePath.split('/'); - let nodePath = ""; + let nodePath = ''; let pathElem = filePathList.map((item, index) => { - if (item === "") { + if (item === '') { return; } if (index === (filePathList.length - 1)) { return ( /{item} - ) + ); } else { - nodePath += "/" + item; + nodePath += '/' + item; return ( / @@ -62,7 +62,7 @@ class MainPanel extends Component { {item} - ) + ); } }); @@ -73,12 +73,12 @@ class MainPanel extends Component { { this.props.permission === 'rw' && - + }
    - - - + + +
    @@ -86,7 +86,7 @@ class MainPanel extends Component {
    - {gettext("Libraries")} + {gettext('Libraries')} / {slug} {pathElem} @@ -115,8 +115,8 @@ class MainPanel extends Component { }
    -
    - ) +
    + ); } } diff --git a/frontend/src/pages/repo-wiki-mode/side-panel.js b/frontend/src/pages/repo-wiki-mode/side-panel.js index fa301ae4a5..42d392c70a 100644 --- a/frontend/src/pages/repo-wiki-mode/side-panel.js +++ b/frontend/src/pages/repo-wiki-mode/side-panel.js @@ -25,7 +25,7 @@ class SidePanel extends Component { showAddFileFolder: false, showRename: false, isFile: false - } + }; this.searchedPath = null; } @@ -36,18 +36,18 @@ class SidePanel extends Component { onMouseEnter = () => { this.setState({ isMenuIconShow: true - }) + }); } onMouseLeave = () => { this.setState({ isMenuIconShow: false - }) + }); } onNodeClick = (e, node) => { - this.setState({currentNode: node}) - this.props.onNodeClick(e, node) + this.setState({currentNode: node}); + this.props.onNodeClick(e, node); } onShowContextMenu = (e, node) => { @@ -59,7 +59,7 @@ class SidePanel extends Component { currentNode: node, menuPosition: position, isNodeItemFrezee: true - }) + }); } onHeadingMenuClick = (e) => { @@ -72,7 +72,7 @@ class SidePanel extends Component { isShowMenu: !this.state.isShowMenu, currentNode: node, menuPosition: position - }) + }); } onHideContextMenu = () => { @@ -82,7 +82,7 @@ class SidePanel extends Component { this.setState({ isShowMenu: false, isNodeItemFrezee: false - }) + }); } toggleAddFileFolder = (flag) => { @@ -115,13 +115,13 @@ class SidePanel extends Component { } onRenameNode = (newName) => { - this.setState({showRename: !this.state.showRename}) + this.setState({showRename: !this.state.showRename}); let node = this.state.currentNode; - this.props.onRenameNode(node, newName) + this.props.onRenameNode(node, newName); } onDeleteNode = () => { - this.setState({showDelete: !this.state.showDelete}) + this.setState({showDelete: !this.state.showDelete}); let node = this.state.currentNode; this.props.onDeleteNode(node); } @@ -133,7 +133,7 @@ class SidePanel extends Component { componentWillReceiveProps(nextProps) { this.setState({ currentNode: nextProps.changedNode - }) + }); } componentWillUnmount() { @@ -149,16 +149,16 @@ class SidePanel extends Component { } deleteCancel = () => { - this.setState({showDelete: !this.state.showDelete}) + this.setState({showDelete: !this.state.showDelete}); } renameCancel = () => { - this.setState({showRename: !this.state.showRename}) + this.setState({showRename: !this.state.showRename}); } render() { return ( -
    +
    - ) + ); } }); @@ -62,7 +62,7 @@ class MainPanel extends Component { { this.props.permission === 'rw' && - + }
    @@ -70,7 +70,7 @@ class MainPanel extends Component {
    - {gettext("Wikis")} + {gettext('Wikis')} / {slug} {pathElem} @@ -89,7 +89,7 @@ class MainPanel extends Component { { !this.props.isViewFileState &&
    -
    - ) +
    + ); } } diff --git a/frontend/src/pages/wiki/side-panel.js b/frontend/src/pages/wiki/side-panel.js index 2ef45187a4..b1ea189bb7 100644 --- a/frontend/src/pages/wiki/side-panel.js +++ b/frontend/src/pages/wiki/side-panel.js @@ -25,7 +25,7 @@ class SidePanel extends Component { showAddFileFolder: false, showRename: false, isFile: false - } + }; this.searchedPath = null; } @@ -36,18 +36,18 @@ class SidePanel extends Component { onMouseEnter = () => { this.setState({ isMenuIconShow: true - }) + }); } onMouseLeave = () => { this.setState({ isMenuIconShow: false - }) + }); } onNodeClick = (e, node) => { - this.setState({currentNode: node}) - this.props.onNodeClick(e, node) + this.setState({currentNode: node}); + this.props.onNodeClick(e, node); } onShowContextMenu = (e, node) => { @@ -59,7 +59,7 @@ class SidePanel extends Component { currentNode: node, menuPosition: position, isNodeItemFrezee: true - }) + }); } onHeadingMenuClick = (e) => { @@ -72,7 +72,7 @@ class SidePanel extends Component { isShowMenu: !this.state.isShowMenu, currentNode: node, menuPosition: position - }) + }); } onHideContextMenu = () => { @@ -82,7 +82,7 @@ class SidePanel extends Component { this.setState({ isShowMenu: false, isNodeItemFrezee: false - }) + }); } toggleAddFileFolder = (flag) => { @@ -115,13 +115,13 @@ class SidePanel extends Component { } onRenameNode = (newName) => { - this.setState({showRename: !this.state.showRename}) + this.setState({showRename: !this.state.showRename}); let node = this.state.currentNode; - this.props.onRenameNode(node, newName) + this.props.onRenameNode(node, newName); } onDeleteNode = () => { - this.setState({showDelete: !this.state.showDelete}) + this.setState({showDelete: !this.state.showDelete}); let node = this.state.currentNode; this.props.onDeleteNode(node); } @@ -133,7 +133,7 @@ class SidePanel extends Component { componentWillReceiveProps(nextProps) { this.setState({ currentNode: nextProps.changedNode - }) + }); } componentWillUnmount() { @@ -149,16 +149,16 @@ class SidePanel extends Component { } deleteCancel = () => { - this.setState({showDelete: !this.state.showDelete}) + this.setState({showDelete: !this.state.showDelete}); } renameCancel = () => { - this.setState({showRename: !this.state.showRename}) + this.setState({showRename: !this.state.showRename}); } render() { return ( -
    +