From 6fe5d70cace2d1123c8f3dff3d84fe8b4eb5189a Mon Sep 17 00:00:00 2001 From: blam Date: Tue, 1 Mar 2022 12:49:04 +0100 Subject: [PATCH] chore: fix up the changeset Signed-off-by: blam --- .changeset/sour-eggs-kick.md | 3 ++- plugins/catalog-react/src/hooks/useEntity.tsx | 2 +- .../catalog/src/components/EntityLayout/EntityLayout.tsx | 8 +++++--- 3 files changed, 8 insertions(+), 5 deletions(-) diff --git a/.changeset/sour-eggs-kick.md b/.changeset/sour-eggs-kick.md index 6e814415ab..f796b173fb 100644 --- a/.changeset/sour-eggs-kick.md +++ b/.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. diff --git a/plugins/catalog-react/src/hooks/useEntity.tsx b/plugins/catalog-react/src/hooks/useEntity.tsx index 9becedfee8..e46ee680eb 100644 --- a/plugins/catalog-react/src/hooks/useEntity.tsx +++ b/plugins/catalog-react/src/hooks/useEntity.tsx @@ -182,7 +182,7 @@ export function useEntity(): UseEntityResponse { // 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.', ); } diff --git a/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx b/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx index 634662f386..40c4f9e873 100644 --- a/plugins/catalog/src/components/EntityLayout/EntityLayout.tsx +++ b/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() // 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 []; }