From 6b955ded7304e94d55a5f36b256132ec4cb5c312 Mon Sep 17 00:00:00 2001
From: Kenneth <kennethnym@hey.com>
Date: Mon, 2 Dec 2024 23:17:02 +0000
Subject: [PATCH] fix: don't show tanstack dev tool in prod

---
 web/src/App.tsx | 16 ++++++++++++++--
 1 file changed, 14 insertions(+), 2 deletions(-)

diff --git a/web/src/App.tsx b/web/src/App.tsx
index 30b8148..d49d46d 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -1,5 +1,17 @@
-import {Outlet} from "@tanstack/react-router";
-import {TanStackRouterDevtools} from "@tanstack/router-devtools";
+import { Outlet } from "@tanstack/react-router";
+import React from "react";
+
+const TanStackRouterDevtools =
+	process.env.NODE_ENV === "production"
+		? () => null // Render nothing in production
+		: React.lazy(() =>
+				// Lazy load in development
+				import("@tanstack/router-devtools").then((res) => ({
+					default: res.TanStackRouterDevtools,
+					// For Embedded Mode
+					// default: res.TanStackRouterDevtoolsPanel
+				})),
+			);
 
 function App() {
 	return (