Add open/close functionality to the gutter-menu when it's collapsed

ui/app/components/global-header.js

@@ -0,0 +1,5 @@
+import Component from '@ember/component';
+
+export default Component.extend({
+  onHamburgerClick() {},
+});

ui/app/components/gutter-menu.js

@@ -32,6 +32,8 @@ export default Component.extend({
     });
   }),
 
+  onHamburgerClick() {},
+
   gotoJobsForNamespace(namespace) {
     if (!namespace || !namespace.get('id')) return;
 

ui/app/components/page-layout.js

@@ -2,4 +2,6 @@ import Component from '@ember/component';
 
 export default Component.extend({
   classNames: ['page-layout'],
+
+  isGutterOpen: false,
 });

ui/app/styles/components/page-layout.scss

@@ -43,6 +43,7 @@
         &.is-left {
           top: 0;
           left: -$gutter-width;
+          transition: left ease-in-out 0.3s;
 
           &.is-open {
             left: 0;

ui/app/templates/components/global-header.hbs

@@ -1,5 +1,6 @@
 <nav class="navbar is-primary">
   <div class="navbar-brand">
+    <span class="navbar-item" onclick={{action onHamburgerClick}}>Hamburger</span>
     <span class="navbar-item is-logo">
       <img src="/ui/images/nomad-logo.svg" alt="Nomad" />
     </span>

ui/app/templates/components/gutter-menu.hbs

@@ -1,6 +1,11 @@
-<div class="page-column is-left">
+<div class="page-column is-left {{if isOpen "is-open"}}">
   <div class="gutter">
     <aside class="menu">
+      <ul class="menu-list">
+        <li>
+          <div class="menu-item"><a onclick={{action onHamburgerClick}}>Close</a></div>
+        </li>
+      </ul>
       <p class="menu-label">
         Workload
       </p>

ui/app/templates/components/page-layout.hbs

@@ -1,6 +1,11 @@
-{{#global-header class="page-header"}}
+{{#global-header
+  class="page-header"
+  onHamburgerClick=(action (mut isGutterOpen) true)}}
   {{app-breadcrumbs}}
 {{/global-header}}
-{{#gutter-menu class="page-body"}}
+{{#gutter-menu
+  class="page-body"
+  isOpen=isGutterOpen
+  onHamburgerClick=(action (mut isGutterOpen) false)}}
   {{yield}}
 {{/gutter-menu}}