Suggestions for TCP-TLS docs

ui/lib/kubernetes/addon/components/page/roles.hbs

@@ -6,11 +6,8 @@
 <TabPageHeader
   @model={{@backend}}
   @filterRoles={{not @promptConfig}}
-  @query={{this.query}}
+  @rolesFilterValue={{@filterValue}}
   @breadcrumbs={{@breadcrumbs}}
-  @handleSearch={{this.handleSearch}}
-  @handleInput={{this.handleInput}}
-  @handleKeyDown={{this.handleKeyDown}}
 >
   {{#unless @promptConfig}}
     <ToolbarLink @route="roles.create" @type="add" data-test-toolbar-roles-action>

ui/lib/kubernetes/addon/components/page/roles.js

@@ -9,58 +9,24 @@ import { action } from '@ember/object';
 import { getOwner } from '@ember/application';
 import errorMessage from 'vault/utils/error-message';
 import { tracked } from '@glimmer/tracking';
-import keys from 'core/utils/key-codes';
 
 /**
  * @module Roles
- * RolesPage component is a child component to show list of roles.
- * It also handles the filtering actions of roles.
+ * RolesPage component is a child component to show list of roles
  *
  * @param {array} roles - array of roles
  * @param {boolean} promptConfig - whether or not to display config cta
- * @param {string} filterValue - value of queryParam pageFilter
+ * @param {array} pageFilter - array of filtered roles
  * @param {array} breadcrumbs - breadcrumbs as an array of objects that contain label and route
  */
 export default class RolesPageComponent extends Component {
   @service flashMessages;
-  @service router;
-  @tracked query;
   @tracked roleToDelete = null;
 
-  constructor() {
-    super(...arguments);
-    this.query = this.args.filterValue;
-  }
-
   get mountPoint() {
     return getOwner(this).mountPoint;
   }
 
-  navigate(pageFilter) {
-    const route = `${this.mountPoint}.roles.index`;
-    const args = [route, { queryParams: { pageFilter: pageFilter || null } }];
-    this.router.transitionTo(...args);
-  }
-
-  @action
-  handleKeyDown(event) {
-    if (event.keyCode === keys.ESC) {
-      // On escape, transition to roles index route.
-      this.navigate();
-    }
-    // ignore all other key events
-  }
-
-  @action handleInput(evt) {
-    this.query = evt.target.value;
-  }
-
-  @action
-  handleSearch(evt) {
-    evt.preventDefault();
-    this.navigate(this.query);
-  }
-
   @action
   async onDelete(model) {
     try {

ui/lib/kubernetes/addon/components/tab-page-header.hbs

@@ -28,12 +28,10 @@
 <Toolbar aria-label="items for managing kubernetes items">
   {{#if @filterRoles}}
     <ToolbarFilters>
-      <FilterInputExplicit
-        @query={{@query}}
+      <NavigateInput
+        @filter={{@rolesFilterValue}}
         @placeholder="Filter roles"
-        @handleSearch={{@handleSearch}}
-        @handleInput={{@handleInput}}
-        @handleKeyDown={{@handleKeyDown}}
+        @urls={{hash list="vault.cluster.secrets.backend.kubernetes.roles"}}
       />
     </ToolbarFilters>
   {{/if}}

ui/tests/acceptance/secrets/backend/kubernetes/roles-test.js

@@ -10,7 +10,6 @@ import kubernetesScenario from 'vault/mirage/scenarios/kubernetes';
 import kubernetesHandlers from 'vault/mirage/handlers/kubernetes';
 import authPage from 'vault/tests/pages/auth';
 import { fillIn, visit, currentURL, click, currentRouteName } from '@ember/test-helpers';
-import { GENERAL } from 'vault/tests/helpers/general-selectors';
 
 module('Acceptance | kubernetes | roles', function (hooks) {
   setupApplicationTest(hooks);
@@ -31,8 +30,7 @@ module('Acceptance | kubernetes | roles', function (hooks) {
   test('it should filter roles', async function (assert) {
     await this.visitRoles();
     assert.dom('[data-test-list-item-link]').exists({ count: 3 }, 'Roles list renders');
-    await fillIn(GENERAL.filterInputExplicit, '1');
-    await click(GENERAL.filterInputExplicitSearch);
+    await fillIn('[data-test-component="navigate-input"]', '1');
     assert.dom('[data-test-list-item-link]').exists({ count: 1 }, 'Filtered roles list renders');
     assert.ok(currentURL().includes('pageFilter=1'), 'pageFilter query param value is set');
   });

ui/tests/helpers/general-selectors.ts

@@ -20,8 +20,6 @@ export const GENERAL = {
 
   filter: (name: string) => `[data-test-filter="${name}"]`,
   filterInput: '[data-test-filter-input]',
-  filterInputExplicit: '[data-test-filter-input-explicit]',
-  filterInputExplicitSearch: '[data-test-filter-input-explicit-search]',
   confirmModalInput: '[data-test-confirmation-modal-input]',
   confirmButton: '[data-test-confirm-button]',
   confirmTrigger: '[data-test-confirm-action-trigger]',

ui/tests/integration/components/kubernetes/page/roles-test.js

@@ -10,7 +10,6 @@ import { setupMirage } from 'ember-cli-mirage/test-support';
 import { render, click } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 import { allowAllCapabilitiesStub } from 'vault/tests/helpers/stubs';
-import { GENERAL } from 'vault/tests/helpers/general-selectors';
 
 module('Integration | Component | kubernetes | Page::Roles', function (hooks) {
   setupRenderingTest(hooks);
@@ -59,7 +58,7 @@ module('Integration | Component | kubernetes | Page::Roles', function (hooks) {
       .dom('[data-test-toolbar-roles-action]')
       .doesNotExist('Create role', 'Toolbar action does not render when not configured');
     assert
-      .dom(GENERAL.filterInputExplicit)
+      .dom('[data-test-nav-input]')
       .doesNotExist('Roles filter input does not render when not configured');
     assert.dom('[data-test-config-cta]').exists('Config cta renders');
   });
@@ -71,7 +70,7 @@ module('Integration | Component | kubernetes | Page::Roles', function (hooks) {
     assert
       .dom('[data-test-toolbar-roles-action] svg')
       .hasClass('flight-icon-plus', 'Toolbar action has correct icon');
-    assert.dom(GENERAL.filterInputExplicit).exists('Roles filter input renders');
+    assert.dom('[data-test-nav-input]').exists('Roles filter input renders');
     assert.dom('[data-test-empty-state-title]').hasText('No roles yet', 'Title renders');
     assert
       .dom('[data-test-empty-state-message]')

ui/tests/integration/components/kubernetes/tab-page-header-test.js

@@ -9,8 +9,6 @@ import { setupEngine } from 'ember-engines/test-support';
 import { setupMirage } from 'ember-cli-mirage/test-support';
 import { render } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
-import { GENERAL } from 'vault/tests/helpers/general-selectors';
-import sinon from 'sinon';
 
 module('Integration | Component | kubernetes | TabPageHeader', function (hooks) {
   setupRenderingTest(hooks);
@@ -30,18 +28,12 @@ module('Integration | Component | kubernetes | TabPageHeader', function (hooks)
     this.model = this.store.peekRecord('secret-engine', 'kubernetes-test');
     this.mount = this.model.path.slice(0, -1);
     this.breadcrumbs = [{ label: 'Secrets', route: 'secrets', linkExternal: true }, { label: this.mount }];
-    this.handleSearch = sinon.spy();
-    this.handleInput = sinon.spy();
-    this.handleKeyDown = sinon.spy();
   });
 
   test('it should render breadcrumbs', async function (assert) {
-    await render(
-      hbs`<TabPageHeader @model={{this.model}} @breadcrumbs={{this.breadcrumbs}} @handleSearch={{this.handleSearch}} @handleInput={{this.handleInput}} @handleKeyDown={{this.handleKeyDown}} />`,
-      {
-        owner: this.engine,
-      }
-    );
+    await render(hbs`<TabPageHeader @model={{this.model}} @breadcrumbs={{this.breadcrumbs}} />`, {
+      owner: this.engine,
+    });
     assert.dom('[data-test-breadcrumbs] li:nth-child(1) a').hasText('Secrets', 'Secrets breadcrumb renders');
 
     assert
@@ -50,42 +42,36 @@ module('Integration | Component | kubernetes | TabPageHeader', function (hooks)
   });
 
   test('it should render title', async function (assert) {
-    await render(
-      hbs`<TabPageHeader @model={{this.model}} @breadcrumbs={{this.breadcrumbs}} @handleSearch={{this.handleSearch}} @handleInput={{this.handleInput}} @handleKeyDown={{this.handleKeyDown}} />`,
-      {
-        owner: this.engine,
-      }
-    );
+    await render(hbs`<TabPageHeader @model={{this.model}} @breadcrumbs={{this.breadcrumbs}} />`, {
+      owner: this.engine,
+    });
     assert
       .dom('[data-test-header-title] svg')
       .hasClass('flight-icon-kubernetes-color', 'Correct icon renders in title');
     assert.dom('[data-test-header-title]').hasText(this.mount, 'Mount path renders in title');
   });
 
   test('it should render tabs', async function (assert) {
-    await render(
-      hbs`<TabPageHeader @model={{this.model}} @breadcrumbs={{this.breadcrumbs}} @handleSearch={{this.handleSearch}} @handleInput={{this.handleInput}} @handleKeyDown={{this.handleKeyDown}}/>`,
-      {
-        owner: this.engine,
-      }
-    );
+    await render(hbs`<TabPageHeader @model={{this.model}} @breadcrumbs={{this.breadcrumbs}} />`, {
+      owner: this.engine,
+    });
     assert.dom('[data-test-tab="overview"]').hasText('Overview', 'Overview tab renders');
     assert.dom('[data-test-tab="roles"]').hasText('Roles', 'Roles tab renders');
     assert.dom('[data-test-tab="config"]').hasText('Configuration', 'Configuration tab renders');
   });
 
   test('it should render filter for roles', async function (assert) {
     await render(
-      hbs`<TabPageHeader @model={{this.model}} @filterRoles={{true}} @query="test" @breadcrumbs={{this.breadcrumbs}} @handleSearch={{this.handleSearch}} @handleInput={{this.handleInput}} @handleKeyDown={{this.handleKeyDown}} />`,
+      hbs`<TabPageHeader @model={{this.model}} @filterRoles={{true}} @rolesFilterValue="test" @breadcrumbs={{this.breadcrumbs}} />`,
       { owner: this.engine }
     );
-    assert.dom(GENERAL.filterInputExplicit).hasValue('test', 'Filter renders with provided value');
+    assert.dom('[data-test-nav-input] input').hasValue('test', 'Filter renders with provided value');
   });
 
   test('it should yield block for toolbar actions', async function (assert) {
     await render(
       hbs`
-      <TabPageHeader @model={{this.model}} @breadcrumbs={{this.breadcrumbs}} @handleSearch={{this.handleSearch}} @handleInput={{this.handleInput}} @handleKeyDown={{this.handleKeyDown}}>
+      <TabPageHeader @model={{this.model}} @breadcrumbs={{this.breadcrumbs}}>
         <span data-test-yield>It yields!</span>
       </TabPageHeader>
     `,

website/content/api-docs/libraries.mdx

@@ -109,7 +109,6 @@ $ stack install gothic
 
 ### Java
 
-- [Quarkus Vault](https://github.com/quarkiverse/quarkus-vault)
 - [Spring Vault](https://github.com/spring-projects/spring-vault)
 - [vault-java-driver](https://github.com/jopenlibs/vault-java-driver)