Transitioning to WBNavbarCommon and fixing regressions on the way.

frontend/src/js/page/wb-app.js

@@ -2,6 +2,7 @@ import { h, Component } from 'preact';
 import { Router, route } from 'preact-router';
 import WBBrowse from 'wb-browse';
 import WBSignIn from 'wb-sign-in';
+import WBSignOut from 'wb-sign-out';
 import WBLandingPage from 'wb-landing-page';
 import WBProcessView from 'wb-process-view';
 import WBCollectionView from 'wb-collection-view';
@@ -16,24 +17,13 @@ class WBApp extends Component {
     this.state.arvToken = window.localStorage['arvToken'];
     if ('currentUser' in window.localStorage)
       this.state.currentUser = JSON.parse(window.localStorage['currentUser']);
-    this.appCallbacks = {
-      'navbarItemClicked': item => this.navbarItemClicked(item)
-    };
-    this.appState = {
-      'arvHost': this.state.arvHost,
-      'arvToken': this.state.arvToken,
-      'currentUser': this.state.currentUser
-    };
   }
 
   navbarItemUrl(item) {
     if (item['id'] === 'sign-out') {
-      delete window.localStorage['arvHost'];
-      delete window.localStorage['arvToken'];
-      delete window.localStorage['currentUser'];
-      return ('/sign-in');
+      return ('/sign-out');
     } else if (item['id'] === 'home') {
-      return ('/browse/' + this.appState.currentUser.uuid);
+      return ('/browse/' + this.state.currentUser.uuid);
     } else if (item['id'] === 'all-projects') {
       return ('/browse');
     } else if (item['id'] === 'all-users') {
@@ -56,11 +46,12 @@ class WBApp extends Component {
       <Router>
         <WBLandingPage path="/" />
 
-        <WBSignIn path="/sign-in" appState={ this.appState } />
+        <WBSignIn path="/sign-in" appState={ this.state } />
+
+        <WBSignOut path='/sign-out' />
 
         <WBBrowse path="/browse/:ownerUuid?/:activePage?/:objTypeTab?/:collectionPage?/:processPage?/:workflowPage?"
-          appCallbacks={ this.appCallbacks }
-          appState={ this.appState }
+          appState={ this.state }
           app={ this } />
 
         <WBProcessView path="/process/:uuid" app={ this } />

frontend/src/js/page/wb-browse.js

@@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
 import { route } from 'preact-router';
-import WBNavbar from 'wb-navbar';
+import WBNavbarCommon from 'wb-navbar-common';
 import WBProjectListing from 'wb-project-listing';
 import WBInlineSearch from 'wb-inline-search';
 import WBProjectCrumbs from 'wb-project-crumbs';
@@ -25,18 +25,13 @@ class WBBrowse extends Component {
     route(this.getUrl(params));
   }
 
-  render({ ownerUuid, activePage, appCallbacks, appState, app,
+  render({ ownerUuid, activePage, appState, app,
     objTypeTab, collectionPage, processPage, workflowPage }) {
 
     return (
       <div>
-        <WBNavbar items={ [
-          { 'name': 'Home', 'id': 'home', 'active': (ownerUuid === appState.currentUser.uuid) },
-          { 'name': 'All Projects', 'id': 'all-projects', 'active': (!ownerUuid) },
-          { 'name': 'User', 'dropdown': [ { 'id': 'sign-out', 'name': 'Sign Out' } ]}
-        ] } rhs={ (
-          <WBInlineSearch />
-        ) } onItemClicked={ appCallbacks.navbarItemClicked } />
+        <WBNavbarCommon app={ app } activeItem={ !ownerUuid ? 'all-projects' :
+          (ownerUuid === app.state.currentUser.uuid ? 'home' : null) } />
 
         <WBProjectCrumbs uuid={ ownerUuid } appState={ appState }
           onItemClicked={ item => route('/browse/' + item['uuid']) } />

frontend/src/js/page/wb-sign-out.js

@@ -0,0 +1,19 @@
+import { h, Component } from 'preact';
+import { route } from 'preact-router';
+
+class WBSignOut extends Component {
+  componentDidMount() {
+    delete window.localStorage['arvHost'];
+    delete window.localStorage['arvToken'];
+    delete window.localStorage['currentUser'];
+    route('/sign-in');
+  }
+
+  render() {
+    return (
+      <div>Signing out...</div>
+    );
+  }
+}
+
+export default WBSignOut;

frontend/src/js/page/wb-users-page.js

@@ -10,7 +10,7 @@ class WBUsersPage extends Component {
   render({ app, page }) {
     return (
       <div>
-        <WBNavbarCommon />
+        <WBNavbarCommon app={ app } activeItem="all-users" />
 
         <WBUserListing app={ app } page={ Number(page || 0) }
           getPageUrl={ page => this.getUrl(page) } />