fix: disable filter accordion for no items (#5223)

canonical · Nov 24, 2023 · 0a1a355 · 0a1a355
1 parent ee016c4
commit 0a1a355
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 1 deletion.
diff --git a/src/app/base/components/FilterAccordion/FilterAccordion.test.tsx b/src/app/base/components/FilterAccordion/FilterAccordion.test.tsx
@@ -157,4 +157,23 @@ describe("FilterAccordion", () => {
       screen.queryByRole("tab", { name: filterNames.get("link_speeds") })
     ).not.toBeInTheDocument();
   });
+
+  it("is disabled if there are no items to display", async () => {
+    render(
+      <FilterAccordion
+        filterNames={filterNames}
+        filterOrder={filterOrder}
+        filterString=""
+        filtersToString={FilterMachines.filtersToString}
+        getCurrentFilters={FilterMachines.getCurrentFilters}
+        getValue={getValue}
+        isFilterActive={FilterMachines.isFilterActive}
+        items={[]}
+        onUpdateFilterString={() => null}
+        toggleFilter={FilterMachines.toggleFilter}
+      />
+    );
+
+    expect(screen.getByRole("button", { name: Labels.Toggle })).toBeDisabled();
+  });
 });
diff --git a/src/app/base/components/FilterAccordion/FilterAccordion.tsx b/src/app/base/components/FilterAccordion/FilterAccordion.tsx
@@ -196,7 +196,7 @@ const FilterAccordion = <I, PK extends keyof I>({
       hasToggleIcon
       position="left"
       toggleClassName="filter-accordion__toggle"
-      toggleDisabled={disabled}
+      toggleDisabled={disabled || items?.length === 0}
       toggleLabel={Labels.Toggle}
     >
       <Accordion