77 */
88
99import type { MutableRefObject } from 'react' ;
10- import React , { useCallback , useMemo , useRef } from 'react' ;
10+ import React , { useCallback , useMemo , useRef , useState , useEffect } from 'react' ;
1111import type { EuiDataGridRefProps } from '@elastic/eui' ;
12- import { EuiLoadingSpinner , type EuiDataGridColumnCellAction } from '@elastic/eui' ;
12+ import { type EuiDataGridColumnCellAction } from '@elastic/eui' ;
1313import type { FieldSpec } from '@kbn/data-views-plugin/common' ;
1414import type {
1515 CellAction ,
@@ -46,10 +46,6 @@ export type UseDataGridColumnsCellActions<
4646 P extends UseDataGridColumnsCellActionsProps = UseDataGridColumnsCellActionsProps
4747> = ( props : P ) => EuiDataGridColumnCellAction [ ] [ ] ;
4848
49- // static actions array references to prevent React updates
50- const loadingColumnActions : EuiDataGridColumnCellAction [ ] = [
51- ( ) => < EuiLoadingSpinner size = "s" data-test-subj = "dataGridColumnCellAction-loading" /> ,
52- ] ;
5349const emptyActions : EuiDataGridColumnCellAction [ ] [ ] = [ ] ;
5450
5551export const useDataGridColumnsCellActions : UseDataGridColumnsCellActions = ( {
@@ -60,6 +56,8 @@ export const useDataGridColumnsCellActions: UseDataGridColumnsCellActions = ({
6056 dataGridRef,
6157 disabledActionTypes = [ ] ,
6258} ) => {
59+ const [ cellActions , setCellActions ] = useState < EuiDataGridColumnCellAction [ ] [ ] > ( emptyActions ) ;
60+
6361 const bulkContexts : CellActionCompatibilityContext [ ] | undefined = useMemo ( ( ) => {
6462 if ( ! triggerId || ! fields ?. length ) {
6563 return undefined ;
@@ -75,35 +73,35 @@ export const useDataGridColumnsCellActions: UseDataGridColumnsCellActions = ({
7573 disabledActionTypes,
7674 } ) ;
7775
78- const columnsCellActions = useMemo < EuiDataGridColumnCellAction [ ] [ ] > ( ( ) => {
79- if ( loading ) {
80- return fields ?. length ? fields . map ( ( ) => loadingColumnActions ) : emptyActions ;
81- }
82- if ( ! triggerId || ! columnsActions ?. length || ! fields ?. length ) {
83- return emptyActions ;
76+ useEffect ( ( ) => {
77+ // no-op
78+ if ( loading || ! triggerId || ! columnsActions ?. length || ! fields ?. length ) {
79+ return ;
8480 }
8581
8682 // Check for a temporary inconsistency because `useBulkLoadActions` takes one render loop before setting `loading` to true.
8783 // It will eventually update to a consistent state
8884 if ( columnsActions . length !== fields . length ) {
89- return emptyActions ;
85+ return ;
9086 }
9187
92- return columnsActions . map ( ( actions , columnIndex ) =>
93- actions . map ( ( action ) =>
94- createColumnCellAction ( {
95- action,
96- field : fields [ columnIndex ] ,
97- getCellValue,
98- metadata,
99- triggerId,
100- dataGridRef,
101- } )
88+ setCellActions (
89+ columnsActions . map ( ( actions , columnIndex ) =>
90+ actions . map ( ( action ) =>
91+ createColumnCellAction ( {
92+ action,
93+ field : fields [ columnIndex ] ,
94+ getCellValue,
95+ metadata,
96+ triggerId,
97+ dataGridRef,
98+ } )
99+ )
102100 )
103101 ) ;
104102 } , [ columnsActions , fields , getCellValue , loading , metadata , triggerId , dataGridRef ] ) ;
105103
106- return columnsCellActions ;
104+ return cellActions ;
107105} ;
108106
109107interface CreateColumnCellActionParams
0 commit comments