diff --git a/.changeset/gorgeous-pumas-speak.md b/.changeset/gorgeous-pumas-speak.md
new file mode 100644
index 0000000000..60f40c6748
--- /dev/null
+++ b/.changeset/gorgeous-pumas-speak.md
@@ -0,0 +1,5 @@
+---
+'@backstage/plugin-catalog': patch
+---
+
+fix entity switch rendering when there is no default case
diff --git a/.changeset/silver-bikes-breathe.md b/.changeset/silver-bikes-breathe.md
index 63dabf7b2e..0288580bba 100644
--- a/.changeset/silver-bikes-breathe.md
+++ b/.changeset/silver-bikes-breathe.md
@@ -2,4 +2,23 @@
'@backstage/plugin-catalog': minor
---
-allow entity switch to render all cases that match the condition
+Allow `EntitySwitch` to render all cases that match the condition.
+
+This change introduces a new parameter for the `EntitySwitch` component
+`renderMultipleMatches`. In case the parameter value is `all`, the `EntitySwitch`
+will render all `EntitySwitch.Case` that contain `if` parameter, and it
+evaluates to true. In case none of the cases match, the default case will be
+rendered, if any.
+
+This means for example in the CI/CD page you can now do the following:
+
+```tsx
+
+ Jenkins
+ CodeBuild
+ No CI/CD
+
+```
+
+This allows the component to have multiple CI/CD systems and all of those are
+rendered on the same page.
diff --git a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx
index 8ee44041c8..13e214d823 100644
--- a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx
+++ b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.test.tsx
@@ -173,6 +173,42 @@ describe('EntitySwitch', () => {
expect(screen.getByText('C')).toBeInTheDocument();
});
+ it('should render nothing if no default case is set for multiple matches', () => {
+ const entity = { metadata: { name: 'mock' }, kind: 'component' } as Entity;
+
+ render(
+
+
+
+ A
} />
+ B} />
+
+
+ ,
+ );
+
+ expect(screen.queryByText('A')).not.toBeInTheDocument();
+ expect(screen.queryByText('B')).not.toBeInTheDocument();
+ });
+
+ it('should render nothing if no default case is set for default', () => {
+ const entity = { metadata: { name: 'mock' }, kind: 'component' } as Entity;
+
+ render(
+
+
+
+ A} />
+ B} />
+
+
+ ,
+ );
+
+ expect(screen.queryByText('A')).not.toBeInTheDocument();
+ expect(screen.queryByText('B')).not.toBeInTheDocument();
+ });
+
it('should switch with async condition that is true', async () => {
const entity = { metadata: { name: 'mock' }, kind: 'component' } as Entity;
diff --git a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx
index 6ad3c66ab3..3cd806faa5 100644
--- a/plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx
+++ b/plugins/catalog/src/components/EntitySwitch/EntitySwitch.tsx
@@ -169,7 +169,7 @@ function AsyncEntitySwitch({
}
function getDefaultChildren(results: SwitchCaseResult[]) {
- return results.filter(r => r.if === undefined)[0].children ?? null;
+ return results.filter(r => r.if === undefined)[0]?.children ?? null;
}
EntitySwitch.Case = EntitySwitchCaseComponent;