fix wiki config error (#6087)

frontend/src/pages/wiki2/index.js

@@ -4,7 +4,7 @@ import MediaQuery from 'react-responsive';
 import { Modal } from 'reactstrap';
 import { Utils } from '../../utils/utils';
 import wikiAPI from '../../utils/wiki-api';
-import { slug, wikiId, siteRoot, initialPath, isDir, sharedToken, hasIndex, lang, isEditWiki } from '../../utils/constants';
+import { slug, wikiId, siteRoot, initialPath, isDir, sharedToken, hasIndex, lang, isEditWiki, gettext } from '../../utils/constants';
 import Dirent from '../../models/dirent';
 import WikiConfig from './models/wiki-config';
 import TreeNode from '../../components/tree-view/tree-node';
@@ -44,7 +44,7 @@ class Wiki extends Component {
       indexNode: null,
       indexContent: '',
       currentPageId: '',
-      config: {},
+      config: new WikiConfig({}),
       repoId: '',
     };
 
@@ -80,6 +80,13 @@ class Wiki extends Component {
   getWikiConfig = () => {
     wikiAPI.getWiki2Config(wikiId).then(res => {
       const { wiki_config, repo_id } = res.data.wiki;
+      try {
+        JSON.parse(wiki_config);
+      } catch (error) {
+        toaster.danger(gettext('Wiki config error'));
+        this.setState({ isConfigLoading: false });
+        return;
+      }
       const config = new WikiConfig(JSON.parse(wiki_config) || {});
       this.setState({
         config,
@@ -114,12 +121,16 @@ class Wiki extends Component {
   };
 
   getFirstPageId = (config) => {
-    const item = config.navigation[0] || {};
+    if (!config || !Array.isArray(config.navigation)) return '';
+    for (let i = 0; i < config.navigation.length; i++) {
+      const item = config.navigation[i] || {};
       if (item.type === 'page') {
         return item.id;
-    } else if (item.type === 'folder') {
+      }
+      if (item.type === 'folder' && item.children[0]) {
         return item.children[0].id;
       }
+    }
   };
 
   loadSidePanel = (initialPath) => {

frontend/src/pages/wiki2/models/folder.js

@@ -3,6 +3,6 @@ export default class Folder {
     this.type = 'folder';
     this.id = object.id;
     this.name = object.name;
-    this.children = object.children || [];
+    this.children = Array.isArray(object.children) ? object.children : [];
   }
 }

frontend/src/pages/wiki2/models/wiki-config.js

@@ -1,7 +1,20 @@
+import Page from './page';
+import Folder from './folder';
+
 export default class WikiConfig {
   constructor(object) {
     this.version = object.version || 1;
-    this.navigation = object.navigation || [];
-    this.pages = object.pages || [];
+    this.navigation = (Array.isArray(object.navigation) ? object.navigation : []).map(item => {
+      if (item.type === 'folder') {
+        return new Folder(item);
+      } else if (item.type === 'page') {
+        return {
+          id: item.id,
+          type: item.type,
+        };
+      }
+      return null;
+    }).filter(item => !!item);
+    this.pages = Array.isArray(object.pages) ? object.pages.map(page => new Page(page)) : [];
   }
 }

frontend/src/pages/wiki2/utils/index.js

@@ -9,7 +9,7 @@ const generatorBase64Code = (keyLength = 4) => {
   return key;
 };
 
-const generateUniqueId = (navigation, length = 4) => {
+const generateUniqueId = (navigation = [], length = 4) => {
   let idMap = {};
   function recurseItem(item) {
     if (!item) return;

frontend/src/pages/wiki2/view-structure/views/view-edit-popover.js

@@ -29,6 +29,13 @@ class ViewEditPopover extends Component {
     this.props.toggleViewEditor();
   };
 
+  handleKeyDown = (e) => {
+    if (e.keyCode === 13) {
+      e.preventDefault();
+      this.props.toggleViewEditor();
+    }
+  };
+
   renderViewName = () => {
     const { viewName } = this.props;
     return (
@@ -40,6 +47,7 @@ class ViewEditPopover extends Component {
           onChange={this.onChangeName}
           autoFocus={true}
           ref={this.viewInputRef}
+          onKeyDown={this.handleKeyDown}
         />
       </div>
     );
@@ -55,6 +63,7 @@ class ViewEditPopover extends Component {
         onEnter={this.onEnter}
         hideArrow={true}
         popoverClassName="view-edit-popover"
+        boundariesElement={document.body}
       >
         <div className="view-edit-popover-header">
           <span className='header-text'>{gettext('Modify Name')}</span>