diff --git a/.changeset/shy-seals-deny.md b/.changeset/shy-seals-deny.md
new file mode 100644
index 0000000000..1687ccaa75
--- /dev/null
+++ b/.changeset/shy-seals-deny.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-catalog': patch
+---
+
+Fix for `EntitySwitch` not properly falling back to render the default entity page when the entity is missing.
diff --git a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx
index 8768e9728e..9588327c3b 100644
--- a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx
+++ b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx
@@ -15,7 +15,10 @@
*/
import { Entity } from '@backstage/catalog-model';
-import { EntityProvider } from '@backstage/plugin-catalog-react';
+import {
+ AsyncEntityProvider,
+ EntityProvider,
+} from '@backstage/plugin-catalog-react';
import { render } from '@testing-library/react';
import React from 'react';
import { isKind } from './conditions';
@@ -76,6 +79,18 @@ describe('EntitySwitch', () => {
expect(rendered.queryByText('A')).not.toBeInTheDocument();
expect(rendered.queryByText('B')).not.toBeInTheDocument();
expect(rendered.queryByText('C')).toBeInTheDocument();
+
+ rendered.rerender(
+
+
+ {content}
+
+ ,
+ );
+
+ expect(rendered.queryByText('A')).not.toBeInTheDocument();
+ expect(rendered.queryByText('B')).not.toBeInTheDocument();
+ expect(rendered.queryByText('C')).toBeInTheDocument();
});
it('should switch child when filters switch', () => {
diff --git a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx
index 1b8667ce2a..993e7daa80 100644
--- a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx
+++ b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx
@@ -63,7 +63,7 @@ export interface EntitySwitchProps {
/** @public */
export const EntitySwitch = (props: EntitySwitchProps) => {
- const { entity } = useAsyncEntity();
+ const { entity, loading } = useAsyncEntity();
const apis = useApiHolder();
const results = useElementFilter(
props.children,
@@ -75,11 +75,23 @@ export const EntitySwitch = (props: EntitySwitchProps) => {
})
.getElements()
.flatMap((element: ReactElement) => {
- if (!entity) {
+ // Nothing is rendered while loading
+ if (loading) {
return [];
}
+
const { if: condition, children: elementsChildren } =
element.props as EntitySwitchCase;
+
+ // If the entity is missing or there is an error, render the default page
+ if (!entity) {
+ return [
+ {
+ if: condition === undefined,
+ children: elementsChildren,
+ },
+ ];
+ }
return [
{
if: condition?.(entity, { apis }) ?? true,
@@ -87,7 +99,7 @@ export const EntitySwitch = (props: EntitySwitchProps) => {
},
];
}),
- [apis, entity],
+ [apis, entity, loading],
);
const hasAsyncCases = results.some(
r => typeof r.if === 'object' && 'then' in r.if,