fix: Hook error during grouping reflections (#10808)

ParabolInc · Feb 6, 2025 · e67bf2b · e67bf2b
1 parent 1490e39
commit e67bf2b
Showing 1 changed file with 10 additions and 7 deletions.
diff --git a/packages/client/components/ReflectionGroup/RemoteReflection.tsx b/packages/client/components/ReflectionGroup/RemoteReflection.tsx
@@ -252,22 +252,25 @@ const RemoteReflection = (props: Props) => {
     }
   }, [remoteDrag, meetingMembers])
 
-  if (!remoteDrag) return null
-  const {dragUserId, dragUserName, isSpotlight} = remoteDrag
-
-  const {nextStyle, transform, minTop} = getStyle(remoteDrag, isDropping, isSpotlight, style)
   const [arrow, setArrow] = useState<RemoteReflectionArrow | undefined>('arrow_downward')
-  const [headerTransform, setHeaderTransform] = useState<string | undefined>(undefined)
-
   useEffect(() => {
+    if (!remoteDrag) return
+    const {minTop} = getCoords(remoteDrag)
     requestAnimationFrame(() => {
       const nextVal = getHeaderTransform(ref, minTop)
       if (nextVal.headerTransform !== headerTransform) {
         setHeaderTransform(nextVal.headerTransform)
         setArrow(nextVal.arrow)
       }
     })
-  }, [])
+  }, [remoteDrag])
+  const [headerTransform, setHeaderTransform] = useState<string | undefined>(undefined)
+
+  if (!remoteDrag) return null
+
+  const {dragUserId, dragUserName, isSpotlight} = remoteDrag
+  const {nextStyle, transform} = getStyle(remoteDrag, isDropping, isSpotlight, style)
+
   return (
     <>
       <RemoteReflectionModal