Add EmptyState to Lighthouse Router

plugins/lighthouse/package.json

@@ -35,7 +35,8 @@
     "react-dom": "^16.13.1",
     "react-markdown": "^4.3.1",
     "react-router-dom": "6.0.0-beta.0",
-    "react-use": "^15.3.3"
+    "react-use": "^15.3.3",
+    "@types/react": "^16.9.50"
   },
   "devDependencies": {
     "@backstage/cli": "^0.1.1-alpha.24",

plugins/lighthouse/src/Router.tsx

@@ -23,6 +23,7 @@ import CreateAudit, { CreateAuditContent } from './components/CreateAudit';
 import { Entity } from '@backstage/catalog-model';
 import { LIGHTHOUSE_WEBSITE_URL_ANNOTATION } from '../constants';
 import { AuditListForEntity } from './components/AuditList/AuditListForEntity';
+import { EmptyState } from '@backstage/core';
 
 export const isPluginApplicableToEntity = (entity: Entity) =>
   Boolean(entity.metadata.annotations?.[LIGHTHOUSE_WEBSITE_URL_ANNOTATION]) ||
@@ -36,13 +37,23 @@ export const Router = () => (
   </Routes>
 );
 
-export const EmbeddedRouter = () => (
-  <Routes>
-    <Route path={`/${rootRouteRef.path}`} element={<AuditListForEntity />} />
-    <Route path={`/${viewAuditRouteRef.path}`} element={<AuditViewContent />} />
-    <Route
-      path={`/${createAuditRouteRef.path}`}
-      element={<CreateAuditContent />}
+export const EmbeddedRouter = ({ entity }: { entity: Entity }) =>
+  !isPluginApplicableToEntity(entity) ? (
+    <EmptyState
+      missing="field"
+      title="Your plugin is missing an annotation"
+      description={`Please add the ${LIGHTHOUSE_WEBSITE_URL_ANNOTATION} annotation`}
     />
-  </Routes>
-);
+  ) : (
+    <Routes>
+      <Route path={`/${rootRouteRef.path}`} element={<AuditListForEntity />} />
+      <Route
+        path={`/${viewAuditRouteRef.path}`}
+        element={<AuditViewContent />}
+      />
+      <Route
+        path={`/${createAuditRouteRef.path}`}
+        element={<CreateAuditContent />}
+      />
+    </Routes>
+  );

yarn.lock

@@ -5430,6 +5430,14 @@
   dependencies:
     csstype "^2.2.0"
 
+"@types/react@^16.9.50":
+  version "16.9.50"
+  resolved "https://registry.npmjs.org/@types/react/-/react-16.9.50.tgz#cb5f2c22d42de33ca1f5efc6a0959feb784a3a2d"
+  integrity sha512-kPx5YsNnKDJejTk1P+lqThwxN2PczrocwsvqXnjvVvKpFescoY62ZiM3TV7dH1T8lFhlHZF+PE5xUyimUwqEGA==
+  dependencies:
+    "@types/prop-types" "*"
+    csstype "^3.0.2"
+
 "@types/reactcss@*":
   version "1.2.3"
   resolved "https://registry.npmjs.org/@types/reactcss/-/reactcss-1.2.3.tgz#af28ae11bbb277978b99d04d1eedfd068ca71834"
@@ -9316,6 +9324,11 @@ csstype@^2.2.0, csstype@^2.5.2, csstype@^2.5.5, csstype@^2.5.7, csstype@^2.6.5,
   resolved "https://registry.npmjs.org/csstype/-/csstype-2.6.9.tgz#05141d0cd557a56b8891394c1911c40c8a98d098"
   integrity sha512-xz39Sb4+OaTsULgUERcCk+TJj8ylkL4aSVDQiX/ksxbELSqwkgt4d4RD7fovIdgJGSuNYqwZEiVjYY5l0ask+Q==
 
+csstype@^3.0.2:
+  version "3.0.3"
+  resolved "https://registry.npmjs.org/csstype/-/csstype-3.0.3.tgz#2b410bbeba38ba9633353aff34b05d9755d065f8"
+  integrity sha512-jPl+wbWPOWJ7SXsWyqGRk3lGecbar0Cb0OvZF/r/ZU011R4YqiRehgkQ9p4eQfo9DSDLqLL3wHwfxeJiuIsNag==
+
 csv-generate@^3.2.4:
   version "3.2.4"
   resolved "https://registry.npmjs.org/csv-generate/-/csv-generate-3.2.4.tgz#440dab9177339ee0676c9e5c16f50e2b3463c019"