componentDidMount() {
const { clearWorkflow } = this.props;
-
clearWorkflow();
+ this.fetchWorkflows();
}
+ fetchWorkflows = () => {
+ const {
+ catalog: { sort, status, searchNameFilter },
+ handleFetchWorkflow
+ } = this.props;
+ handleFetchWorkflow({
+ sort,
+ searchNameFilter,
+ status
+ });
+ };
+
handleAlphabeticalOrderByClick = e => {
e.preventDefault();
status: value
});
};
+
handleScroll = () => {
const {
catalog: {
import PropTypes from 'prop-types';
class InfiniteScroll extends React.Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ initialLoad: false
+ };
+ }
componentDidMount() {
- this.pageLoaded = this.props.pageStart;
this.scrollEl = this.getScrollElement();
this.attachScrollListener();
+ this.setState({ initialLoad: true });
}
componentDidUpdate() {
this.scrollEl.addEventListener('scroll', this.scrollListener, options);
window.addEventListener('resize', this.scrollListener, options);
- if (this.props.initialLoad) {
- this.scrollListener();
- }
+ this.scrollListener();
}
scrollListener = () => {
if (offset < Number(this.props.threshold) && el.offsetParent !== null) {
this.detachScrollListener();
// Call loadMore after detachScrollListener to allow for non-async loadMore functions
- if (typeof this.props.loadMore === 'function') {
- this.props.loadMore((this.pageLoaded += 1));
+ if (
+ typeof this.props.loadMore === 'function' &&
+ this.state.initialLoad
+ ) {
+ this.props.loadMore();
}
}
};
children: PropTypes.node.isRequired,
element: PropTypes.node,
hasMore: PropTypes.bool,
- initialLoad: PropTypes.bool,
loadMore: PropTypes.func.isRequired,
- pageStart: PropTypes.number,
threshold: PropTypes.number,
useCapture: PropTypes.bool,
useWindow: PropTypes.bool
InfiniteScroll.defaultProps = {
element: 'div',
hasMore: false,
- initialLoad: true,
- pageStart: 0,
threshold: 250,
useWindow: true,
useCapture: false