Add filter count to filter button (#1367)

* Add filter count to filter button * Fix date filter bug
Enterprise-CMCS · Sep 26, 2023 · e2f579e · e2f579e
1 parent 10a227a
commit e2f579e
Showing 1 changed file with 6 additions and 1 deletion.
diff --git a/services/ui-src/src/components/SearchAndFilter.tsx b/services/ui-src/src/components/SearchAndFilter.tsx
@@ -487,6 +487,11 @@ function FilterPane<V extends {}>({
   setAllFilters,
 }: FilterPaneProps<V>) {
   const [showFilters, toggleShowFilters] = useToggle(false);
+  const { state: filterChips } = useFilterChipContext();
+  const filterCount = useMemo(
+    () => filterChips.filter((chipVal) => chipVal.label !== null).length,
+    [filterChips]
+  );
   const { dispatch: updateFilterChips } = useFilterChipContext();
   const onResetFilters = useCallback(() => {
     // Resets filter chips state to no chips showing
@@ -524,7 +529,7 @@ function FilterPane<V extends {}>({
 
   return (
     <>
-      <Button onClick={toggleShowFilters}>Filter</Button>
+      <Button onClick={toggleShowFilters}>Filter ({filterCount})</Button>
 
       {transitionFilterPane((style, showFilters) =>
         showFilters