Merge pull request #3470 from overleaf/eslint

Upgrade and configure ESLint

GitOrigin-RevId: ad5aeaf85e72c847a125ff3a9db99a12855e38aa

services/web/frontend/js/shared/hooks/use-expand-collapse.js

@@ -14,29 +14,27 @@ function useExpandCollapse({
     needsExpandCollapse: null
   })
 
-  useLayoutEffect(
-    () => {
-      const expandCollapseEl = ref.current
-      if (expandCollapseEl) {
-        const expandedSize =
-          dimension === 'height'
-            ? expandCollapseEl.scrollHeight
-            : expandCollapseEl.scrollWidth
+  useLayoutEffect(() => {
+    const expandCollapseEl = ref.current
+    if (expandCollapseEl) {
+      const expandedSize =
+        dimension === 'height'
+          ? expandCollapseEl.scrollHeight
+          : expandCollapseEl.scrollWidth
 
-        const needsExpandCollapse = expandedSize > collapsedSize
+      const needsExpandCollapse = expandedSize > collapsedSize
 
-        if (isExpanded) {
-          setSizing({ size: expandedSize, needsExpandCollapse })
-        } else {
-          setSizing({
-            size: needsExpandCollapse ? collapsedSize : expandedSize,
-            needsExpandCollapse
-          })
-        }
+      if (isExpanded) {
+        setSizing({ size: expandedSize, needsExpandCollapse })
+      } else {
+        setSizing({
+          size: needsExpandCollapse ? collapsedSize : expandedSize,
+          needsExpandCollapse
+        })
       }
-    },
-    [isExpanded]
-  )
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isExpanded])
 
   const expandableClasses = classNames(
     'expand-collapse-container',

services/web/frontend/js/shared/hooks/use-resize-observer.js

@@ -13,27 +13,25 @@ function useResizeObserver(observedElement, observedData, callback) {
     resizeObserver.current.unobserve(observedCurrent)
   }
 
-  useLayoutEffect(
-    () => {
-      if ('ResizeObserver' in window) {
-        const observedCurrent = observedElement && observedElement.current
+  useLayoutEffect(() => {
+    if ('ResizeObserver' in window) {
+      const observedCurrent = observedElement && observedElement.current
+      if (observedCurrent) {
+        observe(observedElement.current)
+      }
+
+      if (resizeObserver.current && observedCurrent) {
+        resizeObserver.current.observe(observedCurrent)
+      }
+
+      return () => {
         if (observedCurrent) {
-          observe(observedElement.current)
-        }
-
-        if (resizeObserver.current && observedCurrent) {
-          resizeObserver.current.observe(observedCurrent)
-        }
-
-        return () => {
-          if (observedCurrent) {
-            unobserve(observedCurrent)
-          }
+          unobserve(observedCurrent)
         }
       }
-    },
-    [observedElement, observedData]
-  )
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [observedElement, observedData])
 }
 
 export default useResizeObserver