Update SERVICE_KIND to include all service kinds (#61)

* Update SERVICE_KIND to include all service kinds

* Update docs example

.changeset/thirty-ants-tie.md

@@ -0,0 +1,5 @@
+---
+'@hashicorp/consul-ui-toolkit': patch
+---
+
+Update SERVICE_KIND to include all service kinds

documentation/app/controllers/components/service-list-item.js

@@ -79,6 +79,7 @@ export default class ServiceListItem extends Controller {
             critical: 0,
           },
         },
+        kind: 'typical',
         instanceCount: 8,
         isImported: true,
         samenessGroup: 'group-1',

documentation/app/templates/components/service-list-item.hbs

@@ -115,6 +115,7 @@
                       critical: 0,
                     },
                   },
+                  kind: 'typical',
                   instanceCount: 8,
                   isImported: true,
                   samenessGroup: 'group-1',

documentation/tests/integration/components/service-list-item-test.js

@@ -125,6 +125,40 @@ module('Integration | Component | cut/list-item/service', function (hooks) {
       'renders tags values to metadata'
     );
   });
+
+  test('it does render the kind if it does not find a kindName', async function (assert) {
+    const service = {
+      name: 'Service 1',
+      metadata: {
+        healthCheck: {
+          instance: {
+            success: 4,
+            critical: 2,
+            warning: 1,
+          },
+        },
+        kind: 'typical',
+        instanceCount: 7,
+        linkedServiceCount: 4,
+        upstreamCount: 4,
+        isImported: true,
+        isPermissiveMTls: true,
+        samenessGroup: 'sameness-group-1',
+        connectedWithGateway: true,
+        externalSource: 'vault',
+        tags: ['tag', 'service'],
+      },
+    };
+    this.set('service', service);
+
+    await render(
+      hbs`
+        <Cut::ListItem::Service @service={{this.service}}/>`
+    );
+
+    assert.false(cutService.metadata.kind.renders, 'kind');
+  });
+
   test('it renders Cut::ListItem::Service without metadata', async function (assert) {
     const service = {
       name: 'Service 1',

toolkit/src/components/cut/list-item/service/index.hbs

@@ -25,7 +25,7 @@
             @warningCount={{@service.metadata.healthCheck.instance.warning}}
             @criticalCount={{@service.metadata.healthCheck.instance.critical}}
           />
-          {{#if @service.metadata.kind}}
+          {{#if this.kindName}}
             <Cut::TextWithIcon
               @icon='gateway'
               @text={{this.kindName}}

toolkit/src/components/cut/list-item/service/index.ts

@@ -28,6 +28,15 @@ export default class ServiceListItemComponent extends Component<ServiceListItemS
 
   get kindName() {
     const { kind } = this.args.service.metadata;
-    return kind ? this.NormalizedGatewayLabels[kind] : undefined;
+    return kind &&
+      Object.prototype.hasOwnProperty.call(this.NormalizedGatewayLabels, kind)
+      ? this.NormalizedGatewayLabels[
+          kind as
+            | 'api-gateway'
+            | 'mesh-gateway'
+            | 'ingress-gateway'
+            | 'terminating-gateway'
+        ]
+      : undefined;
   }
 }

toolkit/src/components/cut/list-item/types.ts

@@ -106,6 +106,10 @@ export type ExternalSource =
   | 'lambda';
 
 export type SERVICE_KIND =
+  | ''
+  | 'typical'
+  | 'destination'
+  | 'connect-proxy'
   | 'api-gateway'
   | 'mesh-gateway'
   | 'ingress-gateway'