Simplify template logic

hashicorp-forge · Oct 12, 2023 · bbb7778 · bbb7778
1 parent 46c3729
commit bbb7778
Show file tree

Hide file tree

Showing 17 changed files with 364 additions and 397 deletions.
diff --git a/web/app/components/footer.hbs b/web/app/components/footer.hbs
@@ -1,38 +1,34 @@
-{{#unless (eq this.currentRouteName "authenticated.document")}}
-  <div class="footer" ...attributes>
-    <div class="x-container">
-      <div class="footer-inner">
-        <div class="flex items-center space-x-4">
-          <div data-test-footer-copyright>
-            ©
-            {{this.currentYear}}
-            HashiCorp
-          </div>
-          <div data-test-footer-version>
-            Hermes v{{this.version}}
-            ({{this.revision}})
-          </div>
-        </div>
-
-        <div class="flex items-center space-x-4">
-          <ExternalLink
-            data-test-footer-github-link
-            @iconIsShown={{true}}
-            href={{this.gitHubRepoURL}}
-          >
-            GitHub
-          </ExternalLink>
-          {{#if this.supportURL}}
-            <ExternalLink
-              data-test-footer-support-link
-              @iconIsShown={{true}}
-              href={{this.supportURL}}
-            >
-              Support
-            </ExternalLink>
-          {{/if}}
-        </div>
+<div class="footer" ...attributes>
+  <div class="footer-inner">
+    <div class="flex items-center space-x-4">
+      <div data-test-footer-copyright>
+        ©
+        {{this.currentYear}}
+        HashiCorp
+      </div>
+      <div data-test-footer-version>
+        Hermes v{{this.version}}
+        ({{this.revision}})
       </div>
     </div>
+
+    <div class="flex items-center space-x-4">
+      <ExternalLink
+        data-test-footer-github-link
+        @iconIsShown={{true}}
+        href={{this.gitHubRepoURL}}
+      >
+        GitHub
+      </ExternalLink>
+      {{#if this.supportURL}}
+        <ExternalLink
+          data-test-footer-support-link
+          @iconIsShown={{true}}
+          href={{this.supportURL}}
+        >
+          Support
+        </ExternalLink>
+      {{/if}}
+    </div>
   </div>
-{{/unless}}
+</div>
diff --git a/web/app/components/header/index.hbs → web/app/components/header.hbs b/web/app/components/header/index.hbs → web/app/components/header.hbs
@@ -1,5 +1,3 @@
 <header class="mb-7 border-b border-b-color-border-faint bg-color-page-faint">
   <Header::Nav />
 </header>
-
-<Header::Toolbar @facets={{@facets}} />
diff --git a/web/app/components/header/index.ts → web/app/components/header.ts b/web/app/components/header/index.ts → web/app/components/header.ts
@@ -1,11 +1,6 @@
 import Component from "@glimmer/component";
-import { FacetDropdownGroups } from "hermes/types/facets";
 
-interface HeaderComponentSignature {
-  Args: {
-    facets?: FacetDropdownGroups;
-  };
-}
+interface HeaderComponentSignature {}
 
 export default class HeaderComponent extends Component<HeaderComponentSignature> {}
 

diff --git a/web/app/components/header/nav.hbs b/web/app/components/header/nav.hbs
@@ -1,115 +1,109 @@
-<div class="x-container">
+<nav class="header-nav">
+  <LinkTo @route="authenticated.dashboard" class="header-nav-logo">
+    <HermesLogo />
+  </LinkTo>
 
-  <nav class="header-nav">
-    <LinkTo @route="authenticated.dashboard" class="header-nav-logo">
-      <HermesLogo />
+  <div class="primary-links">
+    <LinkTo
+      data-test-nav-link="all"
+      @route="authenticated.documents"
+      @current-when="authenticated.documents"
+      @query={{this.defaultBrowseScreenQueryParams}}
+    >
+      All Docs
     </LinkTo>
+    <LinkTo
+      data-test-nav-link="my"
+      @route="authenticated.my"
+      @current-when="authenticated.my"
+      @query={{this.defaultBrowseScreenQueryParams}}
+    >
+      My Docs
+    </LinkTo>
+    <LinkTo
+      data-test-nav-link="drafts"
+      @route="authenticated.drafts"
+      @current-when="authenticated.drafts"
+      @query={{this.defaultBrowseScreenQueryParams}}
+    >
+      My Drafts
+    </LinkTo>
+  </div>
 
-    <div class="primary-links">
-      <LinkTo
-        data-test-nav-link="all"
-        @route="authenticated.documents"
-        @current-when="authenticated.documents"
-        @query={{this.defaultBrowseScreenQueryParams}}
-      >
-        All Docs
-      </LinkTo>
-      <LinkTo
-        data-test-nav-link="my"
-        @route="authenticated.my"
-        @current-when="authenticated.my"
-        @query={{this.defaultBrowseScreenQueryParams}}
-      >
-        My Docs
-      </LinkTo>
-      <LinkTo
-        data-test-nav-link="drafts"
-        @route="authenticated.drafts"
-        @current-when="authenticated.drafts"
-        @query={{this.defaultBrowseScreenQueryParams}}
-      >
-        My Drafts
-      </LinkTo>
-    </div>
-
-    <Header::Search class="global-search" />
+  <Header::Search class="global-search" />
 
-    <div class="user-buttons">
-      <Hds::Button
-        data-test-create-new-button
-        @route="authenticated.new"
-        @text="New"
-        @icon="plus"
-        class="pl-2.5 pr-4"
-      />
-      <div class="relative">
-        {{#if this.userMenuHighlightIsShown}}
-          <Header::UserMenuHighlight />
-        {{/if}}
-        {{#if this.profile.picture}}
-          {{! Workaround until `referrerPolicy` is supported in dd.ToggleIcon }}
-          <img
-            src={{this.profile.picture}}
-            class="user-avatar"
-            role="presentation"
-            referrerpolicy="no-referrer"
-          />
-        {{/if}}
-        <Hds::Dropdown as |dd|>
-          <dd.ToggleIcon
-            data-test-user-menu-toggle
-            @text="User menu"
-            @icon="user"
-          />
-          <dd.Title
-            data-test-user-menu-title
-            {{did-insert this.onDropdownOpen}}
-            {{will-destroy this.onDropdownClose}}
-            @text={{this.profile.name}}
-            class="text-body-200"
-          />
-          <dd.Description
-            data-test-user-menu-email
-            @text={{this.profile.email}}
-            class="text-body-200"
-          />
-          <dd.Separator class="mt-2" />
-          <dd.Interactive
-            data-test-user-menu-item="email-notifications"
-            @route="authenticated.settings"
-            @text="Email notifications"
-            class={{if
-              this.emailNotificationsHighlightIsShown
-              "highlighted-new"
-            }}
-          />
+  <div class="user-buttons">
+    <Hds::Button
+      data-test-create-new-button
+      @route="authenticated.new"
+      @text="New"
+      @icon="plus"
+      class="pl-2.5 pr-4"
+    />
+    <div class="relative">
+      {{#if this.userMenuHighlightIsShown}}
+        <Header::UserMenuHighlight />
+      {{/if}}
+      {{#if this.profile.picture}}
+        {{! Workaround until `referrerPolicy` is supported in dd.ToggleIcon }}
+        <img
+          src={{this.profile.picture}}
+          class="user-avatar"
+          role="presentation"
+          referrerpolicy="no-referrer"
+        />
+      {{/if}}
+      <Hds::Dropdown as |dd|>
+        <dd.ToggleIcon
+          data-test-user-menu-toggle
+          @text="User menu"
+          @icon="user"
+        />
+        <dd.Title
+          data-test-user-menu-title
+          {{did-insert this.onDropdownOpen}}
+          {{will-destroy this.onDropdownClose}}
+          @text={{this.profile.name}}
+          class="text-body-200"
+        />
+        <dd.Description
+          data-test-user-menu-email
+          @text={{this.profile.email}}
+          class="text-body-200"
+        />
+        <dd.Separator class="mt-2" />
+        <dd.Interactive
+          data-test-user-menu-item="email-notifications"
+          @route="authenticated.settings"
+          @text="Email notifications"
+          class={{if this.emailNotificationsHighlightIsShown "highlighted-new"}}
+        />
+        <dd.Interactive
+          data-test-user-menu-github
+          @href={{this.gitHubRepoURL}}
+          @isHrefExternal={{true}}
+          @text="GitHub"
+          @icon="external-link"
+          class="user-menu-external-link"
+        />
+        {{#if this.supportDocsURL}}
           <dd.Interactive
-            data-test-user-menu-github
-            @href={{this.gitHubRepoURL}}
+            data-test-user-menu-support
+            @href={{this.supportDocsURL}}
             @isHrefExternal={{true}}
-            @text="GitHub"
+            @text="Support"
             @icon="external-link"
             class="user-menu-external-link"
           />
-          {{#if this.supportDocsURL}}
-            <dd.Interactive
-              data-test-user-menu-support
-              @href={{this.supportDocsURL}}
-              @isHrefExternal={{true}}
-              @text="Support"
-              @icon="external-link"
-              class="user-menu-external-link"
-            />
-          {{/if}}
-          {{#if this.showSignOut}}
-            <dd.Interactive
-              data-test-user-menu-item="sign-out"
-              {{on "click" this.invalidateSession}}
-              @text="Sign out"
-            />
-          {{/if}}
-        </Hds::Dropdown>
-      </div>
+        {{/if}}
+        {{#if this.showSignOut}}
+          <dd.Interactive
+            data-test-user-menu-item="sign-out"
+            {{on "click" this.invalidateSession}}
+            @text="Sign out"
+          />
+        {{/if}}
+      </Hds::Dropdown>
     </div>
-  </nav>
-</div>
+  </div>
+</nav>
diff --git a/web/app/components/header/toolbar.hbs b/web/app/components/header/toolbar.hbs
@@ -1,41 +1,39 @@
 {{#if @facets}}
   <div class="toolbar mb-7">
-    <div class="x-container">
-      <div class="flex w-full justify-between">
-        <div class="flex items-center">
-          <h4 class="hermes-h4 mr-4">
-            Filter by:
-          </h4>
-          <div class="facets flex items-center">
-            <Header::FacetDropdown
-              @label="Type"
-              @facets={{@facets.docType}}
-              @disabled={{not @facets.docType}}
-              @position="left"
-            />
-            <Header::FacetDropdown
-              @label="Status"
-              @facets={{this.statuses}}
-              @disabled={{not this.statuses}}
-              @position="center"
-              class="medium"
-            />
-            <Header::FacetDropdown
-              @label="Product/Area"
-              @facets={{@facets.product}}
-              @disabled={{not @facets.product}}
-              @position="center"
-            />
-            <Header::FacetDropdown
-              @label="Owner"
-              @facets={{@facets.owners}}
-              @disabled={{not @facets.owners}}
-              @position="right"
-            />
-          </div>
+    <div class="flex w-full justify-between">
+      <div class="flex items-center">
+        <h4 class="hermes-h4 mr-4">
+          Filter by:
+        </h4>
+        <div class="facets flex items-center">
+          <Header::FacetDropdown
+            @label="Type"
+            @facets={{@facets.docType}}
+            @disabled={{not @facets.docType}}
+            @position="left"
+          />
+          <Header::FacetDropdown
+            @label="Status"
+            @facets={{this.statuses}}
+            @disabled={{not this.statuses}}
+            @position="center"
+            class="medium"
+          />
+          <Header::FacetDropdown
+            @label="Product/Area"
+            @facets={{@facets.product}}
+            @disabled={{not @facets.product}}
+            @position="center"
+          />
+          <Header::FacetDropdown
+            @label="Owner"
+            @facets={{@facets.owners}}
+            @disabled={{not @facets.owners}}
+            @position="right"
+          />
         </div>
       </div>
-      <Header::ActiveFilterList />
     </div>
+    <Header::ActiveFilterList />
   </div>
 {{/if}}