From 41f4f2dd886f08111a9960bd021cfb12822647bf Mon Sep 17 00:00:00 2001 From: Philipp Hugenroth Date: Fri, 21 Jan 2022 14:45:33 +0100 Subject: [PATCH] Fix component type comparison in Sidebar Signed-off-by: Philipp Hugenroth --- packages/core-components/src/layout/Sidebar/Items.tsx | 8 +++++++- .../core-components/src/layout/Sidebar/MobileSidebar.tsx | 9 ++++++++- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/packages/core-components/src/layout/Sidebar/Items.tsx b/packages/core-components/src/layout/Sidebar/Items.tsx index b16c9ad302..aeac9aebf9 100644 --- a/packages/core-components/src/layout/Sidebar/Items.tsx +++ b/packages/core-components/src/layout/Sidebar/Items.tsx @@ -486,7 +486,13 @@ const SidebarItemWithSubmenu = ({ export const SidebarItem = forwardRef((props, ref) => { // Filter children for SidebarSubmenu components const [submenu] = useElementFilter(props.children, elements => - elements.getElements().filter(child => child.type === SidebarSubmenu), + // Directly comparing child.type with SidebarSubmenu will not work with in + // combination with react-hot-loader + // + // https://github.com/gaearon/react-hot-loader/issues/304#issuecomment-456569720 + elements + .getElements() + .filter(child => child.type === React.createElement(SidebarSubmenu).type), ); if (submenu) { diff --git a/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx b/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx index 3819f21a02..cd6d5defb1 100644 --- a/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx +++ b/packages/core-components/src/layout/Sidebar/MobileSidebar.tsx @@ -162,8 +162,15 @@ export const MobileSidebar = (props: MobileSidebarProps) => { }, [location.pathname]); // Filter children for SidebarGroups + // + // Directly comparing child.type with SidebarSubmenu will not work with in + // combination with react-hot-loader + // + // https://github.com/gaearon/react-hot-loader/issues/304#issuecomment-456569720 let sidebarGroups = useElementFilter(children, elements => - elements.getElements().filter(child => child.type === SidebarGroup), + elements + .getElements() + .filter(child => child.type === React.createElement(SidebarGroup).type), ); if (!children) {