From abcc6e551dab23309c3e3e29e56b44d3a6cc9d29 Mon Sep 17 00:00:00 2001
From: Nathaniel Tucker <me@ntucker.me>
Date: Wed, 8 May 2024 16:31:14 -0500
Subject: [PATCH] docs: Reenable devtoolsmanager for coin app with some perf
 options

---
 examples/coin-app/src/index.tsx | 31 ++++++++++++++++++++++++++++---
 1 file changed, 28 insertions(+), 3 deletions(-)

diff --git a/examples/coin-app/src/index.tsx b/examples/coin-app/src/index.tsx
index 448a4d6ace9..d605c3400d9 100644
--- a/examples/coin-app/src/index.tsx
+++ b/examples/coin-app/src/index.tsx
@@ -10,6 +10,8 @@ import {
   useController,
   AsyncBoundary,
   getDefaultManagers,
+  DevToolsManager,
+  NetworkManager,
 } from '@data-client/react';
 import StreamManager from 'resources/StreamManager';
 import { getTicker } from 'resources/Ticker';
@@ -32,9 +34,7 @@ const spouts = JSONSpout()(
             new WebSocket('wss://ws-feed.exchange.coinbase.com'),
             { ticker: getTicker },
           ),
-          ...getDefaultManagers().filter(
-            manager => manager.constructor.name !== 'DevToolsManager',
-          ),
+          ...getManagers(),
         ];
       },
     })(
@@ -46,4 +46,29 @@ const spouts = JSONSpout()(
   ),
 );
 
+function getManagers() {
+  const managers = getDefaultManagers().filter(
+    manager => manager.constructor.name !== 'DevToolsManager',
+  );
+  if (process.env.NODE_ENV !== 'production') {
+    const networkManager: NetworkManager | undefined = managers.find(
+      manager => manager instanceof NetworkManager,
+    ) as any;
+    managers.unshift(
+      new DevToolsManager(
+        {
+          // double latency to help with high frequency updates
+          latency: 1000,
+          // don't use replacer because it is way too slow for our fast updating
+          serialize: {
+            options: undefined,
+          },
+        },
+        networkManager?.skipLogging?.bind?.(networkManager),
+      ),
+    );
+  }
+  return managers;
+}
+
 export default floodSpouts(spouts);