diff --git a/.changeset/rare-papers-decide.md b/.changeset/rare-papers-decide.md new file mode 100644 index 0000000000..60d8bca3b4 --- /dev/null +++ b/.changeset/rare-papers-decide.md @@ -0,0 +1,5 @@ +--- +'@backstage/ui': patch +--- + +Fixed an infinite render loop in Tabs when navigating to a URL that doesn't match any tab href. diff --git a/packages/ui/src/components/Tabs/Tabs.tsx b/packages/ui/src/components/Tabs/Tabs.tsx index 09970db5ca..11d77a6a5f 100644 --- a/packages/ui/src/components/Tabs/Tabs.tsx +++ b/packages/ui/src/components/Tabs/Tabs.tsx @@ -135,9 +135,10 @@ export const Tabs = (props: TabsProps) => { return undefined; } - // Has routed tabs but none are active - controlled mode with no selection + // Has routed tabs but none are active - use empty string for no selection + // (React Aria has a bug with null that causes infinite loops) if (activeTabs.size === 0) { - return null; + return ''; } let selectedId: string | null = null;