Contact points tab: Remove error count in integrations details and show only Error label (#57325)

This commit is contained in:
Sonia Aguilar
2022-10-20 18:24:32 +02:00
committed by GitHub
parent 47eb7f785d
commit a61e044d00
2 changed files with 9 additions and 14 deletions

View File

@@ -564,12 +564,12 @@ describe('Receivers', () => {
// expand contact point detail for default 2 emails - 2 errors // expand contact point detail for default 2 emails - 2 errors
await userEvent.click(ui.contactPointsCollapseToggle.get(receiverRows[0])); await userEvent.click(ui.contactPointsCollapseToggle.get(receiverRows[0]));
const defaultDetailTable = screen.getAllByTestId('dynamic-table')[1]; const defaultDetailTable = screen.getAllByTestId('dynamic-table')[1];
expect(byText('1 error').getAll(defaultDetailTable)).toHaveLength(1); expect(byText('Error').getAll(defaultDetailTable)).toHaveLength(1);
// expand contact point detail for slack and pagerduty - 0 errors // expand contact point detail for slack and pagerduty - 0 errors
await userEvent.click(ui.contactPointsCollapseToggle.get(receiverRows[1])); await userEvent.click(ui.contactPointsCollapseToggle.get(receiverRows[1]));
const criticalDetailTable = screen.getAllByTestId('dynamic-table')[2]; const criticalDetailTable = screen.getAllByTestId('dynamic-table')[2];
expect(byText('1 error').query(criticalDetailTable)).toBeNull(); expect(byText('Error').query(criticalDetailTable)).toBeNull();
expect(byText('OK').getAll(criticalDetailTable)).toHaveLength(2); expect(byText('OK').getAll(criticalDetailTable)).toHaveLength(2);
}); });
it('Should render no attempt message when there are some points state with null lastNotifyAttempt, and "-" in null values', async () => { it('Should render no attempt message when there are some points state with null lastNotifyAttempt, and "-" in null values', async () => {
@@ -635,7 +635,7 @@ describe('Receivers', () => {
// expand contact point detail for default 2 emails - 2 errors // expand contact point detail for default 2 emails - 2 errors
await userEvent.click(ui.contactPointsCollapseToggle.get(receiverRows[0])); await userEvent.click(ui.contactPointsCollapseToggle.get(receiverRows[0]));
const defaultDetailTable = screen.getAllByTestId('dynamic-table')[1]; const defaultDetailTable = screen.getAllByTestId('dynamic-table')[1];
expect(byText('1 error').getAll(defaultDetailTable)).toHaveLength(1); expect(byText('Error').getAll(defaultDetailTable)).toHaveLength(1);
// expand contact point detail for slack and pagerduty - 0 errors // expand contact point detail for slack and pagerduty - 0 errors
await userEvent.click(ui.contactPointsCollapseToggle.get(receiverRows[1])); await userEvent.click(ui.contactPointsCollapseToggle.get(receiverRows[1]));

View File

@@ -79,17 +79,12 @@ function ViewAction({ permissions, alertManagerName, receiverName }: ActionProps
interface ReceiverErrorProps { interface ReceiverErrorProps {
errorCount: number; errorCount: number;
errorDetail?: string; errorDetail?: string;
showErrorCount: boolean;
} }
function ReceiverError({ errorCount, errorDetail }: ReceiverErrorProps) { function ReceiverError({ errorCount, errorDetail, showErrorCount }: ReceiverErrorProps) {
return ( const text = showErrorCount ? `${errorCount} ${pluralize('error', errorCount)}` : 'Error';
<Badge return <Badge color="orange" icon="exclamation-triangle" text={text} tooltip={errorDetail ?? 'Error'} />;
color="orange"
icon="exclamation-triangle"
text={`${errorCount} ${pluralize('error', errorCount)}`}
tooltip={errorDetail ?? 'Error'}
/>
);
} }
interface NotifierHealthProps { interface NotifierHealthProps {
errorsByNotifier: number; errorsByNotifier: number;
@@ -101,7 +96,7 @@ function NotifierHealth({ errorsByNotifier, errorDetail, lastNotify }: NotifierH
const noErrorsColor = isLastNotifyNullDate(lastNotify) ? 'orange' : 'green'; const noErrorsColor = isLastNotifyNullDate(lastNotify) ? 'orange' : 'green';
const noErrorsText = isLastNotifyNullDate(lastNotify) ? 'No attempts' : 'OK'; const noErrorsText = isLastNotifyNullDate(lastNotify) ? 'No attempts' : 'OK';
return errorsByNotifier > 0 ? ( return errorsByNotifier > 0 ? (
<ReceiverError errorCount={errorsByNotifier} errorDetail={errorDetail} /> <ReceiverError errorCount={errorsByNotifier} errorDetail={errorDetail} showErrorCount={false} />
) : ( ) : (
<Badge color={noErrorsColor} text={noErrorsText} tooltip="" /> <Badge color={noErrorsColor} text={noErrorsText} tooltip="" />
); );
@@ -116,7 +111,7 @@ function ReceiverHealth({ errorsByReceiver, someWithNoAttempt }: ReceiverHealthP
const noErrorsColor = someWithNoAttempt ? 'orange' : 'green'; const noErrorsColor = someWithNoAttempt ? 'orange' : 'green';
const noErrorsText = someWithNoAttempt ? 'No attempts' : 'OK'; const noErrorsText = someWithNoAttempt ? 'No attempts' : 'OK';
return errorsByReceiver > 0 ? ( return errorsByReceiver > 0 ? (
<ReceiverError errorCount={errorsByReceiver} /> <ReceiverError errorCount={errorsByReceiver} showErrorCount={true} />
) : ( ) : (
<Badge color={noErrorsColor} text={noErrorsText} tooltip="" /> <Badge color={noErrorsColor} text={noErrorsText} tooltip="" />
); );