ui: Reduce discovery-chain log errors (#8065)

* ui: Reduce discovery-chain log spam

Currently the only way that the UI can know whether connect is enabled
or not is whether we get 500 errors from certain endpoints.

One of these endpoints we already use, so aswell as recovering from a
500 error, we also remember that connect is disabled for the rest of the
page 'session' (so until the page is refreshed), and make no further
http requests to the endpoint for that specific datacenter.

This means that log spam is reduced to only 1 log per page refresh/dc
instead of 1 log per service navigation.

Longer term we'll need some way to dynamically discover whether connect
is enabled per datacenter without relying on something that will add
error logs to consul.

ui-v2/app/models/dc.js

@@ -12,4 +12,5 @@ export default Model.extend({
   // TODO: Are these required?
   Services: hasMany('service'),
   Nodes: hasMany('node'),
+  MeshEnabled: attr('boolean', { defaultValue: true }),
 });

ui-v2/app/routes/dc/services/show.js

@@ -30,23 +30,7 @@ export default Route.extend({
                 .catch(function() {
                   return null;
                 }),
-              chain: this.chainRepo.findBySlug(params.name, dc, nspace).catch(function(e) {
+              chain: this.chainRepo.findBySlug(params.name, dc, nspace),
-                const code = get(e, 'errors.firstObject.status');
-                // Currently we are specifically catching a 500, but we return null
-                // by default, so null for all errors.
-                // The extra code here is mainly for documentation purposes
-                // and for if we need to perform different actions based on the error code
-                // in the future
-                switch (code) {
-                  case '500':
-                    // connect is likely to be disabled
-                    // we just return a null to hide the tab
-                    // `Connect must be enabled in order to use this endpoint`
-                    return null;
-                  default:
-                    return null;
-                }
-              }),
               proxies: this.proxyRepo.findAllBySlug(params.name, dc, nspace),
               ...model,
             });

ui-v2/app/services/repository.js

@@ -39,6 +39,9 @@ export default Service.extend({
       });
     }
   },
+  peekOne: function(id) {
+    return this.store.peekRecord(this.getModelName(), id);
+  },
   findAllByDatacenter: function(dc, nspace, configuration = {}) {
     const query = {
       dc: dc,

ui-v2/app/services/repository/discovery-chain.js

@@ -1,8 +1,31 @@
+import { inject as service } from '@ember/service';
+import { get, set } from '@ember/object';
 import RepositoryService from 'consul-ui/services/repository';
 
 const modelName = 'discovery-chain';
+const ERROR_MESH_DISABLED = 'Connect must be enabled in order to use this endpoint';
 export default RepositoryService.extend({
+  dcs: service('repository/dc'),
   getModelName: function() {
     return modelName;
   },
+  findBySlug: function(slug, dc, nspace, configuration = {}) {
+    const datacenter = this.dcs.peekOne(dc);
+    if (datacenter !== null && !get(datacenter, 'MeshEnabled')) {
+      return Promise.resolve();
+    }
+    return this._super(...arguments).catch(e => {
+      const code = get(e, 'errors.firstObject.status');
+      const body = get(e, 'errors.firstObject.detail').trim();
+      switch (code) {
+        case '500':
+          if (datacenter !== null && body === ERROR_MESH_DISABLED) {
+            set(datacenter, 'MeshEnabled', false);
+          }
+          return;
+        default:
+          return;
+      }
+    });
+  },
 });

ui-v2/app/services/repository/type/event-source.js

@@ -36,8 +36,8 @@ const createProxy = function(repo, find, settings, cache, serialize = JSON.strin
         // original find... with configuration now added
         return repo[find](...args)
           .then(res => {
-            if (!configuration.settings.enabled) {
+            if (!configuration.settings.enabled || typeof res === 'undefined') {
-              // blocking isn't enabled, immediately close
+              // blocking isn't enabled, or we got no data, immediately close
               this.close();
             }
             return res;

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

@@ -31,7 +31,7 @@
 (if (not item.Service.Kind)
                 (hash label="Intentions" href=(href-to "dc.services.show.intentions") selected=(is-href "dc.services.show.intentions"))
 '')
-(if chain
+(if chain.Chain
                 (hash label="Routing" href=(href-to "dc.services.show.routing") selected=(is-href "dc.services.show.routing"))
 '')
 (if (not item.Service.Kind)

ui-v2/package.json

@@ -57,7 +57,7 @@
     "@glimmer/component": "^1.0.0",
     "@glimmer/tracking": "^1.0.0",
     "@hashicorp/consul-api-double": "^2.6.2",
-    "@hashicorp/ember-cli-api-double": "^3.0.2",
+    "@hashicorp/ember-cli-api-double": "^3.1.0",
     "@xstate/fsm": "^1.4.0",
     "babel-eslint": "^10.0.3",
     "base64-js": "^1.3.0",

ui-v2/tests/acceptance/dc/kvs/trailing-slash.feature

@@ -1,6 +1,6 @@
 @setupApplicationTest
 Feature: dc / kvs / trailing-slash
-  Scenario: I have 10 folders
+  Scenario: I have 10 folders and I visit without a trailing slash
     Given 1 datacenter model with the value "datacenter"
     And 10 kv models from yaml
     When I visit the kvs page for yaml
@@ -10,6 +10,9 @@ Feature: dc / kvs / trailing-slash
     ---
     Then the url should be /datacenter/kv/foo/bar/
     And a GET request was made to "/v1/kv/foo/bar/?keys&dc=datacenter&separator=%2F&ns=@namespace"
+  Scenario: I have 10 folders and I visit with a trailing slash
+    Given 1 datacenter model with the value "datacenter"
+    And 10 kv models from yaml
     When I visit the kvs page for yaml
     ---
       dc: datacenter

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

@@ -17,13 +17,20 @@ Feature: dc / services / show-routing: Show Routing for Service
     And the title should be "service-0 - Consul"
     And I see routing on the tabs
   Scenario: Given connect is disabled, the Routing tab should not display or error
-    Given 1 datacenter model with the value "dc1"
+    Given 2 datacenter models from yaml
+    ---
+      - dc1
+      - dc2
+    ---
     And 1 node models
-    And 1 service model from yaml
+    And 2 service model from yaml
     ---
     - Service:
         Name: service-0
         ID: service-0-with-id
+    - Service:
+        Name: service-1
+        ID: service-1-with-id
     ---
     And the url "/v1/discovery-chain/service-0?dc=dc1&ns=@namespace" responds with from yaml
     ---
@@ -37,4 +44,17 @@ Feature: dc / services / show-routing: Show Routing for Service
     ---
     And I don't see routing on the tabs
     And I don't see the "[data-test-error]" element
-
+    And I visit the service page for yaml
+    ---
+      dc: dc2
+      service: service-1
+    ---
+    And I see routing on the tabs
+    And I visit the service page for yaml
+    ---
+      dc: dc1
+      service: service-0
+    ---
+    Then a GET request wasn't made to "/v1/discovery-chain/service-0?dc=dc1&ns=@namespace"
+    And I don't see routing on the tabs
+    And I don't see the "[data-test-error]" element

ui-v2/tests/steps.js

@@ -21,9 +21,11 @@ import assertForm from './steps/assertions/form';
 const pluralize = function(str) {
   return Inflector.inflector.pluralize(str);
 };
-const getLastNthRequest = function(arr) {
+const getLastNthRequest = function(getRequests) {
   return function(n, method) {
-    let requests = arr.slice(0).reverse();
+    let requests = getRequests()
+      .slice(0)
+      .reverse();
     if (method) {
       requests = requests.filter(function(item) {
         return item.method === method;
@@ -82,7 +84,7 @@ export default function(assert, library) {
       })();
     });
   };
-  const lastNthRequest = getLastNthRequest(api.server.history);
+  const lastNthRequest = getLastNthRequest(() => api.server.history);
   const create = function(number, name, value) {
     // don't return a promise here as
     // I don't need it to wait
@@ -99,6 +101,7 @@ export default function(assert, library) {
     return currentPage;
   };
   const setCurrentPage = function(page) {
+    api.server.clearHistory();
     currentPage = page;
     return page;
   };

ui-v2/tests/steps/assertions/http.js

@@ -1,3 +1,4 @@
+const not = `(n't| not)?`;
 export default function(scenario, assert, lastNthRequest) {
   // lastNthRequest should return a
   // {
@@ -21,12 +22,17 @@ export default function(scenario, assert, lastNthRequest) {
       );
       assert.equal(diff.size, 0, `Expected requests "${[...diff].join(', ')}"`);
     })
-    .then('a $method request was made to "$endpoint"', function(method, url) {
+    .then(`a $method request was${not} made to "$endpoint"`, function(method, negative, url) {
+      const isNegative = typeof negative !== 'undefined';
       const requests = lastNthRequest(null, method);
-      const request = requests.find(function(item) {
+      const request = requests.some(function(item) {
         return method === item.method && url === item.url;
       });
+      if (isNegative) {
+        assert.notOk(request, `Didn't expect a ${method} request url to ${url}`);
+      } else {
         assert.ok(request, `Expected a ${method} request url to ${url}`);
+      }
     })
     .then('a $method request was made to "$endpoint" with no body', function(method, url) {
       const requests = lastNthRequest(null, method);

ui-v2/yarn.lock

@@ -1215,10 +1215,10 @@
   resolved "https://registry.yarnpkg.com/@hashicorp/consul-api-double/-/consul-api-double-2.15.2.tgz#e2c34a348b9959fcc95ffad797c1fed9644a41bd"
   integrity sha512-VNdwsL3ut4SubCtwWfqX4prD9R/RczKtWUID6s6K9h1TCdzTgpZQhbb+gdzaYGqzCE3Mrw416JzclxVTIFIUFw==
 
-"@hashicorp/ember-cli-api-double@^3.0.2":
+"@hashicorp/ember-cli-api-double@^3.1.0":
-  version "3.0.2"
+  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/@hashicorp/ember-cli-api-double/-/ember-cli-api-double-3.0.2.tgz#4f66f22e4b54293c46fe16dc24568267526c8acd"
+  resolved "https://registry.yarnpkg.com/@hashicorp/ember-cli-api-double/-/ember-cli-api-double-3.1.0.tgz#ce228ac5c8a46c7a10112f5bc0fb782c47775b60"
-  integrity sha512-NmcA+jBcBO8tzCfbqWzrQdHvTUeaj71Gdu9phxaULMtM9Zw7BZtHlvb2P1ivknGGw92w9Se50pDNjkB57ww22A==
+  integrity sha512-G8dDSewInFZOeD5sprdZPw7ZKUYlkJ9bJxPkEaMRPbC6ZN4ZHqeFWB1xXeq2ROtR07J6Xbs+BrFIE6GHTshpEg==
   dependencies:
     "@hashicorp/api-double" "^1.6.1"
     array-range "^1.0.1"