fix: github actions

packages/catalog-model/src/location/index.ts

@@ -16,3 +16,4 @@
 
 export type { Location, LocationSpec } from './types';
 export { locationSchema, locationSpecSchema } from './validation';
+export { LOCATION_ANNOTATION } from './annotation';

plugins/catalog-backend/src/database/CommonDatabase.ts

@@ -19,7 +19,12 @@ import {
   InputError,
   NotFoundError,
 } from '@backstage/backend-common';
-import type { Entity, EntityMeta, Location } from '@backstage/catalog-model';
+import {
+  Entity,
+  EntityMeta,
+  Location,
+  LOCATION_ANNOTATION,
+} from '@backstage/catalog-model';
 import Knex from 'knex';
 import lodash from 'lodash';
 import { v4 as uuidv4 } from 'uuid';
@@ -167,7 +172,7 @@ export class CommonDatabase implements Database {
       annotations: {
         ...(newEntity.metadata?.annotations ?? {}),
         ...(request.locationId
-          ? { 'backstage.io/managed-by-location': request.locationId }
+          ? { [LOCATION_ANNOTATION]: request.locationId }
           : {}),
       },
     };

plugins/catalog-backend/src/ingestion/HigherOrderOperations.ts

@@ -15,7 +15,12 @@
  */
 
 import { InputError } from '@backstage/backend-common';
-import { Entity, Location, LocationSpec } from '@backstage/catalog-model';
+import {
+  Entity,
+  Location,
+  LocationSpec,
+  LOCATION_ANNOTATION,
+} from '@backstage/catalog-model';
 import lodash from 'lodash';
 import { v4 as uuidv4 } from 'uuid';
 import { EntitiesCatalog, LocationsCatalog } from '../catalog';
@@ -23,8 +28,6 @@ import { IngestionModel } from '../ingestion';
 import { AddLocationResult, HigherOrderOperation } from './types';
 import { Logger } from 'winston';
 
-const LOCATION_ANNOTATION = 'backstage.io/managed-by-location';
-
 /**
  * Placeholder for operations that span several catalogs and/or stretches out
  * in time.

plugins/catalog/src/api/CatalogClient.ts

@@ -16,7 +16,11 @@
 
 import { CatalogApi } from './types';
 import { DescriptorEnvelope } from '../types';
-import { Entity, Location } from '@backstage/catalog-model';
+import {
+  Entity,
+  Location,
+  LOCATION_ANNOTATION,
+} from '@backstage/catalog-model';
 
 export class CatalogClient implements CatalogApi {
   private apiOrigin: string;
@@ -43,7 +47,7 @@ export class CatalogClient implements CatalogApi {
   }
   async getEntitiesByLocationId(id: string): Promise<Entity[]> {
     const response = await fetch(
-      `${this.apiOrigin}${this.basePath}/entities?backstage.io/managed-by-location=${id}`,
+      `${this.apiOrigin}${this.basePath}/entities?${LOCATION_ANNOTATION}=${id}`,
     );
     return await response.json();
   }
@@ -60,10 +64,7 @@ export class CatalogClient implements CatalogApi {
     throw new Error(`'Entity not found: ${name}`);
   }
   async getLocationByEntity(entity: Entity): Promise<Location | undefined> {
-    const findLocationIdInEntity = (e: Entity): string | undefined =>
-      e.metadata.annotations?.['backstage.io/managed-by-location'];
-
-    const locationId = findLocationIdInEntity(entity);
+    const locationId = entity.metadata.annotations?.[LOCATION_ANNOTATION];
     if (!locationId) return undefined;
 
     const location = this.getLocationById(locationId);

plugins/catalog/src/components/CatalogPage/CatalogPage.tsx

@@ -26,7 +26,7 @@ import {
   pageTheme,
   useApi,
 } from '@backstage/core';
-import { useAsync, useMountedState } from 'react-use';
+import { useAsync } from 'react-use';
 import CatalogTable from '../CatalogTable/CatalogTable';
 import {
   CatalogFilter,
@@ -35,7 +35,11 @@ import {
 import { Button, makeStyles, Typography, Link } from '@material-ui/core';
 import { filterGroups, defaultFilter } from '../../data/filters';
 import GitHub from '@material-ui/icons/GitHub';
-import { Entity, Location } from '@backstage/catalog-model';
+import {
+  Entity,
+  Location,
+  LOCATION_ANNOTATION,
+} from '@backstage/catalog-model';
 
 const useStyles = makeStyles(theme => ({
   contentWrapper: {
@@ -56,7 +60,6 @@ const CatalogPage: FC<{}> = () => {
   const [selectedFilter, setSelectedFilter] = useState<CatalogFilterItem>(
     defaultFilter,
   );
-  const isMounted = useMountedState();
 
   const onFilterSelected = useCallback(
     selected => setSelectedFilter(selected),
@@ -64,26 +67,26 @@ const CatalogPage: FC<{}> = () => {
   );
   const styles = useStyles();
 
-  const { value: locations = [] } = useAsync(async () => {
+  const { value: locations } = useAsync(async () => {
     const getLocationDataForEntities = async (entities: Entity[]) => {
       return Promise.all(
-        entities.map(entity => catalogApi.getLocationByEntity(entity)),
+        entities.map(entity => {
+          const locationId = entity.metadata.annotations?.[LOCATION_ANNOTATION];
+          if (!locationId) return undefined;
+
+          return catalogApi.getLocationById(locationId);
+        }),
       );
     };
 
     if (value) {
-      getLocationDataForEntities(value)
-        .then(
-          (location): Location[] =>
-            location.filter(loc => !!loc) as Array<Location>,
-        )
-        .then(locs => {
-          if (isMounted()) return locs;
-          return [];
-        });
+      return getLocationDataForEntities(value).then(
+        (location): Location[] =>
+          location.filter(loc => !!loc) as Array<Location>,
+      );
     }
     return [];
-  }, [value, catalogApi, isMounted, catalogApi]);
+  }, [value, catalogApi, catalogApi]);
   const actions = [
     (rowData: Component) => ({
       icon: GitHub,
@@ -139,9 +142,10 @@ const CatalogPage: FC<{}> = () => {
               components={
                 (value &&
                   value.map(val => {
-                    const loc =
-                      findLocationForEntity(val, locations) ?? undefined;
-                    return envelopeToComponent(val, loc);
+                    return {
+                      ...envelopeToComponent(val),
+                      location: findLocationForEntity(val, locations),
+                    };
                   })) ||
                 []
               }

plugins/catalog/src/components/ComponentPage/ComponentPage.tsx

@@ -54,9 +54,10 @@ const ComponentPage: FC<ComponentPageProps> = ({ match, history }) => {
   const errorApi = useApi<ErrorApi>(errorApiRef);
 
   const catalogApi = useApi(catalogApiRef);
-  const catalogRequest = useAsync(() =>
-    catalogApi.getEntityByName(match.params.name),
-  );
+  const catalogRequest = useAsync(async () => {
+    const entity = await catalogApi.getEntityByName(match.params.name);
+    return entity;
+  });
 
   useEffect(() => {
     if (catalogRequest.error) {
@@ -76,6 +77,7 @@ const ComponentPage: FC<ComponentPageProps> = ({ match, history }) => {
     setConfirmationDialogOpen(false);
     setRemovingPending(true);
     // await componentFactory.removeComponentByName(componentName);
+    await catalogApi;
     history.push('/catalog');
   };
 

plugins/catalog/src/components/ComponentRemovalDialog/ComponentRemovalDialog.tsx

@@ -26,8 +26,9 @@ import {
 } from '@material-ui/core';
 import { Component } from '../../data/component';
 import { useAsync } from 'react-use';
-import { useApi, Progress } from '@backstage/core';
+import { useApi } from '@backstage/core';
 import { catalogApiRef } from '../../api/types';
+import { Entity } from '@backstage/catalog-model';
 
 type ComponentRemovalDialogProps = {
   onConfirm: () => any;
@@ -41,18 +42,28 @@ const ComponentRemovalDialog: FC<ComponentRemovalDialogProps> = ({
   onClose,
   component,
 }) => {
+  const catalogApi = useApi(catalogApiRef);
+  const { value } = useAsync(async () => {
+    let colocatedEntities: Array<Entity> = [];
+    const locationId = component.location?.id;
+    if (locationId) {
+      colocatedEntities = await catalogApi.getEntitiesByLocationId(locationId);
+    }
+    return colocatedEntities;
+  });
   const theme = useTheme();
   const fullScreen = useMediaQuery(theme.breakpoints.down('sm'));
+  const infoMessage = `This action will unregister ${
+    value ? value.map(e => e.metadata.name).join(', ') : ''
+  } from location with target ${component.location?.target}. To undo,
+  just re-register the component in Backstage.`;
   return (
     <Dialog fullScreen={fullScreen} open onClose={onClose}>
       <DialogTitle id="responsive-dialog-title">
         Are you sure you want to unregister this component?
       </DialogTitle>
       <DialogContent>
-        <DialogContentText>
-          This action will unregister {component.name}. To undo, just
-          re-register the component in Backstage.
-        </DialogContentText>
+        <DialogContentText>{infoMessage}</DialogContentText>
       </DialogContent>
       <DialogActions>
         <Button onClick={onCancel} color="primary">

plugins/catalog/src/data/component.ts

@@ -13,6 +13,7 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+
 import { Location } from '@backstage/catalog-model';
 
 export type Component = {

plugins/catalog/src/data/utils.ts

@@ -14,24 +14,23 @@
  * limitations under the License.
  */
 import { Component } from './component';
-import { Entity, Location } from '@backstage/catalog-model';
+import {
+  Entity,
+  Location,
+  LOCATION_ANNOTATION,
+} from '@backstage/catalog-model';
 
-export const envelopeToComponent = (
-  envelope: Entity,
-  location?: Location,
-): Component => {
+export const envelopeToComponent = (envelope: Entity): Component => {
   return {
     name: envelope.metadata?.name ?? '',
     kind: envelope.kind ?? 'unknown',
     description: envelope.metadata?.annotations?.description ?? 'placeholder',
-    location,
   };
 };
 export const findLocationForEntity = (
   entity: Entity,
-  l: Location[],
+  locations: Location[],
 ): Location | undefined => {
-  const entityLocationId =
-    entity.metadata.annotations?.['backstage.io/managed-by-location'];
-  return l.find(location => location.id === entityLocationId);
+  const entityLocationId = entity.metadata.annotations?.[LOCATION_ANNOTATION];
+  return locations.find(location => location.id === entityLocationId);
 };