front/plugins/home-page: list components

frontend/packages/plugins/home-page/src/components/HomePage/HomePage.tsx

@@ -1,5 +1,11 @@
 import React, { FC } from 'react';
-import { Typography, makeStyles, Theme, Grid } from '@material-ui/core';
+import {
+  Typography,
+  makeStyles,
+  Theme,
+  Grid,
+  LinearProgress,
+} from '@material-ui/core';
 import HomePageTimer from '../HomepageTimer';
 import {
   EntityLink,
@@ -10,6 +16,37 @@ import {
   theme,
 } from '@backstage/core';
 import SquadTechHealth from './SquadTechHealth';
+import { useAsync } from 'react-use';
+
+import { inventoryV1 } from '@backstage/protobuf-definitions';
+
+const client = new inventoryV1.Client('http://localhost:8080');
+
+const entityUriRegex = /boss:\/\/service\/(.*)/;
+
+async function fetchServices() {
+  const req = new inventoryV1.ListEntitiesRequest();
+  req.setUriprefix('boss://service/');
+  const res = await client.listEntities(req);
+
+  return res
+    .getEntitiesList()
+    .map(entity => {
+      const match = entity.getUri()?.match(entityUriRegex);
+      console.log('DEBUG: match =', match);
+      if (!match) {
+        return undefined;
+      }
+      return { id: match[1], kind: 'service' };
+    })
+    .filter(Boolean)
+    .map(x => x!);
+}
+
+const STATIC_DATA = [
+  { id: 'backstage', kind: 'service' },
+  { id: 'backstage-microsite', kind: 'website' },
+];
 
 const useStyles = makeStyles<Theme>(theme => ({
   mainContentArea: {
@@ -26,15 +63,17 @@ const useStyles = makeStyles<Theme>(theme => ({
 
 const HomePage: FC<{}> = () => {
   const classes = useStyles();
+  const status = useAsync(fetchServices);
   const columns = [
     { id: 'entity', label: 'ID' },
     { id: 'kind', label: 'Kind' },
   ];
 
-  const data = [
-    { id: 'backstage', kind: 'service' },
-    { id: 'backstage-microsite', kind: 'website' },
-  ].map(({ id, kind }) => {
+  if (status.loading) {
+    return <LinearProgress />;
+  }
+
+  const data = STATIC_DATA.concat(status?.value ?? []).map(({ id, kind }) => {
     return {
       id,
       entity: (