chore: Re-render <UserButton /> when <UserButton /> props change

clerk · Feb 3, 2025 · b415b79 · b415b79
1 parent 26225f2
commit b415b79
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/.changeset/healthy-panthers-shave.md b/.changeset/healthy-panthers-shave.md
@@ -0,0 +1,5 @@
+---
+'@clerk/clerk-react': patch
+---
+
+Re-render `<UserButton />` when `<UserButton />` props change
diff --git a/packages/react/src/components/ClerkHostRenderer.tsx b/packages/react/src/components/ClerkHostRenderer.tsx
@@ -63,9 +63,10 @@ export class ClerkHostRenderer extends React.PureComponent<
 
     // Remove children and customPages from props before comparing
     // children might hold circular references which deepEqual can't handle
-    // and the implementation of customPages or customMenuItems relies on props getting new references
-    const prevProps = without(_prevProps.props, 'customPages', 'customMenuItems', 'children');
-    const newProps = without(this.props.props, 'customPages', 'customMenuItems', 'children');
+    // and the implementation of customPages relies on props getting new references
+    const prevProps = without(_prevProps.props, 'customPages', 'children');
+    const newProps = without(this.props.props, 'customPages', 'children');
+
     // instead, we simply use the length of customPages to determine if it changed or not
     const customPagesChanged = prevProps.customPages?.length !== newProps.customPages?.length;
     const customMenuItemsChanged = prevProps.customMenuItems?.length !== newProps.customMenuItems?.length;