@plusscommunities/pluss-core-app 1.4.9 → 1.5.0

package/dist/module/components/BackButton.js

@@ -0,0 +1,62 @@
+import React, { PureComponent } from 'react';
+import { View, TouchableOpacity } from 'react-native';
+import { connect } from 'react-redux';
+import stylez from '../styles';
+import { Pl60Icon } from '../fonts';
+import { getMainBrandingColourFromState } from '../colours';
+/* 
+Props- 
+    onPress - onPress action
+    diameter - size of button
+    color - default will be aveoMain
+    style - custom style for container
+*/
+
+class BackButton extends PureComponent {
+  render() {
+    const size = this.props.diameter || 32;
+    const radius = size / 2;
+
+    if (this.props.noClick) {
+      return /*#__PURE__*/React.createElement(View, {
+        style: [stylez.backButton, {
+          backgroundColor: this.props.colourBrandingMain,
+          height: size,
+          width: size,
+          borderRadius: radius
+        }, this.props.color && {
+          backgroundColor: this.props.color
+        }, this.props.style]
+      }, /*#__PURE__*/React.createElement(Pl60Icon, {
+        name: this.props.flipped ? 'chevron_right' : 'chevron_left',
+        style: [stylez.backButtonIcon, this.props.iconStyle]
+      }));
+    }
+
+    return /*#__PURE__*/React.createElement(TouchableOpacity, {
+      style: [stylez.backButton, {
+        backgroundColor: this.props.colourBrandingMain,
+        height: size,
+        width: size,
+        borderRadius: radius
+      }, this.props.color && {
+        backgroundColor: this.props.color
+      }, this.props.style],
+      onPress: this.props.onPress
+    }, /*#__PURE__*/React.createElement(Pl60Icon, {
+      name: this.props.flipped ? 'chevron_right' : 'chevron_left',
+      style: [stylez.backButtonIcon, this.props.iconStyle]
+    }));
+  }
+
+}
+
+const mapStateToProps = state => {
+  return {
+    colourBrandingMain: getMainBrandingColourFromState(state)
+  };
+};
+
+const backButton = connect(mapStateToProps, {})(BackButton);
+export { backButton as BackButton };
+//# sourceMappingURL=BackButton.js.map

package/dist/module/components/BackButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["BackButton.js"],"names":["React","PureComponent","View","TouchableOpacity","connect","stylez","Pl60Icon","getMainBrandingColourFromState","BackButton","render","size","props","diameter","radius","noClick","backButton","backgroundColor","colourBrandingMain","height","width","borderRadius","color","style","flipped","backButtonIcon","iconStyle","onPress","mapStateToProps","state"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,aAAhB,QAAqC,OAArC;AACA,SAASC,IAAT,EAAeC,gBAAf,QAAuC,cAAvC;AACA,SAASC,OAAT,QAAwB,aAAxB;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,SAASC,QAAT,QAAyB,UAAzB;AACA,SAASC,8BAAT,QAA+C,YAA/C;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,MAAMC,UAAN,SAAyBP,aAAzB,CAAuC;AACrCQ,EAAAA,MAAM,GAAG;AACP,UAAMC,IAAI,GAAG,KAAKC,KAAL,CAAWC,QAAX,IAAuB,EAApC;AACA,UAAMC,MAAM,GAAGH,IAAI,GAAG,CAAtB;;AACA,QAAI,KAAKC,KAAL,CAAWG,OAAf,EAAwB;AACtB,0BACE,oBAAC,IAAD;AACE,QAAA,KAAK,EAAE,CACLT,MAAM,CAACU,UADF,EAEL;AAAEC,UAAAA,eAAe,EAAE,KAAKL,KAAL,CAAWM,kBAA9B;AAAkDC,UAAAA,MAAM,EAAER,IAA1D;AAAgES,UAAAA,KAAK,EAAET,IAAvE;AAA6EU,UAAAA,YAAY,EAAEP;AAA3F,SAFK,EAGL,KAAKF,KAAL,CAAWU,KAAX,IAAoB;AAAEL,UAAAA,eAAe,EAAE,KAAKL,KAAL,CAAWU;AAA9B,SAHf,EAIL,KAAKV,KAAL,CAAWW,KAJN;AADT,sBAQE,oBAAC,QAAD;AAAU,QAAA,IAAI,EAAE,KAAKX,KAAL,CAAWY,OAAX,GAAqB,eAArB,GAAuC,cAAvD;AAAuE,QAAA,KAAK,EAAE,CAAClB,MAAM,CAACmB,cAAR,EAAwB,KAAKb,KAAL,CAAWc,SAAnC;AAA9E,QARF,CADF;AAYD;;AACD,wBACE,oBAAC,gBAAD;AACE,MAAA,KAAK,EAAE,CACLpB,MAAM,CAACU,UADF,EAEL;AAAEC,QAAAA,eAAe,EAAE,KAAKL,KAAL,CAAWM,kBAA9B;AAAkDC,QAAAA,MAAM,EAAER,IAA1D;AAAgES,QAAAA,KAAK,EAAET,IAAvE;AAA6EU,QAAAA,YAAY,EAAEP;AAA3F,OAFK,EAGL,KAAKF,KAAL,CAAWU,KAAX,IAAoB;AAAEL,QAAAA,eAAe,EAAE,KAAKL,KAAL,CAAWU;AAA9B,OAHf,EAIL,KAAKV,KAAL,CAAWW,KAJN,CADT;AAOE,MAAA,OAAO,EAAE,KAAKX,KAAL,CAAWe;AAPtB,oBASE,oBAAC,QAAD;AAAU,MAAA,IAAI,EAAE,KAAKf,KAAL,CAAWY,OAAX,GAAqB,eAArB,GAAuC,cAAvD;AAAuE,MAAA,KAAK,EAAE,CAAClB,MAAM,CAACmB,cAAR,EAAwB,KAAKb,KAAL,CAAWc,SAAnC;AAA9E,MATF,CADF;AAaD;;AA/BoC;;AAkCvC,MAAME,eAAe,GAAGC,KAAK,IAAI;AAC/B,SAAO;AACLX,IAAAA,kBAAkB,EAAEV,8BAA8B,CAACqB,KAAD;AAD7C,GAAP;AAGD,CAJD;;AAMA,MAAMb,UAAU,GAAGX,OAAO,CAACuB,eAAD,EAAkB,EAAlB,CAAP,CAA6BnB,UAA7B,CAAnB;AACA,SAASO,UAAU,IAAIP,UAAvB","sourcesContent":["import React, { PureComponent } from 'react';\nimport { View, TouchableOpacity } from 'react-native';\nimport { connect } from 'react-redux';\nimport stylez from '../styles';\nimport { Pl60Icon } from '../fonts';\nimport { getMainBrandingColourFromState } from '../colours';\n\n/* \nProps- \n    onPress - onPress action\n    diameter - size of button\n    color - default will be aveoMain\n    style - custom style for container\n*/\n\nclass BackButton extends PureComponent {\n  render() {\n    const size = this.props.diameter || 32;\n    const radius = size / 2;\n    if (this.props.noClick) {\n      return (\n        <View\n          style={[\n            stylez.backButton,\n            { backgroundColor: this.props.colourBrandingMain, height: size, width: size, borderRadius: radius },\n            this.props.color && { backgroundColor: this.props.color },\n            this.props.style,\n          ]}\n        >\n          <Pl60Icon name={this.props.flipped ? 'chevron_right' : 'chevron_left'} style={[stylez.backButtonIcon, this.props.iconStyle]} />\n        </View>\n      );\n    }\n    return (\n      <TouchableOpacity\n        style={[\n          stylez.backButton,\n          { backgroundColor: this.props.colourBrandingMain, height: size, width: size, borderRadius: radius },\n          this.props.color && { backgroundColor: this.props.color },\n          this.props.style,\n        ]}\n        onPress={this.props.onPress}\n      >\n        <Pl60Icon name={this.props.flipped ? 'chevron_right' : 'chevron_left'} style={[stylez.backButtonIcon, this.props.iconStyle]} />\n      </TouchableOpacity>\n    );\n  }\n}\n\nconst mapStateToProps = state => {\n  return {\n    colourBrandingMain: getMainBrandingColourFromState(state),\n  };\n};\n\nconst backButton = connect(mapStateToProps, {})(BackButton);\nexport { backButton as BackButton };\n"]}

package/dist/module/components/CategoryTabs.js

@@ -0,0 +1,171 @@
+import React, { Component } from 'react';
+import _ from 'lodash';
+import { Text, TouchableOpacity, View, ScrollView } from 'react-native';
+import { connect } from 'react-redux';
+import { TEXT_LIGHT, COLOUR_GREEN, getMainBrandingColourFromState } from '../colours';
+import { getSiteSettingFromState } from '../helper'; // import { HAS_GRADIENT_HEADER } from '../../config';
+
+import Config from '../config';
+
+class CategoryTabs extends Component {
+  constructor(props) {
+    super(props);
+    this.state = {
+      categoryKeys: [],
+      selectedCategory: this.props.initialCategory
+    };
+  }
+
+  UNSAFE_componentWillMount() {
+    this.setState({
+      selectedCategory: !_.isUndefined(this.props.currentTab) && !_.isEmpty(this.props.currentTab) ? this.props.currentTab : this.props.initialCategory,
+      categoryKeys: this.props.categoryKeys
+    });
+  }
+
+  componentDidMount() {
+    this.setState({
+      selectedCategory: !_.isUndefined(this.props.currentTab) && !_.isEmpty(this.props.currentTab) ? this.props.currentTab : this.props.initialCategory
+    });
+  }
+
+  UNSAFE_componentWillReceiveProps(nextProps) {
+    if (!_.isUndefined(nextProps.currentTab) && !_.isEmpty(nextProps.currentTab)) {
+      this.setState({
+        selectedCategory: nextProps.currentTab
+      });
+    }
+  }
+
+  selectCategory(key) {
+    this.setState({
+      selectedCategory: key
+    });
+    this.props.onSelect(key);
+  }
+
+  renderCounter(key) {
+    if (this.props.categoryCounter && this.props.categoryCounter[key] && this.props.categoryCounter[key] === true && this.props.counterValues && this.props.counterValues[key] > 0) {
+      return /*#__PURE__*/React.createElement(View, {
+        style: styles.counter
+      }, /*#__PURE__*/React.createElement(Text, {
+        style: styles.counterText
+      }, this.props.counterValues[key]));
+    }
+
+    return null;
+  }
+
+  renderCategories(noScrollStyle) {
+    const getTextColour = key => {
+      if (this.state.selectedCategory === key) {
+        return this.props.headerType !== 'white' ? '#fff' : this.props.colourBrandingMain;
+      }
+
+      return this.props.headerType !== 'white' ? '#fff' : TEXT_LIGHT;
+    };
+
+    const getBottomBorderColour = key => {
+      if (this.state.selectedCategory === key) {
+        return this.props.headerType !== 'white' ? '#fff' : this.props.colourBrandingMain;
+      }
+
+      return this.props.headerType !== 'white' ? this.props.colourBrandingMain : '#fff';
+    };
+
+    return this.state.categoryKeys.map((key, index) => {
+      return /*#__PURE__*/React.createElement(TouchableOpacity, {
+        key: index // style={[{ minHeight: this.props.height || 30, justifyContent: 'center' }, noScrollStyle && { flex: 1 }]}
+        ,
+        style: [{
+          flex: 1,
+          minHeight: this.props.height || 30,
+          justifyContent: 'center'
+        }, this.props.catWrapperStyle],
+        onPress: this.selectCategory.bind(this, key)
+      }, /*#__PURE__*/React.createElement(View, {
+        style: [{
+          borderBottomColor: getBottomBorderColour(key),
+          borderBottomWidth: noScrollStyle ? 0 : 2,
+          marginRight: noScrollStyle ? 0 : 16,
+          marginLeft: index === 0 && !noScrollStyle ? 16 : 0,
+          justifyContent: 'center',
+          alignContent: 'center',
+          minHeight: 30,
+          flexDirection: 'row',
+          backgroundColor: this.props.headerType !== 'white' ? this.props.colourBrandingMain : undefined
+        }, this.props.style]
+      }, /*#__PURE__*/React.createElement(View, {
+        style: [noScrollStyle && styles.innerContainer, {
+          flex: 1,
+          borderColor: getBottomBorderColour(key),
+          justifyContent: 'center'
+        }, this.props.catStyle]
+      }, /*#__PURE__*/React.createElement(Text, {
+        style: [{
+          fontFamily: 'sf-semibold',
+          fontSize: 15,
+          color: getTextColour(key),
+          textAlign: 'center',
+          paddingVertical: 8,
+          width: 'auto'
+        }, this.props.textStyle, this.props.colourBrandingHeader && this.state.selectedCategory !== key && {
+          color: this.props.colourBrandingMain,
+          opacity: 0.5
+        }]
+      }, key), this.renderCounter(key))));
+    });
+  }
+
+  render() {
+    if (this.props.noScroll) {
+      // return (<View style={{ flexDirection: 'row', paddingLeft: 16, paddingRight: 16 }}>
+      return /*#__PURE__*/React.createElement(View, {
+        style: {
+          flexDirection: 'row',
+          justifyContent: 'space-evenly'
+        }
+      }, this.renderCategories(true));
+    }
+
+    return /*#__PURE__*/React.createElement(ScrollView, {
+      horizontal: true
+    }, this.renderCategories(false));
+  }
+
+}
+
+const styles = {
+  counter: {
+    backgroundColor: COLOUR_GREEN,
+    height: 16,
+    minWidth: 16,
+    borderRadius: 8,
+    marginLeft: 4,
+    marginTop: 4,
+    justifyContent: 'center',
+    alignContent: 'center'
+  },
+  counterText: {
+    color: '#fff',
+    textAlign: 'center',
+    fontSize: 12,
+    fontFamily: 'sf-semibold'
+  },
+  innerContainer: {
+    borderBottomWidth: 2,
+    flexDirection: 'row',
+    paddingHorizontal: 8
+  }
+};
+
+const mapStateToProps = state => {
+  return {
+    colourBrandingMain: getMainBrandingColourFromState(state),
+    headerType: getSiteSettingFromState(state, 'HeaderType', getSiteSettingFromState(state, 'UseGradientHeader', Config.env.hasGradientHeader) ? 'gradient' : 'white')
+  };
+};
+
+const categoryTabs = connect(mapStateToProps, {})(CategoryTabs);
+export { categoryTabs as CategoryTabs };
+//# sourceMappingURL=CategoryTabs.js.map

package/dist/module/components/CategoryTabs.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["CategoryTabs.js"],"names":["React","Component","_","Text","TouchableOpacity","View","ScrollView","connect","TEXT_LIGHT","COLOUR_GREEN","getMainBrandingColourFromState","getSiteSettingFromState","Config","CategoryTabs","constructor","props","state","categoryKeys","selectedCategory","initialCategory","UNSAFE_componentWillMount","setState","isUndefined","currentTab","isEmpty","componentDidMount","UNSAFE_componentWillReceiveProps","nextProps","selectCategory","key","onSelect","renderCounter","categoryCounter","counterValues","styles","counter","counterText","renderCategories","noScrollStyle","getTextColour","headerType","colourBrandingMain","getBottomBorderColour","map","index","flex","minHeight","height","justifyContent","catWrapperStyle","bind","borderBottomColor","borderBottomWidth","marginRight","marginLeft","alignContent","flexDirection","backgroundColor","undefined","style","innerContainer","borderColor","catStyle","fontFamily","fontSize","color","textAlign","paddingVertical","width","textStyle","colourBrandingHeader","opacity","render","noScroll","minWidth","borderRadius","marginTop","paddingHorizontal","mapStateToProps","env","hasGradientHeader","categoryTabs"],"mappings":"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","sourcesContent":["import React, { Component } from 'react';\nimport _ from 'lodash';\nimport { Text, TouchableOpacity, View, ScrollView } from 'react-native';\nimport { connect } from 'react-redux';\nimport { TEXT_LIGHT, COLOUR_GREEN, getMainBrandingColourFromState } from '../colours';\nimport { getSiteSettingFromState } from '../helper';\n// import { HAS_GRADIENT_HEADER } from '../../config';\nimport Config from '../config';\n\nclass CategoryTabs extends Component {\n  constructor(props) {\n    super(props);\n    this.state = {\n      categoryKeys: [],\n      selectedCategory: this.props.initialCategory,\n    };\n  }\n\n  UNSAFE_componentWillMount() {\n    this.setState({\n      selectedCategory:\n        !_.isUndefined(this.props.currentTab) && !_.isEmpty(this.props.currentTab) ? this.props.currentTab : this.props.initialCategory,\n      categoryKeys: this.props.categoryKeys,\n    });\n  }\n\n  componentDidMount() {\n    this.setState({\n      selectedCategory:\n        !_.isUndefined(this.props.currentTab) && !_.isEmpty(this.props.currentTab) ? this.props.currentTab : this.props.initialCategory,\n    });\n  }\n\n  UNSAFE_componentWillReceiveProps(nextProps) {\n    if (!_.isUndefined(nextProps.currentTab) && !_.isEmpty(nextProps.currentTab)) {\n      this.setState({ selectedCategory: nextProps.currentTab });\n    }\n  }\n\n  selectCategory(key) {\n    this.setState({\n      selectedCategory: key,\n    });\n    this.props.onSelect(key);\n  }\n\n  renderCounter(key) {\n    if (\n      this.props.categoryCounter &&\n      this.props.categoryCounter[key] &&\n      this.props.categoryCounter[key] === true &&\n      this.props.counterValues &&\n      this.props.counterValues[key] > 0\n    ) {\n      return (\n        <View style={styles.counter}>\n          <Text style={styles.counterText}>{this.props.counterValues[key]}</Text>\n        </View>\n      );\n    }\n    return null;\n  }\n\n  renderCategories(noScrollStyle) {\n    const getTextColour = key => {\n      if (this.state.selectedCategory === key) {\n        return this.props.headerType !== 'white' ? '#fff' : this.props.colourBrandingMain;\n      }\n      return this.props.headerType !== 'white' ? '#fff' : TEXT_LIGHT;\n    };\n    const getBottomBorderColour = key => {\n      if (this.state.selectedCategory === key) {\n        return this.props.headerType !== 'white' ? '#fff' : this.props.colourBrandingMain;\n      }\n      return this.props.headerType !== 'white' ? this.props.colourBrandingMain : '#fff';\n    };\n    return this.state.categoryKeys.map((key, index) => {\n      return (\n        <TouchableOpacity\n          key={index}\n          // style={[{ minHeight: this.props.height || 30, justifyContent: 'center' }, noScrollStyle && { flex: 1 }]}\n          style={[{ flex: 1, minHeight: this.props.height || 30, justifyContent: 'center' }, this.props.catWrapperStyle]}\n          onPress={this.selectCategory.bind(this, key)}\n        >\n          <View\n            style={[\n              {\n                borderBottomColor: getBottomBorderColour(key),\n                borderBottomWidth: noScrollStyle ? 0 : 2,\n                marginRight: noScrollStyle ? 0 : 16,\n                marginLeft: index === 0 && !noScrollStyle ? 16 : 0,\n                justifyContent: 'center',\n                alignContent: 'center',\n                minHeight: 30,\n                flexDirection: 'row',\n                backgroundColor: this.props.headerType !== 'white' ? this.props.colourBrandingMain : undefined,\n              },\n              this.props.style,\n            ]}\n          >\n            <View\n              style={[\n                noScrollStyle && styles.innerContainer,\n                {\n                  flex: 1,\n                  borderColor: getBottomBorderColour(key),\n                  justifyContent: 'center',\n                },\n                this.props.catStyle,\n              ]}\n            >\n              <Text\n                style={[\n                  {\n                    fontFamily: 'sf-semibold',\n                    fontSize: 15,\n                    color: getTextColour(key),\n                    textAlign: 'center',\n                    paddingVertical: 8,\n                    width: 'auto',\n                  },\n                  this.props.textStyle,\n                  this.props.colourBrandingHeader &&\n                    this.state.selectedCategory !== key && { color: this.props.colourBrandingMain, opacity: 0.5 },\n                ]}\n              >\n                {key}\n              </Text>\n              {this.renderCounter(key)}\n            </View>\n          </View>\n        </TouchableOpacity>\n      );\n    });\n  }\n\n  render() {\n    if (this.props.noScroll) {\n      // return (<View style={{ flexDirection: 'row', paddingLeft: 16, paddingRight: 16 }}>\n      return <View style={{ flexDirection: 'row', justifyContent: 'space-evenly' }}>{this.renderCategories(true)}</View>;\n    }\n    return <ScrollView horizontal>{this.renderCategories(false)}</ScrollView>;\n  }\n}\n\nconst styles = {\n  counter: {\n    backgroundColor: COLOUR_GREEN,\n    height: 16,\n    minWidth: 16,\n    borderRadius: 8,\n    marginLeft: 4,\n    marginTop: 4,\n    justifyContent: 'center',\n    alignContent: 'center',\n  },\n  counterText: {\n    color: '#fff',\n    textAlign: 'center',\n    fontSize: 12,\n    fontFamily: 'sf-semibold',\n  },\n  innerContainer: {\n    borderBottomWidth: 2,\n    flexDirection: 'row',\n    paddingHorizontal: 8,\n  },\n};\n\nconst mapStateToProps = state => {\n  return {\n    colourBrandingMain: getMainBrandingColourFromState(state),\n    headerType: getSiteSettingFromState(\n      state,\n      'HeaderType',\n      getSiteSettingFromState(state, 'UseGradientHeader', Config.env.hasGradientHeader) ? 'gradient' : 'white',\n    ),\n  };\n};\n\nconst categoryTabs = connect(mapStateToProps, {})(CategoryTabs);\nexport { categoryTabs as CategoryTabs };\n"]}

package/dist/module/components/CommentReply.js

@@ -0,0 +1,363 @@
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import { Keyboard, TextInput, View, ImageBackground, TouchableOpacity, Dimensions } from 'react-native';
+import { Icon } from 'react-native-elements';
+import { getBottomSpace } from 'react-native-iphone-x-helper';
+import _ from 'lodash';
+import { getApiError } from '../session';
+import { getShadowStyle } from '../helper';
+import { TEXT_BLUEGREY, TEXT_DARKEST, BG_GREY } from '../colours';
+import { Spinner } from './Spinner';
+import ImageUploader from './ImageUploader';
+import { reactionActions } from '../apis';
+const SCREEN_HEIGHT = Dimensions.get('window').height;
+
+class CommentReply extends Component {
+  constructor(props) {
+    super(props);
+
+    _defineProperty(this, "onUploadStarted", () => {
+      this.setState({
+        uploadingCommentImage: true
+      });
+      setTimeout(() => {
+        if (!this.props.noScroll) {
+          var _this$props$scrollVie, _this$props$scrollVie2;
+
+          (_this$props$scrollVie = this.props.scrollView) === null || _this$props$scrollVie === void 0 ? void 0 : (_this$props$scrollVie2 = _this$props$scrollVie.current) === null || _this$props$scrollVie2 === void 0 ? void 0 : _this$props$scrollVie2.scrollToEnd({
+            animated: true
+          });
+        }
+      }, 500);
+    });
+
+    _defineProperty(this, "onUploadSuccess", uri => {
+      this.setState({
+        uploadingCommentImage: false,
+        commentImageInput: uri.replace('/general/', '/general1400/')
+      });
+    });
+
+    _defineProperty(this, "onUploadFailed", () => {
+      this.setState({
+        uploadingCommentImage: false,
+        commentImageInput: null
+      });
+    });
+
+    this.state = {
+      commentImageInput: '',
+      commentInput: '',
+      uploadingCommentImage: false,
+      commentsLoading: true,
+      addingComment: false
+    };
+  }
+
+  componentDidMount() {
+    if (this.props.commentSection && this.props.commentSection.current) {
+      this.setState({
+        commentsLoading: this.props.commentSection.current.isLoading()
+      });
+    }
+  }
+
+  focusInput() {
+    this.refs.replyInput.focus();
+  }
+
+  loadingStarted() {
+    this.setState({
+      commentsLoading: true
+    });
+  }
+
+  loadingCompleted() {
+    this.setState({
+      commentsLoading: false
+    });
+  }
+
+  shouldShowImageInput() {
+    return this.state.uploadingCommentImage || !_.isEmpty(this.state.commentImageInput);
+  }
+
+  addComment() {
+    setTimeout(() => {
+      if (!this.props.noScroll) {
+        var _this$props$scrollVie3, _this$props$scrollVie4;
+
+        (_this$props$scrollVie3 = this.props.scrollView) === null || _this$props$scrollVie3 === void 0 ? void 0 : (_this$props$scrollVie4 = _this$props$scrollVie3.current) === null || _this$props$scrollVie4 === void 0 ? void 0 : _this$props$scrollVie4.scrollToEnd({
+          animated: true
+        });
+      }
+    }, 500);
+    const text = this.state.commentInput;
+    const image = this.state.commentImageInput;
+    this.setState({
+      addingComment: true,
+      commentInput: '',
+      commentImageInput: ''
+    });
+    Keyboard.dismiss();
+
+    if (this.props.commentSection) {
+      var _this$props$commentSe, _this$props$commentSe2;
+
+      (_this$props$commentSe = this.props.commentSection) === null || _this$props$commentSe === void 0 ? void 0 : (_this$props$commentSe2 = _this$props$commentSe.current) === null || _this$props$commentSe2 === void 0 ? void 0 : _this$props$commentSe2.startedAddingComment();
+    }
+
+    reactionActions.addComment(this.props.entityId, this.props.entityType, this.props.entityName, this.props.site, text, image, this.props.threadId).then(res => {
+      if (this.props.commentSection) {
+        var _this$props$commentSe3, _this$props$commentSe4;
+
+        (_this$props$commentSe3 = this.props.commentSection) === null || _this$props$commentSe3 === void 0 ? void 0 : (_this$props$commentSe4 = _this$props$commentSe3.current) === null || _this$props$commentSe4 === void 0 ? void 0 : _this$props$commentSe4.commentAdded(res.data);
+      }
+
+      this.setState({
+        addingComment: false
+      });
+      setTimeout(() => {
+        if (!this.props.noScroll) {
+          var _this$props$scrollVie5, _this$props$scrollVie6;
+
+          (_this$props$scrollVie5 = this.props.scrollView) === null || _this$props$scrollVie5 === void 0 ? void 0 : (_this$props$scrollVie6 = _this$props$scrollVie5.current) === null || _this$props$scrollVie6 === void 0 ? void 0 : _this$props$scrollVie6.scrollToEnd({
+            animated: true
+          });
+        }
+      }, 500);
+    }).catch(err => {
+      console.log(getApiError(err));
+    });
+  }
+
+  removeImage() {
+    this.setState({
+      commentImageInput: null
+    });
+  }
+
+  showUploadMenu() {
+    if (this.state.uploadingCommentImage || !_.isEmpty(this.state.commentImageInput)) {
+      return;
+    }
+
+    this.commentImageUploader.showUploadMenu();
+  }
+
+  renderImageAttachment() {
+    if (_.isEmpty(this.state.commentImageInput) && !this.state.uploadingCommentImage) {
+      return null;
+    }
+
+    if (this.state.uploadingCommentImage) {
+      return /*#__PURE__*/React.createElement(View, {
+        style: [styles.accessoryImage, styles.accessoryImageBorder, {
+          borderWidth: 1,
+          borderColor: BG_GREY
+        }]
+      }, /*#__PURE__*/React.createElement(Spinner, null));
+    }
+
+    return /*#__PURE__*/React.createElement(ImageBackground, {
+      style: styles.accessoryImage,
+      imageStyle: styles.accessoryImageBorder,
+      source: {
+        uri: this.state.commentImageInput
+      }
+    }, /*#__PURE__*/React.createElement(TouchableOpacity, {
+      style: styles.accessoryImageClose,
+      onPress: this.removeImage.bind(this),
+      hitSlop: {
+        top: 8,
+        right: 8,
+        bottom: 8,
+        left: 8
+      }
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "remove",
+      type: "font-awesome",
+      iconStyle: styles.accessoryImageCloseIcon,
+      style: styles.accessoryImageCloseIconContainer
+    })));
+  }
+
+  renderImageUploader() {
+    return /*#__PURE__*/React.createElement(ImageUploader, {
+      ref: ref => this.commentImageUploader = ref,
+      onUploadStarted: this.onUploadStarted,
+      onUploadSuccess: this.onUploadSuccess,
+      onUploadFailed: this.onUploadFailed,
+      onLibrarySelected: this.onUploadSuccess,
+      quality: 0.8,
+      allowsEditing: false,
+      fileName: "commentImage",
+      popupTitle: "Add Image",
+      userId: this.props.user.uid,
+      hideLibrary: true
+    });
+  }
+
+  render() {
+    if (_.includes(this.props.user.hidden, 'addComment')) {
+      return null;
+    }
+
+    if (this.state.commentsLoading) {
+      return null;
+    }
+
+    return /*#__PURE__*/React.createElement(View, {
+      style: [styles.inputContainer, getShadowStyle(), this.props.style]
+    }, /*#__PURE__*/React.createElement(View, {
+      style: [styles.input, {
+        marginRight: _.isEmpty(this.state.commentInput) && _.isEmpty(this.state.commentImageInput) ? 40 : 80
+      }]
+    }, /*#__PURE__*/React.createElement(TextInput, {
+      ref: "replyInput",
+      placeholder: "Enter your comment here",
+      value: this.state.commentInput,
+      onFocus: () => {
+        if (!this.props.noScroll) {
+          var _this$props$scrollVie7, _this$props$scrollVie8;
+
+          (_this$props$scrollVie7 = this.props.scrollView) === null || _this$props$scrollVie7 === void 0 ? void 0 : (_this$props$scrollVie8 = _this$props$scrollVie7.current) === null || _this$props$scrollVie8 === void 0 ? void 0 : _this$props$scrollVie8.scrollToEnd({
+            animated: true
+          });
+        }
+      },
+      onChangeText: value => {
+        if (!this.props.noScroll) {
+          var _this$props$scrollVie9, _this$props$scrollVie10;
+
+          (_this$props$scrollVie9 = this.props.scrollView) === null || _this$props$scrollVie9 === void 0 ? void 0 : (_this$props$scrollVie10 = _this$props$scrollVie9.current) === null || _this$props$scrollVie10 === void 0 ? void 0 : _this$props$scrollVie10.scrollToEnd({
+            animated: false
+          });
+        }
+
+        this.setState({
+          commentInput: value
+        });
+      },
+      style: styles.inputText,
+      autoCapitalize: "sentences",
+      multiline: true,
+      autoCorrect: true,
+      autoGrow: true
+    })), (!_.isEmpty(this.state.commentInput) || !_.isEmpty(this.state.commentImageInput)) && !this.state.addingComment && /*#__PURE__*/React.createElement(TouchableOpacity, {
+      onPress: this.addComment.bind(this),
+      style: [styles.sendContainer, {
+        right: 4,
+        padding: 4,
+        width: 40,
+        height: 40
+      }]
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "paper-plane",
+      type: "font-awesome",
+      iconStyle: [styles.send, {
+        width: 40
+      }]
+    })), /*#__PURE__*/React.createElement(TouchableOpacity, {
+      onPress: this.showUploadMenu.bind(this),
+      style: [styles.sendContainer, {
+        right: _.isEmpty(this.state.commentInput) && _.isEmpty(this.state.commentImageInput) ? 4 : 44,
+        padding: 4,
+        width: 40,
+        height: 40
+      }]
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "picture-o",
+      type: "font-awesome",
+      iconStyle: [styles.send, {
+        width: 40
+      }]
+    })), this.renderImageAttachment(), this.renderImageUploader());
+  }
+
+}
+
+const styles = {
+  accessoryImage: {
+    marginTop: 8,
+    width: 60,
+    height: 60
+  },
+  accessoryImageBorder: {
+    borderRadius: 2
+  },
+  accessoryImageClose: {
+    width: 14,
+    height: 14,
+    borderRadius: 7,
+    position: 'absolute',
+    top: -7,
+    right: -7,
+    backgroundColor: TEXT_BLUEGREY
+  },
+  accessoryImageCloseIconContainer: {
+    width: 14,
+    height: 14,
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  accessoryImageCloseIcon: {
+    fontSize: 10,
+    color: '#fff',
+    textAlign: 'center'
+  },
+  inputContainer: {
+    backgroundColor: '#fff',
+    paddingVertical: 8,
+    paddingHorizontal: 8,
+    paddingBottom: 8 + getBottomSpace(),
+    flexGrow: 1
+  },
+  inputText: {
+    color: TEXT_DARKEST,
+    fontSize: 14,
+    fontFamily: 'sf-medium'
+  },
+  input: {
+    fontSize: 14,
+    color: TEXT_DARKEST,
+    fontFamily: 'sf-medium',
+    margin: 0,
+    backgroundColor: BG_GREY,
+    borderRadius: 5,
+    padding: 8,
+    maxHeight: SCREEN_HEIGHT / 3
+  },
+  sendContainer: {
+    position: 'absolute',
+    top: 8,
+    right: 8,
+    height: 30,
+    width: 30,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: '#fff'
+  },
+  send: {
+    color: TEXT_BLUEGREY,
+    fontSize: 24,
+    textAlign: 'center'
+  }
+};
+
+const mapStateToProps = state => {
+  const {
+    user
+  } = state;
+  return {
+    user
+  };
+};
+
+const commentReply = connect(mapStateToProps, {}, null, {
+  forwardRef: true
+})(CommentReply);
+export { commentReply as CommentReply };
+//# sourceMappingURL=CommentReply.js.map