@plusscommunities/pluss-core-app 6.1.7 → 6.1.8-auth.0

package/src/components/DropDownItem.js

@@ -1,72 +1,82 @@
-import React, { Component } from 'react';
-import _ from 'lodash';
-import { Text, TouchableOpacity } from 'react-native';
-import { Icon } from 'react-native-elements';
-import { connect } from 'react-redux';
-import { TEXT_DARK, getMainBrandingColourFromState } from '../colours';
+import React, { Component } from "react";
+import _ from "lodash";
+import { TouchableOpacity } from "react-native";
+import { Text } from "./Text";
+import { Icon } from "@rneui/themed";
+import { connect } from "react-redux";
+import { TEXT_DARK, getMainBrandingColourFromState } from "../colours";
 
 class DropDownItem extends Component {
-  state = {};
+	state = {};
 
-  renderIcon() {
-    if (!_.isUndefined(this.props.icon)) {
-      return (
-        <Icon
-          name={this.props.icon}
-          type="font-awesome"
-          style={styles.dropDownItem_Icon}
-          iconStyle={[styles.dropDownItem_IconStyle, { fontSize: 16, color: this.props.colourBrandingMain }]}
-        />
-      );
-    }
-    return null;
-  }
+	renderIcon() {
+		if (!_.isUndefined(this.props.icon)) {
+			return (
+				<Icon
+					name={this.props.icon}
+					type="font-awesome"
+					style={styles.dropDownItem_Icon}
+					iconStyle={[
+						styles.dropDownItem_IconStyle,
+						{ fontSize: 16, color: this.props.colourBrandingMain },
+					]}
+				/>
+			);
+		}
+		return null;
+	}
 
-  render() {
-    return (
-      <TouchableOpacity
-        style={[styles.container, this.props.last && { marginBottom: 0 }, this.props.style]}
-        onPress={this.props.onPress}
-        activeOpacity={0.6}
-      >
-        {this.renderIcon()}
-        <Text style={[styles.text, this.props.textStyle]}>{this.props.text}</Text>
-      </TouchableOpacity>
-    );
-  }
+	render() {
+		return (
+			<TouchableOpacity
+				style={[
+					styles.container,
+					this.props.last && { marginBottom: 0 },
+					this.props.style,
+				]}
+				onPress={this.props.onPress}
+				activeOpacity={0.6}
+			>
+				{this.renderIcon()}
+				<Text style={[styles.text, this.props.textStyle]}>
+					{this.props.text}
+				</Text>
+			</TouchableOpacity>
+		);
+	}
 }
 
 const styles = {
-  container: {
-    flexDirection: 'row',
-    marginBottom: 12,
-    minHeight: 18,
-    width: '100%',
-    position: 'relative',
-  },
-  text: {
-    fontFamily: 'sf-medium',
-    fontSize: 16,
-    lineHeight: 18,
-    color: TEXT_DARK,
-    backgroundColor: 'transparent',
-  },
-  dropDownItem_Icon: {
-    marginRight: 8,
-    width: 18,
-    alignSelf: 'center',
-  },
-  dropDownItem_IconStyle: {
-    fontSize: 16,
-    lineHeight: 18,
-    textAlign: 'center',
-  },
+	container: {
+		flexDirection: "row",
+		marginBottom: 12,
+		minHeight: 18,
+		width: "100%",
+		position: "relative",
+	},
+	text: {
+		fontFamily: "sf-medium",
+		fontSize: 16,
+		lineHeight: 18,
+		color: TEXT_DARK,
+		backgroundColor: "transparent",
+	},
+	dropDownItem_Icon: {
+		marginRight: 8,
+		width: 18,
+		alignSelf: "center",
+	},
+	dropDownItem_IconStyle: {
+		fontSize: 16,
+		lineHeight: 18,
+		textAlign: "center",
+	},
 };
 
-const mapStateToProps = state => {
-  return {
-    colourBrandingMain: getMainBrandingColourFromState(state),
-  };
+const mapStateToProps = (state) => {
+	return {
+		colourBrandingMain: getMainBrandingColourFromState(state),
+	};
 };
 
 const dropDownItem = connect(mapStateToProps, {})(DropDownItem);

package/src/components/DropDownMenu.js

@@ -1,37 +1,41 @@
-import React, { Component } from 'react';
-import { View } from 'react-native';
+import React, { Component } from "react";
+import { View } from "react-native";
 
 class DropDownMenu extends Component {
-  state = {};
+	state = {};
 
-  render() {
-    if (!this.props.visible) {
-      return null;
-    }
-    return <View style={[styles.container, this.props.style]}>{this.props.children}</View>;
-  }
+	render() {
+		if (!this.props.visible) {
+			return null;
+		}
+		return (
+			<View style={[styles.container, this.props.style]}>
+				{this.props.children}
+			</View>
+		);
+	}
 }
 
 const styles = {
-  container: {
-    borderRadius: 2,
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 2,
-    },
-    shadowOpacity: 0.2,
-    shadowRadius: 4,
-    elevation: 4,
-    zIndex: 10,
-    backgroundColor: '#fff',
-    padding: 16,
-    paddingVertical: 14,
+	container: {
+		borderRadius: 2,
+		shadowColor: "#000",
+		shadowOffset: {
+			width: 0,
+			height: 2,
+		},
+		shadowOpacity: 0.2,
+		shadowRadius: 4,
+		elevation: 4,
+		zIndex: 10,
+		backgroundColor: "#fff",
+		padding: 16,
+		paddingVertical: 14,
 
-    position: 'absolute',
-    right: 0,
-    top: 0,
-  },
+		position: "absolute",
+		right: 0,
+		top: 0,
+	},
 };
 
 export { DropDownMenu };

package/src/components/EmptyStateMain.js

@@ -1,53 +1,60 @@
-import React, { PureComponent } from 'react';
-import { Text, View, ScrollView, StyleSheet } from 'react-native';
-import _ from 'lodash';
-import { TEXT_BLUEGREY } from '../colours';
+import React, { PureComponent } from "react";
+import { View, ScrollView, StyleSheet } from "react-native";
+import { Text } from "./Text";
+import _ from "lodash";
+import { TEXT_BLUEGREY } from "../colours";
 
 class EmptyStateMain extends PureComponent {
-  renderPlaceHolder(index, opacity = 1) {
-    const barCount = _.isUndefined(this.props.barCount) ? 3 : this.props.barCount;
-    if (barCount <= index) {
-      return null;
-    }
-    return <View style={[styles.item, { opacity }]} />;
-  }
+	renderPlaceHolder(index, opacity = 1) {
+		const barCount = _.isUndefined(this.props.barCount)
+			? 3
+			: this.props.barCount;
+		if (barCount <= index) {
+			return null;
+		}
+		return <View style={[styles.item, { opacity }]} />;
+	}
 
-  render() {
-    return (
-      <View style={[styles.container, this.props.style]}>
-        {!this.props.hideTitle && <Text style={styles.titleText}>{this.props.title || 'Nothing to see here'}</Text>}
-        {this.props.content}
-        <ScrollView style={styles.itemContainer}>
-          {this.renderPlaceHolder(0, 0.8)}
-          {this.renderPlaceHolder(1, 0.6)}
-          {this.renderPlaceHolder(2, 0.4)}
-        </ScrollView>
-      </View>
-    );
-  }
+	render() {
+		return (
+			<View style={[styles.container, this.props.style]}>
+				{!this.props.hideTitle && (
+					<Text style={styles.titleText}>
+						{this.props.title || "Nothing to see here"}
+					</Text>
+				)}
+				{this.props.content}
+				<ScrollView style={styles.itemContainer}>
+					{this.renderPlaceHolder(0, 0.8)}
+					{this.renderPlaceHolder(1, 0.6)}
+					{this.renderPlaceHolder(2, 0.4)}
+				</ScrollView>
+			</View>
+		);
+	}
 }
 
 const styles = StyleSheet.create({
-  container: {
-    borderRadius: 5,
-    paddingVertical: 5,
-  },
-  titleText: {
-    fontFamily: 'qs-bold',
-    fontSize: 16,
-    color: TEXT_BLUEGREY,
-  },
-  itemContainer: {
-    marginTop: 20,
-    flexDirection: 'column',
-  },
-  item: {
-    borderRadius: 4,
-    width: '100%',
-    height: 32,
-    backgroundColor: '#e6ebef',
-    marginBottom: 17,
-  },
+	container: {
+		borderRadius: 5,
+		paddingVertical: 5,
+	},
+	titleText: {
+		fontFamily: "qs-bold",
+		fontSize: 16,
+		color: TEXT_BLUEGREY,
+	},
+	itemContainer: {
+		marginTop: 20,
+		flexDirection: "column",
+	},
+	item: {
+		borderRadius: 4,
+		width: "100%",
+		height: 32,
+		backgroundColor: "#e6ebef",
+		marginBottom: 17,
+	},
 });
 
 export default EmptyStateMain;

package/src/components/EmptyStateWidget.js

@@ -1,47 +1,56 @@
-import React, { PureComponent } from 'react';
-import { Text, View, ScrollView, StyleSheet } from 'react-native';
-import { TEXT_BLUEGREY } from '../colours';
+import React, { PureComponent } from "react";
+import { View, ScrollView, StyleSheet } from "react-native";
+import { Text } from "./Text";
+import { TEXT_BLUEGREY } from "../colours";
 
 class EmptyStateWidget extends PureComponent {
-  renderPlaceHolder(opacity = 1) {
-    return <View style={[styles.item, { opacity }]} />;
-  }
+	renderPlaceHolder(opacity = 1) {
+		return <View style={[styles.item, { opacity }]} />;
+	}
 
-  render() {
-    return (
-      <View style={[styles.container, this.props.height && { height: this.props.height }, this.props.style]}>
-        <Text style={styles.titleText}>{this.props.title || 'Nothing to see here'}</Text>
-        <ScrollView horizontal style={styles.itemContainer}>
-          {this.renderPlaceHolder(0.8)}
-          {this.renderPlaceHolder(0.6)}
-          {this.renderPlaceHolder(0.4)}
-          {this.renderPlaceHolder(0.2)}
-        </ScrollView>
-      </View>
-    );
-  }
+	render() {
+		return (
+			<View
+				style={[
+					styles.container,
+					this.props.height && { height: this.props.height },
+					this.props.style,
+				]}
+			>
+				<Text style={styles.titleText}>
+					{this.props.title || "Nothing to see here"}
+				</Text>
+				<ScrollView horizontal style={styles.itemContainer}>
+					{this.renderPlaceHolder(0.8)}
+					{this.renderPlaceHolder(0.6)}
+					{this.renderPlaceHolder(0.4)}
+					{this.renderPlaceHolder(0.2)}
+				</ScrollView>
+			</View>
+		);
+	}
 }
 
 const styles = StyleSheet.create({
-  container: {
-    borderRadius: 5,
-    paddingVertical: 5,
-  },
-  titleText: {
-    fontFamily: 'qs-bold',
-    fontSize: 16,
-    color: TEXT_BLUEGREY,
-  },
-  itemContainer: {
-    marginTop: 20,
-  },
-  item: {
-    borderRadius: 4,
-    width: 97,
-    height: 98,
-    backgroundColor: '#e6ebef',
-    marginRight: 17,
-  },
+	container: {
+		borderRadius: 5,
+		paddingVertical: 5,
+	},
+	titleText: {
+		fontFamily: "qs-bold",
+		fontSize: 16,
+		color: TEXT_BLUEGREY,
+	},
+	itemContainer: {
+		marginTop: 20,
+	},
+	item: {
+		borderRadius: 4,
+		width: 97,
+		height: 98,
+		backgroundColor: "#e6ebef",
+		marginRight: 17,
+	},
 });
 
 export default EmptyStateWidget;

package/src/components/FontScaleButton.js

@@ -1,6 +1,7 @@
-import React, { PureComponent } from 'react';
-import { TouchableOpacity, Text } from 'react-native';
-import { TEXT_DARK } from '../colours';
+import React, { PureComponent } from "react";
+import { TouchableOpacity } from "react-native";
+import { Text } from "./Text";
+import { TEXT_DARK } from "../colours";
 
 /* 
 Props- 
@@ -8,31 +9,34 @@ Props-
 */
 
 class FontScaleButton extends PureComponent {
-  render() {
-    return (
-      <TouchableOpacity style={[styles.container, this.props.style]} onPress={this.props.onPress}>
-        <Text style={styles.text}>
-          <Text>A</Text>
-          <Text>{` `}</Text>
-          <Text style={styles.largeText}>A</Text>
-        </Text>
-      </TouchableOpacity>
-    );
-  }
+	render() {
+		return (
+			<TouchableOpacity
+				style={[styles.container, this.props.style]}
+				onPress={this.props.onPress}
+			>
+				<Text style={styles.text}>
+					<Text>A</Text>
+					<Text>{` `}</Text>
+					<Text style={styles.largeText}>A</Text>
+				</Text>
+			</TouchableOpacity>
+		);
+	}
 }
 
 const styles = {
-  container: {
-    padding: 15,
-  },
-  text: {
-    fontFamily: 'sf-medium',
-    color: TEXT_DARK,
-    fontSize: 14,
-  },
-  largeText: {
-    fontSize: 24,
-  },
+	container: {
+		padding: 15,
+	},
+	text: {
+		fontFamily: "sf-medium",
+		color: TEXT_DARK,
+		fontSize: 14,
+	},
+	largeText: {
+		fontSize: 24,
+	},
 };
 
 export { FontScaleButton };

package/src/components/FontScalePopup.js

@@ -1,6 +1,7 @@
-import React, { PureComponent } from 'react';
-import { TouchableOpacity, Text, View } from 'react-native';
-import { TEXT_DARK, LINEGREY } from '../colours';
+import React, { PureComponent } from "react";
+import { TouchableOpacity, View } from "react-native";
+import { Text } from "./Text";
+import { TEXT_DARK, LINEGREY } from "../colours";
 
 /* 
 Props- 
@@ -12,62 +13,72 @@ Props-
 */
 
 class FontScalePopup extends PureComponent {
-  render() {
-    if (!this.props.visible) {
-      return null;
-    }
-    return (
-      <View style={[styles.container, this.props.style]}>
-        <TouchableOpacity style={[styles.button, styles.buttonLeft, this.props.buttonLeftStyle]} onPress={this.props.onPressSmall}>
-          <Text style={styles.smallText}>A</Text>
-        </TouchableOpacity>
-        <TouchableOpacity style={[styles.button, styles.buttonRight, this.props.buttonRightStyle]} onPress={this.props.onPressLarge}>
-          <Text style={styles.largeText}>A</Text>
-        </TouchableOpacity>
-      </View>
-    );
-  }
+	render() {
+		if (!this.props.visible) {
+			return null;
+		}
+		return (
+			<View style={[styles.container, this.props.style]}>
+				<TouchableOpacity
+					style={[styles.button, styles.buttonLeft, this.props.buttonLeftStyle]}
+					onPress={this.props.onPressSmall}
+				>
+					<Text style={styles.smallText}>A</Text>
+				</TouchableOpacity>
+				<TouchableOpacity
+					style={[
+						styles.button,
+						styles.buttonRight,
+						this.props.buttonRightStyle,
+					]}
+					onPress={this.props.onPressLarge}
+				>
+					<Text style={styles.largeText}>A</Text>
+				</TouchableOpacity>
+			</View>
+		);
+	}
 }
 
 const styles = {
-  container: {
-    flexDirection: 'row',
-    borderRadius: 2,
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 2,
-    },
-    shadowOpacity: 0.2,
-    shadowRadius: 4,
-    elevation: 4,
-    zIndex: 10,
-    backgroundColor: '#fff',
-    padding: 2,
-  },
-  button: {
-    height: 50,
-    width: 64,
-    borderColor: LINEGREY,
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  buttonLeft: {
-    borderRightWidth: 1,
-  },
-  buttonRight: {
-    borderLeftWidth: 1,
-  },
-  smallText: {
-    fontFamily: 'sf-medium',
-    color: TEXT_DARK,
-    fontSize: 16,
-  },
-  largeText: {
-    fontFamily: 'sf-medium',
-    color: TEXT_DARK,
-    fontSize: 24,
-  },
+	container: {
+		flexDirection: "row",
+		borderRadius: 2,
+		shadowColor: "#000",
+		shadowOffset: {
+			width: 0,
+			height: 2,
+		},
+		shadowOpacity: 0.2,
+		shadowRadius: 4,
+		elevation: 4,
+		zIndex: 10,
+		backgroundColor: "#fff",
+		padding: 2,
+	},
+	button: {
+		height: 50,
+		width: 64,
+		borderColor: LINEGREY,
+		alignItems: "center",
+		justifyContent: "center",
+	},
+	buttonLeft: {
+		borderRightWidth: 1,
+	},
+	buttonRight: {
+		borderLeftWidth: 1,
+	},
+	smallText: {
+		fontFamily: "sf-medium",
+		color: TEXT_DARK,
+		fontSize: 16,
+	},
+	largeText: {
+		fontFamily: "sf-medium",
+		color: TEXT_DARK,
+		fontSize: 24,
+	},
 };
 
 export { FontScalePopup };