From 7e77a0ff90d66963e0ba888d115c6a2e0e38bfb4 Mon Sep 17 00:00:00 2001
From: "M. Asrof Bayhaqqi" <masrofbayhaqqi@gmail.com>
Date: Tue, 13 Mar 2018 13:59:18 +0700
Subject: [PATCH] add props isLoading

---
 example/index.android.js         | 10 ++++++++--
 example/index.ios.js             | 10 ++++++++--
 lib/PullToRefreshView.android.js | 17 ++++++++++++-----
 lib/PullToRefreshView.ios.js     | 28 +++++++++++++++++++++++-----
 4 files changed, 51 insertions(+), 14 deletions(-)

diff --git a/example/index.android.js b/example/index.android.js
index 41f4cd4..e94bf97 100644
--- a/example/index.android.js
+++ b/example/index.android.js
@@ -19,17 +19,22 @@ export default class PullToRefreshExample extends Component {
   constructor(param) {
     super(param);
     this.state = {
-      cards: [1, 2, 3]
+      cards: [1, 2, 3],
+      isLoading: false
     }
     this._refresh = this._refresh.bind(this);
 
   }
+  componentWillMount() {
+    this.setState({ isLoading: true });
+    this._refresh();
+  }
   _refresh () {
     // you must return Promise everytime
     return new Promise((resolve) => {
       setTimeout(()=>{
         // some refresh process should come here
-        this.setState({cards: this.state.cards.concat([this.state.cards.length + 1])})
+        this.setState({ isLoading: false, cards: this.state.cards.concat([this.state.cards.length + 1]) })
         resolve(); 
       }, 2000)
     })
@@ -41,6 +46,7 @@ export default class PullToRefreshExample extends Component {
           <Text style={styles.headerText}>PullToRefreshView Demo</Text>
         </View>
         <PTRView
+          isLoading={this.state.isLoading}
           style={{backgroundColor:'#F5FCFF'}}
           onRefresh={this._refresh}
         >
diff --git a/example/index.ios.js b/example/index.ios.js
index 41f4cd4..975ab1a 100644
--- a/example/index.ios.js
+++ b/example/index.ios.js
@@ -19,17 +19,22 @@ export default class PullToRefreshExample extends Component {
   constructor(param) {
     super(param);
     this.state = {
-      cards: [1, 2, 3]
+      cards: [1, 2, 3],
+      isLoading: false
     }
     this._refresh = this._refresh.bind(this);
 
   }
+  componentDidMount() {
+    this.setState({ isLoading: true });
+    this._refresh();
+  }
   _refresh () {
     // you must return Promise everytime
     return new Promise((resolve) => {
       setTimeout(()=>{
         // some refresh process should come here
-        this.setState({cards: this.state.cards.concat([this.state.cards.length + 1])})
+        this.setState({ isLoading: false, cards: this.state.cards.concat([this.state.cards.length + 1]) })
         resolve(); 
       }, 2000)
     })
@@ -41,6 +46,7 @@ export default class PullToRefreshExample extends Component {
           <Text style={styles.headerText}>PullToRefreshView Demo</Text>
         </View>
         <PTRView
+          isLoading={this.state.isLoading}
           style={{backgroundColor:'#F5FCFF'}}
           onRefresh={this._refresh}
         >
diff --git a/lib/PullToRefreshView.android.js b/lib/PullToRefreshView.android.js
index c23d3c2..482cc8a 100644
--- a/lib/PullToRefreshView.android.js
+++ b/lib/PullToRefreshView.android.js
@@ -5,10 +5,10 @@ import PropTypes from 'prop-types'
 import { View, RefreshControl, ScrollView } from 'react-native'
 
 export default class PTRViewAndroid extends React.Component {
-  constructor () {
-    super()
+  constructor (props) {
+    super(props)
     this.state = {
-      isLoading: false
+      isLoading: this.props.isLoading
     }
   }
   _delay () {
@@ -33,6 +33,11 @@ export default class PTRViewAndroid extends React.Component {
       isLoading: false
     })
   }
+  componentWillReceiveProps(nextProps) {
+    if (nextProps.isLoading !== this.state.isLoading) {
+      this.setState({ isLoading: nextProps.isLoading });
+    }
+  }
   render () {
     return (
       <ScrollView
@@ -55,7 +60,8 @@ PTRViewAndroid.defaultProps = {
   colors: ['#000'],
   progressBackgroundColor: '#fff',
   offset: 0,
-  delay: 0
+  delay: 0,
+  isLoading: false
 }
 
 PTRViewAndroid.propTypes = {
@@ -63,5 +69,6 @@ PTRViewAndroid.propTypes = {
   onRefresh: PropTypes.func,
   style: PropTypes.object,
   children (props, propName, componentName) {
-  }
+  },
+  isLoading: PropTypes.bool
 }
diff --git a/lib/PullToRefreshView.ios.js b/lib/PullToRefreshView.ios.js
index 2640881..fb137d8 100644
--- a/lib/PullToRefreshView.ios.js
+++ b/lib/PullToRefreshView.ios.js
@@ -8,12 +8,12 @@ import { View, ScrollView } from 'react-native'
 const INDICATOR_HEIGHT = 40
 
 export default class PTRViewiOS extends React.Component {
-  constructor () {
-    super()
+  constructor (props) {
+    super(props)
     this.state = {
       expand: -INDICATOR_HEIGHT,
       scroll_offset: 0,
-      isLoading: false,
+      isLoading: this.props.isLoading,
       needPull: true
     }
   }
@@ -82,6 +82,22 @@ export default class PTRViewiOS extends React.Component {
       }
     })()
   }
+  componentWillReceiveProps(nextProps) {
+    if (nextProps.isLoading !== this.state.isLoading) {
+      if (nextProps.isLoading === true) {
+        this.setState({
+          expand: INDICATOR_HEIGHT-50,
+          needPull: false
+        }, () => this._expander(true))
+      } else {
+        this.setState({
+          expand: -INDICATOR_HEIGHT,
+          needPull: true
+        }, () => this._expander(false))
+      }
+      this.setState({ isLoading: nextProps.isLoading });
+    }
+  }
   render () {
     return (
       <View style={{flex: 1}}>
@@ -107,7 +123,8 @@ export default class PTRViewiOS extends React.Component {
 
 PTRViewiOS.defaultProps = {
   offset: 100,
-  delay: 0
+  delay: 0,
+  isLoading: false
 }
 
 PTRViewiOS.propTypes = {
@@ -116,5 +133,6 @@ PTRViewiOS.propTypes = {
   onRefresh: PropTypes.func,
   style: PropTypes.object,
   children (props, propName, componentName) {
-  }
+  },
+  isLoading: PropTypes.bool
 }