fix(layout): hide default dashboard

src/providers/devtools/index.tsx

@@ -1,16 +1,31 @@
 "use client";
 
-import {
-  DevtoolsPanel,
-  DevtoolsProvider as DevtoolsProviderBase,
-} from "@refinedev/devtools";
-import React from "react";
+import React, { Suspense } from "react";
+
+const RefineDevtools = React.lazy(async () => {
+  const { DevtoolsPanel, DevtoolsProvider: DevtoolsProviderBase } =
+    await import("@refinedev/devtools");
+
+  return {
+    default: (props: React.PropsWithChildren) => (
+      <DevtoolsProviderBase>
+        {props.children}
+        <DevtoolsPanel />
+      </DevtoolsProviderBase>
+    ),
+  };
+});
 
 export const DevtoolsProvider = (props: React.PropsWithChildren) => {
+  if (process.env.NODE_ENV !== "development") {
+    return <>{props.children}</>;
+  }
+
   return (
-    <DevtoolsProviderBase>
-      {props.children}
-      <DevtoolsPanel />
-    </DevtoolsProviderBase>
+    <Suspense fallback={props.children}>
+      <RefineDevtools>
+        {props.children}
+      </RefineDevtools>
+    </Suspense>
   );
 };