diff --git a/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.test.ts b/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.test.tsx
similarity index 88%
rename from public/app/features/alerting/unified/components/amroutes/AmRoutesTable.test.ts
rename to public/app/features/alerting/unified/components/amroutes/AmRoutesTable.test.tsx
index a0ced048f8f..197145f8dd4 100644
--- a/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.test.ts
+++ b/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.test.tsx
@@ -1,9 +1,13 @@
+import { render, screen } from '@testing-library/react';
+import { noop } from 'lodash';
+import React from 'react';
+
import { MatcherOperator } from 'app/plugins/datasource/alertmanager/types';
import { FormAmRoute } from '../../types/amroutes';
import { MatcherFieldValue } from '../../types/silence-form';
-import { deleteRoute, getFilteredRoutes, updatedRoute } from './AmRoutesTable';
+import { AmRoutesTable, deleteRoute, getFilteredRoutes, updatedRoute } from './AmRoutesTable';
const defaultAmRoute: FormAmRoute = {
id: '',
@@ -189,4 +193,24 @@ describe('deleteRoute', () => {
expect(updatedRoutes[1].id).toBe('2');
expect(updatedRoutes[2].id).toBe('3');
});
+
+ it('Should warn about policies with no contact point', () => {
+ const routes: FormAmRoute[] = [
+ buildAmRoute({ id: 'no-contact-point' }),
+ buildAmRoute({ id: 'with-contact-point', receiver: 'TestContactPoint' }),
+ ];
+
+ render(
+
+ );
+ expect(screen.getByText('None')).toBeInTheDocument();
+ expect(screen.getByText('TestContactPoint')).toBeInTheDocument();
+ });
});
diff --git a/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.tsx b/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.tsx
index 9f34dbffd26..d6c17ff3965 100644
--- a/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.tsx
+++ b/public/app/features/alerting/unified/components/amroutes/AmRoutesTable.tsx
@@ -1,7 +1,7 @@
import { intersectionWith, isEqual } from 'lodash';
import React, { FC, useCallback, useEffect, useMemo, useState } from 'react';
-import { Button, ConfirmModal, HorizontalGroup, IconButton } from '@grafana/ui';
+import { Badge, Button, ConfirmModal, HorizontalGroup, IconButton, Tooltip } from '@grafana/ui';
import { contextSrv } from 'app/core/services/context_srv';
import { FormAmRoute } from '../../types/amroutes';
@@ -95,6 +95,10 @@ export const AmRoutesTable: FC = ({
const expandItem = useCallback((item: RouteTableItemProps) => setExpandedId(item.id), []);
const collapseItem = useCallback(() => setExpandedId(undefined), []);
+ const missingReceiver = (route: FormAmRoute) => {
+ return Boolean(route.receiver) === false;
+ };
+
const cols: RouteTableColumnProps[] = [
{
id: 'matchingCriteria',
@@ -120,12 +124,24 @@ export const AmRoutesTable: FC = ({
label: 'Contact point',
renderCell: (item) => {
const type = getGrafanaAppReceiverType(receivers, item.data.receiver);
- return item.data.receiver ? (
- <>
- {item.data.receiver} {type && }
- >
- ) : (
- '-'
+
+ if (!missingReceiver(item.data)) {
+ return (
+ <>
+ {item.data.receiver} {type && }
+ >
+ );
+ }
+
+ return (
+
+
+
+
+
);
},
size: 5,