UI: HDS adoption replace footer element (#24191)

* Replace footer with `Hds::AppFooter`

* Remove unused `.footer` styles

* Add changelog entry

* Use `doc-link` helper for 'Documentation' link

changelog/24191.txt

@@ -0,0 +1,3 @@
+```release-note:improvement
+ui: Implement Helios Design System footer component
+```

ui/app/styles/core.scss

@@ -30,7 +30,6 @@
 @import './core/control';
 @import './core/field';
 @import './core/file';
-@import './core/footer';
 @import './core/inputs';
 @import './core/json-diff-patch';
 @import './core/label';

ui/app/styles/core/footer.scss

@@ -1,20 +0,0 @@
-/**
- * Copyright (c) HashiCorp, Inc.
- * SPDX-License-Identifier: BUSL-1.1
- */
-
-.footer {
-  background-color: transparent;
-  border-top: $base-border;
-  padding: $spacing-24 $spacing-20;
-  margin-top: auto;
-
-  span:not(:first-child) {
-    display: inline-block;
-    padding: 0 0.5rem;
-
-    @include until($mobile) {
-      display: none;
-    }
-  }
-}

ui/app/templates/vault.hbs

@@ -4,32 +4,23 @@
 ~}}
 
 {{outlet}}
-<footer class="footer has-text-grey has-text-centered">
+
-  <span class="is-inline-block">
+<Hds::AppFooter as |AF|>
-    <Icon @name="hashicorp" aria-hidden="true" class="has-text-grey-light" />
+  <AF.Link @href={{changelog-url-for this.auth.activeCluster.leaderNode.version}}>
-    &copy;
+    Vault
-    {{date-format (now) "yyyy"}}
+    {{this.auth.activeCluster.leaderNode.version}}
-    HashiCorp
+  </AF.Link>
-  </span>
-  <span>
-    <ExternalLink @href={{changelog-url-for this.auth.activeCluster.leaderNode.version}} class="link has-text-grey">
-      Vault
-      {{this.auth.activeCluster.leaderNode.version}}
-    </ExternalLink>
-  </span>
   {{#if (is-version "OSS")}}
-    <span>
+    <AF.Link @href="https://hashicorp.com/products/vault/trial?source=vaultui">
-      <ExternalLink @href="https://hashicorp.com/products/vault/trial?source=vaultui" class="link has-text-grey">
+      Upgrade to Vault Enterprise
-        Upgrade to Vault Enterprise
+    </AF.Link>
-      </ExternalLink>
-    </span>
   {{/if}}
-  <span>
+  <AF.Link @href={{doc-link "/vault"}}>
-    <DocLink @path="/vault" class="has-text-grey">
+    Documentation
-      Documentation
+  </AF.Link>
-    </DocLink>
+  <AF.LegalLinks />
-  </span>
+</Hds::AppFooter>
-</footer>
+
 {{#if (eq this.env "development")}}
   <div class="env-banner level development">
     <div class="level-item notification">