react-native-infinite-scroll-view - npm Package Compare versions

Comparing version 0.1.1 to 0.2.0

InfiniteScrollView.js

@@ -8,4 +8,6 @@ 'use strict';
   ScrollView,
+  View,
 } = React;
 
+let autobind = require('autobind-decorator');
 let cloneReferencedElement = require('react-native-clone-referenced-element');
@@ -15,3 +17,3 @@
 
-class InfiniteScrollView {
+class InfiniteScrollView extends React.Component {
   static propTypes = {
@@ -21,16 +23,25 @@ ...ScrollView.propTypes,
     canLoadMore: PropTypes.bool.isRequired,
-    isLoadingMore: PropTypes.bool.isRequired,
-    onLoadMore: PropTypes.func.isRequired,
+    onLoadError: PropTypes.func,
+    onLoadMoreAsync: PropTypes.func.isRequired,
     renderLoadingIndicator: PropTypes.func.isRequired,
+    renderLoadingErrorIndicator: PropTypes.func.isRequired,
   };
 
   static defaultProps = {
-    distanceToLoadMore: 1000,
+    distanceToLoadMore: 1500,
     canLoadMore: false,
-    isLoadingMore: false,
     scrollEventThrottle: 100,
     renderLoadingIndicator: () => <DefaultLoadingIndicator />,
+    renderLoadingErrorIndicator: () => <View />,
     renderScrollComponent: props => <ScrollView {...props} />,
   };
 
+  constructor(props, context) {
+    super(props, context);
+
+    this.state = {
+      isDisplayingError: false,
+    };
+  }
+
   getScrollResponder(): ReactComponent {
@@ -45,4 +56,13 @@ return this._scrollComponent.getScrollResponder();
   render() {
-    if (this.props.isLoadingMore) {
-      var loadingIndicator = React.cloneElement(
+    let statusIndicator;
+
+    if (this.state.isDisplayingError) {
+      statusIndicator = React.cloneElement(
+        this.props.renderLoadingErrorIndicator(
+          { onRetryLoadMore: this._onLoadMoreAsync }
+         ),
+        { key: 'loading-error-indicator' },
+      );
+    } else if (this.props.canLoadMore) {
+      statusIndicator = React.cloneElement(
         this.props.renderLoadingIndicator(),
@@ -59,3 +79,3 @@ { key: 'loading-indicator' },
       onScroll: this._handleScroll.bind(this),
-      children: [this.props.children, loadingIndicator],
+      children: [this.props.children, statusIndicator],
     });
@@ -73,3 +93,4 @@
 
-    if (this.props.isLoadingMore || !this.props.canLoadMore) {
+    if (this.state.isLoading || !this.props.canLoadMore ||
+        this.state.isDisplayingError) {
       return;
@@ -79,6 +100,23 @@ }
     if (this._distanceFromEnd(event) < this.props.distanceToLoadMore) {
-      this.props.onLoadMore();
+      this._onLoadMoreAsync();
     }
   }
 
+  @autobind
+  async _onLoadMoreAsync() {
+    if (this.state.isLoading && __DEV__) {
+      throw new Error('_onLoadMoreAsync called while isLoading is true');
+    }
+
+    try {
+      this.setState({isDisplayingError: false, isLoading: true});
+      await this.props.onLoadMoreAsync();
+    } catch (e) {
+      this.props.onLoadError && this.props.onLoadError(e);
+      this.setState({isDisplayingError: true});
+    } finally {
+      this.setState({isLoading: false});
+    }
+  }
+
   _distanceFromEnd(event): number {
@@ -85,0 +123,0 @@ let {

package.json

 {
   "name": "react-native-infinite-scroll-view",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "An infinitely scrolling view that notifies you as the scroll offset approaches the bottom",
@@ -26,2 +26,3 @@ "main": "InfiniteScrollView.js",
   "dependencies": {
+    "autobind-decorator": "^1.3.2",
     "react-native-clone-referenced-element": "^1.0.0",
@@ -28,0 +29,0 @@ "react-native-scrollable-mixin": "^1.0.0"

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

8885

increased by14.12%

Lines of code

150

increased by28.21%

Worsened metrics

Dependency count

3

increased by50%

Dependency changes

• + Addedautobind-decorator@^1.3.2

• + Addedautobind-decorator@1.4.3(transitive)