Skip to content

Commit c4371e9

Browse files
authored
[ML] DFA: Fix layout of job status in expanded row. (#204978)
## Summary This removes the usage of `EuiBetaBadge` to display the job status. This EUI component has a semantic meaning to be used to display a "beta", "experimental" or other status of a feature, in this case it was used to render the data frame analytics job status. Instead, the job status now gets rendered in the same way like the other items in the list. Before: ![CleanShot 2024-12-19 at 17 36 44@2x](https://github.com/user-attachments/assets/17c80e89-8e67-4400-b431-3a1e4c78d642) After: ![CleanShot 2025-01-07 at 16 43 26@2x](https://github.com/user-attachments/assets/2240d4a7-fb77-4a5b-bfbd-6efeaeda7383) ### Checklist - [ ] Any text added follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing), uses sentence case text and includes [i18n support](https://github.com/elastic/kibana/blob/main/packages/kbn-i18n/README.md) - [x] [Unit or functional tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html) were updated or added to match the most common scenarios - [x] This was checked for breaking HTTP API changes, and any breaking changes have been approved by the breaking-change committee. The `release_note:breaking` label should be applied in these situations.
1 parent fd702ef commit c4371e9

File tree

8 files changed

+120
-43
lines changed

8 files changed

+120
-43
lines changed

x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row.tsx

Lines changed: 16 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -155,9 +155,23 @@ export const ExpandedRow: FC<Props> = ({ item }) => {
155155
defaultMessage: 'Overall',
156156
}),
157157
items: [
158-
{ title: 'badge', description: stateValues.state },
159158
{
160-
title: 'Create time',
159+
title: i18n.translate(
160+
'xpack.ml.dataframe.analyticsList.expandedRow.tabs.jobSettings.status',
161+
{
162+
defaultMessage: 'Status',
163+
}
164+
),
165+
type: 'badge',
166+
description: stateValues.state,
167+
},
168+
{
169+
title: i18n.translate(
170+
'xpack.ml.dataframe.analyticsList.expandedRow.tabs.jobSettings.createTime',
171+
{
172+
defaultMessage: 'Create time',
173+
}
174+
),
161175
description: formatHumanReadableDateTimeSeconds(
162176
moment(item.config.create_time).unix() * 1000
163177
),

x-pack/platform/plugins/shared/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/expanded_row_details_pane.tsx

Lines changed: 20 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -10,8 +10,8 @@ import React from 'react';
1010
import { i18n } from '@kbn/i18n';
1111

1212
import {
13+
EuiBadge,
1314
EuiBasicTable,
14-
EuiBetaBadge,
1515
EuiDescriptionListDescription,
1616
EuiDescriptionListTitle,
1717
EuiFlexGroup,
@@ -25,6 +25,7 @@ import {
2525

2626
export interface SectionItem {
2727
title: string;
28+
type?: 'plain' | 'badge';
2829
description: string | ReactElement;
2930
}
3031
export interface SectionConfig {
@@ -41,35 +42,28 @@ export const OverallDetails: FC<{
4142
overallDetails: SectionConfig;
4243
}> = ({ overallDetails }) => (
4344
<EuiFlexGroup alignItems="center" wrap data-test-subj={overallDetails.dataTestSubj}>
44-
{overallDetails.items.map((item) => {
45-
const key = item.title;
46-
if (item.title === 'badge') {
47-
return (
48-
<EuiFlexItem grow={false} key={key}>
49-
<EuiBetaBadge label={item.description} color="subdued" title={item.title} />
45+
{overallDetails.items.map((item) => (
46+
<EuiFlexItem grow={false} key={item.title}>
47+
<EuiFlexGroup gutterSize="xs" alignItems="center">
48+
<EuiFlexItem grow={false}>
49+
<EuiDescriptionListDescription className="descriptionListTitle">
50+
<EuiText size="xs">{item.title}</EuiText>
51+
</EuiDescriptionListDescription>
5052
</EuiFlexItem>
51-
);
52-
}
53-
54-
return (
55-
<EuiFlexItem grow={false} key={key}>
56-
<EuiFlexGroup gutterSize="xs">
57-
<EuiFlexItem grow={false}>
58-
<EuiDescriptionListDescription className="descriptionListTitle">
59-
<EuiText size="xs">{item.title}</EuiText>
60-
</EuiDescriptionListDescription>
61-
</EuiFlexItem>
62-
<EuiFlexItem>
63-
<EuiDescriptionListTitle className="descriptionListDescription">
53+
<EuiFlexItem>
54+
<EuiDescriptionListTitle className="descriptionListDescription">
55+
{item.type === 'badge' ? (
56+
<EuiBadge color="hollow">{item.description}</EuiBadge>
57+
) : (
6458
<EuiText size="s">
6559
<h5>{item.description}</h5>
6660
</EuiText>
67-
</EuiDescriptionListTitle>
68-
</EuiFlexItem>
69-
</EuiFlexGroup>
70-
</EuiFlexItem>
71-
);
72-
})}
61+
)}
62+
</EuiDescriptionListTitle>
63+
</EuiFlexItem>
64+
</EuiFlexGroup>
65+
</EuiFlexItem>
66+
))}
7367
</EuiFlexGroup>
7468
);
7569

x-pack/test/functional/apps/ml/data_frame_analytics/classification_creation.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -123,7 +123,8 @@ export default function ({ getService }: FtrProviderContext) {
123123
section: 'state',
124124
// Don't include the 'Create time' value entry as it's not stable.
125125
expectedEntries: [
126-
'STOPPED',
126+
'Status',
127+
'stopped',
127128
'Create time',
128129
'Model memory limit',
129130
'25mb',

x-pack/test/functional/apps/ml/data_frame_analytics/classification_creation_saved_search.ts

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,8 @@ export default function ({ getService }: FtrProviderContext) {
119119
section: 'state',
120120
// Don't include the 'Create time' value entry as it's not stable.
121121
expectedEntries: [
122-
'STOPPED',
122+
'Status',
123+
'stopped',
123124
'Create time',
124125
'Model memory limit',
125126
'20mb',
@@ -219,7 +220,8 @@ export default function ({ getService }: FtrProviderContext) {
219220
section: 'state',
220221
// Don't include the 'Create time' value entry as it's not stable.
221222
expectedEntries: [
222-
'STOPPED',
223+
'Status',
224+
'stopped',
223225
'Create time',
224226
'Model memory limit',
225227
'20mb',
@@ -317,7 +319,14 @@ export default function ({ getService }: FtrProviderContext) {
317319
{
318320
section: 'state',
319321
// Don't include the 'Create time' value entry as it's not stable.
320-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '7mb', 'Version'],
322+
expectedEntries: [
323+
'Status',
324+
'stopped',
325+
'Create time',
326+
'Model memory limit',
327+
'7mb',
328+
'Version',
329+
],
321330
},
322331
{
323332
section: 'stats',
@@ -407,7 +416,14 @@ export default function ({ getService }: FtrProviderContext) {
407416
{
408417
section: 'state',
409418
// Don't include the 'Create time' value entry as it's not stable.
410-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '6mb', 'Version'],
419+
expectedEntries: [
420+
'Status',
421+
'stopped',
422+
'Create time',
423+
'Model memory limit',
424+
'6mb',
425+
'Version',
426+
],
411427
},
412428
{
413429
section: 'stats',

x-pack/test/functional/apps/ml/data_frame_analytics/outlier_detection_creation.ts

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -135,7 +135,14 @@ export default function ({ getService }: FtrProviderContext) {
135135
{
136136
section: 'state',
137137
// Don't include the 'Create time' value entry as it's not stable.
138-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '2mb', 'Version'],
138+
expectedEntries: [
139+
'Status',
140+
'stopped',
141+
'Create time',
142+
'Model memory limit',
143+
'2mb',
144+
'Version',
145+
],
139146
},
140147
{
141148
section: 'stats',

x-pack/test/functional/apps/ml/data_frame_analytics/outlier_detection_creation_saved_search.ts

Lines changed: 32 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,14 @@ export default function ({ getService }: FtrProviderContext) {
8383
{
8484
section: 'state',
8585
// Don't include the 'Create time' value entry as it's not stable.
86-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '1mb', 'Version'],
86+
expectedEntries: [
87+
'Status',
88+
'stopped',
89+
'Create time',
90+
'Model memory limit',
91+
'1mb',
92+
'Version',
93+
],
8794
},
8895
{
8996
section: 'stats',
@@ -160,7 +167,14 @@ export default function ({ getService }: FtrProviderContext) {
160167
{
161168
section: 'state',
162169
// Don't include the 'Create time' value entry as it's not stable.
163-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '1mb', 'Version'],
170+
expectedEntries: [
171+
'Status',
172+
'stopped',
173+
'Create time',
174+
'Model memory limit',
175+
'1mb',
176+
'Version',
177+
],
164178
},
165179
{
166180
section: 'stats',
@@ -237,7 +251,14 @@ export default function ({ getService }: FtrProviderContext) {
237251
{
238252
section: 'state',
239253
// Don't include the 'Create time' value entry as it's not stable.
240-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '1mb', 'Version'],
254+
expectedEntries: [
255+
'Status',
256+
'stopped',
257+
'Create time',
258+
'Model memory limit',
259+
'1mb',
260+
'Version',
261+
],
241262
},
242263
{
243264
section: 'stats',
@@ -315,7 +336,14 @@ export default function ({ getService }: FtrProviderContext) {
315336
{
316337
section: 'state',
317338
// Don't include the 'Create time' value entry as it's not stable.
318-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '1mb', 'Version'],
339+
expectedEntries: [
340+
'Status',
341+
'stopped',
342+
'Create time',
343+
'Model memory limit',
344+
'1mb',
345+
'Version',
346+
],
319347
},
320348
{
321349
section: 'stats',

x-pack/test/functional/apps/ml/data_frame_analytics/regression_creation.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,8 @@ export default function ({ getService }: FtrProviderContext) {
119119
section: 'state',
120120
// Don't include the 'Create time' value entry as it's not stable.
121121
expectedEntries: [
122-
'STOPPED',
122+
'Status',
123+
'stopped',
123124
'Create time',
124125
'Model memory limit',
125126
'16mb',

x-pack/test/functional/apps/ml/data_frame_analytics/regression_creation_saved_search.ts

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -89,7 +89,8 @@ export default function ({ getService }: FtrProviderContext) {
8989
section: 'state',
9090
// Don't include the 'Create time' value entry as it's not stable.
9191
expectedEntries: [
92-
'STOPPED',
92+
'Status',
93+
'stopped',
9394
'Create time',
9495
'Model memory limit',
9596
'10mb',
@@ -177,7 +178,8 @@ export default function ({ getService }: FtrProviderContext) {
177178
section: 'state',
178179
// Don't include the 'Create time' value entry as it's not stable.
179180
expectedEntries: [
180-
'STOPPED',
181+
'Status',
182+
'stopped',
181183
'Create time',
182184
'Model memory limit',
183185
'10mb',
@@ -264,7 +266,14 @@ export default function ({ getService }: FtrProviderContext) {
264266
{
265267
section: 'state',
266268
// Don't include the 'Create time' value entry as it's not stable.
267-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '5mb', 'Version'],
269+
expectedEntries: [
270+
'Status',
271+
'stopped',
272+
'Create time',
273+
'Model memory limit',
274+
'5mb',
275+
'Version',
276+
],
268277
},
269278
{
270279
section: 'stats',
@@ -346,7 +355,14 @@ export default function ({ getService }: FtrProviderContext) {
346355
{
347356
section: 'state',
348357
// Don't include the 'Create time' value entry as it's not stable.
349-
expectedEntries: ['STOPPED', 'Create time', 'Model memory limit', '5mb', 'Version'],
358+
expectedEntries: [
359+
'Status',
360+
'stopped',
361+
'Create time',
362+
'Model memory limit',
363+
'5mb',
364+
'Version',
365+
],
350366
},
351367
{
352368
section: 'stats',

0 commit comments

Comments
 (0)