diff --git a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx index c6f75f5d3..6e9f8a9c3 100644 --- a/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx +++ b/src/frontend/src/pages/FlowPage/components/PageComponent/index.tsx @@ -120,75 +120,9 @@ export default function Page({ view }: { view?: boolean }): JSX.Element { const currentFlowId = useFlowsManagerStore((state) => state.currentFlowId); const [isAddingNote, setIsAddingNote] = useState(false); - const [isHighlightingCursor, setIsHighlightingCursor] = useState(false); const addComponent = useAddComponent(); - useEffect(() => { - const handleVisibilityChange = () => { - if (!document.hidden) { - setIsHighlightingCursor(true); - setTimeout(() => setIsHighlightingCursor(false), 1000); - } - }; - - document.addEventListener("visibilitychange", handleVisibilityChange); - - return () => { - document.removeEventListener("visibilitychange", handleVisibilityChange); - }; - }, []); - - useEffect(() => { - if (isHighlightingCursor) { - const cursor = document.body.style.cursor; - document.body.style.cursor = "none"; - const highlightDiv = document.createElement("div"); - highlightDiv.style.position = "fixed"; - highlightDiv.style.width = "40px"; - highlightDiv.style.height = "40px"; - highlightDiv.style.borderRadius = "50%"; - highlightDiv.style.background = - "radial-gradient(circle, rgba(135,206,250,0.7) 0%, rgba(135,206,250,0) 70%)"; - highlightDiv.style.pointerEvents = "none"; - highlightDiv.style.zIndex = "9999"; - highlightDiv.style.filter = "blur(5px)"; - document.body.appendChild(highlightDiv); - - let scale = 1; - let increasing = true; - - const blink = () => { - if (increasing) { - scale += 0.03; - if (scale >= 1.3) increasing = false; - } else { - scale -= 0.03; - if (scale <= 0.7) increasing = true; - } - highlightDiv.style.transform = `scale(${scale})`; - }; - - const blinkInterval = setInterval(blink, 50); - - const moveHighlight = (e: MouseEvent) => { - highlightDiv.style.left = `${e.clientX - 20}px`; - highlightDiv.style.top = `${e.clientY - 20}px`; - }; - - //@ts-ignore - document.addEventListener("mousemove", moveHighlight); - - return () => { - document.body.style.cursor = cursor; - document.body.removeChild(highlightDiv); - //@ts-ignore - document.removeEventListener("mousemove", moveHighlight); - clearInterval(blinkInterval); - }; - } - }, [isHighlightingCursor]); - const zoomLevel = reactFlowInstance?.getZoom(); const shadowBoxWidth = NOTE_NODE_MIN_WIDTH * (zoomLevel || 1); const shadowBoxHeight = NOTE_NODE_MIN_HEIGHT * (zoomLevel || 1);