ui: Unix Domain Socket support (#10287)

This commit adds UI support for Unix Domain Sockets for upstream and downstreams (see #9981 and #10252)
hashicorp · May 26, 2021 · af72b9e · af72b9e
1 parent 2e4c9f5
commit af72b9e
Show file tree

Hide file tree

Showing 7 changed files with 97 additions and 19 deletions.
diff --git a/.changelog/10287.txt b/.changelog/10287.txt
@@ -0,0 +1,3 @@
+```release-note:feature
+ui: Add Unix Domain Socket support
+```
diff --git a/ui/packages/consul-ui/app/components/consul/service-instance/list/index.hbs b/ui/packages/consul-ui/app/components/consul/service-instance/list/index.hbs
@@ -62,6 +62,15 @@ as |item index|>
         {{/if}}
       </dd>
     </dl>
+{{else if item.Service.SocketPath}}
+    <dl class="socket" data-test-socket>
+      <dt {{tooltip}}>
+        Socket Path
+      </dt>
+      <dd>
+        {{item.Service.SocketPath}}
+      </dd>
+    </dl>
 {{/if}}
     <TagList @item={{item.Service}} />
   </BlockSlot>

diff --git a/ui/packages/consul-ui/app/components/consul/upstream-instance/list/index.hbs b/ui/packages/consul-ui/app/components/consul/upstream-instance/list/index.hbs
@@ -37,23 +37,53 @@
           </dd>
         </dl>
       {{/if}}
-      {{#if (gt item.LocalBindPort 0)}}
-{{#let (concat (or item.LocalBindAddress '127.0.0.1') ':' item.LocalBindPort) as |combinedAddress|}}
-        <dl class="local-bind-address">
-          <dt>
-            <span>
-              Address
-            </span>
-          </dt>
-          <dd>
-            <CopyButton
-              @value={{combinedAddress}}
-              @name="Address"
-            />
-              {{combinedAddress}}
-          </dd>
-        </dl>
+      {{#if item.LocalBindSocketPath}}
+{{#let (if item.LocalBindSocketMode
+          (hash
+            label=(concat '(Local bind mode)')
+            value=(concat '(Mode:' item.LocalBindSocketMode ')')
+          )
+          (hash
+            label=""
+            value=""
+          )
+        )
+as |mode|}}
+          <dl class="local-bind-socket">
+            <dt>
+              <span>
+                Local bind socket {{mode.label}}
+              </span>
+            </dt>
+            <dd>
+              <CopyButton
+                @value={{item.LocalBindSocketPath}}
+                @name="Socket path"
+              />
+              {{item.LocalBindSocketPath}}
+            </dd>
+          </dl>
 {{/let}}
+      {{else}}
+        {{#if (gt item.LocalBindPort 0)}}
+  {{#let (concat (or item.LocalBindAddress '127.0.0.1') ':' item.LocalBindPort) as |combinedAddress|}}
+          <dl class="local-bind-address">
+            <dt>
+              <span>
+                Address
+              </span>
+            </dt>
+            <dd>
+              <CopyButton
+                @value={{combinedAddress}}
+                @name="Address"
+              />
+                {{combinedAddress}}
+            </dd>
+          </dl>
+  {{/let}}
+        {{/if}}
+
       {{/if}}
       </div>
     </li>

diff --git a/ui/packages/consul-ui/app/models/service-instance.js b/ui/packages/consul-ui/app/models/service-instance.js
@@ -45,6 +45,7 @@ export default class ServiceInstance extends Model {
   // If the ID is blank fallback to the Service.Service (the Name)
   @or('Service.{ID,Service}') ID;
   @or('Service.Address', 'Node.Service') Address;
+  @attr('string') SocketPath;
 
   @alias('Service.Tags') Tags;
   @alias('Service.Meta') Meta;

diff --git a/ui/packages/consul-ui/app/styles/components/icon-definition.scss b/ui/packages/consul-ui/app/styles/components/icon-definition.scss
@@ -32,6 +32,9 @@
 %icon-definition.address dt::before {
   @extend %with-public-default-mask, %as-pseudo;
 }
+%icon-definition.socket dt::before {
+  @extend %with-port-mask, %as-pseudo;
+}
 %icon-definition.mesh dt::before {
   @extend %with-mesh-mask, %as-pseudo;
 }

diff --git a/ui/packages/consul-ui/mock-api/v1/catalog/connect/_ b/ui/packages/consul-ui/mock-api/v1/catalog/connect/_
@@ -36,6 +36,9 @@ ${typeof location.search.ns !== 'undefined' ? `
         "ServicePort": ${fake.random.number({min: 21000, max: 21255})},
         "ServiceEnableTagOverride": false,
         "ServiceProxy": {
+          "Config": {
+            "protocol": "http"
+          },
           "Expose": {
             "Checks": true,
             "Paths": [
@@ -50,15 +53,22 @@ ${range(env('CONSUL_EXPOSED_COUNT', 3)).map((i) => `
             ]
           },
           "Mode": "${fake.helpers.randomize(['', 'direct', 'transparent'])}",
+          "TransparentProxy": {},
           "DestinationServiceName": "${location.pathname.slice(4)}"
           ${ location.pathname.slice(4) === "service-0" ? `
           ,
           "DestinationServiceID": "${location.pathname.slice(4)}-with-id",
+${ fake.random.number({min: 1, max: 10}) > 2 ? `
           "LocalServiceAddress": "${fake.internet.ip()}",
           "LocalServicePort": ${fake.random.number({min: 0, max: 65535})}
+` : `
+          "LocalServiceSocketMode": "0600",
+          "LocalServiceSocketPath": "/${fake.lorem.words(fake.random.number({min: 1, max: 5})).split(' ').join('/')}${fake.random.boolean() ? fake.system.fileName() : ''}"
+` }
           `
           : ``}
         },
+        "ServiceSocketPath": "",
         "ServiceProxyDestination": "${location.pathname.slice(4)}",
         "ServiceWeights": {
           "Passing": 1,

diff --git a/ui/packages/consul-ui/mock-api/v1/health/service/_ b/ui/packages/consul-ui/mock-api/v1/health/service/_
@@ -18,7 +18,7 @@
         const proxy = service.indexOf('-proxy')
         const sidecar = service.indexOf('-sidecar-proxy')
         const id = (proxy !== -1 ? service.slice(0, -6) + '-with-id-proxy' : service + '-with-id');
-        let kind = ''; 
+        let kind = '';
         switch(true) {
           case service.endsWith('-mesh-gateway'):
             kind = 'mesh-gateway';
@@ -71,21 +71,38 @@ ${typeof location.search.ns !== 'undefined' ? `
                     )
                 }
             ],
+            "Weights": {
+              "Passing": 1,
+              "Warning": 1
+            },
 ${ fake.random.number({min: 1, max: 10}) > 2 ? `
             "Meta": {
               "consul-dashboard-url": "${fake.internet.protocol()}://${fake.internet.domainName()}/?id={{Service}}",
               "external-source": "${fake.helpers.randomize(['consul', 'nomad', 'terraform', 'kubernetes', 'aws', ''])}"
             },
-` : `` }
+` : `
+            "Meta": null,
+` }
+${ false ? `
             "Address":"${fake.internet.ip()}",
             "Port":${fake.random.number({min: 0, max: 65535})},
+` : `
+            "Address":"",
+            "SocketPath": "/${fake.lorem.words(fake.random.number({min: 1, max: 5})).split(' ').join('/')}${fake.random.boolean() ? fake.system.fileName() : ''}",
+` }
+            "Connect": {},
 ${kind !== '' ? `
             "Kind": "${kind}",
 ` : `` }
             "Proxy": {
 ${proxy !== -1 && sidecar === -1 ? `
               "DestinationServiceName": "${service.substr(0, proxy)}",
-` : ``}
+` : `
+              "Expose": {},
+              "MeshGateway": {},
+              "Mode": "",
+              "TransparentProxy": ""
+`}
 ${sidecar !== -1 ? `
               "DestinationServiceName": "${service.substr(0, sidecar)}",
               "DestinationServiceID": "${service.substr(0, sidecar)}-ID",
@@ -113,8 +130,13 @@ ${range(env('CONSUL_EXPOSED_COUNT', 3)).map((i) => `
                     "DestinationName": "${fake.hacker.noun()}",
                     "DestinationNamespace": "${fake.hacker.noun()}",
                     "DestinationType": "${fake.helpers.randomize(['service', 'prepared_query'])}",
+${ false ? `
                     "LocalBindAddress": "${fake.internet.ip()}",
                     "LocalBindPort": ${fake.random.number({min: 0, max: 65535})}
+` : `
+                    "LocalBindSocketMode": "0600",
+                    "LocalBindSocketPath": "/${fake.lorem.words(fake.random.number({min: 1, max: 5})).split(' ').join('/')}${fake.random.boolean() ? fake.system.fileName() : ''}"
+` }
                   }
   `)}
               ]