fix: header in EntityLayout should always be shown

Signed-off-by: Sandor Karpf <sandor.karpf@lastpass.com>

.changeset/early-boxes-work.md

@@ -0,0 +1,6 @@
+---
+'@backstage/plugin-catalog': patch
+---
+
+Header in EntityLayout should always be shown.
+Monitoring the loading status caused flickering when the refresh() method of the Async Entity was invoked.

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

@@ -102,21 +102,13 @@ export const EntityLayout = (props: EntityLayoutProps) => {
     UNSTABLE_contextMenuOptions,
     contextMenuItems,
     children,
+    header,
     NotFoundComponent,
     parentEntityRelations,
   } = props;
   const { kind } = useRouteRefParams(entityRouteRef);
   const { entity, loading, error } = useAsyncEntity();
 
-  const header = props.header ?? (
-    <EntityHeader
-      parentEntityRelations={parentEntityRelations}
-      UNSTABLE_contextMenuOptions={UNSTABLE_contextMenuOptions}
-      UNSTABLE_extraContextMenuItems={UNSTABLE_extraContextMenuItems}
-      contextMenuItems={contextMenuItems}
-    />
-  );
-
   const routes = useElementFilter(
     children,
     elements =>
@@ -150,7 +142,14 @@ export const EntityLayout = (props: EntityLayoutProps) => {
 
   return (
     <Page themeId={entity?.spec?.type?.toString() ?? 'home'}>
-      {!loading && header}
+      {header ?? (
+        <EntityHeader
+          parentEntityRelations={parentEntityRelations}
+          UNSTABLE_contextMenuOptions={UNSTABLE_contextMenuOptions}
+          UNSTABLE_extraContextMenuItems={UNSTABLE_extraContextMenuItems}
+          contextMenuItems={contextMenuItems}
+        />
+      )}
 
       {loading && <Progress />}