[ML] Refresh Anomaly Detection jobs list on alerting rules updates (#98603)

This commit is contained in:
Dima Arnautov 2021-04-28 20:37:58 +02:00 committed by GitHub
parent 9703b74efc
commit 3f46d6f8a7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 17 additions and 11 deletions

View file

@ -99,10 +99,7 @@ export const JobSelectorControl: FC<JobSelectorControlProps> = ({
<EuiFormRow
fullWidth
label={
<FormattedMessage
id="xpack.ml.jobSelector.formControlLabel"
defaultMessage="Select jobs or groups"
/>
<FormattedMessage id="xpack.ml.jobSelector.formControlLabel" defaultMessage="Select job" />
}
isInvalid={!!errors?.length}
error={errors}

View file

@ -82,6 +82,7 @@ export const MlAnomalyAlertFlyout: FC<MlAnomalyAlertFlyoutProps> = ({
interface JobListMlAnomalyAlertFlyoutProps {
setShowFunction: (callback: Function) => void;
unsetShowFunction: () => void;
onSave: () => void;
}
/**
@ -93,6 +94,7 @@ interface JobListMlAnomalyAlertFlyoutProps {
export const JobListMlAnomalyAlertFlyout: FC<JobListMlAnomalyAlertFlyoutProps> = ({
setShowFunction,
unsetShowFunction,
onSave,
}) => {
const [isVisible, setIsVisible] = useState(false);
const [jobIds, setJobIds] = useState<JobId[] | undefined>();
@ -115,6 +117,7 @@ export const JobListMlAnomalyAlertFlyout: FC<JobListMlAnomalyAlertFlyoutProps> =
onCloseFlyout={() => setIsVisible(false)}
onSave={() => {
setIsVisible(false);
onSave();
}}
/>
) : null;
@ -122,9 +125,10 @@ export const JobListMlAnomalyAlertFlyout: FC<JobListMlAnomalyAlertFlyoutProps> =
interface EditRuleFlyoutProps {
initialAlert: MlAnomalyDetectionAlertRule;
onSave: () => void;
}
export const EditAlertRule: FC<EditRuleFlyoutProps> = ({ initialAlert }) => {
export const EditAlertRule: FC<EditRuleFlyoutProps> = ({ initialAlert, onSave }) => {
const [isVisible, setIsVisible] = useState(false);
return (
<>
@ -136,7 +140,10 @@ export const EditAlertRule: FC<EditRuleFlyoutProps> = ({ initialAlert }) => {
<MlAnomalyAlertFlyout
initialAlert={initialAlert}
onCloseFlyout={setIsVisible.bind(null, false)}
onSave={setIsVisible.bind(null, false)}
onSave={() => {
setIsVisible(false);
onSave();
}}
/>
) : null}
</>

View file

@ -12,7 +12,7 @@ import { i18n } from '@kbn/i18n';
import { EuiLink } from '@elastic/eui';
import { EditAlertRule } from '../../../../../alerting/ml_alerting_flyout';
export function extractJobDetails(job, basePath) {
export function extractJobDetails(job, basePath, refreshJobList) {
if (Object.keys(job).length === 0) {
return {};
}
@ -82,7 +82,7 @@ export function extractJobDetails(job, basePath) {
}),
position: 'right',
items: (job.alerting_rules ?? []).map((v) => {
return ['', <EditAlertRule initialAlert={v} />];
return ['', <EditAlertRule initialAlert={v} onSave={refreshJobList} />];
}),
};

View file

@ -55,6 +55,8 @@ export class JobDetailsUI extends Component {
</div>
);
} else {
const { showFullDetails, refreshJobList } = this.props;
const {
general,
customUrl,
@ -71,9 +73,8 @@ export class JobDetailsUI extends Component {
jobTimingStats,
datafeedTimingStats,
alertRules,
} = extractJobDetails(job, basePath);
} = extractJobDetails(job, basePath, refreshJobList);
const { showFullDetails, refreshJobList } = this.props;
const tabs = [
{
id: 'job-settings',

View file

@ -521,6 +521,7 @@ export class JobsListView extends Component {
<JobListMlAnomalyAlertFlyout
setShowFunction={this.setShowCreateAlertFlyoutFunction}
unsetShowFunction={this.unsetShowCreateAlertFlyoutFunction}
onSave={this.onRefreshClick}
/>
</div>
</EuiPageContent>

View file

@ -145,7 +145,7 @@ class MultiJobActionsMenuUI extends Component {
);
}
if (this.canCreateMlAlerts) {
if (this.canCreateMlAlerts && this.props.jobs.length === 1) {
items.push(
<EuiContextMenuItem
key="create alert"