From b9c08fbaae7fad409d2a81c19d28cad3b0975eed Mon Sep 17 00:00:00 2001
From: hyphenized <28708889+hyphenized@users.noreply.github.com>
Date: Wed, 9 Aug 2023 10:39:20 -0500
Subject: [PATCH] Fix invalid fragment

Invoking React.Fragment directly does not return a valid react element
---
 ui/hooks/index.ts | 24 +++++++++++-------------
 1 file changed, 11 insertions(+), 13 deletions(-)

diff --git a/ui/hooks/index.ts b/ui/hooks/index.ts
index 9741d960d8..ec9029cc4a 100644
--- a/ui/hooks/index.ts
+++ b/ui/hooks/index.ts
@@ -68,21 +68,19 @@ type PanelDescriptor = {
  * return switchablePanels
  * ```
  */
-export function useSwitchablePanels(
-  panels: PanelDescriptor[]
-): ReactElement | null {
+export function useSwitchablePanels(panels: PanelDescriptor[]): JSX.Element {
   const [panelNumber, setPanelNumber] = useState(0)
 
-  return React.Fragment({
-    children: [
-      SharedPanelSwitcher({
-        setPanelNumber,
-        panelNumber,
-        panelNames: panels.map(({ name }) => name),
-      }),
-      panels[panelNumber].panelElement(),
-    ],
-  })
+  return React.createElement(
+    React.Fragment,
+    null,
+    SharedPanelSwitcher({
+      setPanelNumber,
+      panelNumber,
+      panelNames: panels.map(({ name }) => name),
+    }),
+    panels[panelNumber].panelElement()
+  )
 }
 
 export function useIsOnboarding(): boolean {