Merge pull request #15376 from overleaf/td-ide-page-working-editor

React IDE page: working editor

GitOrigin-RevId: 3ba8cb787a6f7f8435686d8962adb7444d09acb5

services/web/frontend/js/features/ide-react/hooks/use-layout-event-tracking.ts

@@ -0,0 +1,25 @@
+import { useLayoutContext } from '@/shared/context/layout-context'
+import { useEffect } from 'react'
+import { sendMBOnce } from '@/infrastructure/event-tracking'
+
+export function useLayoutEventTracking() {
+  const { view, leftMenuShown, chatIsOpen } = useLayoutContext()
+
+  useEffect(() => {
+    if (view !== 'editor' && view !== 'pdf') {
+      sendMBOnce(`ide-open-view-${view}-once`)
+    }
+  }, [view])
+
+  useEffect(() => {
+    if (leftMenuShown) {
+      sendMBOnce(`ide-open-left-menu-once`)
+    }
+  }, [leftMenuShown])
+
+  useEffect(() => {
+    if (chatIsOpen) {
+      sendMBOnce(`ide-open-chat-once`)
+    }
+  }, [chatIsOpen])
+}

services/web/frontend/js/features/ide-react/hooks/use-socket-listener.ts

@@ -0,0 +1,18 @@
+import { useEffect } from 'react'
+import { Socket } from '@/features/ide-react/connection/types/socket'
+
+type SocketOnParams = Parameters<Socket['on']>
+
+export default function useSocketListener(
+  socket: Socket,
+  event: SocketOnParams[0],
+  listener: SocketOnParams[1]
+) {
+  useEffect(() => {
+    socket.on(event, listener)
+
+    return () => {
+      socket.removeListener(event, listener)
+    }
+  }, [event, listener, socket])
+}