{"size": 1767, "ext": "js", "max_stars_repo_path": "website/src/components/progress.js", "max_stars_repo_name": "snosrap/spaCy", "max_stars_repo_stars_event_min_datetime": "2016-10-03T11:58:15.000Z", "max_stars_repo_stars_event_max_datetime": "2022-03-31T21:08:19.000Z", "max_issues_repo_path": "website/src/components/progress.js", "max_issues_repo_name": "snosrap/spaCy", "max_issues_repo_issues_event_min_datetime": "2016-10-03T13:11:11.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-31T17:01:25.000Z", "max_forks_repo_path": "website/src/components/progress.js", "max_forks_repo_name": "snosrap/spaCy", "max_forks_repo_forks_event_min_datetime": "2016-10-04T03:36:33.000Z", "max_forks_repo_forks_event_max_datetime": "2022-03-31T14:12:34.000Z"}
{"max_stars_count": 22040, "max_issues_count": 6927, "max_forks_count": 4403, "avg_line_length": 31.5535714286, "max_line_length": 90, "alphanum_fraction": 0.6474250141}
import React, { useState, useEffect, useRef } from 'react'
import { document, window } from 'browser-monads'

import classes from '../styles/progress.module.sass'

function getOffset() {
    const height = Math.max(
        document.body.scrollHeight,
        document.body.offsetHeight,
        document.documentElement.clientHeight,
        document.documentElement.scrollHeight,
        document.documentElement.offsetHeight
    )
    const vh = Math.max(document.documentElement.clientHeight, window.innerHeight || 0)
    return { height, vh }
}

function getScrollY() {
    const pos = (window.pageYOffset || document.scrollTop) - (document.clientTop || 0)
    return isNaN(pos) ? 0 : pos
}

export default function Progress() {
    const progressRef = useRef()
    const [initialized, setInitialized] = useState(false)
    const [offset, setOffset] = useState(getOffset())
    const [scrollY, setScrollY] = useState(getScrollY())

    function handleScroll() {
        setScrollY(getScrollY())
    }

    function handleResize() {
        setOffset(getOffset())
    }

    useEffect(() => {
        if (!initialized && progressRef.current) {
            handleResize()
            setInitialized(true)
        }
        window.addEventListener('scroll', handleScroll)
        window.addEventListener('resize', handleResize)

        return () => {
            window.removeEventListener('scroll', handleScroll)
            window.removeEventListener('resize', handleResize)
        }
    }, [initialized, progressRef])

    const { height, vh } = offset
    const total = 100 - ((height - scrollY - vh) / height) * 100
    const value = scrollY === 0 ? 0 : total || 0
    return <progress ref={progressRef} className={classes.root} value={value} max="100" />
}
