From c42d411cab9fde9d20fa0c7b6714a0b5aa98b5fc Mon Sep 17 00:00:00 2001
From: Alexander Polyankin <alexander.polyankin@metabase.com>
Date: Thu, 17 Oct 2024 09:52:50 -0400
Subject: [PATCH] Hide the toggle all checkbox when there are no search results
(#48817)
---
.../components/ListField/ListField.tsx | 20 ++++++++++---------
.../ListField/ListField.unit.spec.tsx | 13 ++++++++++++
2 files changed, 24 insertions(+), 9 deletions(-)
diff --git a/frontend/src/metabase/components/ListField/ListField.tsx b/frontend/src/metabase/components/ListField/ListField.tsx
index f7c6889af95..e691c3d3741 100644
--- a/frontend/src/metabase/components/ListField/ListField.tsx
+++ b/frontend/src/metabase/components/ListField/ListField.tsx
@@ -151,15 +151,17 @@ export const ListField = ({
)}
<OptionsList isDashboardFilter={isDashboardFilter}>
- <OptionContainer>
- <Checkbox
- variant="stacked"
- label={getToggleAllLabel(debouncedFilter, isAll)}
- checked={isAll}
- indeterminate={!isAll && !isNone}
- onChange={handleToggleAll}
- />
- </OptionContainer>
+ {filteredOptions.length > 0 && (
+ <OptionContainer>
+ <Checkbox
+ variant="stacked"
+ label={getToggleAllLabel(debouncedFilter, isAll)}
+ checked={isAll}
+ indeterminate={!isAll && !isNone}
+ onChange={handleToggleAll}
+ />
+ </OptionContainer>
+ )}
{filteredOptions.map((option, index) => (
<OptionContainer key={index}>
<Checkbox
diff --git a/frontend/src/metabase/components/ListField/ListField.unit.spec.tsx b/frontend/src/metabase/components/ListField/ListField.unit.spec.tsx
index cf27719dc4a..a756a8dc423 100644
--- a/frontend/src/metabase/components/ListField/ListField.unit.spec.tsx
+++ b/frontend/src/metabase/components/ListField/ListField.unit.spec.tsx
@@ -128,4 +128,17 @@ describe("ListField", () => {
expect(onChange).toHaveBeenCalledWith(["Doohickey", "Widget"]);
expect(screen.getByLabelText("Gadget")).not.toBeChecked();
});
+
+ it("should not show the toggle all checkbox when search results are empty", async () => {
+ setup({
+ value: [],
+ options: allOptions,
+ });
+ await userEvent.type(
+ screen.getByPlaceholderText("Search the list"),
+ "Invalid",
+ );
+ expect(screen.queryByLabelText("Select all")).not.toBeInTheDocument();
+ expect(screen.queryByLabelText("Select none")).not.toBeInTheDocument();
+ });
});
--
GitLab