Update ui to reflect config changes for kv. versioned -> version (#4310)

* update ui to reflect config changes for kv. versioned -> version
* options not config
* tweak version display in the ui

ui/app/adapters/secret.js

@@ -7,7 +7,7 @@ export default ApplicationAdapter.extend({
 
   headers: computed(function() {
     return {
-      'X-Vault-Kv-Client': 'v1',
+      'X-Vault-Kv-Client': 'v2',
     };
   }),
 

ui/app/controllers/vault/cluster/settings/mount-secret-backend.js

@@ -34,7 +34,7 @@ export default Ember.Controller.extend({
   showConfig: false,
   local: false,
   sealWrap: false,
-  versioned: true,
+  version: 2,
 
   selection: computed('selectedType', function() {
     return this.get('mountTypes').findBy('value', this.get('selectedType'));
@@ -54,7 +54,7 @@ export default Ember.Controller.extend({
       local: false,
       showConfig: false,
       sealWrap: false,
-      versioned: true,
+      version: 2,
     });
   },
 
@@ -86,7 +86,7 @@ export default Ember.Controller.extend({
         local,
         max_lease_ttl,
         sealWrap,
-        versioned,
+        version,
       } = this.getProperties(
         'selectedPath',
         'selectedType',
@@ -96,7 +96,7 @@ export default Ember.Controller.extend({
         'local',
         'max_lease_ttl',
         'sealWrap',
-        'versioned'
+        'version'
       );
       const currentModel = this.get('model');
       if (currentModel && currentModel.rollbackAttributes) {
@@ -118,9 +118,9 @@ export default Ember.Controller.extend({
         };
       }
 
-      if (type === 'kv' && versioned) {
+      if (type === 'kv') {
         attrs.options = {
-          versioned: 'true',
+          version,
         };
       }
 

ui/app/models/mount-options.js

@@ -2,5 +2,5 @@ import attr from 'ember-data/attr';
 import Fragment from 'ember-data-model-fragments/fragment';
 
 export default Fragment.extend({
-  versioned: attr('string'),
+  version: attr('number'),
 });

ui/app/models/secret-engine.js

@@ -20,7 +20,6 @@ export default DS.Model.extend({
   options: fragment('mount-options'),
   local: attr('boolean'),
   sealWrap: attr('boolean'),
-  isVersioned: computed.alias('options.versioned'),
 
   shouldIncludeInList: computed('type', function() {
     return !LIST_EXCLUDED_BACKENDS.includes(this.get('type'));

ui/app/routes/vault/cluster/secrets/backend.js

@@ -7,9 +7,9 @@ export default Ember.Route.extend({
     const { backend } = this.paramsFor(this.routeName);
     const backendModel = this.store.peekRecord('secret-engine', backend);
     const type = backendModel && backendModel.get('type');
-    if (type === 'kv' && backendModel.get('isVersioned')) {
+    if (type === 'kv' && backendModel.get('options.version') === 2) {
       this.get('flashMessages').stickyInfo(
-        `"${backend}" is a versioned kv secrets engine. The Vault UI does not currently support the additional versioning features. All actions taken through the UI in this engine will operate on the most recent version of a secret.`
+        `"${backend}" is a newer version of the KV backend. The Vault UI does not currently support the additional versioning features. All actions taken through the UI in this engine will operate on the most recent version of a secret.`
       );
     }
 

ui/app/templates/vault/cluster/secrets/backend/list.hbs

@@ -11,8 +11,12 @@
           {{backend}}
           <span class="tag is-outlined is-inverted has-text-grey-dark is-font-mono">
             {{or options.displayName (capitalize backendType)}}
-            {{#if backendModel.isVersioned}}(Versioned){{/if}}
           </span>
+          {{#if (eq backendModel.options.version 2)}}
+            <span class="has-text-grey-dark has-text-weight-normal is-size-6">
+              Version 2
+            </span>
+          {{/if}}
         </h1>
       </div>
       <div class="level-right field is-grouped">

ui/app/templates/vault/cluster/secrets/backends.hbs

@@ -37,12 +37,14 @@
                 {{backend.type}}: {{backend.config.plugin_name}}
               {{else}}
                 {{backend.type}}
-                {{#if backend.isVersioned}}
-                  (versioned)
-                {{/if}}
               {{/if}}
             </code>
           </span>
+          <code class="has-text-grey is-size-8">
+          {{#if (eq backend.options.version 2)}}
+            v2
+          {{/if}}
+          </code>
           <code class="has-text-grey is-size-8">
             {{backend.accessor}}
           </code>

ui/app/templates/vault/cluster/settings/mount-secret-backend.hbs

@@ -50,15 +50,28 @@
     </div>
     {{#if (eq selectedType "kv")}}
       <div class="field">
-        <div class="b-checkbox">
-          {{input type="checkbox" id="versioned" name="versioned" checked=versioned}}
-          <label for="versioned" class="is-label">
-            Versioned
-          </label>
-          <p class="help has-text-grey">
-            The KV Secrets engine can operate in versioned or non-versioned mode. <em>Non-versioned may be upgraded to versioned later, but the opposite is not true</em>.
-          </p>
+        <label for="version" class="is-label">
+          Version
+        </label>
+        <div class="control is-expanded">
+          <div class="select is-fullwidth">
+            <select
+               id="backend-type"
+               value={{selectedType}}
+               onchange={{action (mut version) value="target.value"}}
+              data-test-secret-backend-type=true
+            >
+              {{#each (array 1 2) as |versionOption|}}
+                <option selected={{eq version versionOption}} value={{versionOption}}>
+                Version {{versionOption}}
+                </option>
+              {{/each}}
+            </select>
+          </div>
         </div>
+        <p class="help has-text-grey">
+          The KV Secrets engine can operate in different modes. Version 1 is the original generic secrets engine the allows for storing of static key/value pairs. Version 2 added more features including data versioning, TTLs, and check and set.
+        </p>
       </div>
     {{/if}}
     <div class="field">