repair router bug

frontend/src/components/cur-dir-path/dir-path.js

@@ -5,9 +5,10 @@ import { siteRoot, gettext } from '../../utils/constants';
 
 const propTypes = {
   repoName: PropTypes.string.isRequired,
-  pathPrefix: PropTypes.object,
   currentPath: PropTypes.string.isRequired,
   onPathClick: PropTypes.func.isRequired,
+  onTabNavClick: PropTypes.func,
+  pathPrefix: PropTypes.array,
 };
 
 class DirPath extends React.Component {
@@ -17,6 +18,10 @@ class DirPath extends React.Component {
     this.props.onPathClick(path);
   }
 
+  onTabNavClick = (tabName, id) => {
+    this.props.onTabNavClick(tabName, id);
+  }
+
   turnPathToLink = (path) => {
     path = path[path.length - 1] === '/' ? path.slice(0, path.length - 1) : path;
     let pathList = path.split('/');
@@ -47,13 +52,27 @@ class DirPath extends React.Component {
     let pathElem = this.turnPathToLink(currentPath);
     return (
       <div className="path-containter">
-        {this.props.pathPrefix ? 
-          this.props.pathPrefix :
-            <Fragment>
-              <Link to={siteRoot + 'my-libs/'} className="normal">{gettext('Libraries')}</Link>
+        {this.props.pathPrefix && this.props.pathPrefix.map((item, index) => {
+          return (
+            <Fragment key={index}>
+              <Link to={item.url} className="normal" onClick={() => this.onTabNavClick(item.name, item.id)}>{gettext(item.showName)}</Link>
               <span className="path-split">/</span>
-            </Fragment>       
+            </Fragment>
+          );
+        })}
+        {this.props.pathPrefix && this.props.pathPrefix.length === 0 && (
+          <Fragment>
+            <Link to={siteRoot + 'my-libs/'} className="normal" onClick={() => this.onTabNavClick.bind(this, 'my-libs')}>{gettext('Libraries')}</Link>
+            <span className="path-split">/</span>
+          </Fragment>
+        )
         }
+        {!this.props.pathPrefix && (
+          <Fragment>
+            <a href={siteRoot + 'my-libs/'} className="normal" onClick={() => this.onTabNavClick.bind(this, 'my-libs')}>{gettext('Libraries')}</a>
+            <span className="path-split">/</span>
+          </Fragment>
+        )}
         {currentPath === '/' ?
           <span>{repoName}</span>:
           <a className="path-link" data-path="/" onClick={this.onPathClick}>{repoName}</a>

frontend/src/components/cur-dir-path/index.js

@@ -5,11 +5,12 @@ import DirTool from './dir-tool';
 
 const propTypes = {
   repoID: PropTypes.string.isRequired,
-  pathPrefix: PropTypes.object.isRequired,
   repoName: PropTypes.string.isRequired,
   permission: PropTypes.bool.isRequired,
   currentPath: PropTypes.string.isRequired,
   onPathClick: PropTypes.func.isRequired,
+  onTabNavClick: PropTypes.func,
+  pathPrefix: PropTypes.array,
 };
 
 class CurDirPath extends React.Component {
@@ -22,6 +23,7 @@ class CurDirPath extends React.Component {
           pathPrefix={this.props.pathPrefix}
           currentPath={this.props.currentPath}
           onPathClick={this.props.onPathClick}
+          onTabNavClick={this.props.onTabNavClick}
         />
         <DirTool 
           repoID={this.props.repoID}

frontend/src/components/dir-view/dir-panel.js

@@ -14,7 +14,7 @@ import FileUploader from '../file-uploader/file-uploader';
 
 const propTypes = {
   currentRepo: PropTypes.object,
-  pathPrefix: PropTypes.object.isRequired,
+  pathPrefix: PropTypes.array.isRequired,
   path: PropTypes.string.isRequired,
   repoID: PropTypes.string.isRequired,
   repoName: PropTypes.string.isRequired,
@@ -40,6 +40,7 @@ const propTypes = {
   onFileTagChanged: PropTypes.func.isRequired,
   onMenuClick: PropTypes.func.isRequired,
   onPathClick: PropTypes.func.isRequired,
+  onTabNavClick: PropTypes.func.isRequired,
   updateDirent: PropTypes.func.isRequired,
   onSearchedClick: PropTypes.func.isRequired,
   onFileUploadSuccess: PropTypes.func.isRequired,
@@ -152,6 +153,7 @@ class DirPanel extends React.Component {
                 currentPath={this.props.path} 
                 permission={this.props.permission}
                 onPathClick={this.props.onPathClick}
+                onTabNavClick={this.props.onTabNavClick}
               />
             </div>
             <div className="cur-view-content">

frontend/src/components/dir-view/dir-view.js

@@ -11,7 +11,8 @@ import FileTag from '../../models/file-tag';
 import Repo from '../../models/repo';
 
 const propTypes = {
-  pathPrefix: PropTypes.object.isRequired,
+  pathPrefix: PropTypes.array.isRequired,
+  onTabNavClick: PropTypes.func.isRequired,
   onMenuClick: PropTypes.func.isRequired,
 };
 
@@ -456,6 +457,7 @@ class DirView extends React.Component {
         onFileTagChanged={this.onFileTagChanged}
         onMenuClick={this.onMenuClick}
         onPathClick={this.onPathClick}
+        onTabNavClick={this.props.onTabNavClick}
         updateDirent={this.updateDirent}
         switchViewMode={this.switchViewMode}
         onSearchedClick={this.onSearchedClick}