From 47dd105cd6609360e029522e7a327e793df83257 Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandrocelaya@gmail.com>
Date: Sun, 6 Aug 2023 18:09:46 +0200
Subject: [PATCH] Make sure props are not passed to Fragment

---
 shlink-web-component/src/Main.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/shlink-web-component/src/Main.tsx b/shlink-web-component/src/Main.tsx
index 790753df..64791ef7 100644
--- a/shlink-web-component/src/Main.tsx
+++ b/shlink-web-component/src/Main.tsx
@@ -31,7 +31,11 @@ export const Main = (
   const location = useLocation();
   const routesPrefix = useRoutesPrefix();
   const inRouterContext = useInRouterContext();
-  const Wrapper = useMemo(() => (inRouterContext ? Fragment : BrowserRouter), [inRouterContext]);
+  const [Wrapper, props] = useMemo(() => (
+    inRouterContext
+      ? [Fragment, {}]
+      : [BrowserRouter, { basename: routesPrefix }]
+  ), [inRouterContext]);
 
   const [sidebarVisible, toggleSidebar, showSidebar, hideSidebar] = useToggle();
   useEffect(() => hideSidebar(), [location]);
@@ -43,7 +47,7 @@ export const Main = (
   // FIXME Check if this works when not currently wrapped in a router
 
   return (
-    <Wrapper basename={routesPrefix}>
+    <Wrapper {...props}>
       <FontAwesomeIcon icon={burgerIcon} className={burgerClasses} onClick={toggleSidebar} />
 
       <div {...swipeableProps} className="menu-layout__swipeable">