Skip to content

Commit

Permalink
Simplify application templating (#367)
Browse files Browse the repository at this point in the history
Simplify template logic
  • Loading branch information
jeffdaley authored Oct 13, 2023
1 parent 46c3729 commit dff7577
Show file tree
Hide file tree
Showing 17 changed files with 364 additions and 397 deletions.
66 changes: 31 additions & 35 deletions web/app/components/footer.hbs
Original file line number Diff line number Diff line change
@@ -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>
Original file line number Diff line number Diff line change
@@ -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}} />
Original file line number Diff line number Diff line change
@@ -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> {}

Expand Down
204 changes: 99 additions & 105 deletions web/app/components/header/nav.hbs
Original file line number Diff line number Diff line change
@@ -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>
66 changes: 32 additions & 34 deletions web/app/components/header/toolbar.hbs
Original file line number Diff line number Diff line change
@@ -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}}
Loading

0 comments on commit dff7577

Please sign in to comment.