-
Notifications
You must be signed in to change notification settings - Fork 8.3k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* [ML] Space management UI * fixing types * small react refactor * adding repair toasts * text and style changes * handling spaces being disabled * correcting initalizing endpoint response * text updates * text updates * fixing spaces manager use when spaces is disabled * more text updates * switching to delete saved object first rather than overwrite * filtering non ml spaces * renaming file * fixing types * updating list style Co-authored-by: Kibana Machine <[email protected]>
- Loading branch information
1 parent
441b473
commit 78d7bfd
Showing
30 changed files
with
1,096 additions
and
121 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
7 changes: 7 additions & 0 deletions
7
x-pack/plugins/ml/public/application/components/job_spaces_repair/index.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| /* | ||
| * 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. | ||
| */ | ||
|
|
||
| export { JobSpacesRepairFlyout } from './job_spaces_repair_flyout'; |
161 changes: 161 additions & 0 deletions
161
...k/plugins/ml/public/application/components/job_spaces_repair/job_spaces_repair_flyout.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,161 @@ | ||
| /* | ||
| * 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, useState, useEffect } from 'react'; | ||
| import { i18n } from '@kbn/i18n'; | ||
| import { FormattedMessage } from '@kbn/i18n/react'; | ||
| import { | ||
| EuiFlyout, | ||
| EuiFlyoutHeader, | ||
| EuiFlyoutFooter, | ||
| EuiFlexGroup, | ||
| EuiFlexItem, | ||
| EuiButton, | ||
| EuiButtonEmpty, | ||
| EuiTitle, | ||
| EuiFlyoutBody, | ||
| EuiText, | ||
| EuiCallOut, | ||
| EuiSpacer, | ||
| } from '@elastic/eui'; | ||
|
|
||
| import { ml } from '../../services/ml_api_service'; | ||
| import { | ||
| RepairSavedObjectResponse, | ||
| SavedObjectResult, | ||
| } from '../../../../common/types/saved_objects'; | ||
| import { RepairList } from './repair_list'; | ||
| import { useToastNotificationService } from '../../services/toast_notification_service'; | ||
|
|
||
| interface Props { | ||
| onClose: () => void; | ||
| } | ||
| export const JobSpacesRepairFlyout: FC<Props> = ({ onClose }) => { | ||
| const { displayErrorToast, displaySuccessToast } = useToastNotificationService(); | ||
| const [loading, setLoading] = useState(false); | ||
| const [repairable, setRepairable] = useState(false); | ||
| const [repairResp, setRepairResp] = useState<RepairSavedObjectResponse | null>(null); | ||
|
|
||
| async function loadRepairList(simulate: boolean = true) { | ||
| setLoading(true); | ||
| try { | ||
| const resp = await ml.savedObjects.repairSavedObjects(simulate); | ||
| setRepairResp(resp); | ||
|
|
||
| const count = Object.values(resp).reduce((acc, cur) => acc + Object.keys(cur).length, 0); | ||
| setRepairable(count > 0); | ||
| setLoading(false); | ||
| return resp; | ||
| } catch (error) { | ||
| // this shouldn't be hit as errors are returned per-repair task | ||
| // as part of the response | ||
| displayErrorToast(error); | ||
| setLoading(false); | ||
| } | ||
| return null; | ||
| } | ||
|
|
||
| useEffect(() => { | ||
| loadRepairList(); | ||
| }, []); | ||
|
|
||
| async function repair() { | ||
| if (repairable) { | ||
| // perform the repair | ||
| const resp = await loadRepairList(false); | ||
| // check simulate the repair again to check that all | ||
| // items have been repaired. | ||
| await loadRepairList(true); | ||
|
|
||
| if (resp === null) { | ||
| return; | ||
| } | ||
| const { successCount, errorCount } = getResponseCounts(resp); | ||
| if (errorCount > 0) { | ||
| const title = i18n.translate('xpack.ml.management.repairSavedObjectsFlyout.repair.error', { | ||
| defaultMessage: 'Some jobs cannot be repaired.', | ||
| }); | ||
| displayErrorToast(resp as any, title); | ||
| return; | ||
| } | ||
|
|
||
| displaySuccessToast( | ||
| i18n.translate('xpack.ml.management.repairSavedObjectsFlyout.repair.success', { | ||
| defaultMessage: '{successCount} {successCount, plural, one {job} other {jobs}} repaired', | ||
| values: { successCount }, | ||
| }) | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| return ( | ||
| <> | ||
| <EuiFlyout maxWidth={600} onClose={onClose}> | ||
| <EuiFlyoutHeader hasBorder> | ||
| <EuiTitle size="m"> | ||
| <h2> | ||
| <FormattedMessage | ||
| id="xpack.ml.management.repairSavedObjectsFlyout.headerLabel" | ||
| defaultMessage="Repair saved objects" | ||
| /> | ||
| </h2> | ||
| </EuiTitle> | ||
| </EuiFlyoutHeader> | ||
| <EuiFlyoutBody> | ||
| <EuiCallOut color="primary"> | ||
| <EuiText size="s"> | ||
| <FormattedMessage | ||
| id="xpack.ml.management.repairSavedObjectsFlyout.description" | ||
| defaultMessage="Repair the saved objects if they are out of sync with the machine learning jobs in Elasticsearch." | ||
| /> | ||
| </EuiText> | ||
| </EuiCallOut> | ||
| <EuiSpacer /> | ||
| <RepairList repairItems={repairResp} /> | ||
| </EuiFlyoutBody> | ||
| <EuiFlyoutFooter> | ||
| <EuiFlexGroup justifyContent="spaceBetween"> | ||
| <EuiFlexItem grow={false}> | ||
| <EuiButtonEmpty iconType="cross" onClick={onClose} flush="left"> | ||
| <FormattedMessage | ||
| id="xpack.ml.management.repairSavedObjectsFlyout.closeButton" | ||
| defaultMessage="Close" | ||
| /> | ||
| </EuiButtonEmpty> | ||
| </EuiFlexItem> | ||
| <EuiFlexItem grow={false}> | ||
| <EuiButton | ||
| onClick={repair} | ||
| fill | ||
| isDisabled={repairable === false || loading === true} | ||
| > | ||
| <FormattedMessage | ||
| id="xpack.ml.management.repairSavedObjectsFlyout.repairButton" | ||
| defaultMessage="Repair" | ||
| /> | ||
| </EuiButton> | ||
| </EuiFlexItem> | ||
| </EuiFlexGroup> | ||
| </EuiFlyoutFooter> | ||
| </EuiFlyout> | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| function getResponseCounts(resp: RepairSavedObjectResponse) { | ||
| let successCount = 0; | ||
| let errorCount = 0; | ||
| Object.values(resp).forEach((result: SavedObjectResult) => { | ||
| Object.values(result).forEach(({ success, error }) => { | ||
| if (success === true) { | ||
| successCount++; | ||
| } else if (error !== undefined) { | ||
| errorCount++; | ||
| } | ||
| }); | ||
| }); | ||
| return { successCount, errorCount }; | ||
| } |
Oops, something went wrong.