ui: Convert Service.GatewayConfig to a model fragment (#9586)

* ui: Convert Service.GatewayConfig to a model fragment

We added the ember-intl addon, which has its own format-number helper.
We replaced our own similarly named helper with this one, but the
ember-intl one is far stricter and errors if the arguments passed are
undefined. Our previously one would cope with this.

We'd rather continue to use the stricter ember-intl helper, so here we
convert the GatewayConfig property to a model fragment so that we can
give the GatewayConfig.AssociatedServices property a default zero value.

ui/packages/consul-ui/app/models/gateway-config.js

@@ -0,0 +1,12 @@
+import Fragment from 'ember-data-model-fragments/fragment';
+import { array } from 'ember-data-model-fragments/attributes';
+import { attr } from '@ember-data/model';
+
+export default class GatewayConfig extends Fragment {
+  // AssociatedServiceCount is only populated when asking for a list of
+  // services
+  @attr('number', { defaultValue: () => 0 }) AssociatedServiceCount;
+  // Addresses is only populated when asking for a list of services for a
+  // specific gateway
+  @array('string', { defaultValue: () => [] }) Addresses;
+}

ui/packages/consul-ui/app/models/service.js

@@ -1,6 +1,7 @@
 import Model, { attr } from '@ember-data/model';
 import { computed } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
+import { fragment } from 'ember-data-model-fragments/attributes';
 
 export const PRIMARY_KEY = 'uid';
 export const SLUG_KEY = 'Name';
@@ -41,8 +42,8 @@ export default class Service extends Model {
 
   @attr() Nodes; // array
   @attr() Proxy; // Service
-  @attr() GatewayConfig; // {AssociatedServiceCount: 0}
   @attr() ExternalSources; // array
+  @fragment('gateway-config') GatewayConfig;
   @attr() Meta; // {}
 
   @attr() meta; // {}

ui/packages/consul-ui/mock-api/v1/internal/ui/services

@@ -68,7 +68,9 @@ ${typeof location.search.ns !== 'undefined' ? `
             "ConnectedWithProxy":${fake.random.boolean()},
             "ConnectedWithGateway":${fake.random.boolean()},
             "GatewayConfig": {
+${fake.random.boolean() ? `
               "AssociatedServiceCount": ${fake.random.number({min: 1, max: 4000})}
+` : ``}
             },
 ${kind !== '' ? `
             "Kind": "${kind}",

ui/packages/consul-ui/tests/integration/services/repository/service-test.js

@@ -36,19 +36,20 @@ const undefinedNspace = 'default';
         return service.findGatewayBySlug(gateway, dc, nspace || undefinedNspace, conf);
       },
       function performAssertion(actual, expected) {
-        assert.deepEqual(
-          actual,
-          expected(function(payload) {
-            return payload.map(item =>
-              Object.assign({}, item, {
-                SyncTime: now,
-                Datacenter: dc,
-                Namespace: item.Namespace || undefinedNspace,
-                uid: `["${item.Namespace || undefinedNspace}","${dc}","${item.Name}"]`,
-              })
-            );
-          })
-        );
+        const result = expected(function(payload) {
+          return payload.map(item =>
+            Object.assign({}, item, {
+              SyncTime: now,
+              Datacenter: dc,
+              Namespace: item.Namespace || undefinedNspace,
+              uid: `["${item.Namespace || undefinedNspace}","${dc}","${item.Name}"]`,
+            })
+          );
+        });
+        assert.equal(actual[0].SyncTime, result[0].SyncTime);
+        assert.equal(actual[0].Datacenter, result[0].Datacenter);
+        assert.equal(actual[0].Namespace, result[0].Namespace);
+        assert.equal(actual[0].uid, result[0].uid);
       }
     );
   });