Skip to content

Commit 24d59ec

Browse files
fix link to analytics results from management (#69550) (#69745)
1 parent f4190e5 commit 24d59ec

File tree

7 files changed

+169
-133
lines changed

7 files changed

+169
-133
lines changed

x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/action_clone.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -344,7 +344,7 @@ export function getCloneAction(createAnalyticsForm: CreateAnalyticsFormProps) {
344344
}
345345

346346
interface CloneActionProps {
347-
item: DeepReadonly<DataFrameAnalyticsListRow>;
347+
item: DataFrameAnalyticsListRow;
348348
createAnalyticsForm: CreateAnalyticsFormProps;
349349
}
350350

x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/actions.tsx

Lines changed: 117 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,9 @@
44
* you may not use this file except in compliance with the Elastic License.
55
*/
66

7-
import React from 'react';
7+
import React, { FC } from 'react';
88
import { i18n } from '@kbn/i18n';
99
import { EuiButtonEmpty, EuiToolTip } from '@elastic/eui';
10-
import { DeepReadonly } from '../../../../../../../common/types/common';
1110

1211
import {
1312
checkPermission,
@@ -21,6 +20,7 @@ import {
2120
isClassificationAnalysis,
2221
} from '../../../../common/analytics';
2322
import { CreateAnalyticsFormProps } from '../../hooks/use_create_analytics_form';
23+
import { useMlKibana } from '../../../../../contexts/kibana';
2424
import { CloneAction } from './action_clone';
2525

2626
import { getResultsUrl, isDataFrameAnalyticsRunning, DataFrameAnalyticsListRow } from './common';
@@ -29,87 +29,123 @@ import { stopAnalytics } from '../../services/analytics_service';
2929
import { StartAction } from './action_start';
3030
import { DeleteAction } from './action_delete';
3131

32-
export const AnalyticsViewAction = {
33-
isPrimary: true,
34-
render: (item: DataFrameAnalyticsListRow) => {
35-
const analysisType = getAnalysisType(item.config.analysis);
36-
const isDisabled =
37-
!isRegressionAnalysis(item.config.analysis) &&
38-
!isOutlierAnalysis(item.config.analysis) &&
39-
!isClassificationAnalysis(item.config.analysis);
40-
41-
const url = getResultsUrl(item.id, analysisType);
42-
return (
43-
<EuiButtonEmpty
44-
isDisabled={isDisabled}
45-
onClick={() => (window.location.href = url)}
46-
size="xs"
47-
color="text"
48-
iconType="visTable"
49-
aria-label={i18n.translate('xpack.ml.dataframe.analyticsList.viewAriaLabel', {
50-
defaultMessage: 'View',
51-
})}
52-
data-test-subj="mlAnalyticsJobViewButton"
53-
>
54-
{i18n.translate('xpack.ml.dataframe.analyticsList.viewActionName', {
55-
defaultMessage: 'View',
56-
})}
57-
</EuiButtonEmpty>
58-
);
59-
},
32+
interface Props {
33+
item: DataFrameAnalyticsListRow;
34+
isManagementTable: boolean;
35+
}
36+
37+
const AnalyticsViewButton: FC<Props> = ({ item, isManagementTable }) => {
38+
const {
39+
services: {
40+
application: { navigateToUrl, navigateToApp },
41+
},
42+
} = useMlKibana();
43+
44+
const analysisType = getAnalysisType(item.config.analysis);
45+
const isDisabled =
46+
!isRegressionAnalysis(item.config.analysis) &&
47+
!isOutlierAnalysis(item.config.analysis) &&
48+
!isClassificationAnalysis(item.config.analysis);
49+
50+
const url = getResultsUrl(item.id, analysisType);
51+
const navigator = isManagementTable
52+
? () => navigateToApp('ml', { path: url })
53+
: () => navigateToUrl(url);
54+
55+
return (
56+
<EuiButtonEmpty
57+
isDisabled={isDisabled}
58+
onClick={navigator}
59+
size="xs"
60+
color="text"
61+
iconType="visTable"
62+
aria-label={i18n.translate('xpack.ml.dataframe.analyticsList.viewAriaLabel', {
63+
defaultMessage: 'View',
64+
})}
65+
data-test-subj="mlAnalyticsJobViewButton"
66+
>
67+
{i18n.translate('xpack.ml.dataframe.analyticsList.viewActionName', {
68+
defaultMessage: 'View',
69+
})}
70+
</EuiButtonEmpty>
71+
);
6072
};
6173

62-
export const getActions = (createAnalyticsForm: CreateAnalyticsFormProps) => {
74+
interface Action {
75+
isPrimary?: boolean;
76+
render: (item: DataFrameAnalyticsListRow) => any;
77+
}
78+
79+
export const getAnalyticsViewAction = (isManagementTable: boolean = false): Action => ({
80+
isPrimary: true,
81+
render: (item: DataFrameAnalyticsListRow) => (
82+
<AnalyticsViewButton item={item} isManagementTable={isManagementTable} />
83+
),
84+
});
85+
86+
export const getActions = (
87+
createAnalyticsForm: CreateAnalyticsFormProps,
88+
isManagementTable: boolean
89+
) => {
6390
const canStartStopDataFrameAnalytics: boolean = checkPermission('canStartStopDataFrameAnalytics');
91+
const actions: Action[] = [getAnalyticsViewAction(isManagementTable)];
6492

65-
return [
66-
AnalyticsViewAction,
67-
{
68-
render: (item: DataFrameAnalyticsListRow) => {
69-
if (!isDataFrameAnalyticsRunning(item.stats.state)) {
70-
return <StartAction item={item} />;
71-
}
72-
73-
const buttonStopText = i18n.translate('xpack.ml.dataframe.analyticsList.stopActionName', {
74-
defaultMessage: 'Stop',
75-
});
76-
77-
const stopButton = (
78-
<EuiButtonEmpty
79-
size="xs"
80-
color="text"
81-
disabled={!canStartStopDataFrameAnalytics}
82-
iconType="stop"
83-
onClick={() => stopAnalytics(item)}
84-
aria-label={buttonStopText}
85-
data-test-subj="mlAnalyticsJobStopButton"
86-
>
87-
{buttonStopText}
88-
</EuiButtonEmpty>
89-
);
90-
if (!canStartStopDataFrameAnalytics) {
91-
return (
92-
<EuiToolTip
93-
position="top"
94-
content={createPermissionFailureMessage('canStartStopDataFrameAnalytics')}
95-
>
96-
{stopButton}
97-
</EuiToolTip>
98-
);
99-
}
100-
101-
return stopButton;
102-
},
103-
},
104-
{
105-
render: (item: DataFrameAnalyticsListRow) => {
106-
return <DeleteAction item={item} />;
107-
},
108-
},
109-
{
110-
render: (item: DeepReadonly<DataFrameAnalyticsListRow>) => {
111-
return <CloneAction item={item} createAnalyticsForm={createAnalyticsForm} />;
112-
},
113-
},
114-
];
93+
if (isManagementTable === false) {
94+
actions.push(
95+
...[
96+
{
97+
render: (item: DataFrameAnalyticsListRow) => {
98+
if (!isDataFrameAnalyticsRunning(item.stats.state)) {
99+
return <StartAction item={item} />;
100+
}
101+
102+
const buttonStopText = i18n.translate(
103+
'xpack.ml.dataframe.analyticsList.stopActionName',
104+
{
105+
defaultMessage: 'Stop',
106+
}
107+
);
108+
109+
const stopButton = (
110+
<EuiButtonEmpty
111+
size="xs"
112+
color="text"
113+
disabled={!canStartStopDataFrameAnalytics}
114+
iconType="stop"
115+
onClick={() => stopAnalytics(item)}
116+
aria-label={buttonStopText}
117+
data-test-subj="mlAnalyticsJobStopButton"
118+
>
119+
{buttonStopText}
120+
</EuiButtonEmpty>
121+
);
122+
if (!canStartStopDataFrameAnalytics) {
123+
return (
124+
<EuiToolTip
125+
position="top"
126+
content={createPermissionFailureMessage('canStartStopDataFrameAnalytics')}
127+
>
128+
{stopButton}
129+
</EuiToolTip>
130+
);
131+
}
132+
133+
return stopButton;
134+
},
135+
},
136+
{
137+
render: (item: DataFrameAnalyticsListRow) => {
138+
return <DeleteAction item={item} />;
139+
},
140+
},
141+
{
142+
render: (item: DataFrameAnalyticsListRow) => {
143+
return <CloneAction item={item} createAnalyticsForm={createAnalyticsForm} />;
144+
},
145+
},
146+
]
147+
);
148+
}
149+
150+
return actions;
115151
};

x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/columns.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ import {
3333
DataFrameAnalyticsListRow,
3434
DataFrameAnalyticsStats,
3535
} from './common';
36-
import { getActions, AnalyticsViewAction } from './actions';
36+
import { getActions } from './actions';
3737

3838
enum TASK_STATE_COLOR {
3939
analyzing = 'primary',
@@ -148,8 +148,7 @@ export const getColumns = (
148148
isMlEnabledInSpace: boolean = true,
149149
createAnalyticsForm?: CreateAnalyticsFormProps
150150
) => {
151-
const actions =
152-
isManagementTable === true ? [AnalyticsViewAction] : getActions(createAnalyticsForm!);
151+
const actions = getActions(createAnalyticsForm!, isManagementTable);
153152

154153
function toggleDetails(item: DataFrameAnalyticsListRow) {
155154
const index = expandedRowItemIds.indexOf(item.config.id);

x-pack/plugins/ml/public/application/data_frame_analytics/pages/analytics_management/components/analytics_list/common.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -122,5 +122,5 @@ export function isCompletedAnalyticsJob(stats: DataFrameAnalyticsStats) {
122122
}
123123

124124
export function getResultsUrl(jobId: string, analysisType: string) {
125-
return `ml#/data_frame_analytics/exploration?_g=(ml:(jobId:${jobId},analysisType:${analysisType}))`;
125+
return `#/data_frame_analytics/exploration?_g=(ml:(jobId:${jobId},analysisType:${analysisType}))`;
126126
}

x-pack/plugins/ml/public/application/management/jobs_list/components/jobs_list_page/jobs_list_page.tsx

Lines changed: 45 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -21,6 +21,7 @@ import {
2121
} from '@elastic/eui';
2222

2323
import { checkGetManagementMlJobsResolver } from '../../../../capabilities/check_capabilities';
24+
import { KibanaContextProvider } from '../../../../../../../../../src/plugins/kibana_react/public';
2425

2526
import { getDocLinks } from '../../../../util/dependency_cache';
2627
// @ts-ignore undeclared module
@@ -65,13 +66,12 @@ function getTabs(isMlEnabledInSpace: boolean): Tab[] {
6566
];
6667
}
6768

68-
export const JobsListPage: FC<{ I18nContext: CoreStart['i18n']['Context'] }> = ({
69-
I18nContext,
70-
}) => {
69+
export const JobsListPage: FC<{ coreStart: CoreStart }> = ({ coreStart }) => {
7170
const [initialized, setInitialized] = useState(false);
7271
const [isMlEnabledInSpace, setIsMlEnabledInSpace] = useState(false);
7372
const tabs = getTabs(isMlEnabledInSpace);
7473
const [currentTabId, setCurrentTabId] = useState(tabs[0].id);
74+
const I18nContext = coreStart.i18n.Context;
7575

7676
const check = async () => {
7777
try {
@@ -122,46 +122,48 @@ export const JobsListPage: FC<{ I18nContext: CoreStart['i18n']['Context'] }> = (
122122

123123
return (
124124
<I18nContext>
125-
<EuiPageContent id="kibanaManagementMLSection">
126-
<EuiTitle size="l">
127-
<EuiFlexGroup alignItems="center" justifyContent="spaceBetween">
128-
<EuiFlexItem grow={false}>
129-
<h1>
130-
{i18n.translate('xpack.ml.management.jobsList.jobsListTitle', {
131-
defaultMessage: 'Machine Learning Jobs',
132-
})}
133-
</h1>
134-
</EuiFlexItem>
135-
<EuiFlexItem grow={false}>
136-
<EuiButtonEmpty
137-
target="_blank"
138-
iconType="help"
139-
iconSide="left"
140-
color="primary"
141-
href={
142-
currentTabId === 'anomaly_detection_jobs'
143-
? anomalyDetectionJobsUrl
144-
: anomalyJobsUrl
145-
}
146-
>
147-
{currentTabId === 'anomaly_detection_jobs'
148-
? anomalyDetectionDocsLabel
149-
: analyticsDocsLabel}
150-
</EuiButtonEmpty>
151-
</EuiFlexItem>
152-
</EuiFlexGroup>
153-
</EuiTitle>
154-
<EuiSpacer size="s" />
155-
<EuiTitle size="s">
156-
<EuiText color="subdued">
157-
{i18n.translate('xpack.ml.management.jobsList.jobsListTagline', {
158-
defaultMessage: 'View machine learning analytics and anomaly detection jobs.',
159-
})}
160-
</EuiText>
161-
</EuiTitle>
162-
<EuiSpacer size="l" />
163-
<EuiPageContentBody>{renderTabs()}</EuiPageContentBody>
164-
</EuiPageContent>
125+
<KibanaContextProvider services={{ ...coreStart }}>
126+
<EuiPageContent id="kibanaManagementMLSection">
127+
<EuiTitle size="l">
128+
<EuiFlexGroup alignItems="center" justifyContent="spaceBetween">
129+
<EuiFlexItem grow={false}>
130+
<h1>
131+
{i18n.translate('xpack.ml.management.jobsList.jobsListTitle', {
132+
defaultMessage: 'Machine Learning Jobs',
133+
})}
134+
</h1>
135+
</EuiFlexItem>
136+
<EuiFlexItem grow={false}>
137+
<EuiButtonEmpty
138+
target="_blank"
139+
iconType="help"
140+
iconSide="left"
141+
color="primary"
142+
href={
143+
currentTabId === 'anomaly_detection_jobs'
144+
? anomalyDetectionJobsUrl
145+
: anomalyJobsUrl
146+
}
147+
>
148+
{currentTabId === 'anomaly_detection_jobs'
149+
? anomalyDetectionDocsLabel
150+
: analyticsDocsLabel}
151+
</EuiButtonEmpty>
152+
</EuiFlexItem>
153+
</EuiFlexGroup>
154+
</EuiTitle>
155+
<EuiSpacer size="s" />
156+
<EuiTitle size="s">
157+
<EuiText color="subdued">
158+
{i18n.translate('xpack.ml.management.jobsList.jobsListTagline', {
159+
defaultMessage: 'View machine learning analytics and anomaly detection jobs.',
160+
})}
161+
</EuiText>
162+
</EuiTitle>
163+
<EuiSpacer size="l" />
164+
<EuiPageContentBody>{renderTabs()}</EuiPageContentBody>
165+
</EuiPageContent>
166+
</KibanaContextProvider>
165167
</I18nContext>
166168
);
167169
};

x-pack/plugins/ml/public/application/management/jobs_list/index.ts

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,7 @@ import { getJobsListBreadcrumbs } from '../breadcrumbs';
1414
import { setDependencyCache, clearCache } from '../../util/dependency_cache';
1515

1616
const renderApp = (element: HTMLElement, coreStart: CoreStart) => {
17-
const I18nContext = coreStart.i18n.Context;
18-
ReactDOM.render(React.createElement(JobsListPage, { I18nContext }), element);
17+
ReactDOM.render(React.createElement(JobsListPage, { coreStart }), element);
1918
return () => {
2019
unmountComponentAtNode(element);
2120
clearCache();

x-pack/plugins/ml/public/application/overview/components/analytics_panel/table.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@ import {
2323
getTaskStateBadge,
2424
progressColumn,
2525
} from '../../../data_frame_analytics/pages/analytics_management/components/analytics_list/columns';
26-
import { AnalyticsViewAction } from '../../../data_frame_analytics/pages/analytics_management/components/analytics_list/actions';
26+
import { getAnalyticsViewAction } from '../../../data_frame_analytics/pages/analytics_management/components/analytics_list/actions';
2727
import { formatHumanReadableDateTimeSeconds } from '../../../util/date_utils';
2828

2929
const MlInMemoryTable = mlInMemoryTableFactory<DataFrameAnalyticsListRow>();
@@ -82,7 +82,7 @@ export const AnalyticsTable: FC<Props> = ({ items }) => {
8282
name: i18n.translate('xpack.ml.overview.analyticsList.tableActionLabel', {
8383
defaultMessage: 'Actions',
8484
}),
85-
actions: [AnalyticsViewAction],
85+
actions: [getAnalyticsViewAction()],
8686
width: '100px',
8787
},
8888
];

0 commit comments

Comments
 (0)