VAULT-12127 Refactor breadcrumbs to use Page::Breadcrumbs component

hashicorp · Dec 20, 2022 · e117bd5 · e117bd5
1 parent 3bff9f9
commit e117bd5
Show file tree

Hide file tree

Showing 16 changed files with 64 additions and 55 deletions.
diff --git a/ui/lib/kubernetes/addon/components/page/configuration.hbs b/ui/lib/kubernetes/addon/components/page/configuration.hbs
@@ -1,4 +1,4 @@
-<TabPageHeader @model={{@backend}}>
+<TabPageHeader @model={{@backend}} @breadcrumbs={{@breadcrumbs}}>
   <ToolbarLink @route="configure" data-test-toolbar-config-action>
     {{if @config "Edit configuration" "Configure Kubernetes"}}
   </ToolbarLink>

diff --git a/ui/lib/kubernetes/addon/components/page/credentials.hbs b/ui/lib/kubernetes/addon/components/page/credentials.hbs
@@ -1,25 +1,6 @@
 <PageHeader as |p|>
   <p.top>
-    <nav class="breadcrumb" aria-label="breadcrumbs">
-      <ul>
-        <li data-test-crumb="overview">
-          <span class="sep">/</span>
-          <LinkTo @route="overview">{{@backend}}</LinkTo>
-        </li>
-        <li data-test-crumb="roles">
-          <span class="sep">/</span>
-          <LinkTo @route="roles">roles</LinkTo>
-        </li>
-        <li data-test-crumb="details">
-          <span class="sep">/</span>
-          <LinkTo @route="roles.role.details">{{@roleName}}</LinkTo>
-        </li>
-        <li>
-          <span class="sep">/</span>
-          <span>credentials</span>
-        </li>
-      </ul>
-    </nav>
+    <Page::Breadcrumbs @breadcrumbs={{@breadcrumbs}} />
   </p.top>
   <p.levelLeft>
     <h1 class="title is-3 has-bottom-margin-2" data-test-credentials-header>

diff --git a/ui/lib/kubernetes/addon/components/page/overview.hbs b/ui/lib/kubernetes/addon/components/page/overview.hbs
@@ -1,4 +1,4 @@
-<TabPageHeader @model={{@backend}}>
+<TabPageHeader @model={{@backend}} @breadcrumbs={{@breadcrumbs}}>
   <ToolbarLink @route="configure">Configure Kubernetes</ToolbarLink>
 </TabPageHeader>
 

diff --git a/ui/lib/kubernetes/addon/components/page/role/details.hbs b/ui/lib/kubernetes/addon/components/page/role/details.hbs
@@ -1,21 +1,6 @@
 <PageHeader as |p|>
   <p.top>
-    <nav class="breadcrumb" aria-label="breadcrumbs" data-test-breadcrumbs>
-      <ul>
-        <li data-test-crumb="overview">
-          <span class="sep">/</span>
-          <LinkTo @route="overview">{{@model.backend}}</LinkTo>
-        </li>
-        <li data-test-crumb="roles">
-          <span class="sep">/</span>
-          <LinkTo @route="roles">roles</LinkTo>
-        </li>
-        <li>
-          <span class="sep">/</span>
-          <span data-test-crumb="role">{{@model.name}}</span>
-        </li>
-      </ul>
-    </nav>
+    <Page::Breadcrumbs @breadcrumbs={{@breadcrumbs}} />
   </p.top>
   <p.levelLeft>
     <h1 class="title is-3" data-test-header-title>

diff --git a/ui/lib/kubernetes/addon/components/page/roles.hbs b/ui/lib/kubernetes/addon/components/page/roles.hbs
@@ -1,4 +1,4 @@
-<TabPageHeader @model={{@backend}} @filterRoles={{true}} @rolesFilterValue={{@filterValue}}>
+<TabPageHeader @model={{@backend}} @filterRoles={{true}} @rolesFilterValue={{@filterValue}} @breadcrumbs={{@breadcrumbs}}>
   <ToolbarLink @route="roles.create" @type="add" data-test-toolbar-roles-action>
     Create role
   </ToolbarLink>

diff --git a/ui/lib/kubernetes/addon/components/tab-page-header.hbs b/ui/lib/kubernetes/addon/components/tab-page-header.hbs
@@ -1,17 +1,6 @@
 <PageHeader as |p|>
   <p.top>
-    <nav class="breadcrumb" aria-label="breadcrumbs" data-test-breadcrumbs>
-      <ul>
-        <li data-test-crumb="secrets">
-          <span class="sep">/</span>
-          <LinkToExternal @route="secrets">secrets</LinkToExternal>
-        </li>
-        <li>
-          <span class="sep">/</span>
-          <span data-test-crumb="path">{{@model.id}}</span>
-        </li>
-      </ul>
-    </nav>
+    <Page::Breadcrumbs @breadcrumbs={{@breadcrumbs}} />
   </p.top>
   <p.levelLeft>
     <h1 class="title is-3" data-test-header-title>

diff --git a/ui/lib/kubernetes/addon/routes/configuration.js b/ui/lib/kubernetes/addon/routes/configuration.js
@@ -7,4 +7,13 @@ export default class KubernetesConfigureRoute extends FetchConfigRoute {
       config: this.configModel,
     };
   }
+
+  setupController(controller, resolvedModel) {
+    super.setupController(controller, resolvedModel);
+
+    controller.breadcrumbs = [
+      { label: 'secrets', route: 'secrets', linkExternal: true },
+      { label: resolvedModel.backend.id },
+    ];
+  }
 }
diff --git a/ui/lib/kubernetes/addon/routes/overview.js b/ui/lib/kubernetes/addon/routes/overview.js
@@ -10,4 +10,13 @@ export default class KubernetesOverviewRoute extends FetchConfigRoute {
       roles: this.store.query('kubernetes/role', { backend }).catch(() => []),
     });
   }
+
+  setupController(controller, resolvedModel) {
+    super.setupController(controller, resolvedModel);
+
+    controller.breadcrumbs = [
+      { label: 'secrets', route: 'secrets', linkExternal: true },
+      { label: resolvedModel.backend.id },
+    ];
+  }
 }
diff --git a/ui/lib/kubernetes/addon/routes/roles/index.js b/ui/lib/kubernetes/addon/routes/roles/index.js
@@ -19,4 +19,13 @@ export default class KubernetesRolesRoute extends FetchConfigRoute {
       roles,
     });
   }
+
+  setupController(controller, resolvedModel) {
+    super.setupController(controller, resolvedModel);
+
+    controller.breadcrumbs = [
+      { label: 'secrets', route: 'secrets', linkExternal: true },
+      { label: resolvedModel.backend.id },
+    ];
+  }
 }
diff --git a/ui/lib/kubernetes/addon/routes/roles/role/credentials.js b/ui/lib/kubernetes/addon/routes/roles/role/credentials.js
@@ -9,4 +9,15 @@ export default class KubernetesRoleCredentialsRoute extends Route {
       backend: this.secretMountPath.get(),
     };
   }
+
+  setupController(controller, resolvedModel) {
+    super.setupController(controller, resolvedModel);
+
+    controller.breadcrumbs = [
+      { label: resolvedModel.backend, route: 'overview' },
+      { label: 'roles', route: 'roles' },
+      { label: resolvedModel.roleName, route: 'roles.role.details' },
+      { label: 'credentials' },
+    ];
+  }
 }
diff --git a/ui/lib/kubernetes/addon/routes/roles/role/details.js b/ui/lib/kubernetes/addon/routes/roles/role/details.js
@@ -10,4 +10,14 @@ export default class KubernetesRoleDetailsRoute extends Route {
     const { name } = this.paramsFor('roles.role');
     return this.store.queryRecord('kubernetes/role', { backend, name });
   }
+
+  setupController(controller, resolvedModel) {
+    super.setupController(controller, resolvedModel);
+
+    controller.breadcrumbs = [
+      { label: resolvedModel.backend, route: 'overview' },
+      { label: 'roles', route: 'roles' },
+      { label: resolvedModel.name },
+    ];
+  }
 }
diff --git a/ui/lib/kubernetes/addon/templates/configuration.hbs b/ui/lib/kubernetes/addon/templates/configuration.hbs
@@ -1 +1 @@
-<Page::Configuration @config={{this.model.config}} @backend={{this.model.backend}} />
+<Page::Configuration @config={{this.model.config}} @backend={{this.model.backend}} @breadcrumbs={{this.breadcrumbs}} />
diff --git a/ui/lib/kubernetes/addon/templates/overview.hbs b/ui/lib/kubernetes/addon/templates/overview.hbs
@@ -1 +1,6 @@
-<Page::Overview @config={{this.model.config}} @backend={{this.model.backend}} @roles={{this.model.roles}} />
+<Page::Overview
+  @config={{this.model.config}}
+  @backend={{this.model.backend}}
+  @roles={{this.model.roles}}
+  @breadcrumbs={{this.breadcrumbs}}
+/>
diff --git a/ui/lib/kubernetes/addon/templates/roles/index.hbs b/ui/lib/kubernetes/addon/templates/roles/index.hbs
@@ -3,4 +3,5 @@
   @config={{this.model.config}}
   @backend={{this.model.backend}}
   @filterValue={{this.pageFilter}}
+  @breadcrumbs={{this.breadcrumbs}}
 />
diff --git a/ui/lib/kubernetes/addon/templates/roles/role/credentials.hbs b/ui/lib/kubernetes/addon/templates/roles/role/credentials.hbs
@@ -1 +1 @@
-<Page::Credentials @roleName={{this.model.roleName}} @backend={{this.model.backend}} />
+<Page::Credentials @roleName={{this.model.roleName}} @backend={{this.model.backend}} @breadcrumbs={{this.breadcrumbs}} />
diff --git a/ui/lib/kubernetes/addon/templates/roles/role/details.hbs b/ui/lib/kubernetes/addon/templates/roles/role/details.hbs
@@ -1 +1 @@
-<Page::Role::Details @model={{@model}} />
+<Page::Role::Details @model={{@model}} @breadcrumbs={{this.breadcrumbs}} />
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<Page::Configuration @config={{this.model.config}} @backend={{this.model.backend}} />
		<Page::Configuration @config={{this.model.config}} @backend={{this.model.backend}} @breadcrumbs={{this.breadcrumbs}} />
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<Page::Credentials @roleName={{this.model.roleName}} @backend={{this.model.backend}} />
		<Page::Credentials @roleName={{this.model.roleName}} @backend={{this.model.backend}} @breadcrumbs={{this.breadcrumbs}} />
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<Page::Role::Details @model={{@model}} />
		<Page::Role::Details @model={{@model}} @breadcrumbs={{this.breadcrumbs}} />