mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Alerting: Separate overlapping legacy and UA alerting routes (#76517)
* Separate overlapping legacy and UA alerting routes api/alert-notifiers, alerting/list, and alerting/notifications existed in both legacy and UA. Rename legacy route paths and nav ids to be independent of UA ones.
This commit is contained in:
@@ -61,6 +61,8 @@ export function getNavTitle(navId: string | undefined) {
|
||||
return t('nav.alerting-home.title', 'Home');
|
||||
case 'alert-list':
|
||||
return t('nav.alerting-list.title', 'Alert rules');
|
||||
case 'alert-list-legacy':
|
||||
return t('nav.alert-list-legacy.title', 'Alert rules');
|
||||
case 'receivers':
|
||||
return t('nav.alerting-receivers.title', 'Contact points');
|
||||
case 'am-routes':
|
||||
|
||||
@@ -95,7 +95,7 @@ export class AlertRuleListUnconnected extends PureComponent<Props> {
|
||||
const { alertRules, search, isLoading } = this.props;
|
||||
|
||||
return (
|
||||
<Page navId="alert-list">
|
||||
<Page navId="alert-list-legacy">
|
||||
<Page.Contents isLoading={isLoading}>
|
||||
<div className="page-action-bar">
|
||||
<div className="gf-form gf-form--grow">
|
||||
@@ -117,7 +117,7 @@ export class AlertRuleListUnconnected extends PureComponent<Props> {
|
||||
</div>
|
||||
<div className="page-action-bar__spacer" />
|
||||
{config.unifiedAlertingEnabled && (
|
||||
<LinkButton variant="primary" href="alerting/ng/new">
|
||||
<LinkButton variant="primary" href="alerting-legacy/ng/new">
|
||||
Add NG Alert
|
||||
</LinkButton>
|
||||
)}
|
||||
|
||||
@@ -57,7 +57,7 @@ const NotificationsListPage: FC = () => {
|
||||
<>
|
||||
<div className="page-action-bar">
|
||||
<div className="page-action-bar__spacer" />
|
||||
<LinkButton icon="channel-add" href="alerting/notification/new">
|
||||
<LinkButton icon="channel-add" href="alerting-legacy/notification/new">
|
||||
New channel
|
||||
</LinkButton>
|
||||
</div>
|
||||
@@ -75,10 +75,10 @@ const NotificationsListPage: FC = () => {
|
||||
{notifications.map((notification) => (
|
||||
<tr key={notification.id}>
|
||||
<td className="link-td">
|
||||
<a href={`alerting/notification/${notification.id}/edit`}>{notification.name}</a>
|
||||
<a href={`alerting-legacy/notification/${notification.id}/edit`}>{notification.name}</a>
|
||||
</td>
|
||||
<td className="link-td">
|
||||
<a href={`alerting/notification/${notification.id}/edit`}>{notification.type}</a>
|
||||
<a href={`alerting-legacy/notification/${notification.id}/edit`}>{notification.type}</a>
|
||||
</td>
|
||||
<td className="text-right">
|
||||
<HorizontalGroup justify="flex-end">
|
||||
@@ -108,7 +108,7 @@ const NotificationsListPage: FC = () => {
|
||||
<EmptyListCTA
|
||||
title="There are no notification channels defined yet"
|
||||
buttonIcon="channel-add"
|
||||
buttonLink="alerting/notification/new"
|
||||
buttonLink="alerting-legacy/notification/new"
|
||||
buttonTitle="Add channel"
|
||||
proTip="You can include images in your alert notifications."
|
||||
proTipLink="http://docs.grafana.org/alerting/notifications/"
|
||||
|
||||
@@ -106,7 +106,7 @@ export const NotificationChannelForm = ({
|
||||
<Button type="button" variant="secondary" onClick={() => onTestChannel(getValues())}>
|
||||
Test
|
||||
</Button>
|
||||
<a href={`${config.appSubUrl}/alerting/notifications`}>
|
||||
<a href={`${config.appSubUrl}/alerting-legacy/notifications`}>
|
||||
<Button type="button" variant="secondary">
|
||||
Back
|
||||
</Button>
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { uniq } from 'lodash';
|
||||
import React from 'react';
|
||||
import { Redirect, RouteComponentProps } from 'react-router-dom';
|
||||
|
||||
import { SafeDynamicImport } from 'app/core/components/DynamicImports/SafeDynamicImport';
|
||||
import { NavLandingPage } from 'app/core/components/NavLandingPage/NavLandingPage';
|
||||
@@ -14,73 +15,79 @@ const commonRoutes: RouteDescriptor[] = [];
|
||||
const legacyRoutes: RouteDescriptor[] = [
|
||||
...commonRoutes,
|
||||
{
|
||||
path: '/alerting',
|
||||
path: '/alerting-legacy',
|
||||
component: () => <NavLandingPage navId="alerting-legacy" />,
|
||||
},
|
||||
{
|
||||
path: '/alerting/list',
|
||||
path: '/alerting-legacy/list',
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "AlertRuleListIndex" */ 'app/features/alerting/AlertRuleList')
|
||||
() => import(/* webpackChunkName: "AlertRuleListLegacyIndex" */ 'app/features/alerting/AlertRuleList')
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/ng/list',
|
||||
path: '/alerting-legacy/ng/list',
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "AlertRuleList" */ 'app/features/alerting/AlertRuleList')
|
||||
() => import(/* webpackChunkName: "AlertRuleListLegacy" */ 'app/features/alerting/AlertRuleList')
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/notifications',
|
||||
path: '/alerting-legacy/notifications',
|
||||
roles: config.unifiedAlertingEnabled ? () => ['Editor', 'Admin'] : undefined,
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "NotificationsListPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
() => import(/* webpackChunkName: "NotificationsListLegacyPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/notifications/templates/new',
|
||||
path: '/alerting-legacy/notifications/templates/new',
|
||||
roles: () => ['Editor', 'Admin'],
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "NotificationsListPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
() => import(/* webpackChunkName: "NotificationsListLegacyPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/notifications/templates/:id/edit',
|
||||
path: '/alerting-legacy/notifications/templates/:id/edit',
|
||||
roles: () => ['Editor', 'Admin'],
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "NotificationsListPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
() => import(/* webpackChunkName: "NotificationsListLegacyPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/notifications/receivers/new',
|
||||
path: '/alerting-legacy/notifications/receivers/new',
|
||||
roles: () => ['Editor', 'Admin'],
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "NotificationsListPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
() => import(/* webpackChunkName: "NotificationsListLegacyPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/notifications/receivers/:id/edit',
|
||||
path: '/alerting-legacy/notifications/receivers/:id/edit',
|
||||
roles: () => ['Editor', 'Admin'],
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "NotificationsListPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
() => import(/* webpackChunkName: "NotificationsListLegacyPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/notifications/global-config',
|
||||
path: '/alerting-legacy/notifications/global-config',
|
||||
roles: () => ['Admin', 'Editor'],
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "NotificationsListPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
() => import(/* webpackChunkName: "NotificationsListLegacyPage" */ 'app/features/alerting/NotificationsListPage')
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/notification/new',
|
||||
path: '/alerting-legacy/notification/new',
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "NewNotificationChannel" */ 'app/features/alerting/NewNotificationChannelPage')
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "NewNotificationChannelLegacy" */ 'app/features/alerting/NewNotificationChannelPage'
|
||||
)
|
||||
),
|
||||
},
|
||||
{
|
||||
path: '/alerting/notification/:id/edit',
|
||||
path: '/alerting-legacy/notification/:id/edit',
|
||||
component: SafeDynamicImport(
|
||||
() => import(/* webpackChunkName: "EditNotificationChannel"*/ 'app/features/alerting/EditNotificationChannelPage')
|
||||
() =>
|
||||
import(
|
||||
/* webpackChunkName: "EditNotificationChannelLegacy"*/ 'app/features/alerting/EditNotificationChannelPage'
|
||||
)
|
||||
),
|
||||
},
|
||||
];
|
||||
@@ -295,7 +302,32 @@ export function getAlertingRoutes(cfg = config): RouteDescriptor[] {
|
||||
if (cfg.unifiedAlertingEnabled) {
|
||||
return unifiedRoutes;
|
||||
} else if (cfg.alertingEnabled) {
|
||||
return legacyRoutes;
|
||||
// Redirect old overlapping legacy routes to new separate ones to minimize unintended 404s.
|
||||
const redirects = [
|
||||
{
|
||||
path: '/alerting',
|
||||
component: () => <Redirect to={'/alerting-legacy'} />,
|
||||
},
|
||||
{
|
||||
path: '/alerting/list',
|
||||
component: () => <Redirect to={'/alerting-legacy/list'} />,
|
||||
},
|
||||
{
|
||||
path: '/alerting/notifications',
|
||||
component: () => <Redirect to={'/alerting-legacy/notifications'} />,
|
||||
},
|
||||
{
|
||||
path: '/alerting/notification/new',
|
||||
component: () => <Redirect to={'/alerting-legacy/notification/new'} />,
|
||||
},
|
||||
{
|
||||
path: '/alerting/notification/:id/edit',
|
||||
component: (props: RouteComponentProps<{ id: string }>) => (
|
||||
<Redirect to={'/alerting-legacy/notification/:id/edit'.replace(':id', props.match.params.id)} />
|
||||
),
|
||||
},
|
||||
];
|
||||
return [...legacyRoutes, ...redirects];
|
||||
}
|
||||
|
||||
const uniquePaths = uniq([...legacyRoutes, ...unifiedRoutes].map((route) => route.path));
|
||||
|
||||
@@ -26,7 +26,7 @@ export function createNotificationChannel(data: any): ThunkResult<Promise<void>>
|
||||
try {
|
||||
await getBackendSrv().post(`/api/alert-notifications`, data);
|
||||
dispatch(notifyApp(createSuccessNotification('Notification created')));
|
||||
locationService.push('/alerting/notifications');
|
||||
locationService.push('/alerting-legacy/notifications');
|
||||
} catch (error) {
|
||||
if (isFetchError(error)) {
|
||||
dispatch(notifyApp(createErrorNotification(error.data.error)));
|
||||
@@ -57,7 +57,7 @@ export function testNotificationChannel(data: any): ThunkResult<void> {
|
||||
|
||||
export function loadNotificationTypes(): ThunkResult<void> {
|
||||
return async (dispatch) => {
|
||||
const alertNotifiers: NotifierDTO[] = await getBackendSrv().get(`/api/alert-notifiers`);
|
||||
const alertNotifiers: NotifierDTO[] = await getBackendSrv().get(`/api/alert-notifiers-legacy`);
|
||||
|
||||
const notificationTypes = alertNotifiers.sort((o1, o2) => {
|
||||
if (o1.name > o2.name) {
|
||||
|
||||
Reference in New Issue
Block a user