diff --git a/.changeset/twelve-doors-speak.md b/.changeset/twelve-doors-speak.md
new file mode 100644
index 0000000000..ac88bf561a
--- /dev/null
+++ b/.changeset/twelve-doors-speak.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-tech-insights': patch
+---
+
+Added `onlyFailed` prop to `ScorecardsCard`, and `isFailed` to each check type.
diff --git a/plugins/tech-insights/api-report.md b/plugins/tech-insights/api-report.md
index 1e07c0fc69..5544299bf2 100644
--- a/plugins/tech-insights/api-report.md
+++ b/plugins/tech-insights/api-report.md
@@ -39,6 +39,7 @@ export type CheckResultRenderer = {
type: string;
component: (check: CheckResult) => React_2.ReactElement;
description?: (check: CheckResult) => string | React_2.ReactElement;
+ isFailed?: (check: CheckResult) => boolean;
};
// @public (undocumented)
@@ -46,6 +47,7 @@ export const EntityTechInsightsScorecardCard: (props: {
title: string;
description?: string | undefined;
checksId?: string[] | undefined;
+ onlyFailed?: boolean | undefined;
}) => JSX_2.Element;
// @public (undocumented)
@@ -73,6 +75,7 @@ export const ScorecardInfo: (props: {
checkResults: CheckResult[];
title: string;
description?: string | undefined;
+ noWarning?: boolean | undefined;
}) => JSX_2.Element;
// @public (undocumented)
diff --git a/plugins/tech-insights/src/components/BooleanCheck/BooleanCheck.tsx b/plugins/tech-insights/src/components/BooleanCheck/BooleanCheck.tsx
index 17758e8ee4..5729387372 100644
--- a/plugins/tech-insights/src/components/BooleanCheck/BooleanCheck.tsx
+++ b/plugins/tech-insights/src/components/BooleanCheck/BooleanCheck.tsx
@@ -29,3 +29,9 @@ export const BooleanCheck = (props: { checkResult: CheckResult }) => {
);
};
+
+/**
+ * @public
+ */
+export const isBooleanCheckFailed = (checkResult: CheckResult) =>
+ !checkResult.result;
diff --git a/plugins/tech-insights/src/components/BooleanCheck/index.ts b/plugins/tech-insights/src/components/BooleanCheck/index.ts
index 729ab4d62e..accb43f464 100644
--- a/plugins/tech-insights/src/components/BooleanCheck/index.ts
+++ b/plugins/tech-insights/src/components/BooleanCheck/index.ts
@@ -14,4 +14,4 @@
* limitations under the License.
*/
-export { BooleanCheck } from './BooleanCheck';
+export { BooleanCheck, isBooleanCheckFailed } from './BooleanCheck';
diff --git a/plugins/tech-insights/src/components/CheckResultRenderer.tsx b/plugins/tech-insights/src/components/CheckResultRenderer.tsx
index 7db3c72c02..8dc0a13517 100644
--- a/plugins/tech-insights/src/components/CheckResultRenderer.tsx
+++ b/plugins/tech-insights/src/components/CheckResultRenderer.tsx
@@ -16,7 +16,7 @@
import { CheckResult } from '@backstage/plugin-tech-insights-common';
import React from 'react';
-import { BooleanCheck } from './BooleanCheck';
+import { BooleanCheck, isBooleanCheckFailed } from './BooleanCheck';
/**
* Defines a react component that is responsible for rendering a result of a given type.
@@ -27,6 +27,7 @@ export type CheckResultRenderer = {
type: string;
component: (check: CheckResult) => React.ReactElement;
description?: (check: CheckResult) => string | React.ReactElement;
+ isFailed?: (check: CheckResult) => boolean;
};
/**
@@ -39,4 +40,5 @@ export const jsonRulesEngineCheckResultRenderer: CheckResultRenderer = {
component: (checkResult: CheckResult) => (
),
+ isFailed: isBooleanCheckFailed,
};
diff --git a/plugins/tech-insights/src/components/ScorecardsCard/ScorecardsCard.tsx b/plugins/tech-insights/src/components/ScorecardsCard/ScorecardsCard.tsx
index 4bbc283829..7f69b9432d 100644
--- a/plugins/tech-insights/src/components/ScorecardsCard/ScorecardsCard.tsx
+++ b/plugins/tech-insights/src/components/ScorecardsCard/ScorecardsCard.tsx
@@ -14,7 +14,7 @@
* limitations under the License.
*/
-import React from 'react';
+import React, { useMemo } from 'react';
import useAsync from 'react-use/lib/useAsync';
import { ErrorPanel, Progress } from '@backstage/core-components';
import { useApi } from '@backstage/core-plugin-api';
@@ -27,8 +27,9 @@ export const ScorecardsCard = (props: {
title: string;
description?: string;
checksId?: string[];
+ onlyFailed?: boolean;
}) => {
- const { title, description, checksId } = props;
+ const { title, description, checksId, onlyFailed } = props;
const api = useApi(techInsightsApiRef);
const { entity } = useEntity();
const { value, loading, error } = useAsync(
@@ -36,17 +37,34 @@ export const ScorecardsCard = (props: {
[api, entity, JSON.stringify(checksId)],
);
+ const checkResultRenderers = useMemo(() => {
+ if (!onlyFailed || !value) return {};
+
+ const types = [...new Set(value.map(({ check }) => check.type))];
+ const renderers = api.getCheckResultRenderers(types);
+ return Object.fromEntries(
+ renderers.map(renderer => [renderer.type, renderer]),
+ );
+ }, [api, value, onlyFailed]);
+
if (loading) {
return ;
} else if (error) {
return ;
}
+ const filteredValue = !onlyFailed
+ ? value || []
+ : (value || []).filter(val =>
+ checkResultRenderers[val.check.type]?.isFailed?.(val),
+ );
+
return (
);
};
diff --git a/plugins/tech-insights/src/components/ScorecardsInfo/ScorecardInfo.tsx b/plugins/tech-insights/src/components/ScorecardsInfo/ScorecardInfo.tsx
index 2a2ca982d1..40277f31f4 100644
--- a/plugins/tech-insights/src/components/ScorecardsInfo/ScorecardInfo.tsx
+++ b/plugins/tech-insights/src/components/ScorecardsInfo/ScorecardInfo.tsx
@@ -54,11 +54,22 @@ export const ScorecardInfo = (props: {
checkResults: CheckResult[];
title: string;
description?: string;
+ noWarning?: boolean;
}) => {
- const { checkResults, title, description } = props;
+ const { checkResults, title, description, noWarning } = props;
const classes = useStyles();
if (!checkResults.length) {
+ if (noWarning) {
+ return infoCard(
+ title,
+ description,
+ classes.subheader,
+
+ All checks passed, or no checks have been performed yet
+ ,
+ );
+ }
return infoCard(
title,
description,