[EuiSearchBar] Handle 0 count after manual query manipulation

CHANGELOG.md

@@ -8,6 +8,10 @@
 - Added `markdownFormatProps` prop to `EuiMarkdownEditor` to extend the props passed to the rendered `EuiMarkdownFormat` ([#4663](https://github.com/elastic/eui/pull/4663))
 - Added optional virtualized line rendering to `EuiCodeBlock` ([#4952](https://github.com/elastic/eui/pull/4952))
 
+**Bug fixes**
+
+- Fixed filter count of 0 in `EuiSearchBar` ([#4977](https://github.com/elastic/eui/pull/4977))
+
 ## [`36.0.0`](https://github.com/elastic/eui/tree/v36.0.0)
 
 - Refactored `EuiFlyout` types ([#4940](https://github.com/elastic/eui/pull/4940))

src/components/search_bar/filters/__snapshots__/field_value_selection_filter.test.tsx.snap

@@ -6,10 +6,9 @@ exports[`FieldValueSelectionFilter active - field is global 1`] = `
   button={
     <EuiFilterButton
       grow={true}
-      hasActiveFilters={true}
+      hasActiveFilters={false}
       iconSide="right"
       iconType="arrowDown"
-      numActiveFilters={0}
       onClick={[Function]}
     >
       Tag

src/components/search_bar/filters/field_value_selection_filter.tsx

@@ -342,15 +342,16 @@ export class FieldValueSelectionFilter extends Component<
       ? this.state.options.all.some((item) => this.isActiveField(item.field))
       : false;
 
-    const active = activeTop || activeItem;
+    const activeItemsCount = this.state.activeItems.length;
+    const active = (activeTop || activeItem) && activeItemsCount > 0;
 
     const button = (
       <EuiFilterButton
         iconType="arrowDown"
         iconSide="right"
         onClick={this.onButtonClick.bind(this)}
         hasActiveFilters={active}
-        numActiveFilters={active ? this.state.activeItems.length : undefined}
+        numActiveFilters={active ? activeItemsCount : undefined}
         grow>
         {config.name}
       </EuiFilterButton>