diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/analytics_list.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/analytics_list.tsx index 81494a43193dc..c4c7a8a4ca11a 100644 --- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/analytics_list.tsx +++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/analytics_list.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { FC, useState, useEffect } from 'react'; +import React, { FC, useCallback, useState, useEffect } from 'react'; import { i18n } from '@kbn/i18n'; @@ -119,11 +119,13 @@ export const DataFrameAnalyticsList: FC = ({ } }, [selectedIdFromUrlInitialized, analytics]); + const getAnalyticsCallback = useCallback(() => getAnalytics(true), []); + // Subscribe to the refresh observable to trigger reloading the analytics list. useRefreshAnalyticsList( { isLoading: setIsLoading, - onRefresh: () => getAnalytics(true), + onRefresh: getAnalyticsCallback, }, isManagementTable ); diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row_messages_pane.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row_messages_pane.tsx index 0dd9eba172e1c..942e335526d68 100644 --- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row_messages_pane.tsx +++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row_messages_pane.tsx @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import React, { FC, useState } from 'react'; +import React, { FC, useState, useEffect, useCallback } from 'react'; import { i18n } from '@kbn/i18n'; import { ml } from '../../../../../services/ml_api_service'; import { useRefreshAnalyticsList } from '../../../../common'; @@ -20,45 +20,34 @@ export const ExpandedRowMessagesPane: FC = ({ analyticsId }) => { const [isLoading, setIsLoading] = useState(false); const [errorMessage, setErrorMessage] = useState(''); - const getMessagesFactory = () => { - let concurrentLoads = 0; - return async function getMessages() { - try { - concurrentLoads++; - - if (concurrentLoads > 1) { - return; - } - - setIsLoading(true); - const messagesResp = await ml.dataFrameAnalytics.getAnalyticsAuditMessages(analyticsId); - setIsLoading(false); - setMessages(messagesResp); - - concurrentLoads--; - - if (concurrentLoads > 0) { - concurrentLoads = 0; - getMessages(); - } - } catch (error) { - setIsLoading(false); - setErrorMessage( - i18n.translate('xpack.ml.dfAnalyticsList.analyticsDetails.messagesPane.errorMessage', { - defaultMessage: 'Messages could not be loaded', - }) - ); - } - }; - }; - useRefreshAnalyticsList({ onRefresh: getMessagesFactory() }); + const getMessages = useCallback(async () => { + try { + setIsLoading(true); + const messagesResp = await ml.dataFrameAnalytics.getAnalyticsAuditMessages(analyticsId); + setIsLoading(false); + setMessages(messagesResp); + } catch (error) { + setIsLoading(false); + setErrorMessage( + i18n.translate('xpack.ml.dfAnalyticsList.analyticsDetails.messagesPane.errorMessage', { + defaultMessage: 'Messages could not be loaded', + }) + ); + } + }, []); + + useEffect(() => { + getMessages(); + }, []); + + useRefreshAnalyticsList({ onRefresh: getMessages }); return ( ); };