ui: Fixup KV folder creation then further creation within that folder (…

…#12081)

The fix here is two fold:

- We shouldn't be providing the DataSource (which loads the data) with an id when we are creating from within a folder (in the buggy code we are providing the parentKey of the new KV you are creating)
- Being able to provide an empty id to the DataSource/KV repository and that repository responding with a newly created object is more towards the "new way of doing forms", therefore the corresponding code to return a newly created ember-data object. As we changed the actual bug in point 1 here, we need to make sure the repository responds with an empty object when the request id is empty.

.changelog/12081.txt

@@ -0,0 +1,3 @@
+```release-note:bug
+ui: Fixed a bug with creating multiple nested KVs in one interaction
+```

ui/packages/consul-ui/app/components/consul/kv/form/index.hbs

@@ -18,7 +18,7 @@
         {{disabled (or disabld api.disabled)}}
       >
 {{#if api.isCreate}}
-        <label class="type-text{{if api.data.error.Key ' has-error'}}">
+        <label data-test-kv-key class="type-text{{if api.data.error.Key ' has-error'}}">
             <span>Key or folder</span>
             <input autofocus="autofocus" type="text" value={{left-trim api.data.Key parent}} name="additional" oninput={{action api.change}} placeholder="Key or folder" />
             <em>To create a folder, end a key with <code>/</code></em>

ui/packages/consul-ui/app/services/repository/kv.js

@@ -44,10 +44,19 @@ export default class KvService extends RepositoryService {
         });
       }
     } else {
-      item = await super.findBySlug(...arguments);
+      if (params.id === '') {
+        item = await this.create({
+          Datacenter: params.dc,
+          Namespace: params.ns,
+          Partition: params.partition,
+        });
+      } else {
+        item = await super.findBySlug(...arguments);
+      }
     }
-    // TODO: Whilst KV is using DataForm and DataForm does the model > changeset conversion
-    // a model > changeset conversion is not needed here
+    // TODO: Whilst KV is using DataForm and DataForm does the model >
+    // changeset conversion a model > changeset conversion is not needed here
+    // until we move KV to just use DataWriter like the other new stuff
     return item;
   }
 

ui/packages/consul-ui/app/templates/dc/kv/edit.hbs

@@ -16,7 +16,7 @@ as |parentKey|}}
         partition=route.params.partition
         nspace=route.params.nspace
         dc=route.params.dc
-        key=(if (string-ends-with routeName 'create') parentKey route.params.key)
+        key=(if (string-ends-with routeName 'create') '' route.params.key)
       )
     }}
   as |loader|>

ui/packages/consul-ui/tests/acceptance/dc/kvs/create.feature

@@ -49,3 +49,27 @@ Feature: dc / kvs / create
     And I click create
     And I see the text "New Key / Value" in "h1"
     And I see the text "key-value" in "[data-test-breadcrumbs] li:nth-child(2) a"
+    And I see the "[data-test-kv-key]" element
+  Scenario: Clicking create from within a just created folder
+    Given 1 datacenter model with the value "datacenter"
+    When I visit the kv page for yaml
+    ---
+      dc: datacenter
+    ---
+    Then the url should be /datacenter/kv/create
+    And the title should be "New Key / Value - Consul"
+    Then I fill in with yaml
+    ---
+      additional: key-value/
+    ---
+    Given 1 kv model from yaml
+    ---
+    - key-value/
+    ---
+    And I submit
+    Then the url should be /datacenter/kv
+    And I click "[data-test-kv]"
+    And I click "[data-test-create]"
+    And I see the text "New Key / Value" in "h1"
+    And I see the text "key-value" in "[data-test-breadcrumbs] li:nth-child(2) a"
+    And I see the "[data-test-kv-key]" element