From 710e2f8c2b5f670ca67643f7b7e9e9475be6b754 Mon Sep 17 00:00:00 2001
From: Alejandra <90076947+alejsdev@users.noreply.github.com>
Date: Mon, 11 Mar 2024 16:50:10 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A7=20Set=20TanStack=20Router=20devtoo?=
 =?UTF-8?q?ls=20only=20in=20dev=20mode=20(#668)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/routes/__root.tsx | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/frontend/src/routes/__root.tsx b/frontend/src/routes/__root.tsx
index 9aff46f..a9c87d3 100644
--- a/frontend/src/routes/__root.tsx
+++ b/frontend/src/routes/__root.tsx
@@ -1,13 +1,24 @@
+import React, { Suspense } from 'react'
 import { createRootRoute, Outlet } from '@tanstack/react-router'
-import { TanStackRouterDevtools } from '@tanstack/router-devtools'
 
 import NotFound from '../components/Common/NotFound'
 
+const TanStackRouterDevtools =
+  process.env.NODE_ENV === 'production'
+    ? () => null
+    : React.lazy(() =>
+        import('@tanstack/router-devtools').then((res) => ({
+          default: res.TanStackRouterDevtools,
+        })),
+      )
+
 export const Route = createRootRoute({
   component: () => (
     <>
       <Outlet />
-      <TanStackRouterDevtools />
+      <Suspense>
+        <TanStackRouterDevtools />
+      </Suspense>
     </>
   ),
   notFoundComponent: () => <NotFound />,