ui: Move nspace CRUD to use the same approach as partitions (#11633)

This sounds a bit 'backwards' as the end goal here is to add an improved UX to partitions, not namespaces. The reason for doing it this way is that Namespaces already has a type of 'improved UX' CRUD in that it has one to many relationship in the form when saving your namespaces (the end goal for partitions). In moving Namespaces to use the same approach as partitions we:

- Ensure the new approach works with one-to-many forms.
- Test the new approach without writing a single test (we already have a bunch of tests for namespaces which are now testing the approach used by both namespaces and partitions)

Additionally:

- Fixes issue with missing default nspace in the nspace selector
- In doing when checking to see that things where consistent between the two, I found a few little minor problems with the Admin Partition CRUD so fixed those up here also.
- Removed the old style Nspace notifications

.circleci/config.yml

@@ -22,7 +22,7 @@ references:
     test-results: &TEST_RESULTS_DIR /tmp/test-results
 
   cache:
-    yarn: &YARN_CACHE_KEY consul-ui-v5-{{ checksum "ui/yarn.lock" }}
+    yarn: &YARN_CACHE_KEY consul-ui-v6-{{ checksum "ui/yarn.lock" }}
     rubygem: &RUBYGEM_CACHE_KEY static-site-gems-v1-{{ checksum "Gemfile.lock" }}
 
   environment: &ENVIRONMENT

ui/package.json

@@ -11,7 +11,7 @@
   "scripts": {
     "doc:toc": "doctoc README.md",
     "compliance": "npm-run-all compliance:*",
-    "compliance:licenses": "license-checker --summary --onlyAllow 'Python-2.0;Apache*;Apache License, Version 2.0;Apache-2.0;Apache 2.0;Artistic-2.0;BSD;BSD-3-Clause;CC-BY-3.0;CC-BY-4.0;CC0-1.0;ISC;MIT;MPL-2.0;Public Domain;Unicode-TOU;Unlicense;WTFPL' --excludePackages '[email protected];[email protected];[email protected]'"
+    "compliance:licenses": "license-checker --summary --onlyAllow 'Python-2.0;Apache*;Apache License, Version 2.0;Apache-2.0;Apache 2.0;Artistic-2.0;BSD;BSD-3-Clause;CC-BY-3.0;CC-BY-4.0;CC0-1.0;ISC;MIT;MPL-2.0;Public Domain;Unicode-TOU;Unlicense;WTFPL' --excludePackages '[email protected];[email protected];[email protected];[email protected]'"
 
   },
   "devDependencies": {

ui/packages/consul-nspaces/app/components/consul/nspace/form/README.mdx

@@ -0,0 +1,24 @@
+# Consul::Nspace::Form
+
+```hbs preview-template
+<DataLoader @src={{
+  uri '/${partition}/${nspace}/${dc}/namespace/${id}'
+    (hash
+      partition='partition'
+      nspace='nspace'
+      dc='dc'
+      id=''
+    )
+  }}
+as |loader|>
+  <BlockSlot @name="loaded">
+    <Consul::Nspace::Form
+      @item={{loader.data}}
+      @dc={{'dc-1'}}
+      @nspace={{'nspace'}}
+      @partition={{'partition'}}
+      @onsubmit={{noop}}
+    />
+  </BlockSlot>
+</DataLoader>
+```

ui/packages/consul-nspaces/app/components/consul/nspace/form/index.hbs

@@ -0,0 +1,169 @@
+<div
+  class="consul-nspace-form"
+  ...attributes
+>
+    <DataWriter
+      @sink={{uri
+        '/${partition}/${nspace}/${dc}/nspace'
+        (hash
+          partition=''
+          nspace=''
+          dc=@item.Datacenter
+        )
+      }}
+      @type={{'nspace'}}
+      @label={{"Namespace"}}
+      @ondelete={{fn (if @ondelete @ondelete @onsubmit) @item}}
+      @onchange={{fn (optional @onsubmit) @item}}
+      as |writer|>
+        <BlockSlot @name="removed" as |after|>
+          <Consul::Nspace::Notifications 
+            {{notification
+              after=(action after)
+            }}
+            @type="remove"
+          />
+        </BlockSlot>
+
+    <BlockSlot @name="content">
+
+{{#let 
+
+  (not (can "write nspaces"))
+
+  @item
+
+  (hash
+    help='Must be a valid DNS hostname. Must contain 1-64 characters (numbers, letters, and hyphens), and must begin with a letter. Once created, this cannot be changed.'
+    Name=(array
+      (hash
+        test='^[a-zA-Z0-9]([a-zA-Z0-9-]{0,62}[a-zA-Z0-9])?$'
+        error='Name must be a valid DNS hostname.'
+      )
+    )
+  )
+
+  (hash
+    Description=(array)
+  )
+
+as |readOnly item Name Description|}}
+<form
+  {{on 'submit' (fn writer.persist item)}}
+  {{disabled readOnly}}
+>
+
+<StateChart 
+  @src={{state-chart 'validate'}}
+as |State Guard ChartAction dispatch state|>
+
+  <fieldset>
+{{#if (is "new nspace" item=item)}}
+    <TextInput
+      @name="Name"
+      @placeholder="Name"
+      @item={{item}}
+      @validations={{Name}}
+      @chart={{hash
+        state=state
+        dispatch=dispatch
+      }}
+    />
+{{/if}}
+    <TextInput
+      @expanded={{true}}
+      @name="Description"
+      @label="Description (Optional)"
+      @item={{item}}
+      @validations={{Description}}
+      @chart={{hash
+        state=state
+        dispatch=dispatch
+      }}
+    />
+  </fieldset>
+{{#if (can 'use acls')}}
+  <fieldset id="roles">
+    <h2>Roles</h2>
+    <p>
+{{#if (can "write nspace" item=item)}}
+      By adding roles to this namespaces, you will apply them to all tokens created within this namespace.
+{{else}}
+      The following roles are applied to all tokens created within this namespace.
+{{/if}}
+    </p>
+    <RoleSelector
+      @dc={{@dc}}
+      @nspace="default"
+      @partition={{@partition}}
+      @disabled={{readOnly}}
+      @items={{item.ACLs.RoleDefaults}}
+    />
+  </fieldset>
+  <fieldset id="policies">
+    <h2>Policies</h2>
+    <p>
+{{#if (not readOnly)}}
+      By adding policies to this namespace, you will apply them to all tokens created within this namespace.
+{{else}}
+      The following policies are applied to all tokens created within this namespace.
+{{/if}}
+    </p>
+    <PolicySelector
+      @dc={{@dc}}
+      @nspace="default"
+      @partition={{@partition}}
+      @disabled={{readOnly}}
+      @allowIdentity={{false}}
+      @items={{item.ACLs.PolicyDefaults}}
+    />
+  </fieldset>
+{{/if}}
+  <div>
+{{#if (and (is "new nspace" item=item) (can "create nspaces"))}}
+      <Action
+        @type="submit"
+        {{disabled (or (is "pristine nspace" item=item) (state-matches state "error"))}}
+      >
+        Save
+      </Action>
+{{else if (can "write nspace" item=item)}}
+      <Action @type="submit">Save</Action>
+{{/if}}
+
+      <Action
+        @type="reset"
+        {{on 'click' (if @oncancel (fn @oncancel item) (fn @onsubmit item))}}
+      >
+        Cancel
+      </Action>
+
+{{#if (and (not (is "new nspace" item=item)) (can "delete nspace" item=item))}}
+      <ConfirmationDialog @message="Are you sure you want to delete this Namespace?">
+        <BlockSlot @name="action" as |confirm|>
+          <Action
+            data-test-delete
+            class="type-delete"
+            {{on 'click' (fn confirm (fn writer.delete item))}}
+          >
+            Delete
+          </Action>
+        </BlockSlot>
+        <BlockSlot @name="dialog" as |execute cancel message|>
+          <DeleteConfirmation
+            @message={{message}}
+            @execute={{execute}}
+            @cancel={{cancel}}
+          />
+        </BlockSlot>
+      </ConfirmationDialog>
+{{/if}}
+
+  </div>
+</StateChart>
+</form>
+{{/let}}
+  </BlockSlot>
+</DataWriter>
+</div>
+

ui/packages/consul-ui/app/components/consul/nspace/list/README.mdx → ui/packages/consul-nspaces/app/components/consul/nspace/list/README.mdx

@@ -1,29 +1,30 @@
----
-class: ember
----
-## Consul::Nspace::List
+# Consul::Nspace::List
+
+A presentational component for rendering Consul Namespaces
 
-```hbs
-<DataSource @src="/partition/default/dc-1/namespaces" as |source|>
+Please note: 
+
+- For the moment, make sure you have enabled nspaces using developer debug
+  cookies.
+
+```hbs preview-template
+<DataSource @src={{uri '/partition/default/dc-1/namespaces'}} as |source|>
   <Consul::Nspace::List
     @items={{source.data}}
-    @ondelete={{action (noop)}}
+    @ondelete={{noop}}
   />
 </DataSource>
 ```
 
-A presentational component for rendering Consul Namespaces
-
-### Arguments
+## Arguments
 
 | Argument/Attribute | Type | Default | Description |
 | --- | --- | --- | --- |
 | `items` | `array` |  | An array of Namespaces |
 | `ondelete` | `function` |  | An action to execute when the `Delete` action is clicked |
 
-### See
+## See
 
-- [Component Source Code](./index.js)
 - [Template Source Code](./index.hbs)
 
 ---

ui/packages/consul-nspaces/app/components/consul/nspace/notifications/README.mdx

@@ -0,0 +1,19 @@
+# Consul::Nspace::Notifications
+
+A Notification component specifically for namespaces. This is only a component as we currently use this in two places and if we need to add more types we can do so in one place.
+
+We currently only have one 'remove' type due to the fact that namespaces can't use the default 'delete' notification as they get 'marked for deletion' instead.
+
+```hbs preview-template
+  <Consul::Nspace::Notifications
+    @type={{'remove'}}
+  />
+```
+
+
+
+## See
+
+- [Template Source Code](./index.hbs)
+
+---

ui/packages/consul-nspaces/app/components/consul/nspace/notifications/index.hbs

@@ -0,0 +1,16 @@
+{{#if (eq @type 'remove')}}
+  <Notice
+    class="notification-delete"
+    @type="success"
+    ...attributes
+  as |notice|>
+    <notice.Header>
+      <strong>Success!</strong>
+    </notice.Header>
+    <notice.Body>
+      <p>
+        Your Namespace has been marked for deletion.
+      </p>
+    </notice.Body>
+  </Notice>
+{{/if}}

ui/packages/consul-nspaces/app/components/consul/nspace/search-bar/README.mdx

@@ -0,0 +1,30 @@
+# Consul::Nspace::SearchBar
+
+Searchbar tailored for searching namespaces. Follows our more generic
+'*::SearchBar' component interface.
+
+```hbs preview-template
+  <Consul::Nspace::SearchBar
+    @search={{this.search}}
+    @onsearch={{fn (mut this.search) value="target.value"}}
+
+    @sort={{hash 
+      value='Name:asc'
+      change=(noop)
+    }}
+
+    @filter={{hash
+      searchproperty=(hash
+        value=(array)
+        change=(noop)
+        default=(array)
+      )
+    }}
+  />
+```
+
+## See
+
+- [Template Source Code](./index.hbs)
+
+---

ui/packages/consul-nspaces/app/components/consul/nspace/selector/README.mdx

@@ -0,0 +1,40 @@
+# Consul::Nspace::Selector
+
+A conditional, autoloading, menu component specifically for making it easy to select namespaces.
+
+Please note: 
+
+- Currently at least, you must add this inside of a `<ul>` element, as the `<li>` elements output by this component are intended to be mixed with other sibling `<li>`s from other components or template code.
+- For the moment, make sure you have enabled nspaces using developer debug
+  cookies.
+
+```hbs preview-template
+<ul>
+  <Consul::Nspace::Selector
+    @dc={{hash
+      Name='dc-1'
+    }}
+    @nspace='default'
+    @partition='default'
+    @nspaces={{or this.nspaces (array)}}
+    @onchange={{action (mut this.nspaces) value="data"}}
+  />
+</ul>
+```
+
+
+## Arguments
+
+| Argument/Attribute | Type | Default | Description |
+| --- | --- | --- | --- |
+| `dc` | `object` |  | The current datacenter |
+| `nspace` | `string` |  | The name of the current namespace |
+| `partition` | `string` |  | The name of the current partition |
+| `nspaces` | `array` |  | A list of nspace models/objects to use for the selector |
+| `onchange` | `function` |  | An event handler, for when nspaces are loaded. You probably want to update `@nspaces` using this. |
+
+## See
+
+- [Template Source Code](./index.hbs)
+
+---