message: front/plugins/home-page: list components
diff: 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: (
  