App linking

ios/shpeucfapp/Info.plist

@@ -22,6 +22,15 @@
 	<string>????</string>
 	<key>CFBundleVersion</key>
 	<string>$(CURRENT_PROJECT_VERSION)</string>
+	<key>LSApplicationQueriesSchemes</key>
+	<array>
+		<string>tel</string>
+		<string>mailto</string>
+		<string>instagram</string>
+		<string>slack</string>
+		<string>fb</string>
+		<string>linkedin</string>
+	</array>
 	<key>LSRequiresIPhoneOS</key>
 	<true/>
 	<key>NSAppTransportSecurity</key>

src/components/general/FilterList.js

@@ -58,7 +58,7 @@ class FilterList extends Component {
 	}
 
 	componentDidUpdate(prevProps) {
-		if (prevProps.value !== this.props.value) this.setState(this.processInitialValues());
+		if (prevProps.value !== this.props.value) this.setState({ selected: this.processInitialValues() });
 	}
 
 	processInitialValues() {
@@ -84,9 +84,9 @@ class FilterList extends Component {
 					selected[selectBy(item)] = item;
 				});
 			}
-
-			return { selected };
 		}
+
+		return selected ;
 	}
 
 	static propTypes = {

src/data/FormData.js

@@ -1,12 +1,13 @@
 /*
-The order you put in the data reflects the order that the
-fields are displayed
-*/
+ * The order you put in the data reflects the order that the
+ * fields are displayed
+ */
 
 import React from "react";
 import Countries from "./Countries.json";
 import Majors from "./Majors.json";
 import { changeHourBy, timeVerification } from "../utils/events";
+import { editUser } from "../ducks";
 import { useSelector } from "react-redux";
 import { Form } from "../components";
 
@@ -35,6 +36,7 @@ export const EventForm = (props) => {
 					format: ({ type, committee }) => committee ? `${type}: ${committee}` : type.trim(),
 					revert: ({ type }) => {
 						const [eventType, , ] = type.split(": ");
+
 						return eventType;
 					}
 				},
@@ -132,71 +134,59 @@ export const EventForm = (props) => {
 	);
 };
 
-const editProfileFormDataRegular = [
-	{
-		placeholder: "Gender",
-		camelCaseName: "gender",
-		type: "PickerInput",
-		isRequired: false,
-		options: {
-			data: genderOptions
-		}
-	},
-	{
-		placeholder: "Major",
-		camelCaseName: "major",
-		type: "FilterList",
-		isRequired: false,
-		options: {
-			data: Majors
-		}
-	},
-	{
-		placeholder: "Country of Origin",
-		camelCaseName: "country",
-		type: "FilterList",
-		isRequired: false,
-		options: {
-			data: Countries
+export const ProfileForm = (props) => {
+	const memberFields = [
+		{
+			placeholder: "Gender",
+			camelCaseName: "gender",
+			type: "PickerInput",
+			isRequired: false,
+			options: { data: genderOptions }
+		},
+		{
+			placeholder: "Major",
+			camelCaseName: "major",
+			type: "FilterList",
+			isRequired: false,
+			options: { data: Majors }
+		},
+		{
+			placeholder: "Country of Origin",
+			camelCaseName: "country",
+			type: "FilterList",
+			isRequired: false,
+			options: { data: Countries }
+		},
+		{
+			placeholder: "LinkedIn Profile name",
+			camelCaseName: "linkedin",
+			type: "Input",
+			isRequired: false
 		}
-	}
-];
+	];
 
-const editProfileFormDataPrivileged = [
-	{
-		placeholder: "Gender",
-		camelCaseName: "gender",
-		type: "PickerInput",
-		isRequired: false,
-		options: {
-			data: genderOptions
-		}
-	},
-	{
-		placeholder: "Major",
-		camelCaseName: "major",
-		type: "FilterList",
-		isRequired: false,
-		options: {
-			data: Majors
-		}
-	},
-	{
-		placeholder: "Country of Origin",
-		camelCaseName: "country",
-		type: "FilterList",
-		isRequired: false,
-		options: {
-			data: Countries
+	const privilegedFields = [
+		{
+			placeholder: "Birthday",
+			camelCaseName: "birthday",
+			type: "DatePicker",
+			isRequired: false
 		}
-	},
-	{
-		placeholder: "Birthday",
-		camelCaseName: "birthday",
-		type: "DatePicker",
-		isRequired: false
-	}
-];
+	];
+
+	const activeUser = useSelector(state => state.user.activeUser);
+
+	let elements = (activeUser.privilege.eboard) ? [...memberFields, ...privilegedFields] : memberFields;
+
+	return (
+		<Form
+			elements = { elements }
+			values = { activeUser }
+			onSubmit = { editUser }
+			{ ...props }
+		/>
+	);
+};
 
 const registrationFormData = [
 	{
@@ -293,8 +283,6 @@ const upsertCommittee = [
 ];
 
 export {
-	editProfileFormDataPrivileged,
-	editProfileFormDataRegular,
 	registrationFormData,
 	upsertCommittee
 };

src/ducks/Members.js

@@ -55,7 +55,7 @@ const INITIAL_STATE = {
 	error: "",
 	id: "",
 	flag: "",
-	dashColor: "",
+	color: "",
 	filters: {},
 	userCommittees: {},
 	userList: {}
@@ -129,7 +129,7 @@ export default (state = INITIAL_STATE, action) => {
 				paidMember: payload.paidMember,
 				flag: payload.flag,
 				userCommittees: payload.committees,
-				dashColor: payload.color,
+				color: payload.color,
 				privilege: payload.privilege };
 		case ACTIONS.FETCH_ALL_USERS:
 			return { ...state,

src/ducks/User.js

@@ -28,6 +28,7 @@ const INITIAL_STATE = {
 		birthday: "0000-00-00",
 		paidMember: false,
 		id: "",
+		linkedin: "",
 		voted: false,
 		applied: false,
 		userCommittees: {}

src/screens/General/Dashboard.js

@@ -12,13 +12,13 @@ import { rankMembersAndReturnsCurrentUser } from "../../utils/render";
 import { goToViewEvent } from "../../utils/router";
 import { months } from "../../data/DateItems";
 import { filterPastEvents } from "../../utils/events";
+import { openAppOrWebsite } from "../../utils/appLinking";
 import {
 	Text,
 	View,
 	ScrollView,
 	Dimensions,
 	TouchableOpacity,
-	Linking,
 	Modal,
 	SafeAreaView,
 	StatusBar
@@ -348,25 +348,25 @@ class Dashboard extends Component {
 			black
 		} = styles;
 
-		let buttonLinks = [
-			["https://shpeucf2018-2019.slack.com/", "slack"],
-			["https://www.facebook.com/shpeucfchapter/", "facebook"],
-			["https://www.shpeucf.com/", "globe"],
-			["https://www.instagram.com/shpeucf/?hl=en", "instagram"]
+		let socialMediaLinks = [
+			{ appLink: ["slack", "channel", "announcements"], appImage: "slack" },
+			{ appLink: ["facebook", "groups", "shpeucf"], appImage: "facebook" },
+			{ appLink: ["web", "open", "https://www.shpeucf.com/"], appImage: "globe" },
+			{ appLink: ["instagram", "open", "shpeucf"], appImage: "instagram" }
 		];
 
 		return (
 			<View style = { socialMediaContainer }>
 				<View style = { buttonRowContainer }>
-					{ buttonLinks.map((data, index) =>
+					{ socialMediaLinks.map((socialMediaLinks, index) =>
 						<TouchableOpacity
 							key = { index }
 							style = { socialMediaButton }
-							onPress = { () => Linking.openURL(data[0]) }
+							onPress = { () => openAppOrWebsite(...socialMediaLinks.appLink) }
 						>
 							<FontAwesomeIcon
 								style = { black }
-								name = { data[1] }
+								name = { socialMediaLinks.appImage }
 								size = { dimension.height * 0.04 }
 							/>
 						</TouchableOpacity>

src/screens/User/OtherProfile.js

@@ -2,10 +2,11 @@ import React, { Component } from "react";
 import { Actions } from "react-native-router-flux";
 import Ionicons from "react-native-vector-icons/Ionicons";
 import { connect } from "react-redux";
-import { Alert, ButtonLayout, NavBar } from "../../components";
+import { ButtonLayout, NavBar } from "../../components";
 import { Avatar } from "react-native-elements";
 import Flag from "react-native-flags";
 import { verifiedCheckMark } from "../../utils/render";
+import { openAppOrWebsite } from "../../utils/appLinking";
 import { Text, View, TouchableOpacity, Dimensions, SafeAreaView } from "react-native";
 
 const dimension = Dimensions.get("window");
@@ -18,16 +19,8 @@ class OtherProfile extends Component {
 	}
 
 	renderContent() {
-		const {
-			email, major, points
-		} = this.props;
-		const {
-			bioContainer,
-			fieldContainerStyle,
-			itemLabelText,
-			itemValueText,
-			textColor
-		} = styles;
+		const { email, major, points } = this.props;
+		const { bioContainer, fieldContainerStyle, itemLabelText, itemValueText, textColor } = styles;
 
 		return (
 			<SafeAreaView style = {{ flex: 1, backgroundColor: "#0c0b0b" }}>
@@ -122,8 +115,8 @@ class OtherProfile extends Component {
 	}
 
 	renderFlag() {
-
 		let flag = null;
+
 		if (this.props.flag !== "" && this.props.flag) {
 			flag = <Flag
 				type = "flat"
@@ -146,27 +139,26 @@ class OtherProfile extends Component {
 			LogoContainer,
 			socialmediarow
 		} = styles;
+		const {
+			firstName,
+			email,
+			linkedin
+		} = this.props;
 
 		return (
 			<View style = {{ flex: 0.2 }}>
 				<View style = {{ flex: 0.03 }}></View>
 				<View style = { socialmediarow }>
 					<View style = { [LogoContainer, { backgroundColor: this.props.color, flex: 1 }] }>
 						<TouchableOpacity
-							onPress = { () => {
-								Alert.alert("Coming Soon");
-								// Actions.PostShow({ title: 'Linkedin', uri: 'https://www.linkedin.com/'})
-							} }>
+							onPress = { () => { openAppOrWebsite("linkedin", "profile", linkedin, `${firstName} has not added their Linkedin profile yet.`) } }>
 							<Ionicons name = "logo-linkedin" size = { dimension.height * 0.045 } color = 'white' />
 						</TouchableOpacity>
 					</View>
 					<View style = {{ flex: 0.01 }}></View>
 					<View style = { [LogoContainer, { backgroundColor: this.props.color, flex: 1 }] }>
 						<TouchableOpacity
-							onPress = { () => {
-								Alert.alert("Coming Soon");
-								// Actions.PostShow({ title: 'Github', uri: 'https://www.github.com/'})
-							} } >
+							onPress = { () => { openAppOrWebsite("email", "", email, `${firstName}'s email is not set.`) } } >
 							<Ionicons name = "ios-mail" size = { dimension.height * 0.045 } color = 'white' />
 						</TouchableOpacity>
 					</View>
@@ -259,7 +251,8 @@ const mapStateToProps = ({ members, general, user }) => {
 		quote,
 		color,
 		flag,
-		paidMember
+		paidMember,
+		linkedin
 	} = members;
 	const {
 		loading
@@ -280,10 +273,11 @@ const mapStateToProps = ({ members, general, user }) => {
 		activeUser,
 		color,
 		flag,
-		paidMember
+		paidMember,
+		linkedin
 	};
 };
 
 const mapDispatchToProps = {};
 
-export default connect(mapStateToProps, mapDispatchToProps)(OtherProfile);
+export default connect(mapStateToProps, mapDispatchToProps)(OtherProfile);