onChangeBefore buttons #8

yasaricli · May 1, 2020 · 2291d88 · 2291d88
1 parent d310e4f
commit 2291d88
Show file tree

Hide file tree

Showing 5 changed files with 40 additions and 10 deletions.
diff --git a/.npmignore b/.npmignore
@@ -1,4 +1,4 @@
 example
 docs
 static
-capture.gif
+capture.gif
diff --git a/example/package.json b/example/package.json
@@ -12,7 +12,7 @@
   "dependencies": {
     "react": "16.9.0",
     "react-native": "0.61.5",
-    "react-native-counters": "../",
+    "react-native-counters": "^1.0.1",
     "react-native-vector-icons": "^6.6.0"
   },
   "devDependencies": {

diff --git a/example/yarn.lock b/example/yarn.lock
@@ -5437,8 +5437,10 @@ react-is@^16.12.0, react-is@^16.8.1, react-is@^16.8.4, react-is@^16.9.0:
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.0.tgz#0f37c3613c34fe6b37cd7f763a0d6293ab15c527"
   integrity sha512-GFMtL0vHkiBv9HluwNZTggSn/sCyEt9n02aM0dSAjGGyqyNlAyftYm4phPxdvCigG15JreC5biwxCgTAJZ7yAA==
 
-react-native-counters@../:
-  version "0.0.1"
+react-native-counters@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/react-native-counters/-/react-native-counters-1.0.1.tgz#458f8d639d501ff34c85d69b94e2af2960277223"
+  integrity sha512-boSbEXxYHUU7rkDIlTqMAYiveagJn30i37bDqleeJQEm9jW0WFcdAfvZzGQuR/lLTWCD1kpcjtYrBhoq4TYFKg==
   dependencies:
     prop-types "^15.6.2"
 

diff --git a/src/components/button.js b/src/components/button.js
@@ -14,17 +14,21 @@ export default class Button extends Component {
   }
 
   isDisabled() {
-    const { min, max, count } = this.props;
+    const { min, max, count, disabled } = this.props;
 
-    return (this.isMinus() ? min : max) == count;
+    if (disabled) {
+      return true;
+    }
+
+    return (this.isMinus() ? min : max) === count;
   }
 
   isMinus() {
-    return this.props.type == '-';
+    return this.props.type === '-';
   }
 
   isPlus() {
-    return this.props.type == '+';
+    return this.props.type === '+';
   }
 
   icon() {

diff --git a/src/components/counter.js b/src/components/counter.js
@@ -14,19 +14,36 @@ export default class Counter extends Component {
     super(props);
     this.state = {
       count: this.props.start,
+
+      // onChangeBefore loading --> disabled.
+      beforeLoading: false,
     };
   }
 
   onPress(count, type) {
+    const { onChangeBefore } = this.props;
+
+    if (onChangeBefore) {
+      return this.setState({ beforeLoading: true }, () => {
+        onChangeBefore(() => {
+          return this.onChange(count, type);
+        });
+      });
+    }
+
+    return this.onChange(count, type);
+  }
+
+  onChange(count, type) {
     const { onChange } = this.props;
 
-    return this.setState({ count }, () => {
+    return this.setState({ count, beforeLoading: false }, () => {
       return onChange && onChange(count, type);
     });
   }
 
   render() {
-    const { count } = this.state;
+    const { count, beforeLoading } = this.state;
     const { countTextStyle } = this.props;
 
     return (
@@ -35,6 +52,7 @@ export default class Counter extends Component {
           type="-"
           count={this.state.count}
           onPress={this.onPress.bind(this)}
+          disabled={beforeLoading}
           {...this.props}
         />
 
@@ -48,6 +66,7 @@ export default class Counter extends Component {
           type="+"
           count={this.state.count}
           onPress={this.onPress.bind(this)}
+          disabled={beforeLoading}
           {...this.props}
         />
       </View>
@@ -62,7 +81,10 @@ Counter.propTypes = {
   start: PropTypes.number,
   min: PropTypes.number,
   max: PropTypes.number,
+
+
   onChange: PropTypes.func,
+  onChangeBefore: PropTypes.func,
 
   minusIcon: PropTypes.func,
   plusIcon: PropTypes.func,
@@ -86,4 +108,6 @@ Counter.defaultProps = {
   buttonStyle: {},
   buttonTextStyle: {},
   countTextStyle: {},
+
+  onChangeBefore: null
 };