fix: issue with useSearchParams hook

babylonlabs-io · Jan 15, 2025 · 614bc7c · 614bc7c
1 parent 5f4078d
commit 614bc7c
Showing 1 changed file with 35 additions and 33 deletions.
diff --git a/src/app/providers.tsx b/src/app/providers.tsx
@@ -5,7 +5,7 @@ import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
 import { ReactQueryStreamedHydration } from "@tanstack/react-query-next-experimental";
 import { ThemeProvider } from "next-themes";
-import React from "react";
+import React, { Suspense } from "react";
 
 import { NotificationContainer } from "./components/Notification/NotificationContainer";
 import { ErrorProvider } from "./context/Error/ErrorContext";
@@ -20,38 +20,40 @@ function Providers({ children }: React.PropsWithChildren) {
   const [client] = React.useState(new QueryClient());
 
   return (
-    <ScrollLocker>
-      <ThemeProvider
-        defaultTheme="light"
-        enableSystem={false}
-        attribute="data-theme"
-      >
-        <QueryClientProvider client={client}>
-          <ErrorProvider>
-            <BbnRpcProvider>
-              <WalletConnectionProvider>
-                <BTCWalletProvider>
-                  <CosmosWalletProvider>
-                    <AppState>
-                      <StakingStatsProvider>
-                        <ReactQueryStreamedHydration>
-                          {children}
-                        </ReactQueryStreamedHydration>
-                      </StakingStatsProvider>
-                    </AppState>
-                  </CosmosWalletProvider>
-                </BTCWalletProvider>
-              </WalletConnectionProvider>
-            </BbnRpcProvider>
-          </ErrorProvider>
-          <ReactQueryDevtools
-            buttonPosition="bottom-left"
-            initialIsOpen={false}
-          />
-        </QueryClientProvider>
-        <NotificationContainer />
-      </ThemeProvider>
-    </ScrollLocker>
+    <Suspense>
+      <ScrollLocker>
+        <ThemeProvider
+          defaultTheme="light"
+          enableSystem={false}
+          attribute="data-theme"
+        >
+          <QueryClientProvider client={client}>
+            <ErrorProvider>
+              <BbnRpcProvider>
+                <WalletConnectionProvider>
+                  <BTCWalletProvider>
+                    <CosmosWalletProvider>
+                      <AppState>
+                        <StakingStatsProvider>
+                          <ReactQueryStreamedHydration>
+                            {children}
+                          </ReactQueryStreamedHydration>
+                        </StakingStatsProvider>
+                      </AppState>
+                    </CosmosWalletProvider>
+                  </BTCWalletProvider>
+                </WalletConnectionProvider>
+              </BbnRpcProvider>
+            </ErrorProvider>
+            <ReactQueryDevtools
+              buttonPosition="bottom-left"
+              initialIsOpen={false}
+            />
+          </QueryClientProvider>
+          <NotificationContainer />
+        </ThemeProvider>
+      </ScrollLocker>
+    </Suspense>
   );
 }