Apply suggestions from code review

Co-authored-by: Jamie White <jamie@jgwhite.co.uk>

ui/app/components/panel-header.hbs

@@ -1,17 +1,17 @@
 {{#let
  (hash
  title=(or
- (and (eq @artifact "deployment") "Deployment")
- (and (eq @artifact "build") "Build")
- (and (eq @artifact "release") "Release")
- (and @artifact "n/a")
+ (and (eq @artifact "deployment") "page.deployment.title")
+ (and (eq @artifact "build") "page.build.title")
+ (and (eq @artifact "release") "page.release.title")
+ "page.unavailable.title"
  )
  )
  as |vars|
 }}
 <header data-test-panel-header class="panel-header {{@className}}">
  <div class="title">
- <h1>{{vars.title}} 
+ <h1>{{t vars.title}}
  {{#if @sequence}}
  <b class="badge badge--version">v{{@sequence}}</b>
  {{/if}}

ui/app/components/section.ts

@@ -9,7 +9,10 @@ type Args = {
 
 export default class extends Component<Args> {
  @tracked expanded = this.args.expanded ?? true;
- @tracked isExpandable = this.args.isExpandable ?? true;
+
+ get isExpandable(): boolean {
+ return this.args.isExpandable ?? true;
+ }
 
  @action
  toggleExpanded(): void {

ui/app/components/status-report-meta-table/index.hbs

@@ -1,6 +1,6 @@
 {{#let
  (hash
- shouldRenderHealthAndTag= (and
+ shouldRenderHealthAndTag=(and
  (or
  (eq @artifactType "Deployment")
  (eq @artifactType "Release")
@@ -14,14 +14,14 @@
 <div class="artifact-overview">
  <table>
  <tbody>
- {{#if (or (or (has-block) vars.shouldRenderCommit) vars.shouldRenderHealthAndTag)}}
+ {{#if (or (has-block) vars.shouldRenderCommit vars.shouldRenderHealthAndTag)}}
  {{yield}}
  {{else}}
- {{t "page.deployment.overview.unavailable"}}
+ {{t "page.artifact.overview.unavailable"}}
  {{/if}}
  {{#if vars.shouldRenderHealthAndTag}}
  <tr>
- <th scope="row">{{t "page.deployment.overview.health-check"}}</th>
+ <th scope="row">{{t "page.artifact.overview.health-check"}}</th>
  <td>
  <div class="status-indicator">
  <StatusReportIndicator @statusReport={{@model.statusReport}} /> &nbsp;
@@ -32,14 +32,14 @@
  disabled={{this.isRefreshRunning}}
  {{on "click" this.refreshHealthCheck}}
  >
- {{t "page.deployment.overview.re-run-health-check"}}
+ {{t "page.artifact.overview.re-run-health-check"}}
  </Pds::Button>
  </div>
  </td>
  </tr>
  <tr>
  <th scope="row">
- {{t "page.deployment.overview.image"}}
+ {{t "page.artifact.overview.image"}}
  </th>
  <td>
  <ContainerImageTag @statusReport={{@model.statusReport}}/>
@@ -48,7 +48,7 @@
  {{/if}}
  {{#if vars.shouldRenderCommit}}
  <tr>
- <th scope="row">Commit</th>
+ <th scope="row">{{t "page.artifact.overview.commit"}}</th>
  <td>
  <GitCommit @commit={{@model.preload.jobDataSourceRef.git.commit}}/>
  </td>

ui/app/templates/workspace/projects/project/app/build.hbs

@@ -12,7 +12,7 @@
  <:body>
  <StatusReportMetaTable @model={{@model}} @artifactType="Build">
  <tr>
- <th scope="row">Status</th>
+ <th scope="row">{{t "page.build.overview.status"}}</th>
  <td>
  <Pds::Icon
  @type={{icon-for-component operation.component.name}}

ui/app/templates/workspace/projects/project/app/deployment.hbs

@@ -20,9 +20,7 @@
  <:body>
  <StatusReportMetaTable @model={{@model}} @artifactType="Deployment">
  <tr>
- <th scope="row">
- Status
- </th>
+ <th scope="row">{{t "page.deployment.overview.status"}}</th>
  <td>
  <Pds::Icon @type={{icon-for-component @model.component.name}} class="icon" />
  <span>Deployed by <b>{{component-name @model.component.name}}</b>

ui/app/templates/workspace/projects/project/app/release.hbs

@@ -13,11 +13,11 @@
  </PanelHeader>
 
  <Section @isExpandable={{false}}>
- <:heading>{{t "page.build.overview.heading"}}</:heading>
+ <:heading>{{t "page.release.overview.heading"}}</:heading>
  <:body>
  <StatusReportMetaTable @model={{@model}} @artifactType="Release">
  <tr>
- <th scope="row">Status</th>
+ <th scope="row">{{t "page.release.overview.status"}}</th>
  <td>
  <Pds::Icon @type={{icon-for-component @model.component.name}} class="icon" />
  <span>Released on <b>{{component-name @model.component.name}}</b>

ui/tests/integration/components/panel-header-test.ts

@@ -3,7 +3,7 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Component | panel-title', function (hooks) {
+module('Integration | Component | panel-header', function (hooks) {
  setupRenderingTest(hooks);
 
  test('it renders an empty component when params not passed', async function (assert) {

ui/translations/en-us.yaml

@@ -17,15 +17,20 @@ product:
  name: 'Waypoint'
 
 page:
+ artifact:
+ overview:
+ image: 'Image'
+ health-check: 'Health'
+ re-run-health-check: 'Re-run'
+ unavailable: 'Currently unavailable'
+ commit: 'Commit'
  builds:
  title: 'Builds'
  build:
+ title: 'Build'
  overview:
- heading: Overview
- image: Image
- health-check: Health
- re-run-health-check: Re-run
- unavailable: Currently unavailable
+ heading: 'Overview'
+ status: 'Status'
  deployments:
  title: 'Deployments'
  destroyed_label: 'Destroyed'
@@ -38,32 +43,30 @@ page:
  2: 'Deployed by ' # SUCCESS
  3: 'Failed to deploy by ' # ERROR
  deployment:
+ title: 'Deployment'
  resources:
  heading: Resources
  deployment-table-caption: Resources created by <b>this deployment</b>
  release-table-caption-prefix: Resources created by <b>Release</b>
  overview:
- heading: Overview
- image: Image
- health-check: Health
- re-run-health-check: Re-run
- unavailable: Currently unavailable
+ heading: 'Overview'
+ status: 'Status'
  logs:
  heading: Deployment Logs
  releases:
  title: 'Releases'
  release:
+ title: 'Release'
  resources:
  heading: Resources
  table-caption: Resources created by <b>this release</b>
  overview:
- heading: Overview
- image: Image
- health-check: Health
- re-run-health-check: Re-run
- unavailable: Currently unavailable
+ heading: 'Overview'
+ status: 'Status'
  logs:
  heading: Release Logs
+ unavailable:
+ title: ''
 
 form:
  project_new: