repo wiki mode lib decrypt

frontend/src/components/dialog/lib-decrypt-dialog.js

@@ -27,12 +27,6 @@ class LibDecryptDialog extends React.Component {
     })
   } 
 
-  handleKeyPress = (e) => {
-    if (e.key === 'Enter') {
-      this.handleSubmit();
-    }
-  }
-
   handleChange = (e) => {
     this.setState({
       password: e.target.value,
@@ -41,12 +35,12 @@ class LibDecryptDialog extends React.Component {
   }
 
   toggle = () => {
-    window.history.back();
+    window.location.href = siteRoot;
   };
 
   render() {
     return (
-      <Modal isOpen={true}>
+      <Modal isOpen={true} centered={true}>
         <ModalBody>
         <button type="button" className="close" onClick={this.toggle}><span aria-hidden="true">×</span></button> 
         <Form className="lib-decrypt-form text-center">
@@ -55,7 +49,9 @@ class LibDecryptDialog extends React.Component {
           {this.state.showError &&
             <p className="error">{gettext('Wrong password')}</p>
           }
-          <Input type="password" name="password" placeholder={gettext('Password')} onChange={this.handleChange}/>
+          <FormGroup>
+            <Input type="password" name="password" placeholder={gettext('Password')} onChange={this.handleChange}/>
+          </FormGroup>
           <br />
           <Button onClick={this.handleSubmit}>{gettext('Submit')}</Button>
           <br />

frontend/src/repo-wiki-mode.js

@@ -9,6 +9,8 @@ import MainPanel from './pages/repo-wiki-mode/main-panel';
 import Node from './components/tree-view/node';
 import Tree from './components/tree-view/tree';
 import toaster from './components/toast';
+import LibDecryptDialog from './components/dialog/lib-decrypt-dialog';
+import ModalPortal from './components/modal-portal';
 import Dirent from './models/dirent';
 import FileTag from './models/file-tag';
 import './assets/css/fa-solid.css';
@@ -40,6 +42,7 @@ class Wiki extends Component {
       isDirentSelected: false,
       isAllDirentSelected: false,
       selectedDirentList: [],
+      libNeedDecrypt: false
     };
     window.onpopstate = this.onpopstate;
     this.hash = '';
@@ -53,15 +56,23 @@ class Wiki extends Component {
   }
 
   componentDidMount() {
-    if (isDir === 'None') {
+    seafileAPI.getRepoInfo(repoID).then(res => {
-      this.setState({pathExist: false});
+      this.setState({
-    } else if (isDir === 'True') {
+        libNeedDecrypt: res.data.lib_need_decrypt, 
-      this.showDir(initialPath);
+      });
-    } else if (isDir === 'False') {
-      this.showFile(initialPath);
-    }
 
-    this.loadSidePanel(initialPath);
+    if (!res.data.lib_need_decrypt) {
+      if (isDir === 'None') {
+          this.setState({pathExist: false});
+        } else if (isDir === 'True') {
+          this.showDir(initialPath);
+        } else if (isDir === 'False') {
+          this.showFile(initialPath);
+        }
+
+        this.loadSidePanel(initialPath);
+      }
+    });
   }
 
 
@@ -736,7 +747,34 @@ class Wiki extends Component {
     });
   }
 
+  onLibDecryptDialog = () => {
+    this.setState({
+      libNeedDecrypt: false,
+    })
+
+    if (isDir === 'None') {
+        this.setState({pathExist: false});
+      } else if (isDir === 'True') {
+        this.showDir(initialPath);
+      } else if (isDir === 'False') {
+        this.showFile(initialPath);
+      }
+
+      this.loadSidePanel(initialPath);
+  }
+
   render() {
+    let { libNeedDecrypt } = this.state;
+    if (libNeedDecrypt) {
+      return (
+        <ModalPortal>
+          <LibDecryptDialog repoID={repoID}
+                            onLibDecryptDialog={this.onLibDecryptDialog}
+          />
+        </ModalPortal>
+      )
+    }
+
     return (
       <div id="main" className="wiki-main">
         <SidePanel