Fix firefox recoil snapshot bug (#2321)

fix firefox recoil snapshot bug
twentyhq · Nov 2, 2023 · f19ed5e · f19ed5e
1 parent 9725582
commit f19ed5e
Showing 1 changed file with 3 additions and 8 deletions.
diff --git a/front/src/modules/debug/components/RecoilDebugObserver.tsx b/front/src/modules/debug/components/RecoilDebugObserver.tsx
@@ -1,5 +1,4 @@
-import { useEffect } from 'react';
-import { useRecoilSnapshot, useRecoilValue } from 'recoil';
+import { useRecoilTransactionObserver_UNSTABLE, useRecoilValue } from 'recoil';
 
 import { isDebugModeState } from '@/client-config/states/isDebugModeState';
 import { logDebug } from '~/utils/logDebug';
@@ -16,15 +15,12 @@ const formatTitle = (stateName: string) => {
 };
 
 export const RecoilDebugObserverEffect = () => {
-  const snapshot = useRecoilSnapshot();
-
   const isDebugMode = useRecoilValue(isDebugModeState);
 
-  useEffect(() => {
+  useRecoilTransactionObserver_UNSTABLE(({ snapshot }) => {
     if (!isDebugMode) {
       return;
     }
-
     for (const node of Array.from(
       snapshot.getNodes_UNSTABLE({ isModified: true }),
     )) {
@@ -40,7 +36,6 @@ export const RecoilDebugObserverEffect = () => {
 
       console.groupEnd();
     }
-  }, [isDebugMode, snapshot]);
-
+  });
   return null;
 };