2019-09-13 12:37:46 +00:00
|
|
|
/* eslint-disable react/display-name */
|
2022-07-21 08:27:29 +00:00
|
|
|
import React from "react";
|
2020-10-16 13:16:01 +00:00
|
|
|
import PropTypes from "prop-types";
|
2021-02-09 14:50:25 +00:00
|
|
|
import StyledRowContainer from "./styled-row-container";
|
2022-07-21 08:27:29 +00:00
|
|
|
import InfiniteLoaderComponent from "../infinite-loader";
|
2019-08-29 13:02:11 +00:00
|
|
|
|
|
|
|
class RowContainer extends React.PureComponent {
|
|
|
|
render() {
|
2020-10-16 13:16:01 +00:00
|
|
|
const {
|
|
|
|
manualHeight,
|
|
|
|
itemHeight,
|
|
|
|
children,
|
|
|
|
useReactWindow,
|
|
|
|
id,
|
|
|
|
className,
|
|
|
|
style,
|
2021-10-15 11:31:19 +00:00
|
|
|
onScroll,
|
2022-07-11 14:06:21 +00:00
|
|
|
filesLength,
|
|
|
|
itemCount,
|
|
|
|
fetchMoreFiles,
|
|
|
|
hasMoreFiles,
|
2020-10-16 13:16:01 +00:00
|
|
|
} = this.props;
|
2019-08-29 13:02:11 +00:00
|
|
|
|
|
|
|
return (
|
2020-10-16 13:16:01 +00:00
|
|
|
<StyledRowContainer
|
|
|
|
id={id}
|
|
|
|
className={className}
|
|
|
|
style={style}
|
|
|
|
manualHeight={manualHeight}
|
|
|
|
useReactWindow={useReactWindow}
|
|
|
|
>
|
2022-07-11 14:06:21 +00:00
|
|
|
{useReactWindow ? (
|
|
|
|
<InfiniteLoaderComponent
|
|
|
|
className="List"
|
|
|
|
viewAs="row"
|
|
|
|
hasMoreFiles={hasMoreFiles}
|
|
|
|
filesLength={filesLength}
|
|
|
|
itemCount={itemCount}
|
|
|
|
loadMoreItems={fetchMoreFiles}
|
|
|
|
itemSize={itemHeight}
|
|
|
|
onScroll={onScroll}
|
|
|
|
>
|
|
|
|
{children}
|
|
|
|
</InfiniteLoaderComponent>
|
|
|
|
) : (
|
|
|
|
children
|
|
|
|
)}
|
2019-08-29 13:02:11 +00:00
|
|
|
</StyledRowContainer>
|
|
|
|
);
|
|
|
|
}
|
2019-09-10 06:01:34 +00:00
|
|
|
}
|
2019-08-29 13:02:11 +00:00
|
|
|
|
|
|
|
RowContainer.propTypes = {
|
2021-03-10 10:44:54 +00:00
|
|
|
/** Height of one Row element. Required for scroll to work properly */
|
2019-08-29 13:02:11 +00:00
|
|
|
itemHeight: PropTypes.number,
|
2021-03-10 10:44:54 +00:00
|
|
|
/** Allows you to set fixed block height for Row */
|
2019-08-29 13:02:11 +00:00
|
|
|
manualHeight: PropTypes.string,
|
2021-03-10 10:44:54 +00:00
|
|
|
/** Child elements */
|
2019-11-14 12:25:54 +00:00
|
|
|
children: PropTypes.any.isRequired,
|
2021-03-10 10:44:54 +00:00
|
|
|
/** Use react-window for efficiently rendering large lists */
|
2019-12-03 12:54:46 +00:00
|
|
|
useReactWindow: PropTypes.bool,
|
2021-03-10 10:44:54 +00:00
|
|
|
/** Accepts class */
|
2019-12-03 12:54:46 +00:00
|
|
|
className: PropTypes.string,
|
2021-03-10 10:44:54 +00:00
|
|
|
/** Accepts id */
|
2019-12-03 12:54:46 +00:00
|
|
|
id: PropTypes.string,
|
2021-03-10 10:44:54 +00:00
|
|
|
/** Accepts css style */
|
2020-10-16 13:16:01 +00:00
|
|
|
style: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
|
2021-10-15 11:31:19 +00:00
|
|
|
/** Called when the list scroll positions changes */
|
|
|
|
onScroll: PropTypes.func,
|
2022-07-11 14:06:21 +00:00
|
|
|
filesLength: PropTypes.number,
|
|
|
|
itemCount: PropTypes.number,
|
|
|
|
loadMoreItems: PropTypes.func,
|
|
|
|
hasMoreFiles: PropTypes.bool,
|
2019-08-29 13:02:11 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
RowContainer.defaultProps = {
|
|
|
|
itemHeight: 50,
|
2019-12-03 12:54:46 +00:00
|
|
|
useReactWindow: true,
|
2020-10-16 13:16:01 +00:00
|
|
|
id: "rowContainer",
|
2019-08-29 13:02:11 +00:00
|
|
|
};
|
|
|
|
|
2020-10-16 13:16:01 +00:00
|
|
|
export default RowContainer;
|