ui: Metadata cleanup (#7767)

* Use new ConsulMetadataList for service > instance > metadata tab

* Meta Data vs Metadata everywhere (Metadata is correct)

* Fix up wording in tests

ui-v2/app/router.js

@@ -70,7 +70,7 @@ export const routes = {
           _options: { path: '/lock-sessions' },
         },
         metadata: {
-          _options: { path: '/meta-data' },
+          _options: { path: '/metadata' },
         },
       },
     },

ui-v2/app/templates/dc/nodes/show.hbs

@@ -21,7 +21,7 @@
                           (hash label="Services" href=(href-to "dc.nodes.show.services") selected=(is-href "dc.nodes.show.services"))
 (if tomography.distances  (hash label="Round Trip Time" href=(href-to "dc.nodes.show.rtt") selected=(is-href "dc.nodes.show.rtt")) '')
                           (hash label="Lock Sessions" href=(href-to "dc.nodes.show.sessions") selected=(is-href "dc.nodes.show.sessions"))
-                          (hash label="Meta Data" href=(href-to "dc.nodes.show.metadata") selected=(is-href "dc.nodes.show.metadata"))
+                          (hash label="Metadata" href=(href-to "dc.nodes.show.metadata") selected=(is-href "dc.nodes.show.metadata"))
               )
         }}/>
     </BlockSlot>

ui-v2/app/templates/dc/services/-metadata.hbs

@@ -1,7 +0,0 @@
-{{#if item.Meta}}
-  <ConsulMetadataList @items={{object-entries item.Meta}} />
-{{else}}
-  <p>
-    This instance has no meta data.
-  </p>
-{{/if}}

ui-v2/app/templates/dc/services/instance.hbs

@@ -64,7 +64,7 @@
                       (hash label="Addresses" href=(href-to "dc.services.instance.addresses") selected=(is-href "dc.services.instance.addresses")) ""
 )
                       (hash label="Tags" href=(href-to "dc.services.instance.tags") selected=(is-href "dc.services.instance.tags"))
-                      (hash label="Meta Data" href=(href-to "dc.services.instance.metadata") selected=(is-href "dc.services.instance.metadata"))
+                      (hash label="Metadata" href=(href-to "dc.services.instance.metadata") selected=(is-href "dc.services.instance.metadata"))
               )
         }}/>
         {{outlet}}

ui-v2/app/templates/dc/services/instance/metadata.hbs

@@ -1,27 +1,7 @@
-<div id="meta-data" class="tab-section">
+<div id="metadata" class="tab-section">
   <div role="tabpanel">
 {{#if item.Meta}}
-      {{#with (object-entries item.Meta) as |meta|}}
+  <ConsulMetadataList @items={{object-entries item.Meta}} />
-        <TabularCollection
-          data-test-metadata
-          @items={{meta}} as |item index|
-        >
-            <BlockSlot @name="header">
-                <th>Key</th>
-                <th>Value</th>
-            </BlockSlot>
-            <BlockSlot @name="row">
-                <td>
-                  <span>
-                    {{object-at 0 item}}
-                  </span>
-                </td>
-                <td>
-                  <span>{{object-at 1 item}}</span>
-                </td>
-            </BlockSlot>
-        </TabularCollection>
-      {{/with}}
 {{else}}
   <p>
     This instance has no meta data.
@@ -29,4 +9,3 @@
 {{/if}}
   </div>
 </div>
-

ui-v2/tests/acceptance/dc/nodes/show.feature

@@ -20,8 +20,8 @@ Feature: dc / nodes / show: Show node
     When I click lockSessions on the tabs
     And I see lockSessionsIsSelected on the tabs
 
-    When I click metaData on the tabs
+    When I click metadata on the tabs
-    And I see metaDataIsSelected on the tabs
+    And I see metadataIsSelected on the tabs
   Scenario: Given 1 node all the tabs are visible and clickable and the RTT one isn't there
     Given 1 node models from yaml
     ---

ui-v2/tests/acceptance/dc/services/instances/show.feature

@@ -68,9 +68,9 @@ Feature: dc / services / instances / show: Show Service Instance
     Then I see the text "Tag1" in "[data-test-tags] span:nth-child(1)"
     Then I see the text "Tag2" in "[data-test-tags] span:nth-child(2)"
 
-    When I click metaData on the tabs
+    When I click metadata on the tabs
-    And I see metaDataIsSelected on the tabs
+    And I see metadataIsSelected on the tabs
-    And I see 3 of the metaData object
+    And I see 3 of the metadata object
     And the title should be "service-0-with-id - Consul"
 
   Scenario: A Service instance warns when deregistered whilst blocking

ui-v2/tests/pages/dc/nodes/show.js

@@ -6,7 +6,7 @@ export default function(visitable, deletable, clickable, attribute, collection,
       'services',
       'round-trip-time',
       'lock-sessions',
-      'meta-data',
+      'metadata',
     ]),
     healthchecks: collection('[data-test-node-healthcheck]', {
       name: attribute('data-test-node-healthcheck'),
@@ -23,6 +23,6 @@ export default function(visitable, deletable, clickable, attribute, collection,
         TTL: attribute('data-test-session-ttl', '[data-test-session-ttl]'),
       })
     ),
-    metaData: collection('#meta-data [data-test-tabular-row]', {}),
+    metadata: collection('#metadata [data-test-tabular-row]', {}),
   };
 }

ui-v2/tests/pages/dc/services/instance.js

@@ -10,7 +10,7 @@ export default function(visitable, attribute, collection, text, tabs) {
       'upstreams',
       'exposed-paths',
       'tags',
-      'meta-data',
+      'metadata',
     ]),
     serviceChecks: collection('[data-test-service-checks] li', {
       exposed: attribute('data-test-exposed', '[data-test-exposed]'),
@@ -30,6 +30,6 @@ export default function(visitable, attribute, collection, text, tabs) {
     addresses: collection('#addresses [data-test-tabular-row]', {
       address: text('[data-test-address]'),
     }),
-    metaData: collection('#meta-data [data-test-tabular-row]', {}),
+    metadata: collection('#metadata [data-test-tabular-row]', {}),
   };
 }