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>
+  );