Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 5196 | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 5196 Rev 5293
Línea 1... Línea 1...
1 
import { useEffect, useState } from 'react'
 1 
import { useState, useRef, useEffect } from 'react'
Línea 2... Línea 2...
2 
 
 2 
 
3 
const useNear = (ref, rootMargin = '0px') => {
 3 
export const useNear = ({ rootMargin = '0px' }) => {
- 
 
 4 
  const [isNear, setIsNear] = useState(false)
Línea -... Línea 5...
- 
 
 5 
  const el = useRef(null)
- 
 
 6 
 
4 
  const [isIntersecting, setIntersecting] = useState(false)
 7 
  useEffect(
Línea 5... Línea 8...
5 
 
 8 
    function () {
6 
  const reset = () => setIntersecting(false)
 - 
 
7 
 
 9 
      if (typeof el.current === 'undefined') return
8 
  useEffect(() => {
 10 
 
9 
    const observer = new IntersectionObserver(
 11 
      let observer
10 
      ([entry]) => {
 - 
 
11 
        // Update our state when observer callback fires
 - 
 
12 
        setIntersecting(entry.isIntersecting)
 - 
 
13 
      },
 - 
 
14 
      {
 - 
 
15 
        rootMargin
 - 
 
16 
      }
 12 
      Promise.resolve(
17 
    )
 - 
 
18 
    if (ref.current) {
 13 
        typeof window.IntersectionObserver !== 'undefined'
19 
      observer.observe(ref.current)
 14 
          ? window.IntersectionObserver
20 
    }
 - 
 
21 
    return () => {
 15 
          : import('intersection-observer')
Línea 22... Línea 16...
22 
      observer.unobserve(ref.current)
 16 
      ).then(() => {
- 
 
 17 
        const onIntersect = (entries, observer) => {
- 
 
 18 
          const { isIntersecting } = entries[0]
- 
 
 19 
 
- 
 
 20 
          if (isIntersecting) {
23 
    }
 21 
            setIsNear(true)
- 
 
 22 
            observer.disconnect()
- 
 
 23 
          }
- 
 
 24 
        }
Línea -... Línea 25...
- 
 
 25 
 
- 
 
 26 
        observer = new window.IntersectionObserver(onIntersect, { rootMargin })
- 
 
 27 
        observer.observe(el.current)
- 
 
 28 
      })
- 
 
 29 
 
24 
  }, [isIntersecting, ref]) // Empty array ensures that effect is only run on mount and unmount
 30 
      return () => observer && observer.disconnect()
- 
 
 31 
    },