As requested on slack

One element opens at a time. Note that I don’t think this is going to
function properly for direct links. Unsure.

app/components/nav-menu.js

@@ -14,6 +14,9 @@ export default Ember.Component.extend(UserSession, {
 
     _setup: function() {
         let nav = this.get("nav");
+        nav.closeSubnav = function() {
+            this.set('isShowing', false);
+        }.bind(this);
         nav.subnav.forEach(function(item) { 
             item.show = this.currentUserCan(item.capability);
         }.bind(this));        

app/controllers/navigation.js

@@ -11,6 +11,7 @@ export default Ember.Controller.extend(ProgressDialog, UserSession, Navigation,
     progressTitle: 'Searching',
     searchRoute: null,
     syncStatus: '',
+    currentOpenNav: null,
 
     actions: {
         search: function() {
@@ -28,6 +29,10 @@ export default Ember.Controller.extend(ProgressDialog, UserSession, Navigation,
         },
 
         navAction: function(nav) {
+            if (this.currentOpenNav) {
+                this.currentOpenNav.closeSubnav();
+            }
+            this.currentOpenNav = nav;
             this.transitionToRoute(nav.route);
         },
 

app/templates/components/nav-menu.hbs

@@ -1,9 +1,9 @@
 {{log this}}
 {{#if show}}
-  <div class="category-title">
-    <a href="#" class="primary-section-link nav-link" {{action 'toggleContent'}}>
-        <span {{bind-attr class=":mega-octicon nav.iconClass"}}></span>{{nav.title}}
-    </a>
+  <div class="category-title" {{action 'toggleContent'}}>
+    {{#link-to nav.route class="primary-section-link nav-link"}}
+      <span {{bind-attr class=":mega-octicon nav.iconClass"}}></span>{{nav.title}}
+    {{/link-to}}
   </div>
   {{#if isShowing }}
   <div class="category-sub-items">