@plusscommunities/pluss-core-app 8.0.0 → 8.0.1-auth.0

package/src/components/FormCardSectionOptionLauncher.js

@@ -1,57 +1,83 @@
-import React, { PureComponent } from 'react';
-import { View, Text, TouchableOpacity } from 'react-native';
-import { Icon } from '@rneui/themed';
-import { connect } from 'react-redux';
-import { TEXT_DARK, TEXT_LIGHT, getMainBrandingColourFromState } from '../colours';
-import { FormCardSection } from './FormCardSection';
+import React, { PureComponent } from "react";
+import { View, TouchableOpacity } from "react-native";
+import { Text } from "./Text";
+import { Icon } from "@rneui/themed";
+import { connect } from "react-redux";
+import {
+	TEXT_DARK,
+	TEXT_LIGHT,
+	getMainBrandingColourFromState,
+} from "../colours";
+import { FormCardSection } from "./FormCardSection";
 
 class FormCardSectionOptionLauncher extends PureComponent {
-  render() {
-    const { onPress, sectionStyle, textStyle, title, description, value, icon, colourBrandingMain } = this.props;
+	render() {
+		const {
+			onPress,
+			sectionStyle,
+			textStyle,
+			title,
+			description,
+			value,
+			icon,
+			colourBrandingMain,
+		} = this.props;
 
-    return (
-      <TouchableOpacity onPress={onPress}>
-        <FormCardSection hasContent sectionStyle={sectionStyle}>
-          <View style={styles.container}>
-            <Text style={[styles.text, { marginRight: 16, flex: 1 }, textStyle]}>{title}</Text>
-            <Text style={[styles.text, { marginRight: 16 }]}>{value}</Text>
-            <Icon
-              name={icon ? icon : 'angle-right'}
-              type="font-awesome"
-              iconStyle={[styles.text, { fontSize: 20, color: colourBrandingMain }]}
-            />
-          </View>
-          {description ? <Text style={styles.description}>{description}</Text> : null}
-        </FormCardSection>
-      </TouchableOpacity>
-    );
-  }
+		return (
+			<TouchableOpacity onPress={onPress}>
+				<FormCardSection hasContent sectionStyle={sectionStyle}>
+					<View style={styles.container}>
+						<Text
+							style={[styles.text, { marginRight: 16, flex: 1 }, textStyle]}
+						>
+							{title}
+						</Text>
+						<Text style={[styles.text, { marginRight: 16 }]}>{value}</Text>
+						<Icon
+							name={icon ? icon : "angle-right"}
+							type="font-awesome"
+							iconStyle={[
+								styles.text,
+								{ fontSize: 20, color: colourBrandingMain },
+							]}
+						/>
+					</View>
+					{description ? (
+						<Text style={styles.description}>{description}</Text>
+					) : null}
+				</FormCardSection>
+			</TouchableOpacity>
+		);
+	}
 }
 
 const styles = {
-  container: {
-    flexDirection: 'row',
-    alignSelf: 'stretch',
-    alignItems: 'center',
-  },
-  text: {
-    fontFamily: 'sf-regular',
-    fontSize: 17,
-    color: TEXT_DARK,
-  },
-  description: {
-    fontFamily: 'sf-regular',
-    fontSize: 15,
-    color: TEXT_LIGHT,
-    marginTop: 8,
-  },
+	container: {
+		flexDirection: "row",
+		alignSelf: "stretch",
+		alignItems: "center",
+	},
+	text: {
+		fontFamily: "sf-regular",
+		fontSize: 17,
+		color: TEXT_DARK,
+	},
+	description: {
+		fontFamily: "sf-regular",
+		fontSize: 15,
+		color: TEXT_LIGHT,
+		marginTop: 8,
+	},
 };
 
-const mapStateToProps = state => {
-  return {
-    colourBrandingMain: getMainBrandingColourFromState(state),
-  };
+const mapStateToProps = (state) => {
+	return {
+		colourBrandingMain: getMainBrandingColourFromState(state),
+	};
 };
 
-const formCardSectionOptionLauncher = connect(mapStateToProps, {})(FormCardSectionOptionLauncher);
+const formCardSectionOptionLauncher = connect(
+	mapStateToProps,
+	{},
+)(FormCardSectionOptionLauncher);
 export { formCardSectionOptionLauncher as FormCardSectionOptionLauncher };

package/src/components/FormattedText.js

@@ -1,131 +1,148 @@
-import React, { Component } from 'react';
-import { Linking } from 'react-native';
-import { connect } from 'react-redux';
-import ParsedText from 'react-native-parsed-text';
-import { getMainBrandingColourFromState, TEXT_DARKEST } from '../colours';
-import { getValidUrl } from '../helper';
-import { analyticsActions } from '../apis';
+import React, { Component } from "react";
+import { Linking } from "react-native";
+import { connect } from "react-redux";
+import ParsedText from "react-native-parsed-text";
+import { Text } from "./Text";
+import { getMainBrandingColourFromState, TEXT_DARKEST } from "../colours";
+import { getValidUrl } from "../helper";
+import { analyticsActions } from "../apis";
 
 class FormattedText extends Component {
-  static get UrlTextRegex() {
-    return /\[([^\]\|\]]+)\|([^\]\|\]]+)\]/i;
-  }
+	static get UrlTextRegex() {
+		return /\[([^\]\|\]]+)\|([^\]\|\]]+)\]/i;
+	}
 
-  checkLog(type, target) {
-    if (this.props.logClicks) {
-      analyticsActions.log(this.props.site, type, this.props.entityType, this.props.entityId, { target });
-    }
-  }
+	checkLog(type, target) {
+		if (this.props.logClicks) {
+			analyticsActions.log(
+				this.props.site,
+				type,
+				this.props.entityType,
+				this.props.entityId,
+				{ target },
+			);
+		}
+	}
 
-  onPressUrl = url => {
-    const urlToUse = getValidUrl(url);
-    Linking.openURL(urlToUse);
-    this.checkLog('UrlClick', urlToUse);
-  };
+	onPressUrl = (url) => {
+		const urlToUse = getValidUrl(url);
+		Linking.openURL(urlToUse);
+		this.checkLog("UrlClick", urlToUse);
+	};
 
-  onPressUrlText = urlText => {
-    const texts = urlText.match(FormattedText.UrlTextRegex);
-    this.onPressUrl(texts[1]);
-  };
+	onPressUrlText = (urlText) => {
+		const texts = urlText.match(FormattedText.UrlTextRegex);
+		this.onPressUrl(texts[1]);
+	};
 
-  onPressEmail = email => {
-    Linking.openURL(`mailto:${email}`);
-    this.checkLog('EmailClick', email);
-  };
+	onPressEmail = (email) => {
+		Linking.openURL(`mailto:${email}`);
+		this.checkLog("EmailClick", email);
+	};
 
-  onPressPhone = phone => {
-    const parsedPhone = phone.replace(/\D/g, '');
-    Linking.openURL(`tel:${parsedPhone.replace(/\D/g, '')}`);
-    this.checkLog('PhoneClick', parsedPhone);
-  };
+	onPressPhone = (phone) => {
+		const parsedPhone = phone.replace(/\D/g, "");
+		Linking.openURL(`tel:${parsedPhone.replace(/\D/g, "")}`);
+		this.checkLog("PhoneClick", parsedPhone);
+	};
 
-  ifEnabled = value => (this.props.disabled ? undefined : value);
+	ifEnabled = (value) => (this.props.disabled ? undefined : value);
 
-  renderTextContent(matchingString, matches) {
-    return matches[1];
-  }
+	renderTextContent(matchingString, matches) {
+		return matches[1];
+	}
 
-  renderUrlText(matchingString, matches) {
-    return matches[2];
-  }
+	renderUrlText(matchingString, matches) {
+		return matches[2];
+	}
 
-  render() {
-    const { style, numberOfLines, titleSize, colourBrandingMain, subtitleSize, children } = this.props;
+	render() {
+		const {
+			style,
+			numberOfLines,
+			titleSize,
+			colourBrandingMain,
+			subtitleSize,
+			children,
+		} = this.props;
 
-    return (
-      <ParsedText
-        style={[styles.text, this.ifEnabled({ lineHeight: 24 }), style]}
-        numberOfLines={numberOfLines}
-        parse={[
-          {
-            pattern: /\*\*(.*?)\*\*/i,
-            style: this.ifEnabled({
-              fontFamily: 'sf-bold',
-              lineHeight: 24,
-            }),
-            renderText: this.renderTextContent,
-          },
-          {
-            pattern: /\*t\*(.*?)\*t\*/i,
-            style: this.ifEnabled({
-              fontSize: titleSize || 22,
-              color: colourBrandingMain,
-              fontFamily: 'sf-semibold',
-              lineHeight: 24,
-            }),
-            renderText: this.renderTextContent,
-          },
-          {
-            pattern: /\*s\*(.*?)\*s\*/i,
-            style: this.ifEnabled({
-              fontSize: subtitleSize || 18,
-              color: TEXT_DARKEST,
-              fontFamily: 'sf-semibold',
-              lineHeight: 24,
-            }),
-            renderText: this.renderTextContent,
-          },
-          {
-            pattern: FormattedText.UrlTextRegex,
-            style: this.ifEnabled({ color: colourBrandingMain }),
-            onPress: this.ifEnabled(this.onPressUrlText),
-            renderText: this.renderUrlText,
-          },
-          {
-            pattern: /(?:(?:https?|ftp|file):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#\/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[A-Z0-9+&@#\/%=~_|$])/im,
-            style: this.ifEnabled({ color: colourBrandingMain }),
-            onPress: this.ifEnabled(this.onPressUrl),
-          },
-          {
-            pattern: /([A-Z0-9._%-]+)@([A-Z0-9.-]+\.[A-Z]{2,4})/im,
-            style: this.ifEnabled({ color: colourBrandingMain }),
-            onPress: this.ifEnabled(this.onPressEmail),
-          },
-          {
-            pattern: /(?:\+?(\d{1,3}))?([-. (]*(\d{1,3})[-. )]*)?((\d{2,4})[-. ]*(\d{2,4})(?:[-.x ]*(\d+))?)\s*$/im,
-            style: this.ifEnabled({ color: colourBrandingMain }),
-            onPress: this.ifEnabled(this.onPressPhone),
-          },
-        ]}
-      >
-        {children}
-      </ParsedText>
-    );
-  }
+		return (
+			<ParsedText
+				maxFontSizeMultiplier={1.2}
+				style={[styles.text, this.ifEnabled({ lineHeight: 24 }), style]}
+				numberOfLines={numberOfLines}
+				parse={[
+					{
+						pattern: /\*\*(.*?)\*\*/i,
+						style: this.ifEnabled({
+							fontFamily: "sf-bold",
+							lineHeight: 24,
+						}),
+						renderText: this.renderTextContent,
+					},
+					{
+						pattern: /\*t\*(.*?)\*t\*/i,
+						style: this.ifEnabled({
+							fontSize: titleSize || 22,
+							color: colourBrandingMain,
+							fontFamily: "sf-semibold",
+							lineHeight: 24,
+						}),
+						renderText: this.renderTextContent,
+					},
+					{
+						pattern: /\*s\*(.*?)\*s\*/i,
+						style: this.ifEnabled({
+							fontSize: subtitleSize || 18,
+							color: TEXT_DARKEST,
+							fontFamily: "sf-semibold",
+							lineHeight: 24,
+						}),
+						renderText: this.renderTextContent,
+					},
+					{
+						pattern: FormattedText.UrlTextRegex,
+						style: this.ifEnabled({ color: colourBrandingMain }),
+						onPress: this.ifEnabled(this.onPressUrlText),
+						renderText: this.renderUrlText,
+					},
+					{
+						pattern:
+							/(?:(?:https?|ftp|file):\/\/|www\.|ftp\.)(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[-A-Z0-9+&@#\/%=~_|$?!:,.])*(?:\([-A-Z0-9+&@#\/%=~_|$?!:,.]*\)|[A-Z0-9+&@#\/%=~_|$])/im,
+						style: this.ifEnabled({ color: colourBrandingMain }),
+						onPress: this.ifEnabled(this.onPressUrl),
+					},
+					{
+						pattern: /([A-Z0-9._%-]+)@([A-Z0-9.-]+\.[A-Z]{2,4})/im,
+						style: this.ifEnabled({ color: colourBrandingMain }),
+						onPress: this.ifEnabled(this.onPressEmail),
+					},
+					{
+						pattern:
+							/(?:\+?(\d{1,3}))?([-. (]*(\d{1,3})[-. )]*)?((\d{2,4})[-. ]*(\d{2,4})(?:[-.x ]*(\d+))?)\s*$/im,
+						style: this.ifEnabled({ color: colourBrandingMain }),
+						onPress: this.ifEnabled(this.onPressPhone),
+					},
+				]}
+			>
+				{children}
+			</ParsedText>
+		);
+	}
 }
 
 const styles = {
-  text: {
-    color: TEXT_DARKEST,
-    fontSize: 14,
-    fontFamily: 'sf-regular',
-  },
+	text: {
+		color: TEXT_DARKEST,
+		fontSize: 14,
+		fontFamily: "sf-regular",
+	},
 };
 
-const mapStateToProps = state => {
-  return {
-    colourBrandingMain: getMainBrandingColourFromState(state),
-  };
+const mapStateToProps = (state) => {
+	return {
+		colourBrandingMain: getMainBrandingColourFromState(state),
+	};
 };
 
 export default connect(mapStateToProps, {})(FormattedText);