chore: fix up the changeset

Signed-off-by: blam <ben@blam.sh>

.changeset/sour-eggs-kick.md

@@ -5,5 +5,6 @@
 
 Added the following deprecations to the `catalog-react` package:
 
-- **DEPRECATION**: `useEntity` will now warn if the entity has not yet been loaded. This hook is now designed only to be used inside of an `EntityPage` where the `entity` prop is guaranteed to be defined. If you would like to use it outside, please use `useAsyncEntity` instead.
+- **DEPRECATION**: `useEntity` will now warn if the entity has not yet been loaded, and will soon throw errors instead. If you're using the default implementation of `EntityLayout` and `EntitySwitch` then these components will ensure that there is an entity loaded before rendering children. If you're implementing your own `EntityLayout` or `EntitySwitch` or something that operates outside or adjacent to them, then use `useAsyncEntity`.
+
 - **DEPRECATION**: the `loading`, `error` and `refresh` properties that are returned from `useEntity` have been deprecated, and are available on `useAsyncEntity` instead.

plugins/catalog-react/src/hooks/useEntity.tsx

@@ -182,7 +182,7 @@ export function useEntity<T extends Entity = Entity>(): UseEntityResponse<T> {
 
     // eslint-disable-next-line no-console
     console.warn(
-      'DEPRECATION: useEntity hook is being called outside of an EntityPage where the entity has not been loaded. If this is intentional, please use useAsyncEntity instead. This warning will be replaced with an error in future releases.',
+      'DEPRECATION: useEntity hook is being called outside of an EntityLayout where the entity has not been loaded. If this is intentional, please use useAsyncEntity instead. This warning will be replaced with an error in future releases.',
     );
   }
 

plugins/catalog/src/components/EntityLayout/EntityLayout.tsx

@@ -40,7 +40,7 @@ import {
   getEntityRelations,
   InspectEntityDialog,
   UnregisterEntityDialog,
-  useEntity,
+  useAsyncEntity,
   useEntityCompoundName,
 } from '@backstage/plugin-catalog-react';
 import { Box, TabProps } from '@material-ui/core';
@@ -177,7 +177,7 @@ export const EntityLayout = (props: EntityLayoutProps) => {
     children,
   } = props;
   const { kind, namespace, name } = useEntityCompoundName();
-  const { entity, loading, error } = useEntity();
+  const { entity, loading, error } = useAsyncEntity();
   const location = useLocation();
   const routes = useElementFilter(
     children,
@@ -190,7 +190,9 @@ export const EntityLayout = (props: EntityLayoutProps) => {
         })
         .getElements<EntityLayoutRouteProps>() // all nodes, element data, maintain structure or not?
         .flatMap(({ props: elementProps }) => {
-          if (elementProps.if && entity && !elementProps.if(entity)) {
+          if (!entity) {
+            return [];
+          } else if (elementProps.if && !elementProps.if(entity)) {
             return [];
           }