diff --git a/ui/packages/consul-ui/app/components/hashicorp-consul/index.hbs b/ui/packages/consul-ui/app/components/hashicorp-consul/index.hbs index 58fc719201..8d0a0e0682 100644 --- a/ui/packages/consul-ui/app/components/hashicorp-consul/index.hbs +++ b/ui/packages/consul-ui/app/components/hashicorp-consul/index.hbs @@ -122,7 +122,13 @@ class='hds-side-nav-hide-when-minimized consul-side-nav__selector-group' as |SNL| > - + + + {{else}} + {{#if this.hcpLinkStatus.shouldDisplayNavLinkItem}} + {{#if this.hcpLinkStatus.alreadyLinked}} + + {{else}} + + {{#if this.shouldDisplayNewBadge}} + + {{/if}} + {{this.linkText}} + + {{/if}} + {{/if}} + {{/if}} +{{/let}} \ No newline at end of file diff --git a/ui/packages/consul-ui/app/components/hcp-nav-item/index.js b/ui/packages/consul-ui/app/components/hcp-nav-item/index.js new file mode 100644 index 0000000000..876690ecd2 --- /dev/null +++ b/ui/packages/consul-ui/app/components/hcp-nav-item/index.js @@ -0,0 +1,22 @@ +import Component from '@glimmer/component'; +import { inject as service } from '@ember/service'; + +export default class HcpLinkItemComponent extends Component { + @service('hcp-link-status') hcpLinkStatus; + @service env; + + get hcpLink() { + // TODO: How do I figure this out? From the linking API? + return 'https://corn.com'; + } + + get accessedFromHcp() { + // If the user has accessed consul from HCP managed consul, we do NOT want to display the + // "HCP Consul Central↗️" link in the nav bar. As we're already displaying a BackLink from Hcp::Home + return !!this.env.var('CONSUL_HCP_URL'); + } + + get shouldDisplayNewBadge() { + return true; + } +} diff --git a/ui/packages/consul-ui/app/components/link-to-hcp-banner/index.js b/ui/packages/consul-ui/app/components/link-to-hcp-banner/index.js index 3d0c96f2fa..52168cd7af 100644 --- a/ui/packages/consul-ui/app/components/link-to-hcp-banner/index.js +++ b/ui/packages/consul-ui/app/components/link-to-hcp-banner/index.js @@ -9,7 +9,6 @@ import { inject as service } from '@ember/service'; export default class LinkToHcpBannerComponent extends Component { @service('hcp-link-status') hcpLinkStatus; - @service('env') env; @action onDismiss() { diff --git a/ui/packages/consul-ui/app/services/hcp-link-status.js b/ui/packages/consul-ui/app/services/hcp-link-status.js index 6eaa932f10..f6d0416074 100644 --- a/ui/packages/consul-ui/app/services/hcp-link-status.js +++ b/ui/packages/consul-ui/app/services/hcp-link-status.js @@ -11,10 +11,14 @@ const LOCAL_STORAGE_KEY = 'consul:hideHcpLinkBanner'; export default class HcpLinkStatus extends Service { @service abilities; @tracked - alreadyLinked = false; + alreadyLinked = true; // TODO: default to false @tracked userDismissedBanner = false; + get shouldDisplayNavLinkItem() { + return this.hasPermissionToLink; + } + get shouldDisplayBanner() { return !this.alreadyLinked && !this.userDismissedBanner && this.hasPermissionToLink; }