feat: refactor overview button

src/main.tsx

@@ -9,6 +9,8 @@ import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import { Toaster } from "sonner";
 import { MotionProvider } from "./components/motion/motion-provider";
 import { WebSocketProvider } from "./context/websocket-provider";
+import { StatusProvider } from "./context/status-provider";
+import { FilterProvider } from "./context/network-filter-context";
 
 const queryClient = new QueryClient();
 
@@ -18,19 +20,23 @@ ReactDOM.createRoot(document.getElementById("root")!).render(
       <ThemeProvider storageKey="vite-ui-theme">
         <QueryClientProvider client={queryClient}>
           <WebSocketProvider url="/api/v1/ws/server">
-            <App />
-            <Toaster
-              duration={1000}
-              toastOptions={{
-                classNames: {
-                  default:
-                    "w-fit rounded-full px-2.5 py-1.5 bg-neutral-100 border border-neutral-200 backdrop-blur-xl shadow-none",
-                },
-              }}
-              position="top-center"
-              className={"flex items-center justify-center"}
-            />
-            <ReactQueryDevtools />
+            <StatusProvider>
+              <FilterProvider>
+                <App />
+                <Toaster
+                  duration={1000}
+                  toastOptions={{
+                    classNames: {
+                      default:
+                        "w-fit rounded-full px-2.5 py-1.5 bg-neutral-100 border border-neutral-200 backdrop-blur-xl shadow-none",
+                    },
+                  }}
+                  position="top-center"
+                  className={"flex items-center justify-center"}
+                />
+                <ReactQueryDevtools />
+              </FilterProvider>
+            </StatusProvider>
           </WebSocketProvider>
         </QueryClientProvider>
       </ThemeProvider>