WIP: Add Stop functionality for Applications

openmetadata-ui/src/main/resources/ui/src/components/Modals/KillScheduleRun/KillScheduleRunModal.interface.ts

@@ -0,0 +1,20 @@
+/*
+ * Copyright 2022 Collate.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+export interface KillScheduleRunModalProps {
+ appName: string;
+ isModalOpen: boolean;
+ displayName: string;
+ onClose: () => void;
+ onKillWorkflowsUpdate?: () => void;
+}

openmetadata-ui/src/main/resources/ui/src/components/Modals/KillScheduleRun/KillScheduleRunModal.tsx

@@ -0,0 +1,76 @@
+/*
+ * Copyright 2022 Collate.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ * http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Modal, Typography } from 'antd';
+import { AxiosError } from 'axios';
+import React, { FC, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+import { killApp } from '../../../rest/applicationAPI';
+import { showErrorToast, showSuccessToast } from '../../../utils/ToastUtils';
+import { KillScheduleRunModalProps } from './KillScheduleRunModal.interface';
+
+const KillScheduleModal: FC<KillScheduleRunModalProps> = ({
+ appName,
+ isModalOpen,
+ displayName,
+ onClose,
+ onKillWorkflowsUpdate,
+}) => {
+ const { t } = useTranslation();
+ const [isLoading, setIsLoading] = useState<boolean>(false);
+
+ const handleConfirm = async () => {
+ setIsLoading(true);
+ try {
+ const { status } = await killApp(appName);
+ if (status === 200) {
+ showSuccessToast(
+ t('message.pipeline-killed-successfully', {
+ pipelineName: displayName,
+ })
+ );
+ onKillWorkflowsUpdate?.();
+ }
+ } catch (error) {
+ // catch block error is unknown type so we have to cast it to respective type
+ showErrorToast(error as AxiosError);
+ } finally {
+ onClose();
+ setIsLoading(false);
+ }
+ };
+
+ return (
+ <Modal
+ destroyOnClose
+ cancelText={t('label.cancel')}
+ closable={false}
+ confirmLoading={isLoading}
+ data-testid="kill-modal"
+ maskClosable={false}
+ okText={t('label.confirm')}
+ open={isModalOpen}
+ title={`${t('label.kill')} ${displayName} ?`}
+ onCancel={onClose}
+ onOk={handleConfirm}>
+ <Typography.Text data-testid="kill-modal-body">
+ {t('message.are-you-sure-action-property', {
+ action: 'Kill',
+ propertyName: displayName,
+ })}
+ </Typography.Text>
+ </Modal>
+ );
+};
+
+export default KillScheduleModal;

openmetadata-ui/src/main/resources/ui/src/components/Settings/Applications/AppRunsHistory/AppRunsHistory.component.tsx

@@ -55,6 +55,7 @@ import { PagingHandlerParams } from '../../../common/NextPrevious/NextPrevious.i
 import StatusBadge from '../../../common/StatusBadge/StatusBadge.component';
 import { StatusType } from '../../../common/StatusBadge/StatusBadge.interface';
 import Table from '../../../common/Table/Table';
+import KillScheduleModal from '../../../Modals/KillScheduleRun/KillScheduleRunModal';
 import AppLogsViewer from '../AppLogsViewer/AppLogsViewer.component';
 import {
  AppRunRecordWithId,
@@ -73,6 +74,7 @@ const AppRunsHistory = forwardRef(
  AppRunRecordWithId[]
  >([]);
  const [expandedRowKeys, setExpandedRowKeys] = useState<string[]>([]);
+ const [isKillModalOpen, setIsKillModalOpen] = useState<boolean>(false);
 
  const {
  currentPage,
@@ -127,29 +129,34 @@ const AppRunsHistory = forwardRef(
 
  const getActionButton = useCallback(
  (record: AppRunRecordWithId, index: number) => {
- if (appData?.appType === AppType.Internal) {
+ if (
+ appData?.appType === AppType.Internal ||
+ (isExternalApp && index === 0)
+ ) {
  return (
- <Button
- className="p-0"
- data-testid="logs"
- disabled={showLogAction(record)}
- size="small"
- type="link"
- onClick={() => handleRowExpandable(record.id)}>
- {t('label.log-plural')}
- </Button>
- );
- } else if (isExternalApp && index === 0) {
- return (
- <Button
- className="p-0"
- data-testid="logs"
- disabled={showLogAction(record)}
- size="small"
- type="link"
- onClick={() => handleRowExpandable(record.id)}>
- {t('label.log-plural')}
- </Button>
+ <>
+ <Button
+ className="p-0"
+ data-testid="logs"
+ disabled={showLogAction(record)}
+ size="small"
+ type="link"
+ onClick={() => handleRowExpandable(record.id)}>
+ {t('label.log-plural')}
+ </Button>
+ {/* For status running and supportsInterrupt is true, show kill button */}
+ {record.status === Status.Running &&
+ Boolean(appData?.supportsInterrupt) && (
+ <Button
+ className="m-l-xs p-0"
+ data-testid="kill-button"
+ size="small"
+ type="link"
+ onClick={() => setIsKillModalOpen(true)}>
+ {t('label.kill')}
+ </Button>
+ )}
+ </>
  );
  } else {
  return NO_DATA_PLACEHOLDER;
@@ -281,41 +288,56 @@ const AppRunsHistory = forwardRef(
  }, [fqn, pageSize]);
 
  return (
- <Row gutter={[16, 16]}>
- <Col span={24}>
- <Table
- bordered
- columns={tableColumn}
- data-testid="app-run-history-table"
- dataSource={appRunsHistoryData}
- expandable={{
- expandedRowRender: (record) => <AppLogsViewer data={record} />,
- showExpandColumn: false,
- rowExpandable: (record) => !showLogAction(record),
- expandedRowKeys,
+ <>
+ <Row gutter={[16, 16]}>
+ <Col span={24}>
+ <Table
+ bordered
+ columns={tableColumn}
+ data-testid="app-run-history-table"
+ dataSource={appRunsHistoryData}
+ expandable={{
+ expandedRowRender: (record) => <AppLogsViewer data={record} />,
+ showExpandColumn: false,
+ rowExpandable: (record) => !showLogAction(record),
+ expandedRowKeys,
+ }}
+ loading={isLoading}
+ locale={{
+ emptyText: <ErrorPlaceHolder className="m-y-md" />,
+ }}
+ pagination={false}
+ rowKey="id"
+ size="small"
+ />
+ </Col>
+ <Col span={24}>
+ {showPagination && paginationVisible && (
+ <NextPrevious
+ isNumberBased
+ currentPage={currentPage}
+ pageSize={pageSize}
+ paging={paging}
+ pagingHandler={handleAppHistoryPageChange}
+ onShowSizeChange={handlePageSizeChange}
+ />
+ )}
+ </Col>
+ </Row>
+ {isKillModalOpen && (
+ <KillScheduleModal
+ appName={fqn}
+ displayName={appData?.displayName ?? ''}
+ isModalOpen={isKillModalOpen}
+ onClose={() => {
+ setIsKillModalOpen(false);
  }}
- loading={isLoading}
- locale={{
- emptyText: <ErrorPlaceHolder className="m-y-md" />,
+ onKillWorkflowsUpdate={() => {
+ fetchAppHistory();
  }}
- pagination={false}
- rowKey="id"
- size="small"
  />
- </Col>
- <Col span={24}>
- {showPagination && paginationVisible && (
- <NextPrevious
- isNumberBased
- currentPage={currentPage}
- pageSize={pageSize}
- paging={paging}
- pagingHandler={handleAppHistoryPageChange}
- onShowSizeChange={handlePageSizeChange}
- />
- )}
- </Col>
- </Row>
+ )}
+ </>
  );
  }
 );

openmetadata-ui/src/main/resources/ui/src/rest/applicationAPI.ts

@@ -135,3 +135,7 @@ export const restoreApp = async (id: string) => {
 
  return response.data;
 };
+
+export const killApp = async (name: string) => {
+ return await APIClient.post(`${BASE_URL}/stop/${getEncodedFqn(name)}`);
+};