diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/index.ts b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/index.ts index 858b6c70501b..ce03305e3d85 100644 --- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/index.ts +++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/index.ts @@ -5,3 +5,5 @@ */ export { StopButton } from './stop_button'; +export { StopButtonModal } from './stop_button_modal'; +export { useForceStopAction } from './use_force_stop_action'; diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/stop_button_modal.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/stop_button_modal.tsx new file mode 100644 index 000000000000..387f42cc85ef --- /dev/null +++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/stop_button_modal.tsx @@ -0,0 +1,56 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import React, { FC } from 'react'; +import { i18n } from '@kbn/i18n'; +import { FormattedMessage } from '@kbn/i18n/react'; +import { EuiConfirmModal, EuiOverlayMask, EUI_MODAL_CONFIRM_BUTTON } from '@elastic/eui'; + +import { ForceStopAction } from './use_force_stop_action'; + +export const StopButtonModal: FC = ({ + closeModal, + item, + forceStopAndCloseModal, +}) => { + return ( + <> + {item !== undefined && ( + + +

+ +

+
+
+ )} + + ); +}; diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/use_force_stop_action.ts b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/use_force_stop_action.ts new file mode 100644 index 000000000000..5a4e74894873 --- /dev/null +++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/action_stop/use_force_stop_action.ts @@ -0,0 +1,38 @@ +/* + * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one + * or more contributor license agreements. Licensed under the Elastic License; + * you may not use this file except in compliance with the Elastic License. + */ + +import { useState } from 'react'; + +import { DataFrameAnalyticsListRow } from '../analytics_list/common'; +import { stopAnalytics } from '../../services/analytics_service'; + +export type ForceStopAction = ReturnType; +export const useForceStopAction = () => { + const [isModalVisible, setModalVisible] = useState(false); + + const [item, setItem] = useState(); + + const closeModal = () => setModalVisible(false); + const forceStopAndCloseModal = () => { + if (item !== undefined) { + setModalVisible(false); + stopAnalytics(item); + } + }; + + const openModal = (newItem: DataFrameAnalyticsListRow) => { + setItem(newItem); + setModalVisible(true); + }; + + return { + closeModal, + isModalVisible, + item, + openModal, + forceStopAndCloseModal, + }; +}; diff --git a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/use_actions.tsx b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/use_actions.tsx index 373b9991d4d3..d35533503908 100644 --- a/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/use_actions.tsx +++ b/x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/use_actions.tsx @@ -21,12 +21,13 @@ import { EditButtonFlyout, } from '../action_edit'; import { useStartAction, StartButton, StartButtonModal } from '../action_start'; -import { StopButton } from '../action_stop'; +import { StopButton, useForceStopAction, StopButtonModal } from '../action_stop'; import { getViewAction } from '../action_view'; import { isCompletedAnalyticsJob, isDataFrameAnalyticsRunning, + isDataFrameAnalyticsFailed, DataFrameAnalyticsListRow, } from './common'; @@ -53,11 +54,13 @@ export const useActions = ( const deleteAction = useDeleteAction(); const editAction = useEditAction(); const startAction = useStartAction(); + const stopAction = useForceStopAction(); /* eslint-disable react-hooks/rules-of-hooks */ modals = ( <> {startAction.isModalVisible && } + {stopAction.isModalVisible && } {deleteAction.isModalVisible && } {isEditActionFlyoutVisible(editAction) && } @@ -78,7 +81,10 @@ export const useActions = ( ...[ { render: (item: DataFrameAnalyticsListRow) => { - if (!isDataFrameAnalyticsRunning(item.stats.state)) { + if ( + !isDataFrameAnalyticsRunning(item.stats.state) && + !isDataFrameAnalyticsFailed(item.stats.state) + ) { return ( { if (canStartStopDataFrameAnalytics) { - stopAnalytics(item); + if (isDataFrameAnalyticsFailed(item.stats.state)) { + stopAction.openModal(item); + } else { + stopAnalytics(item); + } } }} />