From f3d272cf579db99586e79bca9d698686079d05db Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fredrik=20Adel=C3=B6w?= <freben@gmail.com>
Date: Mon, 17 Oct 2022 12:08:05 +0200
Subject: [PATCH] Make sure to reload score card contents when props change
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Fredrik Adelöw <freben@gmail.com>
---
 .changeset/itchy-rockets-hide.md                       |  5 +++++
 .../src/components/ScorecardsCard/ScorecardsCard.tsx   | 10 +++++-----
 2 files changed, 10 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/itchy-rockets-hide.md

diff --git a/.changeset/itchy-rockets-hide.md b/.changeset/itchy-rockets-hide.md
new file mode 100644
index 0000000000..ec6df7fa6d
--- /dev/null
+++ b/.changeset/itchy-rockets-hide.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-tech-insights': patch
+---
+
+Make sure to reload score card contents when props change
diff --git a/plugins/tech-insights/src/components/ScorecardsCard/ScorecardsCard.tsx b/plugins/tech-insights/src/components/ScorecardsCard/ScorecardsCard.tsx
index 52909acad9..4bbc283829 100644
--- a/plugins/tech-insights/src/components/ScorecardsCard/ScorecardsCard.tsx
+++ b/plugins/tech-insights/src/components/ScorecardsCard/ScorecardsCard.tsx
@@ -16,10 +16,9 @@
 
 import React from 'react';
 import useAsync from 'react-use/lib/useAsync';
-import { Progress } from '@backstage/core-components';
+import { ErrorPanel, Progress } from '@backstage/core-components';
 import { useApi } from '@backstage/core-plugin-api';
 import { ScorecardInfo } from '../ScorecardsInfo';
-import Alert from '@material-ui/lab/Alert';
 import { techInsightsApiRef } from '../../api/TechInsightsApi';
 import { useEntity } from '@backstage/plugin-catalog-react';
 import { getCompoundEntityRef } from '@backstage/catalog-model';
@@ -31,15 +30,16 @@ export const ScorecardsCard = (props: {
 }) => {
   const { title, description, checksId } = props;
   const api = useApi(techInsightsApiRef);
-  const { namespace, kind, name } = getCompoundEntityRef(useEntity().entity);
+  const { entity } = useEntity();
   const { value, loading, error } = useAsync(
-    async () => await api.runChecks({ namespace, kind, name }, checksId),
+    async () => await api.runChecks(getCompoundEntityRef(entity), checksId),
+    [api, entity, JSON.stringify(checksId)],
   );
 
   if (loading) {
     return <Progress />;
   } else if (error) {
-    return <Alert severity="error">{error.message}</Alert>;
+    return <ErrorPanel error={error} />;
   }
 
   return (