diff --git a/x-pack/plugins/ml/common/util/group_color_utils.ts b/x-pack/plugins/ml/common/util/group_color_utils.ts index 710591927418..b5749641d2b5 100644 --- a/x-pack/plugins/ml/common/util/group_color_utils.ts +++ b/x-pack/plugins/ml/common/util/group_color_utils.ts @@ -13,7 +13,7 @@ const COLORS = [ euiVars.euiColorVis1, euiVars.euiColorVis2, euiVars.euiColorVis3, - // euiVars.euiColorVis4, // light pink, too hard to read with white text + euiVars.euiColorVis4, euiVars.euiColorVis5, euiVars.euiColorVis6, euiVars.euiColorVis7, diff --git a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/edit_job_flyout/tabs/job_details.js b/x-pack/plugins/ml/public/application/jobs/jobs_list/components/edit_job_flyout/tabs/job_details.js index ec5ef6fce26b..97b705177ed8 100644 --- a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/edit_job_flyout/tabs/job_details.js +++ b/x-pack/plugins/ml/public/application/jobs/jobs_list/components/edit_job_flyout/tabs/job_details.js @@ -19,6 +19,7 @@ import { import { ml } from '../../../../../services/ml_api_service'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; +import { tabColor } from '../../../../../../../common/util/group_color_utils'; export class JobDetails extends Component { constructor(props) { @@ -43,7 +44,7 @@ export class JobDetails extends Component { ml.jobs .groups() .then((resp) => { - const groups = resp.map((g) => ({ label: g.id })); + const groups = resp.map((g) => ({ label: g.id, color: tabColor(g.id) })); this.setState({ groups }); }) .catch((error) => { @@ -53,7 +54,9 @@ export class JobDetails extends Component { static getDerivedStateFromProps(props) { const selectedGroups = - props.jobGroups !== undefined ? props.jobGroups.map((g) => ({ label: g })) : []; + props.jobGroups !== undefined + ? props.jobGroups.map((g) => ({ label: g, color: tabColor(g) })) + : []; return { description: props.jobDescription, diff --git a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_filter_bar/job_filter_bar.tsx b/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_filter_bar/job_filter_bar.tsx index 1b1bea889925..71be81266229 100644 --- a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_filter_bar/job_filter_bar.tsx +++ b/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_filter_bar/job_filter_bar.tsx @@ -17,7 +17,6 @@ import { } from '@elastic/eui'; import { i18n } from '@kbn/i18n'; import { FormattedMessage } from '@kbn/i18n/react'; -// @ts-ignore import { JobGroup } from '../job_group'; import { useMlKibana } from '../../../../contexts/kibana'; diff --git a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_group/index.js b/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_group/index.ts similarity index 100% rename from x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_group/index.js rename to x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_group/index.ts diff --git a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_group/job_group.js b/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_group/job_group.js deleted file mode 100644 index e8892c076c7a..000000000000 --- a/x-pack/plugins/ml/public/application/jobs/jobs_list/components/job_group/job_group.js +++ /dev/null @@ -1,34 +0,0 @@ -/* - * 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 { tabColor } from '../../../../../../common/util/group_color_utils'; - -import PropTypes from 'prop-types'; -import React from 'react'; -import theme from '@elastic/eui/dist/eui_theme_light.json'; - -export function JobGroup({ name }) { - return ( -