diff options
Diffstat (limited to 'src')
42 files changed, 546 insertions, 19 deletions
diff --git a/src/assets/images/badges/alpha_chi_omega.png b/src/assets/images/badges/alpha_chi_omega.png Binary files differnew file mode 100644 index 00000000..473894cc --- /dev/null +++ b/src/assets/images/badges/alpha_chi_omega.png diff --git a/src/assets/images/badges/alpha_phi_alpha.png b/src/assets/images/badges/alpha_phi_alpha.png Binary files differnew file mode 100644 index 00000000..275e0eb3 --- /dev/null +++ b/src/assets/images/badges/alpha_phi_alpha.png diff --git a/src/assets/images/badges/baseball.png b/src/assets/images/badges/baseball.png Binary files differnew file mode 100644 index 00000000..7b470dbe --- /dev/null +++ b/src/assets/images/badges/baseball.png diff --git a/src/assets/images/badges/basketball.png b/src/assets/images/badges/basketball.png Binary files differnew file mode 100644 index 00000000..45d1139b --- /dev/null +++ b/src/assets/images/badges/basketball.png diff --git a/src/assets/images/badges/beta_omega_chi.png b/src/assets/images/badges/beta_omega_chi.png Binary files differnew file mode 100644 index 00000000..f2a85996 --- /dev/null +++ b/src/assets/images/badges/beta_omega_chi.png diff --git a/src/assets/images/badges/brown_badge.png b/src/assets/images/badges/brown_badge.png Binary files differnew file mode 100644 index 00000000..bcffb6e3 --- /dev/null +++ b/src/assets/images/badges/brown_badge.png diff --git a/src/assets/images/badges/delta_gamma.png b/src/assets/images/badges/delta_gamma.png Binary files differnew file mode 100644 index 00000000..84182eca --- /dev/null +++ b/src/assets/images/badges/delta_gamma.png diff --git a/src/assets/images/badges/delta_phi.png b/src/assets/images/badges/delta_phi.png Binary files differnew file mode 100644 index 00000000..074317d1 --- /dev/null +++ b/src/assets/images/badges/delta_phi.png diff --git a/src/assets/images/badges/field_hockey.png b/src/assets/images/badges/field_hockey.png Binary files differnew file mode 100644 index 00000000..766f0f60 --- /dev/null +++ b/src/assets/images/badges/field_hockey.png diff --git a/src/assets/images/badges/football.png b/src/assets/images/badges/football.png Binary files differnew file mode 100644 index 00000000..2e8214b7 --- /dev/null +++ b/src/assets/images/badges/football.png diff --git a/src/assets/images/badges/gymnastics.png b/src/assets/images/badges/gymnastics.png Binary files differnew file mode 100644 index 00000000..5d500f26 --- /dev/null +++ b/src/assets/images/badges/gymnastics.png diff --git a/src/assets/images/badges/hockey.png b/src/assets/images/badges/hockey.png Binary files differnew file mode 100644 index 00000000..7e269665 --- /dev/null +++ b/src/assets/images/badges/hockey.png diff --git a/src/assets/images/badges/kappa_alpha_psi.png b/src/assets/images/badges/kappa_alpha_psi.png Binary files differnew file mode 100644 index 00000000..1b7d7aff --- /dev/null +++ b/src/assets/images/badges/kappa_alpha_psi.png diff --git a/src/assets/images/badges/kappa_delta.png b/src/assets/images/badges/kappa_delta.png Binary files differnew file mode 100644 index 00000000..642ddb5b --- /dev/null +++ b/src/assets/images/badges/kappa_delta.png diff --git a/src/assets/images/badges/lax.png b/src/assets/images/badges/lax.png Binary files differnew file mode 100644 index 00000000..3810589b --- /dev/null +++ b/src/assets/images/badges/lax.png diff --git a/src/assets/images/badges/sigma.png b/src/assets/images/badges/sigma.png Binary files differnew file mode 100644 index 00000000..7e6c9d22 --- /dev/null +++ b/src/assets/images/badges/sigma.png diff --git a/src/assets/images/badges/theta_alpha.png b/src/assets/images/badges/theta_alpha.png Binary files differnew file mode 100644 index 00000000..607720f5 --- /dev/null +++ b/src/assets/images/badges/theta_alpha.png diff --git a/src/assets/images/badges/track.png b/src/assets/images/badges/track.png Binary files differnew file mode 100644 index 00000000..a531f641 --- /dev/null +++ b/src/assets/images/badges/track.png diff --git a/src/assets/images/badges/volleyball.png b/src/assets/images/badges/volleyball.png Binary files differnew file mode 100644 index 00000000..a9bb9c88 --- /dev/null +++ b/src/assets/images/badges/volleyball.png diff --git a/src/components/index.ts b/src/components/index.ts index 0a7c189b..d5649323 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -6,4 +6,3 @@ export * from './taggs'; export * from './comments'; export * from './moments'; export * from './suggestedPeople'; - diff --git a/src/components/taggs/SocialMediaInfo.tsx b/src/components/taggs/SocialMediaInfo.tsx index 8f5f38c1..5497226c 100644 --- a/src/components/taggs/SocialMediaInfo.tsx +++ b/src/components/taggs/SocialMediaInfo.tsx @@ -1,6 +1,6 @@ import React from 'react'; import {StyleSheet, Text, View} from 'react-native'; -import { ScreenType } from '../../types'; +import {ScreenType} from '../../types'; import {SocialIcon} from '../common'; import {handleOpenSocialUrlOnBrowser} from '../../utils'; diff --git a/src/constants/api.ts b/src/constants/api.ts index 07fa2b59..0fc846c3 100644 --- a/src/constants/api.ts +++ b/src/constants/api.ts @@ -32,6 +32,7 @@ export const NOTIFICATIONS_ENDPOINT: string = API_URL + 'notifications/'; export const DISCOVER_ENDPOINT: string = API_URL + 'discover/'; export const WAITLIST_USER_ENDPOINT: string = API_URL + 'waitlist-user/'; export const COMMENT_THREAD_ENDPOINT: string = API_URL + 'reply/'; +export const ADD_USER_BADGES: string = API_URL + 'suggested_people/add_badges/'; // Suggested People export const SP_USERS_ENDPOINT: string = API_URL + 'suggested_people/'; diff --git a/src/constants/constants.ts b/src/constants/constants.ts index 14bff6a7..72eb1b57 100644 --- a/src/constants/constants.ts +++ b/src/constants/constants.ts @@ -79,6 +79,14 @@ export const NOTIFICATION_GRADIENT = [ 'rgba(247, 248, 248, 1)', 'rgba(247, 248, 248, 0)', ]; +export const BADGE_GRADIENT_FIRST = [ + 'rgba(86, 63, 51, 1)', + 'rgba(236, 32, 39, 1)', +]; +export const BADGE_GRADIENT_REST = [ + 'rgba(78, 54, 41, 1)', + 'rgba(236, 32, 39, 1)', +]; export const SOCIAL_FONT_COLORS = { INSTAGRAM: INSTAGRAM_FONT_COLOR, diff --git a/src/constants/strings.ts b/src/constants/strings.ts index 7652fccd..93da6e59 100644 --- a/src/constants/strings.ts +++ b/src/constants/strings.ts @@ -14,7 +14,6 @@ export const ERROR_DELETED_OBJECT = 'Oh sad! Looks like the comment / moment was export const ERROR_DOUBLE_CHECK_CONNECTION = 'Please double-check your network connection and retry'; export const ERROR_DUP_OLD_PWD = 'You may not use a previously used password'; export const ERROR_EMAIL_IN_USE = 'Email already in use, please try another one'; -export const ERROR_PHONE_IN_USE = 'Phone already in use, please try another one'; export const ERROR_FAILED_LOGIN_INFO = 'Login failed, please try re-entering your login information'; export const ERROR_FAILED_TO_COMMENT = 'Unable to post comment, refresh and try again!'; export const ERROR_FAILED_TO_DELETE_COMMENT = 'Unable to delete comment, refresh and try again!'; @@ -28,20 +27,24 @@ export const ERROR_LINK = (str: string) => `Unable to link with ${str}, Please c export const ERROR_LOGIN = 'There was a problem logging you in, please refresh and try again'; export const ERROR_LOGIN_FAILED = 'Login failed. Check your username and password, and try again'; export const ERROR_NEXT_PAGE = 'There was a problem while loading the next page π, try again in a couple minutes'; +export const ERROR_NOT_ONBOARDED = 'You are now on waitlist, please enter your invitation code if you have one'; +export const ERROR_PHONE_IN_USE = 'Phone already in use, please try another one'; export const ERROR_PROFILE_CREATION_SHORT = 'Profile creation failed π'; export const ERROR_PWD_ACCOUNT = (str: string) => `Please make sure that the email / username entered is registered with us. You may contact our customer support at ${str}`; export const ERROR_REGISTRATION = (str: string) => `Registration failed π, ${str}`; -export const ERROR_SELECT_CLASS_YEAR = 'Please select your Class Year'; export const ERROR_SELECT_BIRTHDAY = 'Please select your birthday'; +export const ERROR_SELECT_CLASS_YEAR = 'Please select your Class Year'; export const ERROR_SELECT_GENDER = 'Please select your gender'; export const ERROR_SERVER_DOWN = 'mhm, looks like our servers are down, please refresh and try again in a few mins'; -export const ERROR_TWILIO_SERVER_ERROR = 'mhm, looks like that is an invalid phone number or our servers are down, please try again in a few mins'; export const ERROR_SOMETHING_WENT_WRONG = 'Oh dear, donβt worry someone will be held responsible for this error, In the meantime refresh the app'; export const ERROR_SOMETHING_WENT_WRONG_REFRESH = "Ha, looks like this one's on us, please refresh and try again"; export const ERROR_SOMETHING_WENT_WRONG_RELOAD = "You broke it, Just kidding! we don't know what happened... Please reload the app and try again"; +export const ERROR_TWILIO_SERVER_ERROR = 'mhm, looks like that is an invalid phone number or our servers are down, please try again in a few mins'; export const ERROR_UNABLE_TO_FIND_PROFILE = 'We were unable to find this profile. Please check username and try again'; export const ERROR_UNABLE_TO_VIEW_PROFILE = 'Unable to view this profile'; export const ERROR_UPLOAD = 'An error occurred while uploading. Please try again!'; +export const ERROR_UPLOAD_BADGES = 'Unable to upload your badges. Please retry'; +export const ERROR_BADGES_EXCEED_LIMIT = 'You can\'t have more than 5 badges!'; export const ERROR_UPLOAD_LARGE_PROFILE_PIC = "Can't have the first image seen on the profile be blank, please upload a large picture"; export const ERROR_UPLOAD_MOMENT = 'Unable to upload moment. Please retry'; export const ERROR_UPLOAD_SMALL_PROFILE_PIC = "Can't have a profile without a pic to represent you, please upload a small profile picture"; @@ -51,12 +54,11 @@ export const MOMENT_DELETED_MSG = 'Moment deleted....Some moments have to go, to export const NO_NEW_NOTIFICATIONS = 'You have no new notifications'; export const NO_RESULTS_FOUND = 'No Results Found!'; export const SUCCESS_CATEGORY_DELETE = 'Category successfully deleted, but its memory will live on'; +export const SUCCESS_INVITATION_CODE = 'Perfect! You entered a valid invitation code, you are now able to login and explore Tagg!'; export const SUCCESS_LINK = (str: string) => `Successfully linked ${str} π`; export const SUCCESS_PIC_UPLOAD = 'Beautiful, the picture was uploaded successfully!'; export const SUCCESS_PWD_RESET = 'Your password was reset successfully!'; export const SUCCESS_VERIFICATION_CODE_SENT = 'New verification code sent! Check your phone messages for your code'; -export const SUCCESS_INVITATION_CODE = 'Perfect! You entered a valid invitation code, you are now able to login and explore Tagg!'; -export const ERROR_NOT_ONBOARDED = 'You are now on waitlist, please enter your invitation code if you have one'; export const UP_TO_DATE = 'Up-to-Date!'; export const UPLOAD_MOMENT_PROMPT_ONE_MESSAGE = 'Post your first moment to\n continue building your digital\nidentity!'; export const UPLOAD_MOMENT_PROMPT_THREE_HEADER = 'Continue to build your profile'; diff --git a/src/routes/main/MainStackScreen.tsx b/src/routes/main/MainStackScreen.tsx index 04f73985..91ed2f70 100644 --- a/src/routes/main/MainStackScreen.tsx +++ b/src/routes/main/MainStackScreen.tsx @@ -7,6 +7,7 @@ import {normalize} from 'react-native-elements'; import BackIcon from '../../assets/icons/back-arrow.svg'; import { AnimatedTutorial, + BadgeSelection, CaptionScreen, CategorySelection, CreateCustomCategory, diff --git a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx index 85249034..737c503c 100644 --- a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx +++ b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackNavigator.tsx @@ -5,6 +5,7 @@ export type SuggestedPeopleOnboardingStackParams = { UploadPicture: { goTo: string; }; + BadgeSelection: undefined; }; export const SuggestedPeopleOnboardingStack = createStackNavigator<SuggestedPeopleOnboardingStackParams>(); diff --git a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx index 61cc694c..d1a6e5e1 100644 --- a/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx +++ b/src/routes/suggestedPeopleOnboarding/SuggestedPeopleOnboardingStackScreen.tsx @@ -3,6 +3,7 @@ import {SuggestedPeopleOnboardingStack} from './SuggestedPeopleOnboardingStackNa import { SuggestedPeopleWelcomeScreen, SuggestedPeopleUploadPictureScreen, + BadgeSelection, } from '../../screens'; import {SCREEN_WIDTH} from '../../utils'; import {headerBarOptions} from '../main'; @@ -30,6 +31,13 @@ const SuggestedPeopleOnboardingStackScreen: React.FC = () => { ...headerBarOptions('white', ''), }} /> + <SuggestedPeopleOnboardingStack.Screen + name="BadgeSelection" + component={BadgeSelection} + options={{ + ...headerBarOptions('white', ''), + }} + /> </SuggestedPeopleOnboardingStack.Navigator> ); }; diff --git a/src/routes/tabs/NavigationBar.tsx b/src/routes/tabs/NavigationBar.tsx index 49713d66..5d4f7cf2 100644 --- a/src/routes/tabs/NavigationBar.tsx +++ b/src/routes/tabs/NavigationBar.tsx @@ -19,9 +19,10 @@ const NavigationBar: React.FC = () => { (state: RootState) => state, ); - const [unreadNotificationsPresent, setUnreadNotificationsPresent] = useState< - boolean - >(false); + const [ + unreadNotificationsPresent, + setUnreadNotificationsPresent, + ] = useState<boolean>(false); useEffect(() => { const determine = async () => { diff --git a/src/screens/badge/BadgeItem.tsx b/src/screens/badge/BadgeItem.tsx new file mode 100644 index 00000000..d7c0b74a --- /dev/null +++ b/src/screens/badge/BadgeItem.tsx @@ -0,0 +1,84 @@ +import React from 'react'; +import {View, Text, StyleSheet, Image, ImageSourcePropType} from 'react-native'; +import {SCREEN_WIDTH, normalize} from '../../utils'; +import LinearGradient from 'react-native-linear-gradient'; +import {BADGE_GRADIENT_FIRST, BADGE_GRADIENT_REST} from '../../constants'; +import {TouchableOpacity} from 'react-native-gesture-handler'; + +interface BadgeItemProps { + title: string; + resourcePath: ImageSourcePropType; + index: Number; + selected: boolean; + onSelection: (ikey: string) => void; +} + +const BadgeItem: React.FC<BadgeItemProps> = ({ + title, + resourcePath, + selected, + index, + onSelection, +}) => { + return ( + <TouchableOpacity onPress={() => onSelection(title)}> + <LinearGradient + colors={index === 0 ? BADGE_GRADIENT_FIRST : BADGE_GRADIENT_REST} + useAngle={true} + angle={136.69} + style={styles.item}> + <View + style={ + selected ? styles.selectedDetailContainer : styles.detailContainer + }> + <Image source={resourcePath} style={styles.imageStyles} /> + <View style={styles.textContainer}> + <Text style={styles.title}>{title}</Text> + </View> + </View> + </LinearGradient> + </TouchableOpacity> + ); +}; + +const styles = StyleSheet.create({ + item: { + width: SCREEN_WIDTH / 3 - 20, + height: SCREEN_WIDTH / 3 - 20, + marginLeft: 15, + marginBottom: 12, + borderRadius: 8, + }, + detailContainer: { + flexGrow: 1, + justifyContent: 'center', + alignItems: 'center', + borderWidth: 3, + borderRadius: 8, + borderColor: 'transparent', + }, + selectedDetailContainer: { + flexGrow: 1, + justifyContent: 'center', + alignItems: 'center', + borderWidth: 3, + borderColor: 'white', + borderRadius: 8, + }, + imageStyles: { + width: '31%', + height: '31%', + marginTop: '11%', + }, + textContainer: {marginTop: '16%'}, + title: { + fontSize: normalize(15), + fontWeight: '500', + lineHeight: normalize(17.9), + textAlign: 'center', + color: 'white', + marginHorizontal: '2%', + }, +}); + +export default BadgeItem; diff --git a/src/screens/badge/BadgeList.tsx b/src/screens/badge/BadgeList.tsx new file mode 100644 index 00000000..f3e96d60 --- /dev/null +++ b/src/screens/badge/BadgeList.tsx @@ -0,0 +1,57 @@ +import React from 'react'; +import {SectionList, StyleSheet} from 'react-native'; +import {SCREEN_HEIGHT} from '../../utils'; +import BadgeItem from './BadgeItem'; +import BadgeHeader from './BadgeListHeader'; + +interface BadgeListProps { + data: any[]; + selectedBadges: any[]; + selectKey: (ikey: string) => void; +} + +const BadgeList: React.FC<BadgeListProps> = ({ + data, + selectedBadges, + selectKey, +}) => { + return ( + <SectionList + stickySectionHeadersEnabled={false} + style={{height: SCREEN_HEIGHT * 0.8}} + contentContainerStyle={styles.listContainer} + sections={data} + keyExtractor={(item, index) => item + index} + extraData={selectedBadges} + renderItem={({item: {badgeName, badgeImage}, index}) => { + return ( + <BadgeItem + selected={selectedBadges.includes(badgeName)} + onSelection={selectKey} + title={badgeName} + resourcePath={badgeImage} + index={index} + /> + ); + }} + renderSectionHeader={({section: {title}}) => ( + <BadgeHeader title={title} /> + )} + /> + ); +}; + +const styles = StyleSheet.create({ + listContainer: { + flexDirection: 'row', + flexWrap: 'wrap', + alignItems: 'center', + flexGrow: 1, + paddingBottom: SCREEN_HEIGHT * 0.1, + }, + scrollViewStyles: { + paddingBottom: SCREEN_HEIGHT * 0.5, + }, +}); + +export default BadgeList; diff --git a/src/screens/badge/BadgeListHeader.tsx b/src/screens/badge/BadgeListHeader.tsx new file mode 100644 index 00000000..27335dfb --- /dev/null +++ b/src/screens/badge/BadgeListHeader.tsx @@ -0,0 +1,33 @@ +import React from 'react'; +import {View, Text, StyleSheet} from 'react-native'; +import {SCREEN_WIDTH, normalize} from '../../utils'; + +interface BadgeHeaderProps { + title: String; +} + +const BadgeListHeader: React.FC<BadgeHeaderProps> = ({title}) => { + return ( + <View style={styles.headerContainer}> + <Text style={styles.header}>{title}</Text> + </View> + ); +}; + +const styles = StyleSheet.create({ + headerContainer: { + width: SCREEN_WIDTH * 0.75, + marginHorizontal: SCREEN_WIDTH * 0.125, + marginBottom: '2%', + marginTop: '4%', + }, + header: { + fontSize: normalize(20), + fontWeight: '700', + lineHeight: normalize(23.87), + color: '#fff', + textAlign: 'center', + }, +}); + +export default BadgeListHeader; diff --git a/src/screens/badge/BadgeScreenHeader.tsx b/src/screens/badge/BadgeScreenHeader.tsx new file mode 100644 index 00000000..fd250585 --- /dev/null +++ b/src/screens/badge/BadgeScreenHeader.tsx @@ -0,0 +1,42 @@ +import React from 'react'; +import {Image, StyleSheet, Text, View} from 'react-native'; +import {normalize} from '../../utils'; + +const BadgeScreenHeader: React.FC = () => { + return ( + <View style={styles.container}> + <Image source={require('../../assets/images/badges/brown_badge.png')} /> + <View style={styles.universityTextContainer}> + <Text style={styles.universityText}>Brown University Badges</Text> + </View> + <View style={styles.searchTextContainer}> + <Text style={styles.searchText}> + Search for organizations you are a part of! + </Text> + </View> + </View> + ); +}; + +const styles = StyleSheet.create({ + container: { + alignItems: 'center', + marginBottom: '1%', + }, + universityTextContainer: {marginTop: 12}, + universityText: { + fontSize: normalize(20), + fontWeight: '700', + lineHeight: normalize(23.87), + color: 'white', + }, + searchTextContainer: {marginTop: 6}, + searchText: { + fontSize: normalize(15), + fontWeight: '500', + lineHeight: normalize(17.9), + color: 'white', + }, +}); + +export default BadgeScreenHeader; diff --git a/src/screens/badge/BadgeSelection.tsx b/src/screens/badge/BadgeSelection.tsx new file mode 100644 index 00000000..4754960b --- /dev/null +++ b/src/screens/badge/BadgeSelection.tsx @@ -0,0 +1,266 @@ +import AsyncStorage from '@react-native-community/async-storage'; +import {StackNavigationProp} from '@react-navigation/stack'; +import React, {useEffect, useState} from 'react'; +import {Alert, SafeAreaView, StatusBar, StyleSheet, View} from 'react-native'; +import {Text} from 'react-native-animatable'; +import {TouchableOpacity} from 'react-native-gesture-handler'; +import LinearGradient from 'react-native-linear-gradient'; +import {useDispatch} from 'react-redux'; +import {ADD_USER_BADGES, BACKGROUND_GRADIENT_MAP} from '../../constants'; +import { + ERROR_BADGES_EXCEED_LIMIT, + ERROR_UPLOAD_BADGES, +} from '../../constants/strings'; +import {suggestedPeopleBadgesFinished} from '../../store/actions'; +import {BackgroundGradientType} from '../../types'; +import {SCREEN_HEIGHT, StatusBarHeight} from '../../utils'; +import BadgeList from './BadgeList'; +import BadgeScreenHeader from './BadgeScreenHeader'; + +/** + * Home Screen for displaying Tagg Badge Selections + **/ + +const BadgeImages = { + football: require('../../assets/images/badges/football.png'), + track: require('../../assets/images/badges/track.png'), + volleyball: require('../../assets/images/badges/volleyball.png'), + lax: require('../../assets/images/badges/brown_badge.png'), + fieldHockey: require('../../assets/images/badges/field_hockey.png'), + gymnastics: require('../../assets/images/badges/gymnastics.png'), + hockey: require('../../assets/images/badges/hockey.png'), + baseball: require('../../assets/images/badges/baseball.png'), + basketball: require('../../assets/images/badges/basketball.png'), + kappadelta: require('../../assets/images/badges/kappa_delta.png'), + alphachiomega: require('../../assets/images/badges/alpha_chi_omega.png'), + deltagamma: require('../../assets/images/badges/delta_gamma.png'), + sigma: require('../../assets/images/badges/sigma.png'), + thetaalpha: require('../../assets/images/badges/theta_alpha.png'), + deltaphi: require('../../assets/images/badges/delta_phi.png'), + kappaalphapsi: require('../../assets/images/badges/kappa_alpha_psi.png'), + alphaphialpha: require('../../assets/images/badges/alpha_phi_alpha.png'), + betaomegachi: require('../../assets/images/badges/beta_omega_chi.png'), +}; + +const DATA = [ + { + title: 'Athletics', + data: [ + { + badgeName: 'Brown Football', + badgeImage: BadgeImages.football, + }, + { + badgeName: 'Brown Track', + badgeImage: BadgeImages.track, + }, + { + badgeName: 'Brown Volleyball', + badgeImage: BadgeImages.volleyball, + }, + { + badgeName: 'Brown LAX', + badgeImage: BadgeImages.lax, + }, + { + badgeName: 'Brown Field Hockey', + badgeImage: BadgeImages.fieldHockey, + }, + { + badgeName: 'Brown Gymnastics', + badgeImage: BadgeImages.gymnastics, + }, + { + badgeName: 'Brown Hockey', + badgeImage: BadgeImages.hockey, + }, + { + badgeName: 'Brown Baseball', + badgeImage: BadgeImages.baseball, + }, + { + badgeName: 'Brown Basketball', + badgeImage: BadgeImages.basketball, + }, + ], + }, + + { + title: 'Sorority', + data: [ + { + badgeName: 'Kappa Delta', + badgeImage: BadgeImages.kappadelta, + }, + { + badgeName: 'Alpha Chi Omega', + badgeImage: BadgeImages.alphachiomega, + }, + { + badgeName: 'Delta Gamma', + badgeImage: BadgeImages.deltagamma, + }, + ], + }, + + { + title: 'Fraternity', + data: [ + { + badgeName: 'Sigma', + badgeImage: BadgeImages.sigma, + }, + { + badgeName: 'Theta Alpha', + badgeImage: BadgeImages.thetaalpha, + }, + { + badgeName: 'Delta Phi', + badgeImage: BadgeImages.deltaphi, + }, + ], + }, + { + title: 'Historically Black Fraternities', + data: [ + { + badgeName: 'Kappa Alpha Psi', + badgeImage: BadgeImages.kappadelta, + }, + { + badgeName: 'Alpha Phi Alpha', + badgeImage: BadgeImages.alphaphialpha, + }, + { + badgeName: 'Beta Omega Chi', + badgeImage: BadgeImages.betaomegachi, + }, + ], + }, +]; + +type BadgeSelectionParamList = { + BadgeList: any[]; +}; + +type BadgeSelectionScreenNavigationProp = StackNavigationProp< + BadgeSelectionParamList, + 'BadgeList' +>; + +type BadgeSelectionProps = { + navigation: BadgeSelectionScreenNavigationProp; +}; + +const BadgeSelection: React.FC<BadgeSelectionProps> = ({navigation}) => { + const [canSubmit, setCanSubmit] = useState(false); + navigation.setOptions({ + headerRight: () => ( + <TouchableOpacity + style={styles.rightButtonContainer} + onPress={() => { + if (canSubmit) { + uploadUserSelection(); + } + }}> + <Text style={styles.rightButton}>{canSubmit ? 'Done' : 'Skip'}</Text> + </TouchableOpacity> + ), + }); + + const [selectedBadges, setSelectedBadges] = useState<string[]>([]); + const selectKey = (key: string) => { + if (selectedBadges.includes(key)) { + const selectedBadgesArray = [...selectedBadges]; + const itemIndex = selectedBadgesArray.indexOf(key); + if (itemIndex > -1) { + selectedBadgesArray.splice(itemIndex, 1); + } + setSelectedBadges(selectedBadgesArray); + } else { + const selectedBadgesArray = [...selectedBadges, key]; + setSelectedBadges(selectedBadgesArray); + } + }; + const dispatch = useDispatch(); + useEffect(() => { + setCanSubmit(selectedBadges.length !== 0); + }, [selectedBadges]); + + const uploadUserSelection = async () => { + try { + const token = await AsyncStorage.getItem('token'); + const form = new FormData(); + form.append('badges', JSON.stringify(selectedBadges)); + const response = await fetch(ADD_USER_BADGES, { + method: 'POST', + headers: { + 'Content-Type': 'multipart/form-data', + Authorization: 'Token ' + token, + }, + body: form, + }); + if (response.status === 400) { + Alert.alert(ERROR_BADGES_EXCEED_LIMIT); + return; + } + dispatch(suggestedPeopleBadgesFinished()); + } catch (error) { + console.log(error); + Alert.alert(ERROR_UPLOAD_BADGES); + } + }; + + return ( + <LinearGradient + colors={BACKGROUND_GRADIENT_MAP[BackgroundGradientType.Dark]} + style={styles.container}> + <StatusBar barStyle={'light-content'} /> + <SafeAreaView> + <View style={styles.listContainer}> + <BadgeScreenHeader /> + {/* filter not working, comment out for now */} + {/* <SearchBar + style={styles.searchBarStyle} + onCancel={() => {}} + top={Animated.useValue(0)} + /> */} + <BadgeList + data={DATA} + selectedBadges={selectedBadges} + selectKey={selectKey} + /> + </View> + </SafeAreaView> + </LinearGradient> + ); +}; + +const styles = StyleSheet.create({ + container: { + flex: 1, + }, + searchBarStyle: { + width: '95%', + alignSelf: 'center', + marginTop: SCREEN_HEIGHT * 0.05, + }, + viewContainer: {marginTop: StatusBarHeight}, + listContainer: {marginTop: SCREEN_HEIGHT * 0.05}, + rightButtonContainer: {marginRight: 24}, + rightButton: { + color: '#FFFFFF', + fontWeight: 'bold', + fontSize: 15, + lineHeight: 18, + }, + leftButtonContainer: {marginLeft: 24}, + leftButton: { + color: '#FFFFFF', + fontWeight: '500', + fontSize: 15, + lineHeight: 18, + }, +}); + +export default BadgeSelection; diff --git a/src/screens/badge/index.ts b/src/screens/badge/index.ts new file mode 100644 index 00000000..217aa7e8 --- /dev/null +++ b/src/screens/badge/index.ts @@ -0,0 +1,5 @@ +export {default as BadgeSelection} from './BadgeSelection'; +export {default as BadgeItem} from './BadgeItem'; +export {default as BadgeListHeader} from './BadgeListHeader'; +export {default as BadgeList} from './BadgeList'; +export {default as BadgeScreenHeader} from './BadgeScreenHeader'; diff --git a/src/screens/index.ts b/src/screens/index.ts index faf3d0b7..50ada3d1 100644 --- a/src/screens/index.ts +++ b/src/screens/index.ts @@ -4,3 +4,4 @@ export * from './profile'; export * from './search'; export * from './suggestedPeople'; export * from './suggestedPeopleOnboarding'; +export * from './badge'; diff --git a/src/screens/profile/SocialMediaTaggs.tsx b/src/screens/profile/SocialMediaTaggs.tsx index 45d417a6..466ba509 100644 --- a/src/screens/profile/SocialMediaTaggs.tsx +++ b/src/screens/profile/SocialMediaTaggs.tsx @@ -12,7 +12,12 @@ import { } from '../../components'; import {AVATAR_GRADIENT} from '../../constants'; import {ProfileStackParams} from '../../routes'; -import {SimplePostType, TwitterPostType, SocialAccountType, ScreenType} from '../../types'; +import { + SimplePostType, + TwitterPostType, + SocialAccountType, + ScreenType, +} from '../../types'; import {AvatarHeaderHeight, SCREEN_HEIGHT} from '../../utils'; import {useSelector} from 'react-redux'; import {RootState} from '../../store/rootReducer'; diff --git a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx index c587e930..bb8aaccf 100644 --- a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx +++ b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx @@ -76,6 +76,7 @@ const SuggestedPeopleUploadPictureScreen: React.FC = ({route}) => { const success = await sendSuggestedPeoplePhoto(image); if (success) { dispatch(uploadedSuggestedPeoplePhoto(image)); + navigation.push('BadgeSelection'); } else { Alert.alert(ERROR_UPLOAD); } diff --git a/src/services/FCMService.ts b/src/services/FCMService.ts index b6cd18af..84f30f09 100644 --- a/src/services/FCMService.ts +++ b/src/services/FCMService.ts @@ -134,7 +134,7 @@ class FCMService { // TODO: Get {name, params} of screen when user must be redirected to // Redirected to Notification Screen for now const redirectTo = 'Notifications'; - /* TODO: Check login status and redirect user/store screen to async as + /* TODO: Check login status and redirect user/store screen to async as initialRoute for NavigationBar Stack */ RootNavigation.navigate(redirectTo); } diff --git a/src/services/ReportingService.ts b/src/services/ReportingService.ts index 8c0a4bfb..76883e81 100644 --- a/src/services/ReportingService.ts +++ b/src/services/ReportingService.ts @@ -3,10 +3,7 @@ import {REPORT_ISSUE_ENDPOINT} from '../constants'; import {Alert} from 'react-native'; import AsyncStorage from '@react-native-community/async-storage'; -import { - ERROR_SOMETHING_WENT_WRONG, - MARKED_AS_MSG, -} from '../constants/strings'; +import {ERROR_SOMETHING_WENT_WRONG, MARKED_AS_MSG} from '../constants/strings'; export const sendReport = async ( moment_id: string, diff --git a/src/store/actions/user.ts b/src/store/actions/user.ts index a9f9d945..4f1da47c 100644 --- a/src/store/actions/user.ts +++ b/src/store/actions/user.ts @@ -174,6 +174,18 @@ export const uploadedSuggestedPeoplePhoto = ( type: setSuggestedPeopleImage.type, payload: {suggestedPeopleImage: imageUri}, }); + } catch (error) { + console.log(error); + } +}; + +export const suggestedPeopleBadgesFinished = (): ThunkAction< + Promise<void>, + RootState, + unknown, + Action<string> +> => async (dispatch) => { + try { dispatch({ type: setSuggestedPeopleLinked.type, payload: {suggested_people_linked: 1}, diff --git a/src/store/reducers/userBlockReducer.ts b/src/store/reducers/userBlockReducer.ts index 90e4a04a..64bdda30 100644 --- a/src/store/reducers/userBlockReducer.ts +++ b/src/store/reducers/userBlockReducer.ts @@ -11,8 +11,9 @@ const userBlockSlice = createSlice({ updateBlockedList: (state, action) => { const {isBlocked, data} = action.payload; - if (!isBlocked) state.blockedUsers.push(data); - else { + if (!isBlocked) { + state.blockedUsers.push(data); + } else { state.blockedUsers = state.blockedUsers.filter( (user) => user.username != data.username, ); diff --git a/src/utils/common.ts b/src/utils/common.ts index 50f96493..30122e79 100644 --- a/src/utils/common.ts +++ b/src/utils/common.ts @@ -88,7 +88,9 @@ export const haveUnreadNotifications = async ( continue; } const unread = lastViewed ? lastViewed.diff(notificationDate) < 0 : false; - if (unread) return true; + if (unread) { + return true; + } } return false; }; |
