<commit_before>// This file is part of Indico.
// Copyright (C) 2002 - 2019 CERN
//
// Indico is free software; you can redistribute it and/or
// modify it under the terms of the MIT License; see the
// LICENSE file for more details.

import React, {useState} from 'react';
import PropTypes from 'prop-types';
import {Sticky} from 'semantic-ui-react';

import {ScrollButton} from 'indico/react/components';
import {useResponsive} from 'indico/react/util';

import './StickyWithScrollBack.module.scss';

export default function StickyWithScrollBack({children, context, responsive}) {
  const [scrollButtonVisible, setScrollButtonVisible] = useState(false);

  const {isPhone, isTablet, isLandscape} = useResponsive();
  const isResponsiveDevice = responsive && (isPhone || isTablet) && isLandscape;
  return (
    <Sticky
      context={context}
      styleName="sticky-content"
      onStick={() => setScrollButtonVisible(true)}
      onUnstick={() => setScrollButtonVisible(false)}
      active={!isResponsiveDevice}
    >
      {children}
      <ScrollButton visible={scrollButtonVisible || isResponsiveDevice} />
    </Sticky>
  );
}

StickyWithScrollBack.propTypes = {
  children: PropTypes.node,
  context: PropTypes.object,
  responsive: PropTypes.bool,
};

StickyWithScrollBack.defaultProps = {
  children: null,
  context: null,
  responsive: false,
};
<commit_msg>Display scroll button properly on responsive<commit_after>// This file is part of Indico.
// Copyright (C) 2002 - 2019 CERN
//
// Indico is free software; you can redistribute it and/or
// modify it under the terms of the MIT License; see the
// LICENSE file for more details.

import React, {useState, useEffect} from 'react';
import PropTypes from 'prop-types';
import {Sticky} from 'semantic-ui-react';

import {ScrollButton} from 'indico/react/components';
import {useResponsive} from 'indico/react/util';

import './StickyWithScrollBack.module.scss';

const MIN_RESPONSIVE_OFFSET = 200;

export default function StickyWithScrollBack({children, context, responsive}) {
  const [scrollButtonVisible, setScrollButtonVisible] = useState(false);
  const [responsiveScrollOffset, setResponsiveScrollOffset] = useState(window.pageYOffset);

  const {isPhone, isTablet, isLandscape} = useResponsive();
  const isResponsiveDevice = responsive && (isPhone || isTablet) && isLandscape;

  useEffect(() => {
    window.addEventListener('scroll', onScroll, false);
    return () => window.removeEventListener('scroll', onScroll, false);
  });

  function onScroll() {
    setResponsiveScrollOffset(window.pageYOffset);
  }

  return (
    <Sticky
      context={context}
      styleName="sticky-content"
      onStick={() => setScrollButtonVisible(true)}
      onUnstick={() => setScrollButtonVisible(false)}
      active={!isResponsiveDevice}
    >
      {children}
      <ScrollButton
        visible={
          scrollButtonVisible ||
          (isResponsiveDevice && responsiveScrollOffset > MIN_RESPONSIVE_OFFSET)
        }
      />
    </Sticky>
  );
}

StickyWithScrollBack.propTypes = {
  children: PropTypes.node,
  context: PropTypes.object,
  responsive: PropTypes.bool,
};

StickyWithScrollBack.defaultProps = {
  children: null,
  context: null,
  responsive: false,
};

{'fraction_non_alphanumeric': 0.11853448275862069, 'fraction_numerical': 0.005849753694581281, 'mean_word_length': 4.240322580645161, 'pattern_counts': {'":': 0, '<': 9, '<?xml version=': 0, '>': 16, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1563406', 'n_tokens_mistral': 984, 'n_tokens_neox': 961, 'n_words': 245}