Add API Explorer Link to Sidebar Nav under tools (#21578)

* wip

* add outlet and sidebar nav link

* add changelog

* fix tests

* address pr comment

changelog/21578.txt

@@ -0,0 +1,3 @@
+```release-note:improvement
+ui: Add API Explorer link to Sidebar, under Tools.
+```

ui/app/components/sidebar/nav/tools.hbs

@@ -19,4 +19,5 @@
       />
     {{/if}}
   {{/each}}
+  <Nav.Link @route="vault.cluster.tools.open-api-explorer" @text="API Explorer" data-test-sidebar-nav-link="API Explorer" />
 </Hds::SideNav::Portal>

ui/app/router.js

@@ -21,7 +21,6 @@ Router.map(function () {
       this.route('redirect');
       this.route('init');
       this.route('logout');
-      this.mount('open-api-explorer', { path: '/api-explorer' });
       this.route('license');
       this.route('mfa-setup');
       this.route('clients', function () {
@@ -51,6 +50,7 @@ Router.map(function () {
       this.route('unseal');
       this.route('tools', function () {
         this.route('tool', { path: '/:selected_action' });
+        this.mount('open-api-explorer', { path: '/api-explorer' });
       });
       this.route('access', function () {
         this.route('methods', { path: '/' });

ui/app/templates/vault/cluster/tools.hbs

@@ -0,0 +1,2 @@
+<Sidebar::Nav::Tools />
+{{outlet}}

ui/app/templates/vault/cluster/tools/tool.hbs

@@ -1,2 +1 @@
-<Sidebar::Nav::Tools />
 <ToolActionsForm @selectedAction={{this.selectedAction}} />

ui/tests/acceptance/api-explorer/index-test.js

@@ -17,7 +17,7 @@ module('Acceptance | API Explorer', function (hooks) {
   });
 
   test('it filters paths after swagger-ui is loaded', async function (assert) {
-    await visit('/vault/api-explorer');
+    await visit('/vault/tools/api-explorer');
     await waitUntil(() => {
       return find('[data-test-filter-input]').disabled === false;
     });

ui/tests/integration/components/sidebar/nav/tools-test.js

@@ -22,11 +22,11 @@ module('Integration | Component | sidebar-nav-tools', function (hooks) {
     await renderComponent();
     assert
       .dom('[data-test-sidebar-nav-link]')
-      .exists({ count: 1 }, 'Nav links are hidden other than back link');
+      .exists({ count: 2 }, 'Nav links are hidden other than back link and api explorer.');
   });
 
   test('it should render nav headings and links', async function (assert) {
-    const links = ['Back to main navigation', ...toolsActions()];
+    const links = ['Back to main navigation', ...toolsActions(), 'API Explorer'];
     stubFeaturesAndPermissions(this.owner);
     await renderComponent();