Fix tagging listing integration test (#218431)

## Summary

close https://github.com/elastic/kibana/issues/211256
close https://github.com/elastic/kibana/issues/144057
close https://github.com/elastic/kibana/issues/195623
close https://github.com/elastic/kibana/issues/212262
close https://github.com/elastic/kibana/issues/211575
close https://github.com/elastic/kibana/issues/144058

src/platform/packages/shared/content-management/table_list_view_table/src/components/table.tsx

@@ -170,7 +170,6 @@ export function Table<T extends UserContentCommonSchema>({
 
   const {
     isPopoverOpen,
-    isInUse,
     closePopover,
     onFilterButtonClick,
     onSelectChange,
@@ -354,7 +353,6 @@ export function Table<T extends UserContentCommonSchema>({
     >
       <TagFilterContextProvider
         isPopoverOpen={isPopoverOpen}
-        isInUse={isInUse}
         closePopover={closePopover}
         onFilterButtonClick={onFilterButtonClick}
         onSelectChange={onSelectChange}

src/platform/packages/shared/content-management/table_list_view_table/src/components/tag_filter_panel.tsx

@@ -50,7 +50,6 @@ interface Context {
   clearTagSelection: () => void;
   closePopover: () => void;
   isPopoverOpen: boolean;
-  isInUse: boolean;
   options: TagOptionItem[];
   totalActiveFilters: number;
   onFilterButtonClick: () => void;
@@ -76,7 +75,6 @@ export const TagFilterPanel: FC<{}> = ({}) => {
     throw new Error('TagFilterPanel must be used within a TagFilterContextProvider');
   const {
     isPopoverOpen,
-    isInUse,
     options,
     totalActiveFilters,
     onFilterButtonClick,
@@ -140,7 +138,6 @@ export const TagFilterPanel: FC<{}> = ({}) => {
         panelPaddingSize="none"
         anchorPosition="downCenter"
         panelProps={{ css: { width: euiTheme.base * 18 } }}
-        panelStyle={isInUse ? { transition: 'none' } : undefined}
       >
         <EuiPopoverTitle paddingSize="m" css={popoverTitleCSS}>
           <EuiFlexGroup>

src/platform/packages/shared/content-management/table_list_view_table/src/components/use_tag_filter_panel.tsx

@@ -7,7 +7,7 @@
  * License v3.0 only", or the "Server Side Public License, v 1".
  */
 
-import React, { useEffect, useState, useCallback, useRef } from 'react';
+import React, { useEffect, useState, useCallback } from 'react';
 import type { MouseEvent } from 'react';
 import { Query, EuiFlexGroup, EuiFlexItem, EuiText, EuiHealth, EuiBadge } from '@elastic/eui';
 import type { FieldValueOptionType } from '@elastic/eui';
@@ -48,23 +48,12 @@ export const useTagFilterPanel = ({
   addOrRemoveIncludeTagFilter,
 }: Params) => {
   const [isPopoverOpen, setIsPopoverOpen] = useState(false);
-  // When the panel is "in use" it means that it is opened and the user is interacting with it.
-  // When the user clicks on a tag to select it, the component is unmounted and mounted immediately, which
-  // creates a new EUI transition "IN" which makes the UI "flicker". To avoid that we pass this
-  // "isInUse" state which disable the transition.
-  const [isInUse, setIsInUse] = useState(false);
   const [options, setOptions] = useState<TagOptionItem[]>([]);
   const [tagSelection, setTagSelection] = useState<TagSelection>({});
   const totalActiveFilters = Object.keys(tagSelection).length;
-  const onClickTime = useRef<number>(0);
 
   const onSelectChange = useCallback(
     (updatedOptions: TagOptionItem[]) => {
-      // onSelectChange() handler is to support keyboard navigation. When user clicks on a tag
-      // we call the onOptionClick() imperatively below and we don't need to do anything here.
-      const timeSinceOptionClick = Date.now() - onClickTime.current;
-      if (timeSinceOptionClick < 100) return;
-
       const diff = updatedOptions.find((item, index) => item.checked !== options[index].checked);
       if (diff) {
         addOrRemoveIncludeTagFilter(diff.tag);
@@ -75,8 +64,10 @@ export const useTagFilterPanel = ({
 
   const onOptionClick = useCallback(
     (tag: Tag) => (e: MouseEvent) => {
+      // Make sure we don't trigger the default behavior of the EuiSelectable and onSelectChange isn't called
+      e.stopPropagation();
+
       const withModifierKey = (isMac && e.metaKey) || (!isMac && e.ctrlKey);
-      onClickTime.current = Date.now();
 
       if (withModifierKey) {
         addOrRemoveExcludeTagFilter(tag);
@@ -174,20 +165,11 @@ export const useTagFilterPanel = ({
     if (isPopoverOpen) {
       // Refresh the tag list whenever we open the pop over
       updateTagList();
-
-      // To avoid "cutting" the inflight css transition when opening the popover
-      // we add a slight delay to switch the "isInUse" flag.
-      setTimeout(() => {
-        setIsInUse(true);
-      }, 250);
-    } else {
-      setIsInUse(false);
     }
   }, [isPopoverOpen, updateTagList]);
 
   return {
     isPopoverOpen,
-    isInUse,
     options,
     totalActiveFilters,
     onFilterButtonClick,

x-pack/test/saved_object_tagging/functional/tests/dashboard_integration.ts

@@ -17,8 +17,7 @@ export default function ({ getPageObjects, getService }: FtrProviderContext) {
   const dashboardSettings = getService('dashboardSettings');
   const PageObjects = getPageObjects(['dashboard', 'tagManagement', 'common']);
 
-  // Failing: See https://github.com/elastic/kibana/issues/144057
-  describe.skip('dashboard integration', () => {
+  describe('dashboard integration', () => {
     before(async () => {
       await kibanaServer.importExport.load(
         'x-pack/test/saved_object_tagging/common/fixtures/es_archiver/dashboard/data.json'