Skip to content

Commit b0e0ac8

Browse files
committed
OCPBUGS-77113: remove dev to admin links as dev monitoring views are enabled
Signed-off-by: Gabriel Bernal <gbernal@redhat.com>
1 parent 6bcf94e commit b0e0ac8

6 files changed

Lines changed: 67 additions & 25 deletions

File tree

frontend/packages/console-shared/src/components/dashboard/utilization-card/TopConsumerPopover.tsx

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,19 @@ import * as React from 'react';
33
import { Button, Popover, PopoverPosition } from '@patternfly/react-core';
44
import { useTranslation } from 'react-i18next';
55
import { Link } from 'react-router-dom-v5-compat';
6-
import { LIMIT_STATE, Humanize } from '@console/dynamic-plugin-sdk';
6+
import { Humanize, LIMIT_STATE, useActivePerspective } from '@console/dynamic-plugin-sdk';
77
import { getPrometheusQueryResponse } from '@console/internal/actions/dashboards';
88
import {
9-
withDashboardResources,
109
DashboardItemProps,
10+
withDashboardResources,
1111
} from '@console/internal/components/dashboard/with-dashboard-resources';
1212
import { DataPoint } from '@console/internal/components/graphs';
1313
import { getInstantVectorStats } from '@console/internal/components/graphs/utils';
1414
import { ConsoleSelect } from '@console/internal/components/utils/console-select';
1515
import { useK8sWatchResource } from '@console/internal/components/utils/k8s-watch-hook';
1616
import { resourcePathFromModel } from '@console/internal/components/utils/resource-link';
17-
import { K8sKind, referenceForModel, K8sResourceCommon } from '@console/internal/module/k8s';
18-
import { getName, getNamespace } from '../../..';
17+
import { K8sKind, K8sResourceCommon, referenceForModel } from '@console/internal/module/k8s';
18+
import { FLAGS, getName, getNamespace, useFlag } from '../../..';
1919
import { RedExclamationCircleIcon, YellowExclamationTriangleIcon } from '../../status';
2020
import Status from '../status-card/StatusPopup';
2121

@@ -130,6 +130,9 @@ export const PopoverBody = withDashboardResources<DashboardItemProps & PopoverBo
130130
}) => {
131131
const { t } = useTranslation();
132132
const [currentConsumer, setCurrentConsumer] = React.useState(consumers[0]);
133+
const [activePerspective, setActivePerspective] = useActivePerspective();
134+
const canAccessMonitoring =
135+
useFlag(FLAGS.CAN_GET_NS) && !!window.SERVER_FLAGS.prometheusBaseURL;
133136
const { query, model, metric, fieldSelector } = currentConsumer;
134137
const k8sResource = React.useMemo(
135138
() => (isOpen ? getResourceToWatch(model, namespace, fieldSelector) : null),
@@ -194,7 +197,10 @@ export const PopoverBody = withDashboardResources<DashboardItemProps & PopoverBo
194197
[consumers],
195198
);
196199

197-
const monitoringURL = `/monitoring/query-browser?${monitoringParams.toString()}`;
200+
const monitoringURL =
201+
canAccessMonitoring && activePerspective === 'admin'
202+
? `/monitoring/query-browser?${monitoringParams.toString()}`
203+
: `/dev-monitoring/ns/${namespace}/metrics?${monitoringParams.toString()}`;
198204

199205
let body: React.ReactNode;
200206
if (error || consumersLoadError) {
@@ -231,7 +237,16 @@ export const PopoverBody = withDashboardResources<DashboardItemProps & PopoverBo
231237
);
232238
})}
233239
</ul>
234-
<Link to={monitoringURL}>{t('console-shared~View more')}</Link>
240+
<Link
241+
to={monitoringURL}
242+
onClick={() => {
243+
if (monitoringURL.startsWith('/dev-monitoring') && activePerspective !== 'dev') {
244+
setActivePerspective('dev');
245+
}
246+
}}
247+
>
248+
{t('console-shared~View more')}
249+
</Link>
235250
</>
236251
);
237252
}

frontend/packages/dev-console/src/components/monitoring/dashboard/MonitoringDashboardGraph.tsx

Lines changed: 11 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import * as _ from 'lodash';
44
import { useTranslation } from 'react-i18next';
55
import { useDispatch } from 'react-redux';
66
import { Link } from 'react-router-dom-v5-compat';
7+
import { useActivePerspective } from '@console/dynamic-plugin-sdk';
78
import { QueryBrowser } from '@console/dynamic-plugin-sdk/src/lib-core';
89
import { dashboardsSetEndTime, dashboardsSetTimespan } from '@console/internal/actions/observe';
910
import { Humanize } from '@console/internal/components/utils';
@@ -17,15 +18,23 @@ export enum GraphTypes {
1718

1819
const PrometheusGraphLink = ({ query, namespace, ariaChartLinkLabel }) => {
1920
const { t } = useTranslation();
21+
const [perspective] = useActivePerspective();
2022
const queries = _.compact(_.castArray(query));
2123
if (!queries.length) {
2224
return null;
2325
}
2426
const params = new URLSearchParams();
2527
queries.forEach((q, index) => params.set(`query${index}`, q));
26-
params.set('namespace', namespace);
28+
2729
return (
28-
<Link aria-label={ariaChartLinkLabel} to={`/monitoring/query-browser?${params.toString()}`}>
30+
<Link
31+
aria-label={ariaChartLinkLabel}
32+
to={
33+
perspective === 'dev'
34+
? `/dev-monitoring/ns/${namespace}/metrics?${params.toString()}`
35+
: `/monitoring/metrics?${params.toString()}`
36+
}
37+
>
2938
{t('devconsole~Inspect')}
3039
</Link>
3140
);

frontend/packages/dev-console/src/components/monitoring/overview/MonitoringOverview.tsx

Lines changed: 5 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -69,17 +69,6 @@ const MonitoringOverview: React.FC<MonitoringOverviewProps> = (props) => {
6969
setExpanded(newExpanded);
7070
};
7171

72-
// query params:
73-
// namespace - used within dashboard logic for variables
74-
// project-dropdown-value - used for namespace dropdown for console
75-
76-
const dashboardLinkParams = new URLSearchParams({
77-
workload: resource?.metadata?.name ?? '',
78-
type: resource?.kind?.toLowerCase() ?? '',
79-
'project-dropdown-value': resource?.metadata?.namespace ?? '',
80-
namespace: resource?.metadata?.namespace ?? '',
81-
});
82-
8372
return (
8473
<div className="odc-monitoring-overview">
8574
<Accordion
@@ -140,7 +129,11 @@ const MonitoringOverview: React.FC<MonitoringOverviewProps> = (props) => {
140129
<>
141130
<div className="odc-monitoring-overview__view-monitoring-dashboards">
142131
<Link
143-
to={`/monitoring/dashboards/dashboard-k8s-resources-workload?${dashboardLinkParams.toString()}`}
132+
to={`/dev-monitoring/ns/${
133+
resource?.metadata?.namespace
134+
}?dashboard=grafana-dashboard-k8s-resources-workload&workload=${
135+
resource?.metadata?.name
136+
}&type=${resource?.kind?.toLowerCase()}`}
144137
data-test="observe-dashboards-link"
145138
>
146139
{t('devconsole~View dashboards')}

frontend/packages/dev-console/src/components/monitoring/overview/MonitoringOverviewAlerts.tsx

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ import * as React from 'react';
22
import { Alert } from '@patternfly/react-core';
33
import * as _ from 'lodash';
44
import { Link } from 'react-router-dom-v5-compat';
5-
import { Alert as AlertType } from '@console/dynamic-plugin-sdk';
5+
import { Alert as AlertType, useActivePerspective } from '@console/dynamic-plugin-sdk';
66
import { labelsToParams } from '@console/internal/components/monitoring/utils';
77
import { fromNow } from '@console/internal/components/utils/datetime';
88
import { sortMonitoringAlerts } from '@console/shared';
@@ -14,6 +14,7 @@ interface MonitoringOverviewAlertsProps {
1414
}
1515

1616
const MonitoringOverviewAlerts: React.FC<MonitoringOverviewAlertsProps> = ({ alerts }) => {
17+
const [activePerspective, setActivePerspective] = useActivePerspective();
1718
const sortedAlerts = sortMonitoringAlerts(alerts);
1819

1920
return (
@@ -22,15 +23,26 @@ const MonitoringOverviewAlerts: React.FC<MonitoringOverviewAlertsProps> = ({ ale
2223
const {
2324
activeAt,
2425
annotations: { message },
25-
labels: { severity, alertname },
26+
labels: { severity, alertname, namespace },
2627
rule: { name, id },
2728
} = alert;
28-
const alertDetailsPageLink = `/monitoring/alerts/${id}?${labelsToParams(alert.labels)}`;
29+
const alertDetailsPageLink =
30+
activePerspective === 'dev'
31+
? `/dev-monitoring/ns/${namespace}/alerts/${id}?${labelsToParams(alert.labels)}`
32+
: `/monitoring/alerts/${id}?${labelsToParams(alert.labels)}`;
2933
return (
3034
<Alert
3135
variant={getAlertType(severity)}
3236
isInline
3337
title={<Link to={alertDetailsPageLink}>{name}</Link>}
38+
onClick={() => {
39+
if (
40+
alertDetailsPageLink.startsWith('/dev-monitoring') &&
41+
activePerspective !== 'dev'
42+
) {
43+
setActivePerspective('dev');
44+
}
45+
}}
3446
key={`${alertname}-${id}`}
3547
>
3648
{message}

frontend/public/components/graphs/__tests__/prometheus-graph.spec.tsx

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,13 +78,14 @@ describe('PrometheusGraphLink', () => {
7878
},
7979
{
8080
perspective: 'dev',
81-
expectedUrl: '/monitoring/query-browser?query0=test&namespace=default',
81+
expectedUrl: '/dev-monitoring/ns/default/metrics?query0=test&namespace=default',
8282
description: 'dev perspective graph link',
8383
},
8484
];
8585

8686
testScenarios.forEach(({ perspective, expectedUrl, description }) => {
8787
it(`should generate correct URL for ${description}`, () => {
88+
store.dispatch(setFlag(FLAGS.CAN_GET_NS, true));
8889
useActivePerspectiveMock.mockReturnValue([perspective, () => {}]);
8990

9091
renderWithProviders(

frontend/public/components/graphs/prometheus-graph.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@ import { FLAGS } from '@console/shared/src/constants/common';
99
import { featureReducerName } from '../../reducers/features';
1010
import { getActiveNamespace } from '../../reducers/ui';
1111
import { RootState } from '../../redux';
12+
import { useActivePerspective } from '@console/dynamic-plugin-sdk/src';
1213

1314
const mapStateToProps = (state: RootState) => ({
1415
canAccessMonitoring:
@@ -17,11 +18,13 @@ const mapStateToProps = (state: RootState) => ({
1718
});
1819

1920
const PrometheusGraphLink_: React.FC<PrometheusGraphLinkProps> = ({
21+
canAccessMonitoring,
2022
children,
2123
query,
2224
namespace,
2325
ariaChartLinkLabel,
2426
}) => {
27+
const [activePerspective, setActivePerspective] = useActivePerspective();
2528
const queries = _.compact(_.castArray(query));
2629
if (!queries.length) {
2730
return <>{children}</>;
@@ -31,13 +34,21 @@ const PrometheusGraphLink_: React.FC<PrometheusGraphLinkProps> = ({
3134
queries.forEach((q, index) => params.set(`query${index}`, q));
3235
params.set('namespace', namespace);
3336

34-
const url = `/monitoring/query-browser?${params.toString()}`;
37+
const url =
38+
canAccessMonitoring && activePerspective !== 'dev'
39+
? `/monitoring/query-browser?${params.toString()}`
40+
: `/dev-monitoring/ns/${namespace}/metrics?${params.toString()}`;
3541

3642
return (
3743
<Link
3844
to={url}
3945
aria-label={ariaChartLinkLabel}
4046
style={{ color: 'inherit', textDecoration: 'none' }}
47+
onClick={() => {
48+
if (url.startsWith('/dev-monitoring/') && activePerspective !== 'dev') {
49+
setActivePerspective('dev');
50+
}
51+
}}
4152
>
4253
{children}
4354
</Link>
@@ -59,6 +70,7 @@ export const PrometheusGraph: React.FC<PrometheusGraphProps> = React.forwardRef(
5970
);
6071

6172
type PrometheusGraphLinkProps = {
73+
canAccessMonitoring: boolean;
6274
query: string | string[];
6375
namespace?: string;
6476
ariaChartLinkLabel?: string;

0 commit comments

Comments
 (0)