Display tab tooltips in tab-nav

ui/packages/consul-ui/app/components/tab-nav/index.hbs

@@ -1,17 +1,23 @@
-{{#let
-  (dom-position (set this 'style') offset=true)
-  "tab"
-as |select name|}}
+{{#let (dom-position (set this 'style') offset=true) 'tab' as |select name|}}
   <nav
-  style={{{if this.style (concat
-      '--selected-width:' this.style.width ';'
-      '--selected-left:' this.style.left ';'
-      '--selected-height:' this.style.height ';'
-      '--selected-top:' this.style.top
+    style={{{if
+      this.style
+      (concat
+        '--selected-width:'
+        this.style.width
+        ';'
+        '--selected-left:'
+        this.style.left
+        ';'
+        '--selected-height:'
+        this.style.height
+        ';'
+        '--selected-top:'
+        this.style.top
       )
       undefined
     }}}
-  aria-label="Secondary"
+    aria-label='Secondary'
     class={{concat 'tab-nav' ' animatable'}}
     ...attributes
   >
@@ -19,26 +25,23 @@ as |select name|}}
       {{#each @items as |item|}}
         <li
           {{on 'click' (fn select)}}
-    {{did-upsert
-      (if item.selected
-        (fn select)
-        (noop)
-      )
-      @items.length
-    }}
+          {{did-upsert (if item.selected (fn select) (noop)) @items.length}}
           data-test-tab={{concat name '_' (if item.label (slugify item.label) (slugify item))}}
-    class={{if (or item.selected (eq selected (if item.label (slugify item.label) (slugify item)))) 'selected'}}
+          class={{if
+            (or item.selected (eq selected (if item.label (slugify item.label) (slugify item))))
+            'selected'
+          }}
         >
           <Action
-      {{on 'click'
-          (fn this.onClick (uppercase item.label))
-      }}
-      {{on 'click'
-          (fn this.onTabClicked item)
-      }}
+            {{on 'click' (fn this.onClick (uppercase item.label))}}
+            {{on 'click' (fn this.onTabClicked item)}}
             @href={{item.href}}
           >
+            {{#if item.tooltip}}
+              <span {{tooltip item.tooltip}}>{{item.label}}</span>
+            {{else}}
               {{item.label}}
+            {{/if}}
           </Action>
         </li>
       {{/each}}