convert es-header to a glimmer component

Author: mansona

addon/components/es-header.js

@@ -1,9 +1,9 @@
-import Component from 'sparkles-component';
 import { set } from '@ember/object';
+import Component from '@glimmer/component';
 
 import defaultLinks from '../constants/links';
 
-export default class EsHeader extends Component {
+export default class EsHeaderComponent extends Component {
   expanded = false;
 
   get navHome() {
@@ -26,7 +26,7 @@ export default class EsHeader extends Component {
     set(this, 'expanded', !this.expanded);
   }
 
-  didInsertElement() {
+  trackExpanded() {
     // Ensure menu is marked as expanded if there is enough screen estate
     // TODO: Dynamically calculate necessary horizontal space and collapse based on that
     if (typeof FastBoot === 'undefined') {

addon/templates/components/es-header.hbs

@@ -10,7 +10,7 @@
       >
     </a>
 
-    <button class="navbar-toggler ember-view" onclick={{action this.toggleMenu}} aria-expanded={{if this.expanded "true" "false"}}>
+    <button class="navbar-toggler ember-view" onclick={{action this.toggleMenu}} aria-expanded={{if this.expanded "true" "false"}} {{did-insert this.trackExpanded}}>
       Show Site Navigation
     </button>
 

addon/templates/components/es-header/navbar-link.hbs

@@ -1 +1 @@
-export { default } from 'ember-styleguide/components/es-header';
+export { default } from 'ember-styleguide/components/es-header';