ui: Alter position of logic for showing the Round Trip Time tab to pr…

…event DOM refresh (#7377)

* ui: Move tomography length check inside of the partial

Previously we checked the length of tomography.distances to decide
whether to show the RTT tab or not. Previous to our ember upgrade this
would not cause a DOM reload of so many elements (i.e. all of the tab
content). Since our ember upgrade, any change to tomography (so not
necessarily the length of distances) seems to fire a change to the length (even if
the length remains the same). The knock on effect of this is that the
array of tab panels seems to be recalculated (but remain the same) and
all of the tab panels are completely re-rendered, causing the scroll of
the page to be reset.

This commit moves the check for tomography.distance.length to the lower
down with the loop, which means the array of tab panels always remains
the same, which consequently means that the entire array of tab panels
is never re-rendered entirely, and therefore fixes the issue.

ui-v2/app/templates/dc/nodes/-rtt.hbs

@@ -3,19 +3,19 @@
         Minimum
     </dt>
     <dd>
-        {{ format-number tomography.min maximumFractionDigits=2}}ms
+        {{format-number tomography.min maximumFractionDigits=2}}ms
     </dd>
     <dt>
         Median
     </dt>
     <dd>
-        {{ format-number tomography.median maximumFractionDigits=2}}ms
+        {{format-number tomography.median maximumFractionDigits=2}}ms
     </dd>
     <dt>
         Maximum
     </dt>
     <dd>
-        {{ format-number tomography.max maximumFractionDigits=2}}ms
+        {{format-number tomography.max maximumFractionDigits=2}}ms
     </dd>
 </dl>
 {{tomography-graph tomography=tomography}}

ui-v2/app/templates/dc/nodes/show.hbs

@@ -48,19 +48,19 @@
     {{/block-slot}}
     {{#block-slot name='content'}}
         {{#each
-            (compact
-                (array
-                            (hash id=(slugify 'Health Checks') partial='dc/nodes/healthchecks')
-                            (hash id=(slugify 'Services') partial='dc/nodes/services')
-   (if tomography.distances (hash id=(slugify 'Round Trip Time') partial='dc/nodes/rtt') '')
-                            (hash id=(slugify 'Lock Sessions') partial='dc/nodes/sessions')
-                            (hash id=(slugify 'Meta Data') partial='dc/nodes/metadata')
-                )
+            (array
+              (hash id=(slugify 'Health Checks') partial='dc/nodes/healthchecks')
+              (hash id=(slugify 'Services') partial='dc/nodes/services')
+              (hash id=(slugify 'Round Trip Time') partial='dc/nodes/rtt')
+              (hash id=(slugify 'Lock Sessions') partial='dc/nodes/sessions')
+              (hash id=(slugify 'Meta Data') partial='dc/nodes/metadata')
             ) as |panel|
         }}
+    {{#if (or (not-eq panel.id 'round-trip-time') (gt tomography.distances.length 0)) }}
             {{#tab-section id=panel.id selected=(eq (if selectedTab selectedTab '') panel.id) onchange=(action "change")}}
                 {{partial panel.partial}}
             {{/tab-section}}
+    {{/if}}
         {{/each}}
     {{/block-slot}}
 {{/app-view}}