ui: Adding partitions + icons to upstreams/upstream instances (#11556)

Adds a partition badge/label/visual to upstreams and upstream instances.

.changelog/11556.txt

@@ -0,0 +1,3 @@
+```release-note:improvement
+ui: Add upstream icons for upstreams and upstream instances
+```

ui/packages/consul-ui/app/components/consul/intention/list/table/index.hbs

@@ -24,6 +24,7 @@ as |item index|>
             {{else}}
               {{item.SourceName}}
             {{/if}}
+            {{#if (or (can 'use nspaces') (can 'use partitions'))}}
             {{! TODO: slugify }}
             <em>
               <span
@@ -32,6 +33,7 @@ as |item index|>
                 class={{concat 'nspace-' (or item.SourceNS 'default')}}
               >{{or item.SourceNS 'default'}}</span>
             </em>
+            {{/if}}
           </a>
         </td>
         <td class="intent intent-{{slugify item.Action}}" data-test-intention-action={{item.Action}}>
@@ -44,6 +46,7 @@ as |item index|>
             {{else}}
               {{item.DestinationName}}
             {{/if}}
+            {{#if (or (can 'use nspaces') (can 'use partitions'))}}
             {{! TODO: slugify }}
             <em>
               <span
@@ -52,6 +55,7 @@ as |item index|>
                 class={{concat 'nspace-' (or item.DestinationNS 'default')}}
               >{{or item.DestinationNS 'default'}}</span>
             </em>
+            {{/if}}
           </span>
         </td>
         <td class="permissions">

ui/packages/consul-ui/app/components/consul/upstream-instance/list/README.mdx

@@ -0,0 +1,39 @@
+# Consul::UpstreamInstance::List
+
+```hbs
+<DataSource
+  @src={{uri '/partition/default/dc-1/proxies/for-service/origin-service-slug'}}
+as |source|>
+  <Consul::UpstreamInstance::List
+    @items={{source.data}}
+    @dc={{'dc-1'}}
+    @nspace={{'nspace'}}
+    @partition={{'partition'}}
+  />
+</DataSource>
+```
+
+A presentational component for rendering Consul Upstream Instances. Upstreams
+instances are a Consul Service Instance that specifically has a relationship
+with an origin Service Instance.
+
+Currently you have to pass in the current dc, nspace and partition so that we
+can figure out whether to show things that aren't in same 'bucket' that you are
+currently in in the UI.
+
+## Arguments
+
+| Argument | Type | Default | Description |
+| --- | --- | --- | --- |
+| `items` | `array` |  | An array of Upstreams |
+| `dc` | `string` |  | The slug of the current dc |
+| `nspace` | `string` |  | The slug of the current nspace |
+| `partition` | `string` |  | The slug of the current partition |
+
+## See
+
+- [Possible
+  Occurances](/hashicorp/consul/search?q=%22Consul%3A%3AUpstreamInstance%3A%3AList%22)
+- [Template Source Code](./index.hbs)
+
+---

ui/packages/consul-ui/app/components/consul/upstream-instance/list/index.hbs

@@ -11,7 +11,21 @@
         </p>
       </div>
       <div class="detail">
-{{#if (env 'CONSUL_NSPACES_ENABLED')}}
+{{#if (can 'use partitions')}}
+  {{#if (not-eq item.DestinationType 'prepared_query')}}
+        <dl class="partition">
+          <dt
+            {{tooltip}}
+          >
+            Admin Partition
+          </dt>
+          <dd>
+            {{or item.DestinationPartition 'default'}}
+          </dd>
+        </dl>
+  {{/if}}
+{{/if}}
+{{#if (can 'use nspaces')}}
   {{#if (not-eq item.DestinationType 'prepared_query')}}
         <dl class="nspace">
           <dt

ui/packages/consul-ui/app/components/consul/upstream-instance/list/index.scss

@@ -8,6 +8,9 @@
   dl.datacenter dt::before {
     @extend %with-user-organization-mask, %as-pseudo;
   }
+  dl.partition dt::before {
+    @extend %with-user-team-mask, %as-pseudo;
+  }
   dl.nspace dt::before {
     @extend %with-folder-outline-mask, %as-pseudo;
   }

ui/packages/consul-ui/app/components/consul/upstream/list/README.mdx

@@ -0,0 +1,40 @@
+# Consul::Upstream::List
+
+```hbs
+<DataSource
+  @src={{uri '/partition/default/dc-1/gateways/for-service/origin-service-slug'}}
+as |source|>
+  <Consul::Upstream::List
+    @items={{source.data}}
+    @dc={{'dc-1'}}
+    @nspace={{'nspace'}}
+    @partition={{'partition'}}
+  />
+</DataSource>
+```
+
+A presentational component for rendering Consul Upstreams (not upstream
+instances). Upstreams are a Consul Service that is specifically have a
+relationship with an origin Service. The Upstream 'groups' are usually only used
+for showing relationships for gateways.
+
+Currently you have to pass in the current dc, nspace and partition so that we
+can figure out whether to show things that aren't in same 'bucket' that you are
+currently in in the UI.
+
+## Arguments
+
+| Argument | Type | Default | Description |
+| --- | --- | --- | --- |
+| `items` | `array` |  | An array of Upstreams |
+| `dc` | `string` |  | The slug of the current dc |
+| `nspace` | `string` |  | The slug of the current nspace |
+| `partition` | `string` |  | The slug of the current partition |
+
+## See
+
+- [Possible Occurances](/hashicorp/consul/search?q=%22Consul%3A%3AUpstream%3A%3AList%22)
+- [Component Source Code](./index.js)
+- [Template Source Code](./index.hbs)
+
+---

ui/packages/consul-ui/app/components/consul/upstream/list/index.hbs

@@ -24,6 +24,18 @@ as |item index|>
           {{/if}}
       </dd>
     </dl>
+{{#if (and (can 'use partitions') (not-eq item.Partition @partition))}}
+    <dl class="partition">
+      <dt
+        {{tooltip}}
+      >
+        Admin Partition
+      </dt>
+      <dd>
+        {{item.Partition}}
+      </dd>
+    </dl>
+{{/if}}
     <a
       data-test-service-name
       href={{if (and (can 'use nspaces') (not-eq item.Namespace @nspace))

ui/packages/consul-ui/app/components/consul/upstream/list/index.scss

@@ -0,0 +1,8 @@
+%consul-upstream-list {
+  dl.partition dt::before {
+    @extend %with-user-team-mask, %as-pseudo;
+  }
+}
+.consul-upstream-list {
+  @extend %consul-upstream-list;
+}

ui/packages/consul-ui/app/styles/components.scss

@@ -76,6 +76,7 @@
 @import 'consul-ui/components/consul/loader';
 @import 'consul-ui/components/consul/tomography/graph';
 @import 'consul-ui/components/consul/discovery-chain';
+@import 'consul-ui/components/consul/upstream/list';
 @import 'consul-ui/components/consul/upstream-instance/list';
 @import 'consul-ui/components/consul/health-check/list';
 @import 'consul-ui/components/consul/exposed-path/list';

ui/packages/consul-ui/app/templates/dc/services/instance/upstreams.hbs

@@ -74,6 +74,7 @@ as |route|>
             @items={{collection.items}}
             @dc={{dc}}
             @nspace={{nspace}}
+            @partition={{partition}}
           />
         </collection.Collection>
         <collection.Empty>