@plusscommunities/pluss-core-app 8.0.29 → 8.0.31

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","PureComponent","View","TouchableOpacity","connect","stylez","FontAwesome","getMainBrandingColourFromState","BackButton","render","size","props","diameter","radius","noClick","createElement","style","backButton","backgroundColor","colourBrandingMain","height","width","borderRadius","color","name","flipped","backButtonIcon","iconStyle","onPress","mapStateToProps","state"],"sources":["BackButton.js"],"sourcesContent":["import React, { PureComponent } from \"react\";\nimport { View, TouchableOpacity } from \"react-native\";\nimport { connect } from \"react-redux\";\nimport stylez from \"../styles\";\nimport { FontAwesome } from \"./Icon\";\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\trender() {\n\t\tconst size = this.props.diameter || 32;\n\t\tconst radius = size / 2;\n\t\tif (this.props.noClick) {\n\t\t\treturn (\n\t\t\t\t<View\n\t\t\t\t\tstyle={[\n\t\t\t\t\t\tstylez.backButton,\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tbackgroundColor: this.props.colourBrandingMain,\n\t\t\t\t\t\t\theight: size,\n\t\t\t\t\t\t\twidth: size,\n\t\t\t\t\t\t\tborderRadius: radius,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tthis.props.color && { backgroundColor: this.props.color },\n\t\t\t\t\t\tthis.props.style,\n\t\t\t\t\t]}\n\t\t\t\t>\n\t\t\t\t\t<FontAwesome\n\t\t\t\t\t\tname={this.props.flipped ? \"chevron-right\" : \"chevron-left\"}\n\t\t\t\t\t\tstyle={[stylez.backButtonIcon, this.props.iconStyle]}\n\t\t\t\t\t/>\n\t\t\t\t</View>\n\t\t\t);\n\t\t}\n\t\treturn (\n\t\t\t<TouchableOpacity\n\t\t\t\tstyle={[\n\t\t\t\t\tstylez.backButton,\n\t\t\t\t\t{\n\t\t\t\t\t\tbackgroundColor: this.props.colourBrandingMain,\n\t\t\t\t\t\theight: size,\n\t\t\t\t\t\twidth: size,\n\t\t\t\t\t\tborderRadius: radius,\n\t\t\t\t\t},\n\t\t\t\t\tthis.props.color && { backgroundColor: this.props.color },\n\t\t\t\t\tthis.props.style,\n\t\t\t\t]}\n\t\t\t\tonPress={this.props.onPress}\n\t\t\t>\n\t\t\t\t<FontAwesome\n\t\t\t\t\tname={this.props.flipped ? \"chevron-right\" : \"chevron-left\"}\n\t\t\t\t\tstyle={[stylez.backButtonIcon, this.props.iconStyle]}\n\t\t\t\t/>\n\t\t\t</TouchableOpacity>\n\t\t);\n\t}\n}\n\nconst mapStateToProps = (state) => {\n\treturn {\n\t\tcolourBrandingMain: getMainBrandingColourFromState(state),\n\t};\n};\n\nconst backButton = connect(mapStateToProps, {})(BackButton);\nexport { backButton as BackButton };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,aAAa,QAAQ,OAAO;AAC5C,SAASC,IAAI,EAAEC,gBAAgB,QAAQ,cAAc;AACrD,SAASC,OAAO,QAAQ,aAAa;AACrC,OAAOC,MAAM,MAAM,WAAW;AAC9B,SAASC,WAAW,QAAQ,QAAQ;AACpC,SAASC,8BAA8B,QAAQ,YAAY;;AAE3D;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,MAAMC,UAAU,SAASP,aAAa,CAAC;EACtCQ,MAAMA,CAAA,EAAG;IACR,MAAMC,IAAI,GAAG,IAAI,CAACC,KAAK,CAACC,QAAQ,IAAI,EAAE;IACtC,MAAMC,MAAM,GAAGH,IAAI,GAAG,CAAC;IACvB,IAAI,IAAI,CAACC,KAAK,CAACG,OAAO,EAAE;MACvB,oBACCd,KAAA,CAAAe,aAAA,CAACb,IAAI;QACJc,KAAK,EAAE,CACNX,MAAM,CAACY,UAAU,EACjB;UACCC,eAAe,EAAE,IAAI,CAACP,KAAK,CAACQ,kBAAkB;UAC9CC,MAAM,EAAEV,IAAI;UACZW,KAAK,EAAEX,IAAI;UACXY,YAAY,EAAET;QACf,CAAC,EACD,IAAI,CAACF,KAAK,CAACY,KAAK,IAAI;UAAEL,eAAe,EAAE,IAAI,CAACP,KAAK,CAACY;QAAM,CAAC,EACzD,IAAI,CAACZ,KAAK,CAACK,KAAK;MACf,gBAEFhB,KAAA,CAAAe,aAAA,CAACT,WAAW;QACXkB,IAAI,EAAE,IAAI,CAACb,KAAK,CAACc,OAAO,GAAG,eAAe,GAAG,cAAe;QAC5DT,KAAK,EAAE,CAACX,MAAM,CAACqB,cAAc,EAAE,IAAI,CAACf,KAAK,CAACgB,SAAS;MAAE,CACrD,CACI,CAAC;IAET;IACA,oBACC3B,KAAA,CAAAe,aAAA,CAACZ,gBAAgB;MAChBa,KAAK,EAAE,CACNX,MAAM,CAACY,UAAU,EACjB;QACCC,eAAe,EAAE,IAAI,CAACP,KAAK,CAACQ,kBAAkB;QAC9CC,MAAM,EAAEV,IAAI;QACZW,KAAK,EAAEX,IAAI;QACXY,YAAY,EAAET;MACf,CAAC,EACD,IAAI,CAACF,KAAK,CAACY,KAAK,IAAI;QAAEL,eAAe,EAAE,IAAI,CAACP,KAAK,CAACY;MAAM,CAAC,EACzD,IAAI,CAACZ,KAAK,CAACK,KAAK,CACf;MACFY,OAAO,EAAE,IAAI,CAACjB,KAAK,CAACiB;IAAQ,gBAE5B5B,KAAA,CAAAe,aAAA,CAACT,WAAW;MACXkB,IAAI,EAAE,IAAI,CAACb,KAAK,CAACc,OAAO,GAAG,eAAe,GAAG,cAAe;MAC5DT,KAAK,EAAE,CAACX,MAAM,CAACqB,cAAc,EAAE,IAAI,CAACf,KAAK,CAACgB,SAAS;IAAE,CACrD,CACgB,CAAC;EAErB;AACD;AAEA,MAAME,eAAe,GAAIC,KAAK,IAAK;EAClC,OAAO;IACNX,kBAAkB,EAAEZ,8BAA8B,CAACuB,KAAK;EACzD,CAAC;AACF,CAAC;AAED,MAAMb,UAAU,GAAGb,OAAO,CAACyB,eAAe,EAAE,CAAC,CAAC,CAAC,CAACrB,UAAU,CAAC;AAC3D,SAASS,UAAU,IAAIT,UAAU","ignoreList":[]}

package/dist/module/components/CalendarPopup.js

@@ -0,0 +1,126 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import moment from "moment";
+import React, { Component } from "react";
+import { Modal, View, TouchableOpacity, StyleSheet } from "react-native";
+import { Calendar } from "react-native-calendars";
+import { StatusBarHeight } from "../helper";
+import { FontAwesome } from "./Icon";
+import { hexToRGBAstring, COLOUR_RED, TEXT_DARK, COLOUR_GRAPEFRUIT } from "../colours";
+class CalendarPopup extends Component {
+  constructor(props) {
+    super(props);
+    _defineProperty(this, "onDayPress", date => {
+      const {
+        onSelect
+      } = this.props;
+      if (!onSelect) return;
+
+      // console.log('onDayPress', date);
+      onSelect(date.timestamp);
+    });
+    this.state = {};
+  }
+  renderClose() {
+    const {
+      onClose
+    } = this.props;
+    return /*#__PURE__*/React.createElement(TouchableOpacity, {
+      style: styles.menuIconContainer,
+      onPress: onClose,
+      activeOpacity: 0.6
+    }, /*#__PURE__*/React.createElement(FontAwesome, {
+      name: "x",
+      style: styles.menuIcon
+    }));
+  }
+  render() {
+    const {
+      visible,
+      animationType,
+      onClose,
+      backgroundStyle,
+      selectedDate,
+      minDate,
+      maxDate,
+      enabledDates,
+      selectedColor,
+      enabledColor,
+      disabledColor,
+      theme
+    } = this.props;
+    const initialDate = (selectedDate ? moment(selectedDate) : moment()).format("YYYY-MM-DD");
+    const min = minDate ? moment(minDate).format("YYYY-MM-DD") : undefined;
+    const max = maxDate ? moment(maxDate).format("YYYY-MM-DD") : undefined;
+    const dateMarkings = {};
+    (enabledDates || []).forEach(date => {
+      const {
+        day,
+        enabled
+      } = date;
+      const key = moment(day).format("YYYY-MM-DD");
+      dateMarkings[key] = {
+        enabled,
+        disableTouchEvent: !enabled,
+        customStyles: {
+          text: {
+            color: enabled ? enabledColor || TEXT_DARK : disabledColor || COLOUR_RED
+          }
+        }
+      };
+    });
+    // console.log('CalendarPopup - enabled', JSON.stringify(dateMarkings, null, 2));
+    return /*#__PURE__*/React.createElement(Modal, {
+      transparent: true,
+      visible: visible || false,
+      animationType: animationType || "fade",
+      onRequestClose: onClose
+    }, /*#__PURE__*/React.createElement(View, {
+      style: [styles.popup, backgroundStyle || {
+        backgroundColor: hexToRGBAstring("#fff", 1)
+      }]
+    }, /*#__PURE__*/React.createElement(Calendar, {
+      initialDate: initialDate,
+      minDate: min,
+      maxDate: max,
+      markingType: "custom",
+      markedDates: {
+        ...dateMarkings,
+        [initialDate]: {
+          selected: true,
+          selectedColor: selectedColor || COLOUR_GRAPEFRUIT
+        }
+      },
+      onDayPress: this.onDayPress,
+      theme: theme
+    })), this.renderClose());
+  }
+}
+const styles = StyleSheet.create({
+  container: {
+    backgroundColor: "#000"
+  },
+  popup: {
+    flex: 1,
+    justifyContent: "center"
+  },
+  menuIconContainer: {
+    position: "absolute",
+    top: StatusBarHeight(0),
+    right: 0,
+    width: 55,
+    height: 55,
+    zIndex: 3
+  },
+  menuIcon: {
+    fontSize: 30,
+    padding: 15,
+    width: 65,
+    textAlign: "center",
+    color: "#000",
+    zIndex: 3
+  }
+});
+export { CalendarPopup };
+//# sourceMappingURL=CalendarPopup.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["moment","React","Component","Modal","View","TouchableOpacity","StyleSheet","Calendar","StatusBarHeight","FontAwesome","hexToRGBAstring","COLOUR_RED","TEXT_DARK","COLOUR_GRAPEFRUIT","CalendarPopup","constructor","props","_defineProperty","date","onSelect","timestamp","state","renderClose","onClose","createElement","style","styles","menuIconContainer","onPress","activeOpacity","name","menuIcon","render","visible","animationType","backgroundStyle","selectedDate","minDate","maxDate","enabledDates","selectedColor","enabledColor","disabledColor","theme","initialDate","format","min","undefined","max","dateMarkings","forEach","day","enabled","key","disableTouchEvent","customStyles","text","color","transparent","onRequestClose","popup","backgroundColor","markingType","markedDates","selected","onDayPress","create","container","flex","justifyContent","position","top","right","width","height","zIndex","fontSize","padding","textAlign"],"sources":["CalendarPopup.js"],"sourcesContent":["import moment from \"moment\";\nimport React, { Component } from \"react\";\nimport { Modal, View, TouchableOpacity, StyleSheet } from \"react-native\";\nimport { Calendar } from \"react-native-calendars\";\nimport { StatusBarHeight } from \"../helper\";\nimport { FontAwesome } from \"./Icon\";\nimport {\n\thexToRGBAstring,\n\tCOLOUR_RED,\n\tTEXT_DARK,\n\tCOLOUR_GRAPEFRUIT,\n} from \"../colours\";\n\nclass CalendarPopup extends Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\n\t\tthis.state = {};\n\t}\n\n\tonDayPress = (date) => {\n\t\tconst { onSelect } = this.props;\n\t\tif (!onSelect) return;\n\n\t\t// console.log('onDayPress', date);\n\t\tonSelect(date.timestamp);\n\t};\n\n\trenderClose() {\n\t\tconst { onClose } = this.props;\n\t\treturn (\n\t\t\t<TouchableOpacity\n\t\t\t\tstyle={styles.menuIconContainer}\n\t\t\t\tonPress={onClose}\n\t\t\t\tactiveOpacity={0.6}\n\t\t\t>\n\t\t\t\t<FontAwesome name=\"x\" style={styles.menuIcon} />\n\t\t\t</TouchableOpacity>\n\t\t);\n\t}\n\n\trender() {\n\t\tconst {\n\t\t\tvisible,\n\t\t\tanimationType,\n\t\t\tonClose,\n\t\t\tbackgroundStyle,\n\t\t\tselectedDate,\n\t\t\tminDate,\n\t\t\tmaxDate,\n\t\t\tenabledDates,\n\t\t\tselectedColor,\n\t\t\tenabledColor,\n\t\t\tdisabledColor,\n\t\t\ttheme,\n\t\t} = this.props;\n\n\t\tconst initialDate = (selectedDate ? moment(selectedDate) : moment()).format(\n\t\t\t\"YYYY-MM-DD\",\n\t\t);\n\t\tconst min = minDate ? moment(minDate).format(\"YYYY-MM-DD\") : undefined;\n\t\tconst max = maxDate ? moment(maxDate).format(\"YYYY-MM-DD\") : undefined;\n\t\tconst dateMarkings = {};\n\t\t(enabledDates || []).forEach((date) => {\n\t\t\tconst { day, enabled } = date;\n\t\t\tconst key = moment(day).format(\"YYYY-MM-DD\");\n\t\t\tdateMarkings[key] = {\n\t\t\t\tenabled,\n\t\t\t\tdisableTouchEvent: !enabled,\n\t\t\t\tcustomStyles: {\n\t\t\t\t\ttext: {\n\t\t\t\t\t\tcolor: enabled\n\t\t\t\t\t\t\t? enabledColor || TEXT_DARK\n\t\t\t\t\t\t\t: disabledColor || COLOUR_RED,\n\t\t\t\t\t},\n\t\t\t\t},\n\t\t\t};\n\t\t});\n\t\t// console.log('CalendarPopup - enabled', JSON.stringify(dateMarkings, null, 2));\n\t\treturn (\n\t\t\t<Modal\n\t\t\t\ttransparent\n\t\t\t\tvisible={visible || false}\n\t\t\t\tanimationType={animationType || \"fade\"}\n\t\t\t\tonRequestClose={onClose}\n\t\t\t>\n\t\t\t\t<View\n\t\t\t\t\tstyle={[\n\t\t\t\t\t\tstyles.popup,\n\t\t\t\t\t\tbackgroundStyle || { backgroundColor: hexToRGBAstring(\"#fff\", 1) },\n\t\t\t\t\t]}\n\t\t\t\t>\n\t\t\t\t\t<Calendar\n\t\t\t\t\t\tinitialDate={initialDate}\n\t\t\t\t\t\tminDate={min}\n\t\t\t\t\t\tmaxDate={max}\n\t\t\t\t\t\tmarkingType={\"custom\"}\n\t\t\t\t\t\tmarkedDates={{\n\t\t\t\t\t\t\t...dateMarkings,\n\t\t\t\t\t\t\t[initialDate]: {\n\t\t\t\t\t\t\t\tselected: true,\n\t\t\t\t\t\t\t\tselectedColor: selectedColor || COLOUR_GRAPEFRUIT,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t}}\n\t\t\t\t\t\tonDayPress={this.onDayPress}\n\t\t\t\t\t\ttheme={theme}\n\t\t\t\t\t/>\n\t\t\t\t</View>\n\t\t\t\t{this.renderClose()}\n\t\t\t</Modal>\n\t\t);\n\t}\n}\n\nconst styles = StyleSheet.create({\n\tcontainer: {\n\t\tbackgroundColor: \"#000\",\n\t},\n\tpopup: {\n\t\tflex: 1,\n\t\tjustifyContent: \"center\",\n\t},\n\tmenuIconContainer: {\n\t\tposition: \"absolute\",\n\t\ttop: StatusBarHeight(0),\n\t\tright: 0,\n\t\twidth: 55,\n\t\theight: 55,\n\t\tzIndex: 3,\n\t},\n\tmenuIcon: {\n\t\tfontSize: 30,\n\t\tpadding: 15,\n\t\twidth: 65,\n\t\ttextAlign: \"center\",\n\t\tcolor: \"#000\",\n\t\tzIndex: 3,\n\t},\n});\n\nexport { CalendarPopup };\n"],"mappings":"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","ignoreList":[]}

package/dist/module/components/CategoryTabs.js

@@ -0,0 +1,155 @@
+import React, { Component } from "react";
+import _ from "lodash";
+import { TouchableOpacity, View, ScrollView } from "react-native";
+import { Text } from "./Text";
+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,"names":["React","Component","_","TouchableOpacity","View","ScrollView","Text","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","createElement","style","styles","counter","counterText","renderCategories","noScrollStyle","getTextColour","headerType","colourBrandingMain","getBottomBorderColour","map","index","flex","minHeight","height","justifyContent","catWrapperStyle","onPress","bind","borderBottomColor","borderBottomWidth","marginRight","marginLeft","alignContent","flexDirection","backgroundColor","undefined","innerContainer","borderColor","catStyle","fontFamily","fontSize","color","textAlign","paddingVertical","width","textStyle","colourBrandingHeader","opacity","render","noScroll","horizontal","minWidth","borderRadius","marginTop","paddingHorizontal","mapStateToProps","env","hasGradientHeader","categoryTabs"],"sources":["CategoryTabs.js"],"sourcesContent":["import React, { Component } from \"react\";\nimport _ from \"lodash\";\nimport { TouchableOpacity, View, ScrollView } from \"react-native\";\nimport { Text } from \"./Text\";\nimport { connect } from \"react-redux\";\nimport {\n\tTEXT_LIGHT,\n\tCOLOUR_GREEN,\n\tgetMainBrandingColourFromState,\n} from \"../colours\";\nimport { getSiteSettingFromState } from \"../helper\";\n// import { HAS_GRADIENT_HEADER } from '../../config';\nimport Config from \"../config\";\n\nclass CategoryTabs extends Component {\n\tconstructor(props) {\n\t\tsuper(props);\n\t\tthis.state = {\n\t\t\tcategoryKeys: [],\n\t\t\tselectedCategory: this.props.initialCategory,\n\t\t};\n\t}\n\n\tUNSAFE_componentWillMount() {\n\t\tthis.setState({\n\t\t\tselectedCategory:\n\t\t\t\t!_.isUndefined(this.props.currentTab) &&\n\t\t\t\t!_.isEmpty(this.props.currentTab)\n\t\t\t\t\t? this.props.currentTab\n\t\t\t\t\t: this.props.initialCategory,\n\t\t\tcategoryKeys: this.props.categoryKeys,\n\t\t});\n\t}\n\n\tcomponentDidMount() {\n\t\tthis.setState({\n\t\t\tselectedCategory:\n\t\t\t\t!_.isUndefined(this.props.currentTab) &&\n\t\t\t\t!_.isEmpty(this.props.currentTab)\n\t\t\t\t\t? this.props.currentTab\n\t\t\t\t\t: this.props.initialCategory,\n\t\t});\n\t}\n\n\tUNSAFE_componentWillReceiveProps(nextProps) {\n\t\tif (\n\t\t\t!_.isUndefined(nextProps.currentTab) &&\n\t\t\t!_.isEmpty(nextProps.currentTab)\n\t\t) {\n\t\t\tthis.setState({ selectedCategory: nextProps.currentTab });\n\t\t}\n\t}\n\n\tselectCategory(key) {\n\t\tthis.setState({\n\t\t\tselectedCategory: key,\n\t\t});\n\t\tthis.props.onSelect(key);\n\t}\n\n\trenderCounter(key) {\n\t\tif (\n\t\t\tthis.props.categoryCounter &&\n\t\t\tthis.props.categoryCounter[key] &&\n\t\t\tthis.props.categoryCounter[key] === true &&\n\t\t\tthis.props.counterValues &&\n\t\t\tthis.props.counterValues[key] > 0\n\t\t) {\n\t\t\treturn (\n\t\t\t\t<View style={styles.counter}>\n\t\t\t\t\t<Text style={styles.counterText}>\n\t\t\t\t\t\t{this.props.counterValues[key]}\n\t\t\t\t\t</Text>\n\t\t\t\t</View>\n\t\t\t);\n\t\t}\n\t\treturn null;\n\t}\n\n\trenderCategories(noScrollStyle) {\n\t\tconst getTextColour = (key) => {\n\t\t\tif (this.state.selectedCategory === key) {\n\t\t\t\treturn this.props.headerType !== \"white\"\n\t\t\t\t\t? \"#fff\"\n\t\t\t\t\t: this.props.colourBrandingMain;\n\t\t\t}\n\t\t\treturn this.props.headerType !== \"white\" ? \"#fff\" : TEXT_LIGHT;\n\t\t};\n\t\tconst getBottomBorderColour = (key) => {\n\t\t\tif (this.state.selectedCategory === key) {\n\t\t\t\treturn this.props.headerType !== \"white\"\n\t\t\t\t\t? \"#fff\"\n\t\t\t\t\t: this.props.colourBrandingMain;\n\t\t\t}\n\t\t\treturn this.props.headerType !== \"white\"\n\t\t\t\t? this.props.colourBrandingMain\n\t\t\t\t: \"#fff\";\n\t\t};\n\t\treturn this.state.categoryKeys.map((key, index) => {\n\t\t\treturn (\n\t\t\t\t<TouchableOpacity\n\t\t\t\t\tkey={index}\n\t\t\t\t\t// style={[{ minHeight: this.props.height || 30, justifyContent: 'center' }, noScrollStyle && { flex: 1 }]}\n\t\t\t\t\tstyle={[\n\t\t\t\t\t\t{\n\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\tminHeight: this.props.height || 30,\n\t\t\t\t\t\t\tjustifyContent: \"center\",\n\t\t\t\t\t\t},\n\t\t\t\t\t\tthis.props.catWrapperStyle,\n\t\t\t\t\t]}\n\t\t\t\t\tonPress={this.selectCategory.bind(this, key)}\n\t\t\t\t>\n\t\t\t\t\t<View\n\t\t\t\t\t\tstyle={[\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\tborderBottomColor: getBottomBorderColour(key),\n\t\t\t\t\t\t\t\tborderBottomWidth: noScrollStyle ? 0 : 2,\n\t\t\t\t\t\t\t\tmarginRight: noScrollStyle ? 0 : 16,\n\t\t\t\t\t\t\t\tmarginLeft: index === 0 && !noScrollStyle ? 16 : 0,\n\t\t\t\t\t\t\t\tjustifyContent: \"center\",\n\t\t\t\t\t\t\t\talignContent: \"center\",\n\t\t\t\t\t\t\t\tminHeight: 30,\n\t\t\t\t\t\t\t\tflexDirection: \"row\",\n\t\t\t\t\t\t\t\tbackgroundColor:\n\t\t\t\t\t\t\t\t\tthis.props.headerType !== \"white\"\n\t\t\t\t\t\t\t\t\t\t? this.props.colourBrandingMain\n\t\t\t\t\t\t\t\t\t\t: undefined,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\tthis.props.style,\n\t\t\t\t\t\t]}\n\t\t\t\t\t>\n\t\t\t\t\t\t<View\n\t\t\t\t\t\t\tstyle={[\n\t\t\t\t\t\t\t\tnoScrollStyle && styles.innerContainer,\n\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\tflex: 1,\n\t\t\t\t\t\t\t\t\tborderColor: getBottomBorderColour(key),\n\t\t\t\t\t\t\t\t\tjustifyContent: \"center\",\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\tthis.props.catStyle,\n\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Text\n\t\t\t\t\t\t\t\tstyle={[\n\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\tfontFamily: \"sf-semibold\",\n\t\t\t\t\t\t\t\t\t\tfontSize: 15,\n\t\t\t\t\t\t\t\t\t\tcolor: getTextColour(key),\n\t\t\t\t\t\t\t\t\t\ttextAlign: \"center\",\n\t\t\t\t\t\t\t\t\t\tpaddingVertical: 8,\n\t\t\t\t\t\t\t\t\t\twidth: \"auto\",\n\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t\tthis.props.textStyle,\n\t\t\t\t\t\t\t\t\tthis.props.colourBrandingHeader &&\n\t\t\t\t\t\t\t\t\t\tthis.state.selectedCategory !== key && {\n\t\t\t\t\t\t\t\t\t\t\tcolor: this.props.colourBrandingMain,\n\t\t\t\t\t\t\t\t\t\t\topacity: 0.5,\n\t\t\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t\t]}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{key}\n\t\t\t\t\t\t\t</Text>\n\t\t\t\t\t\t\t{this.renderCounter(key)}\n\t\t\t\t\t\t</View>\n\t\t\t\t\t</View>\n\t\t\t\t</TouchableOpacity>\n\t\t\t);\n\t\t});\n\t}\n\n\trender() {\n\t\tif (this.props.noScroll) {\n\t\t\t// return (<View style={{ flexDirection: 'row', paddingLeft: 16, paddingRight: 16 }}>\n\t\t\treturn (\n\t\t\t\t<View style={{ flexDirection: \"row\", justifyContent: \"space-evenly\" }}>\n\t\t\t\t\t{this.renderCategories(true)}\n\t\t\t\t</View>\n\t\t\t);\n\t\t}\n\t\treturn <ScrollView horizontal>{this.renderCategories(false)}</ScrollView>;\n\t}\n}\n\nconst styles = {\n\tcounter: {\n\t\tbackgroundColor: COLOUR_GREEN,\n\t\theight: 16,\n\t\tminWidth: 16,\n\t\tborderRadius: 8,\n\t\tmarginLeft: 4,\n\t\tmarginTop: 4,\n\t\tjustifyContent: \"center\",\n\t\talignContent: \"center\",\n\t},\n\tcounterText: {\n\t\tcolor: \"#fff\",\n\t\ttextAlign: \"center\",\n\t\tfontSize: 12,\n\t\tfontFamily: \"sf-semibold\",\n\t},\n\tinnerContainer: {\n\t\tborderBottomWidth: 2,\n\t\tflexDirection: \"row\",\n\t\tpaddingHorizontal: 8,\n\t},\n};\n\nconst mapStateToProps = (state) => {\n\treturn {\n\t\tcolourBrandingMain: getMainBrandingColourFromState(state),\n\t\theaderType: getSiteSettingFromState(\n\t\t\tstate,\n\t\t\t\"HeaderType\",\n\t\t\tgetSiteSettingFromState(\n\t\t\t\tstate,\n\t\t\t\t\"UseGradientHeader\",\n\t\t\t\tConfig.env.hasGradientHeader,\n\t\t\t)\n\t\t\t\t? \"gradient\"\n\t\t\t\t: \"white\",\n\t\t),\n\t};\n};\n\nconst categoryTabs = connect(mapStateToProps, {})(CategoryTabs);\nexport { categoryTabs as CategoryTabs };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,QAAQ,OAAO;AACxC,OAAOC,CAAC,MAAM,QAAQ;AACtB,SAASC,gBAAgB,EAAEC,IAAI,EAAEC,UAAU,QAAQ,cAAc;AACjE,SAASC,IAAI,QAAQ,QAAQ;AAC7B,SAASC,OAAO,QAAQ,aAAa;AACrC,SACCC,UAAU,EACVC,YAAY,EACZC,8BAA8B,QACxB,YAAY;AACnB,SAASC,uBAAuB,QAAQ,WAAW;AACnD;AACA,OAAOC,MAAM,MAAM,WAAW;AAE9B,MAAMC,YAAY,SAASZ,SAAS,CAAC;EACpCa,WAAWA,CAACC,KAAK,EAAE;IAClB,KAAK,CAACA,KAAK,CAAC;IACZ,IAAI,CAACC,KAAK,GAAG;MACZC,YAAY,EAAE,EAAE;MAChBC,gBAAgB,EAAE,IAAI,CAACH,KAAK,CAACI;IAC9B,CAAC;EACF;EAEAC,yBAAyBA,CAAA,EAAG;IAC3B,IAAI,CAACC,QAAQ,CAAC;MACbH,gBAAgB,EACf,CAAChB,CAAC,CAACoB,WAAW,CAAC,IAAI,CAACP,KAAK,CAACQ,UAAU,CAAC,IACrC,CAACrB,CAAC,CAACsB,OAAO,CAAC,IAAI,CAACT,KAAK,CAACQ,UAAU,CAAC,GAC9B,IAAI,CAACR,KAAK,CAACQ,UAAU,GACrB,IAAI,CAACR,KAAK,CAACI,eAAe;MAC9BF,YAAY,EAAE,IAAI,CAACF,KAAK,CAACE;IAC1B,CAAC,CAAC;EACH;EAEAQ,iBAAiBA,CAAA,EAAG;IACnB,IAAI,CAACJ,QAAQ,CAAC;MACbH,gBAAgB,EACf,CAAChB,CAAC,CAACoB,WAAW,CAAC,IAAI,CAACP,KAAK,CAACQ,UAAU,CAAC,IACrC,CAACrB,CAAC,CAACsB,OAAO,CAAC,IAAI,CAACT,KAAK,CAACQ,UAAU,CAAC,GAC9B,IAAI,CAACR,KAAK,CAACQ,UAAU,GACrB,IAAI,CAACR,KAAK,CAACI;IAChB,CAAC,CAAC;EACH;EAEAO,gCAAgCA,CAACC,SAAS,EAAE;IAC3C,IACC,CAACzB,CAAC,CAACoB,WAAW,CAACK,SAAS,CAACJ,UAAU,CAAC,IACpC,CAACrB,CAAC,CAACsB,OAAO,CAACG,SAAS,CAACJ,UAAU,CAAC,EAC/B;MACD,IAAI,CAACF,QAAQ,CAAC;QAAEH,gBAAgB,EAAES,SAAS,CAACJ;MAAW,CAAC,CAAC;IAC1D;EACD;EAEAK,cAAcA,CAACC,GAAG,EAAE;IACnB,IAAI,CAACR,QAAQ,CAAC;MACbH,gBAAgB,EAAEW;IACnB,CAAC,CAAC;IACF,IAAI,CAACd,KAAK,CAACe,QAAQ,CAACD,GAAG,CAAC;EACzB;EAEAE,aAAaA,CAACF,GAAG,EAAE;IAClB,IACC,IAAI,CAACd,KAAK,CAACiB,eAAe,IAC1B,IAAI,CAACjB,KAAK,CAACiB,eAAe,CAACH,GAAG,CAAC,IAC/B,IAAI,CAACd,KAAK,CAACiB,eAAe,CAACH,GAAG,CAAC,KAAK,IAAI,IACxC,IAAI,CAACd,KAAK,CAACkB,aAAa,IACxB,IAAI,CAAClB,KAAK,CAACkB,aAAa,CAACJ,GAAG,CAAC,GAAG,CAAC,EAChC;MACD,oBACC7B,KAAA,CAAAkC,aAAA,CAAC9B,IAAI;QAAC+B,KAAK,EAAEC,MAAM,CAACC;MAAQ,gBAC3BrC,KAAA,CAAAkC,aAAA,CAAC5B,IAAI;QAAC6B,KAAK,EAAEC,MAAM,CAACE;MAAY,GAC9B,IAAI,CAACvB,KAAK,CAACkB,aAAa,CAACJ,GAAG,CACxB,CACD,CAAC;IAET;IACA,OAAO,IAAI;EACZ;EAEAU,gBAAgBA,CAACC,aAAa,EAAE;IAC/B,MAAMC,aAAa,GAAIZ,GAAG,IAAK;MAC9B,IAAI,IAAI,CAACb,KAAK,CAACE,gBAAgB,KAAKW,GAAG,EAAE;QACxC,OAAO,IAAI,CAACd,KAAK,CAAC2B,UAAU,KAAK,OAAO,GACrC,MAAM,GACN,IAAI,CAAC3B,KAAK,CAAC4B,kBAAkB;MACjC;MACA,OAAO,IAAI,CAAC5B,KAAK,CAAC2B,UAAU,KAAK,OAAO,GAAG,MAAM,GAAGlC,UAAU;IAC/D,CAAC;IACD,MAAMoC,qBAAqB,GAAIf,GAAG,IAAK;MACtC,IAAI,IAAI,CAACb,KAAK,CAACE,gBAAgB,KAAKW,GAAG,EAAE;QACxC,OAAO,IAAI,CAACd,KAAK,CAAC2B,UAAU,KAAK,OAAO,GACrC,MAAM,GACN,IAAI,CAAC3B,KAAK,CAAC4B,kBAAkB;MACjC;MACA,OAAO,IAAI,CAAC5B,KAAK,CAAC2B,UAAU,KAAK,OAAO,GACrC,IAAI,CAAC3B,KAAK,CAAC4B,kBAAkB,GAC7B,MAAM;IACV,CAAC;IACD,OAAO,IAAI,CAAC3B,KAAK,CAACC,YAAY,CAAC4B,GAAG,CAAC,CAAChB,GAAG,EAAEiB,KAAK,KAAK;MAClD,oBACC9C,KAAA,CAAAkC,aAAA,CAAC/B,gBAAgB;QAChB0B,GAAG,EAAEiB;QACL;QAAA;QACAX,KAAK,EAAE,CACN;UACCY,IAAI,EAAE,CAAC;UACPC,SAAS,EAAE,IAAI,CAACjC,KAAK,CAACkC,MAAM,IAAI,EAAE;UAClCC,cAAc,EAAE;QACjB,CAAC,EACD,IAAI,CAACnC,KAAK,CAACoC,eAAe,CACzB;QACFC,OAAO,EAAE,IAAI,CAACxB,cAAc,CAACyB,IAAI,CAAC,IAAI,EAAExB,GAAG;MAAE,gBAE7C7B,KAAA,CAAAkC,aAAA,CAAC9B,IAAI;QACJ+B,KAAK,EAAE,CACN;UACCmB,iBAAiB,EAAEV,qBAAqB,CAACf,GAAG,CAAC;UAC7C0B,iBAAiB,EAAEf,aAAa,GAAG,CAAC,GAAG,CAAC;UACxCgB,WAAW,EAAEhB,aAAa,GAAG,CAAC,GAAG,EAAE;UACnCiB,UAAU,EAAEX,KAAK,KAAK,CAAC,IAAI,CAACN,aAAa,GAAG,EAAE,GAAG,CAAC;UAClDU,cAAc,EAAE,QAAQ;UACxBQ,YAAY,EAAE,QAAQ;UACtBV,SAAS,EAAE,EAAE;UACbW,aAAa,EAAE,KAAK;UACpBC,eAAe,EACd,IAAI,CAAC7C,KAAK,CAAC2B,UAAU,KAAK,OAAO,GAC9B,IAAI,CAAC3B,KAAK,CAAC4B,kBAAkB,GAC7BkB;QACL,CAAC,EACD,IAAI,CAAC9C,KAAK,CAACoB,KAAK;MACf,gBAEFnC,KAAA,CAAAkC,aAAA,CAAC9B,IAAI;QACJ+B,KAAK,EAAE,CACNK,aAAa,IAAIJ,MAAM,CAAC0B,cAAc,EACtC;UACCf,IAAI,EAAE,CAAC;UACPgB,WAAW,EAAEnB,qBAAqB,CAACf,GAAG,CAAC;UACvCqB,cAAc,EAAE;QACjB,CAAC,EACD,IAAI,CAACnC,KAAK,CAACiD,QAAQ;MAClB,gBAEFhE,KAAA,CAAAkC,aAAA,CAAC5B,IAAI;QACJ6B,KAAK,EAAE,CACN;UACC8B,UAAU,EAAE,aAAa;UACzBC,QAAQ,EAAE,EAAE;UACZC,KAAK,EAAE1B,aAAa,CAACZ,GAAG,CAAC;UACzBuC,SAAS,EAAE,QAAQ;UACnBC,eAAe,EAAE,CAAC;UAClBC,KAAK,EAAE;QACR,CAAC,EACD,IAAI,CAACvD,KAAK,CAACwD,SAAS,EACpB,IAAI,CAACxD,KAAK,CAACyD,oBAAoB,IAC9B,IAAI,CAACxD,KAAK,CAACE,gBAAgB,KAAKW,GAAG,IAAI;UACtCsC,KAAK,EAAE,IAAI,CAACpD,KAAK,CAAC4B,kBAAkB;UACpC8B,OAAO,EAAE;QACV,CAAC;MACD,GAED5C,GACI,CAAC,EACN,IAAI,CAACE,aAAa,CAACF,GAAG,CAClB,CACD,CACW,CAAC;IAErB,CAAC,CAAC;EACH;EAEA6C,MAAMA,CAAA,EAAG;IACR,IAAI,IAAI,CAAC3D,KAAK,CAAC4D,QAAQ,EAAE;MACxB;MACA,oBACC3E,KAAA,CAAAkC,aAAA,CAAC9B,IAAI;QAAC+B,KAAK,EAAE;UAAEwB,aAAa,EAAE,KAAK;UAAET,cAAc,EAAE;QAAe;MAAE,GACpE,IAAI,CAACX,gBAAgB,CAAC,IAAI,CACtB,CAAC;IAET;IACA,oBAAOvC,KAAA,CAAAkC,aAAA,CAAC7B,UAAU;MAACuE,UAAU;IAAA,GAAE,IAAI,CAACrC,gBAAgB,CAAC,KAAK,CAAc,CAAC;EAC1E;AACD;AAEA,MAAMH,MAAM,GAAG;EACdC,OAAO,EAAE;IACRuB,eAAe,EAAEnD,YAAY;IAC7BwC,MAAM,EAAE,EAAE;IACV4B,QAAQ,EAAE,EAAE;IACZC,YAAY,EAAE,CAAC;IACfrB,UAAU,EAAE,CAAC;IACbsB,SAAS,EAAE,CAAC;IACZ7B,cAAc,EAAE,QAAQ;IACxBQ,YAAY,EAAE;EACf,CAAC;EACDpB,WAAW,EAAE;IACZ6B,KAAK,EAAE,MAAM;IACbC,SAAS,EAAE,QAAQ;IACnBF,QAAQ,EAAE,EAAE;IACZD,UAAU,EAAE;EACb,CAAC;EACDH,cAAc,EAAE;IACfP,iBAAiB,EAAE,CAAC;IACpBI,aAAa,EAAE,KAAK;IACpBqB,iBAAiB,EAAE;EACpB;AACD,CAAC;AAED,MAAMC,eAAe,GAAIjE,KAAK,IAAK;EAClC,OAAO;IACN2B,kBAAkB,EAAEjC,8BAA8B,CAACM,KAAK,CAAC;IACzD0B,UAAU,EAAE/B,uBAAuB,CAClCK,KAAK,EACL,YAAY,EACZL,uBAAuB,CACtBK,KAAK,EACL,mBAAmB,EACnBJ,MAAM,CAACsE,GAAG,CAACC,iBACZ,CAAC,GACE,UAAU,GACV,OACJ;EACD,CAAC;AACF,CAAC;AAED,MAAMC,YAAY,GAAG7E,OAAO,CAAC0E,eAAe,EAAE,CAAC,CAAC,CAAC,CAACpE,YAAY,CAAC;AAC/D,SAASuE,YAAY,IAAIvE,YAAY","ignoreList":[]}

package/dist/module/components/CommentReply.js

@@ -0,0 +1,334 @@
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React, { Component } from "react";
+import { connect } from "react-redux";
+import { Keyboard, TextInput, View, ImageBackground, TouchableOpacity, Dimensions } from "react-native";
+import { Icon } from "@rneui/themed";
+import { withSafeAreaInsets } from "react-native-safe-area-context";
+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$scrollVie = this.props.scrollView) === null || _this$props$scrollVie === void 0 || (_this$props$scrollVie = _this$props$scrollVie.current) === null || _this$props$scrollVie === void 0 || _this$props$scrollVie.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
+    };
+    this.replyInputRef = /*#__PURE__*/React.createRef();
+  }
+  componentDidMount() {
+    if (this.props.commentSection && this.props.commentSection.current) {
+      this.setState({
+        commentsLoading: this.props.commentSection.current.isLoading()
+      });
+    }
+  }
+  focusInput() {
+    this.replyInputRef.current.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$scrollVie2;
+        (_this$props$scrollVie2 = this.props.scrollView) === null || _this$props$scrollVie2 === void 0 || (_this$props$scrollVie2 = _this$props$scrollVie2.current) === null || _this$props$scrollVie2 === void 0 || _this$props$scrollVie2.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$commentSe = this.props.commentSection) === null || _this$props$commentSe === void 0 || (_this$props$commentSe = _this$props$commentSe.current) === null || _this$props$commentSe === void 0 || _this$props$commentSe.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$commentSe2;
+        (_this$props$commentSe2 = this.props.commentSection) === null || _this$props$commentSe2 === void 0 || (_this$props$commentSe2 = _this$props$commentSe2.current) === null || _this$props$commentSe2 === void 0 || _this$props$commentSe2.commentAdded(res.data);
+      }
+      this.setState({
+        addingComment: false
+      });
+      setTimeout(() => {
+        if (!this.props.noScroll) {
+          var _this$props$scrollVie3;
+          (_this$props$scrollVie3 = this.props.scrollView) === null || _this$props$scrollVie3 === void 0 || (_this$props$scrollVie3 = _this$props$scrollVie3.current) === null || _this$props$scrollVie3 === void 0 || _this$props$scrollVie3.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() {
+    var _this$props$insets;
+    if (_.includes(this.props.user.hidden, "addComment")) {
+      return null;
+    }
+    if (this.state.commentsLoading) {
+      return null;
+    }
+    return /*#__PURE__*/React.createElement(View, {
+      style: [styles.inputContainer, getShadowStyle(), {
+        paddingBottom: 8 + (((_this$props$insets = this.props.insets) === null || _this$props$insets === void 0 ? void 0 : _this$props$insets.bottom) ?? 0)
+      }, 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, {
+      maxFontSizeMultiplier: 1.2,
+      ref: this.replyInputRef,
+      placeholder: "Enter your comment here",
+      value: this.state.commentInput,
+      onFocus: () => {
+        if (!this.props.noScroll) {
+          var _this$props$scrollVie4;
+          (_this$props$scrollVie4 = this.props.scrollView) === null || _this$props$scrollVie4 === void 0 || (_this$props$scrollVie4 = _this$props$scrollVie4.current) === null || _this$props$scrollVie4 === void 0 || _this$props$scrollVie4.scrollToEnd({
+            animated: true
+          });
+        }
+      },
+      onChangeText: value => {
+        if (!this.props.noScroll) {
+          var _this$props$scrollVie5;
+          (_this$props$scrollVie5 = this.props.scrollView) === null || _this$props$scrollVie5 === void 0 || (_this$props$scrollVie5 = _this$props$scrollVie5.current) === null || _this$props$scrollVie5 === void 0 || _this$props$scrollVie5.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,
+    // bottom inset added dynamically via props
+    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
+})(withSafeAreaInsets(CommentReply));
+export { commentReply as CommentReply };
+//# sourceMappingURL=CommentReply.js.map