Fixed bug in datagrid where Hide fields columns were cached

CHANGELOG.md

@@ -10,13 +10,15 @@
 - Adjusted colors of color blind viz palette ([#2686](https://github.com/elastic/eui/pull/2686))
 - Converted `EuiSelect` to Typescript ([#2694](https://github.com/elastic/eui/pull/2694))
 - Added `aggregate`, `pageSelect`, `pagesSelect`, `securitySignal`, `securitySignalDetected`, `securitySignalResolved` and `timeline` icons ([#2704](https://github.com/elastic/eui/pull/2704))
+- Added `useDependentState` custom hook ([#2725](https://github.com/elastic/eui/pull/#2725))
 
 **Bug fixes**
 
 - Fixed `isExpanded` property of nodes from `EuiTreeView` ([#2700](https://github.com/elastic/eui/pull/#2700))
 - Added text selection to `EuiLink` button ([#2722](https://github.com/elastic/eui/pull/#2722))
 - Fixed bug in `EuiDataGrid` where resizing columns changed the active DOM element ([#2724](https://github.com/elastic/eui/pull/#2724))
 - Fixed position of scrollbar in `EuiCodeBlock` ([#2727](https://github.com/elastic/eui/pull/#2727))
+- Fixed bug in `EuiDataGrid` that prevented the "Hide fields" popover from showing an updated column list ([#2725](https://github.com/elastic/eui/pull/#2725))
 
 **Breaking changes**
 

src/components/datagrid/column_selector.tsx

@@ -27,13 +27,15 @@ import {
 } from '../drag_and_drop';
 import { DropResult } from 'react-beautiful-dnd';
 import { EuiIcon } from '../icon';
+import { useDependentState } from '../../services';
 
 export const useColumnSelector = (
   availableColumns: EuiDataGridColumn[],
   columnVisibility: EuiDataGridColumnVisibility
 ): [ReactElement, EuiDataGridColumn[]] => {
-  const [sortedColumns, setSortedColumns] = useState(() =>
-    availableColumns.map(({ id }) => id)
+  const [sortedColumns, setSortedColumns] = useDependentState(
+    () => availableColumns.map(({ id }) => id),
+    [availableColumns]
   );
 
   const { visibleColumns, setVisibleColumns } = columnVisibility;