fix(distribution): hide empty groups if all services are shown (#2873)

projectcaluma · Jan 15, 2025 · 33a12ba · 33a12ba
1 parent fa35505
commit 33a12ba
Show file tree

Hide file tree

Showing 2 changed files with 28 additions and 23 deletions.
diff --git a/packages/distribution/addon/components/cd-inquiry-new-form/group-type.hbs b/packages/distribution/addon/components/cd-inquiry-new-form/group-type.hbs
@@ -1,23 +1,25 @@
 {{! template-lint-disable require-presentational-children }}
-<tr
-  class="uk-background-muted uk-text-bold"
-  role="button"
-  {{on "click" (fn (mut this.isExpanded) (not this.isExpanded))}}
-  data-test-group-type={{@type.name}}
->
-  <td colspan="3" class="">
-    <div class="uk-flex uk-flex-between">
-      {{t @type.name}}
-      <UkIcon @icon={{if this.isExpanded "chevron-up" "chevron-down"}} />
-    </div>
-  </td>
-</tr>
-{{#if this.isExpanded}}
-  {{#each @type.groups as |group|}}
-    <CdInquiryNewForm::Group
-      @group={{group}}
-      @selectedGroups={{@selectedGroups}}
-      @updateSelectedGroups={{@updateSelectedGroups}}
-    />
-  {{/each}}
+{{#if @type.groups.length}}
+  <tr
+    class="uk-background-muted uk-text-bold"
+    role="button"
+    {{on "click" (fn (mut this.isExpanded) (not this.isExpanded))}}
+    data-test-group-type={{@type.name}}
+  >
+    <td colspan="3" class="">
+      <div class="uk-flex uk-flex-between">
+        {{t @type.name}}
+        <UkIcon @icon={{if this.isExpanded "chevron-up" "chevron-down"}} />
+      </div>
+    </td>
+  </tr>
+  {{#if this.isExpanded}}
+    {{#each @type.groups as |group|}}
+      <CdInquiryNewForm::Group
+        @group={{group}}
+        @selectedGroups={{@selectedGroups}}
+        @updateSelectedGroups={{@updateSelectedGroups}}
+      />
+    {{/each}}
+  {{/if}}
 {{/if}}
diff --git a/packages/distribution/tests/integration/components/cd-inquiry-new-form-test.js b/packages/distribution/tests/integration/components/cd-inquiry-new-form-test.js
@@ -33,6 +33,7 @@ module("Integration | Component | cd-inquiry-new-form", function (hooks) {
           },
           a: { label: "label-a" },
           b: { label: "label-b" },
+          c: { label: "label-c" },
         },
       },
     };
@@ -51,6 +52,7 @@ module("Integration | Component | cd-inquiry-new-form", function (hooks) {
           { id: 4, name: "4" },
           { id: 5, name: "5" },
         ],
+        c: [],
       };
 
       return Object.entries(records).reduce((retval, [type, recs]) => {
@@ -79,7 +81,7 @@ module("Integration | Component | cd-inquiry-new-form", function (hooks) {
       { owner: this.engine },
     );
 
-    assert.dom("button[data-test-type]").exists({ count: 2 });
+    assert.dom("button[data-test-type]").exists({ count: 3 });
     assert.dom("tr[data-test-group]").exists({ count: 2 });
 
     await click("button[data-test-type=b]");
@@ -232,10 +234,11 @@ module("Integration | Component | cd-inquiry-new-form", function (hooks) {
       assert.dom("[data-test-group-toggle-bar]").isNotVisible();
     });
 
-    test("it shows all the enabled groups", async function (assert) {
+    test("it shows all the enabled groups with content", async function (assert) {
       assert.dom('[data-test-group-type="suggestions"]').isNotVisible();
       assert.dom('[data-test-group-type="label-a"]').isVisible();
       assert.dom('[data-test-group-type="label-b"]').isVisible();
+      assert.dom('[data-test-group-type="label-c"]').doesNotExist();
     });
 
     test("it allows the toggling of a group", async function (assert) {