From 7711d23240e42b24182c8274787fdd3d5d8f6625 Mon Sep 17 00:00:00 2001
From: vinny <vinny.inverso@gmail.com>
Date: Wed, 13 Nov 2024 11:47:10 -0500
Subject: [PATCH] HARMONY-1892: toggleLabelNavVisibility based on number of
 jobs selected

---
 .../workflow-ui/jobs/index.mustache.html      |  2 +-
 .../harmony/public/js/workflow-ui/labels.js   | 19 +++++++++++++++++++
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/services/harmony/app/views/workflow-ui/jobs/index.mustache.html b/services/harmony/app/views/workflow-ui/jobs/index.mustache.html
index 27f9ef3a7..c0dae40bb 100644
--- a/services/harmony/app/views/workflow-ui/jobs/index.mustache.html
+++ b/services/harmony/app/views/workflow-ui/jobs/index.mustache.html
@@ -42,7 +42,7 @@
                      {{^isAdminRoute}}
                      {{#jobs.length}}
                      {{#labels.length}}
-                    <li id="label-nav-item" class="nav-item dropstart">
+                    <li id="label-nav-item" class="nav-item dropstart d-none">
                         <a id="label-dropdown-a" class="nav-link dropdown-toggle py-0 px-2" data-bs-toggle="dropdown" data-bs-auto-close="outside" href="#" role="button" aria-expanded="false">label</a>
                         <ul class="dropdown-menu mt-2">
                             <li class="mx-2 mb-2">
diff --git a/services/harmony/public/js/workflow-ui/labels.js b/services/harmony/public/js/workflow-ui/labels.js
index 65ab2a2be..04fed5957 100644
--- a/services/harmony/public/js/workflow-ui/labels.js
+++ b/services/harmony/public/js/workflow-ui/labels.js
@@ -6,6 +6,7 @@ import PubSub from '../pub-sub.js';
 let bsDropdown;
 let labelLinks;
 let labelDropdown;
+let labelNavItem;
 
 /**
  * Responds to a submit link click event by adding or removing
@@ -158,6 +159,18 @@ function setLabelLinksEnabled(labelItemLinks) {
   }
 }
 
+/**
+ * Hide/show labels dropdown based on the number of jobs selected.
+ * @param {number} selectedJobsCount - count of selected jobs
+ */
+function toggleLabelNavVisibility(selectedJobsCount) {
+  if (selectedJobsCount === 0) {
+    labelNavItem.classList.add('d-none');
+  } else {
+    labelNavItem.classList.remove('d-none');
+  }
+}
+
 /**
  * Bind event handlers to their respective elements.
  */
@@ -201,10 +214,15 @@ export default {
     labelLinks = Array.from(document.querySelectorAll('#labels-list .label-li a'));
     // the dropdown that contains label list items
     labelDropdown = document.getElementById('label-dropdown-a');
+    labelNavItem = document.getElementById('label-nav-item');
     if (labelDropdown) {
       bsDropdown = new bootstrap.Dropdown(labelDropdown);
     }
     bindEventListeners();
+    PubSub.subscribe(
+      'job-selected',
+      () => this.toggleLabelNavVisibility(jobsTable.getJobIds().length),
+    );
   },
   promoteLabels,
   demoteLabels,
@@ -213,4 +231,5 @@ export default {
   setLabelLinksEnabled,
   filterLabelsList,
   showAllLabels,
+  toggleLabelNavVisibility,
 };