Enterprise version detection fix (#4547)

* fix version service parsing of .hsm in a version string

* remove race condition where the replication menu would show the enterprise upsell in an enterprise binary

* fix styling and layout of replication status menu

* move version check to beforeModel

ui/app/routes/vault/cluster.js

@@ -6,6 +6,7 @@ const POLL_INTERVAL_MS = 10000;
 const { inject } = Ember;
 
 export default Ember.Route.extend(ModelBoundaryRoute, ClusterRoute, {
+  version: inject.service(),
   store: inject.service(),
   auth: inject.service(),
   currentCluster: Ember.inject.service(),
@@ -21,7 +22,8 @@ export default Ember.Route.extend(ModelBoundaryRoute, ClusterRoute, {
     const params = this.paramsFor(this.routeName);
     const id = this.getClusterId(params);
     if (id) {
-      return this.get('auth').setCluster(id);
+      this.get('auth').setCluster(id);
+      return this.get('version').fetchFeatures();
     } else {
       return Ember.RSVP.reject({ httpStatus: 404, message: 'not found', path: params.cluster_name });
     }
@@ -29,7 +31,8 @@ export default Ember.Route.extend(ModelBoundaryRoute, ClusterRoute, {
 
   model(params) {
     const id = this.getClusterId(params);
-    return this.get('store').findRecord('cluster', id);
+
+      return this.get('store').findRecord('cluster', id);
   },
 
   stopPoll: Ember.on('deactivate', function() {

ui/app/services/version.js

@@ -24,7 +24,7 @@ export default Service.extend({
 
   hasSentinel: hasFeature('Sentinel'),
 
-  isEnterprise: computed.match('version', /\+\w+$/),
+  isEnterprise: computed.match('version', /\+.+$/),
 
   isOSS: computed.not('isEnterprise'),
 

ui/app/styles/components/status-menu.scss

@@ -91,9 +91,16 @@
     width: 100%;
     text-align: left;
 
+    .icon {
+      color: $menu-item-hover-background-color;
+    }
     &:hover {
       background-color: $menu-item-hover-background-color;
       color: $menu-item-hover-color;
+      .icon {
+        color: $menu-item-hover-color;
+      }
+
     }
 
     &.is-active {

ui/app/templates/partials/replication/replication-mode-summary-menu.hbs

@@ -1,38 +1,40 @@
-<div class="level-left is-flex-1">
-  <div>
-    {{#if (or replicationUnsupported (and (eq mode 'performance') (not version.hasPerfReplication)))}}
-      <p>
-         Upgrade to Vault Enterprise Premium to use Performance Replication.
-      </p>
-    {{else if replicationEnabled}}
-      <span>
-        {{capitalize modeForUrl}}
-      </span>
-      {{#if secondaryId}}
+<div class="level is-mobile">
+  <div class="level-left is-flex-1">
+    <div>
+      {{#if (or replicationUnsupported (and (eq mode 'performance') (not version.hasPerfReplication)))}}
+        <p>
+           Upgrade to Vault Enterprise Premium to use Performance Replication.
+        </p>
+      {{else if replicationEnabled}}
+        <span>
+          {{capitalize modeForUrl}}
+        </span>
+        {{#if secondaryId}}
+          <span class="tag is-light">
+            <code>
+              {{secondaryId}}
+            </code>
+          </span>
+        {{/if}}
         <span class="tag is-light">
           <code>
-            {{secondaryId}}
+            {{clusterIdDisplay}}
           </code>
         </span>
+      {{else}}
+        Enable
+      {{/if}}
+    </div>
+  </div>
+  <div class="level-right">
+    {{#if replicationEnabled}}
+      {{#if (get cluster (concat mode 'StateGlyph'))}}
+        {{i-con size=14 glyph=(get cluster (concat mode 'StateGlyph'))}}
+      {{else if syncProgress}}
+        <progress value="{{syncProgressPercent}}" max="100" class="progress is-small is-narrow is-info">
+          {{syncProgress.progress}} of {{syncProgress.total}} keys
+        </progress>
       {{/if}}
-      <span class="tag is-light">
-        <code>
-          {{clusterIdDisplay}}
-        </code>
-      </span>
-    {{else}}
-      Enable
     {{/if}}
   </div>
 </div>
-<div class="level-right">
-  {{#if replicationEnabled}}
-    {{#if (get cluster (concat mode 'StateGlyph'))}}
-      {{i-con size=14 glyph=(get cluster (concat mode 'StateGlyph')) class="has-text-info" aria-label=(concat mode 'StateDisplay')}}
-    {{else if syncProgress}}
-      <progress value="{{syncProgressPercent}}" max="100" class="progress is-small is-narrow is-info">
-        {{syncProgress.progress}} of {{syncProgress.total}} keys
-      </progress>
-    {{/if}}
-  {{/if}}
-</div>

ui/tests/unit/services/version-test.js

@@ -16,6 +16,13 @@ test('setting version computes isEnterprise properly', function(assert) {
   assert.equal(service.get('isEnterprise'), true);
 });
 
+test('setting version with hsm ending computes isEnterprise properly', function(assert) {
+  let service = this.subject();
+  service.set('version', '0.9.5+prem.hsm');
+  assert.equal(service.get('isOSS'), false);
+  assert.equal(service.get('isEnterprise'), true);
+});
+
 test('hasPerfReplication', function(assert) {
   let service = this.subject();
   assert.equal(service.get('hasPerfReplication'), false);