Merge branch 'master' into tma-701-private-account-banner

# Conflicts:
#	src/constants/strings.ts

9 files changed, 144 insertions, 44 deletions

diff --git a/src/components/onboarding/UniversitySelection.tsx b/src/components/onboarding/UniversitySelection.tsx
new file mode 100644
index 00000000..92bec47f
--- /dev/null
+++ b/src/components/onboarding/UniversitySelection.tsx
@@ -0,0 +1,97 @@
+import React from 'react';
+import {Image, ImageSourcePropType, StyleSheet, Text, View} from 'react-native';
+import {TouchableOpacity} from 'react-native-gesture-handler';
+import {UniversityType} from '../../types';
+import {normalize} from '../../utils';
+
+interface UniversitySelectionProps {
+  selected: UniversityType;
+  setSelected: (selected: UniversityType) => void;
+}
+
+const UniversitySelection: React.FC<UniversitySelectionProps> = ({
+  selected,
+  setSelected,
+}) => {
+  const crestData = [
+    {
+      imagePath: require('../../assets/universities/brown.png'),
+      title: 'Brown',
+      key: UniversityType.Brown,
+    },
+    {
+      imagePath: require('../../assets/universities/cornell.png'),
+      title: 'Cornell',
+      key: UniversityType.Cornell,
+    },
+    // {
+    //   imagePath: require('../../assets/universities/harvard.png'),
+    //   title: 'Harvard',
+    //   key: UniversityType.Harvard,
+    // },
+  ];
+  const renderButton = (
+    imagePath: ImageSourcePropType,
+    title: string,
+    key: UniversityType,
+  ) => (
+    <TouchableOpacity
+      style={
+        selected === key ? styles.crestContainerSelected : styles.crestContainer
+      }
+      onPress={() => setSelected(key)}>
+      <Image source={imagePath} style={styles.crest} />
+      <Text style={styles.crestLabel}>{title}</Text>
+    </TouchableOpacity>
+  );
+  return (
+    <>
+      <Text style={styles.title}>University Badge</Text>
+      <View style={styles.container}>
+        {crestData.map((data) =>
+          renderButton(data.imagePath, data.title, data.key),
+        )}
+      </View>
+    </>
+  );
+};
+
+const styles = StyleSheet.create({
+  title: {
+    color: 'white',
+    fontSize: normalize(15),
+    lineHeight: normalize(18),
+    fontWeight: '700',
+    marginBottom: 10,
+  },
+  container: {
+    flexDirection: 'row',
+    justifyContent: 'space-around',
+    marginBottom: 10,
+  },
+  crest: {
+    height: normalize(25),
+    aspectRatio: 31 / 38,
+    marginBottom: 5,
+  },
+  crestContainer: {
+    alignItems: 'center',
+    padding: 10,
+  },
+  crestContainerSelected: {
+    alignItems: 'center',
+    borderWidth: 2,
+    borderColor: 'white',
+    borderRadius: 5,
+    padding: 8,
+    backgroundColor: '#fff2',
+  },
+  crestLabel: {
+    color: 'white',
+    fontSize: normalize(15),
+    lineHeight: normalize(18),
+    fontWeight: '500',
+  },
+});
+
+export default UniversitySelection;
diff --git a/src/components/onboarding/index.ts b/src/components/onboarding/index.ts
index b790933f..fdb85090 100644
--- a/src/components/onboarding/index.ts
+++ b/src/components/onboarding/index.ts
@@ -10,3 +10,4 @@ export {default as TaggDropDown} from './TaggDropDown';
 export {default as SocialMediaLinker} from './SocialMediaLinker';
 export {default as LinkSocialMedia} from './LinkSocialMedia';
 export {default as MomentCategory} from './MomentCategory';
+export {default as UniversitySelection} from './UniversitySelection';
diff --git a/src/components/profile/ProfileHeader.tsx b/src/components/profile/ProfileHeader.tsx
index b5dda399..2c623c2b 100644
--- a/src/components/profile/ProfileHeader.tsx
+++ b/src/components/profile/ProfileHeader.tsx
@@ -24,7 +24,7 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({
   handleBlockUnblock,
 }) => {
   const {
-    profile: {name = '', university_class = 2021} = {},
+    profile: {name = '', university_class = 2021, university},
     user: {username: userXName = ''},
   } = useSelector((state: RootState) =>
     userXId ? state.userX[screenType][userXId] : state.user,
@@ -59,10 +59,7 @@ const ProfileHeader: React.FC<ProfileHeaderProps> = ({
           )}
           <View style={styles.friendsAndUniversity}>
             <FriendsCount screenType={screenType} userXId={userXId} />
-            <UniversityIcon
-              university="brown"
-              university_class={university_class}
-            />
+            <UniversityIcon {...{university, university_class}} />
           </View>
         </View>
       </View>
diff --git a/src/components/profile/ProfileMoreInfoDrawer.tsx b/src/components/profile/ProfileMoreInfoDrawer.tsx
index 2fec5cca..a77a2e84 100644
--- a/src/components/profile/ProfileMoreInfoDrawer.tsx
+++ b/src/components/profile/ProfileMoreInfoDrawer.tsx
@@ -24,11 +24,9 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
   const {setIsOpen, userXId, isBlocked, handleBlockUnblock, userXName} = props;
   const {
     user: {userId, username},
-  } = useSelector((state: RootState) => state.user);
+    profile,
+  } = useSelector((state: RootState) => state?.user);
   const isOwnProfile = !userXId || userXName === username;
-  const {suggested_people_linked} = useSelector(
-    (state: RootState) => state.user.profile,
-  );
 
   const goToEditProfile = () => {
     navigation.push('EditProfile', {
@@ -39,7 +37,7 @@ const ProfileMoreInfoDrawer: React.FC<ProfileMoreInfoDrawerProps> = (props) => {
   };
 
   const goToUpdateSPProfile = () => {
-    if (suggested_people_linked === 0) {
+    if (profile.suggested_people_linked === 0) {
       Alert.alert(ERROR_ATTEMPT_EDIT_SP);
     } else {
       // Sending undefined for updatedSelectedBadges to mark that there was no update yet
diff --git a/src/components/profile/UniversityIcon.tsx b/src/components/profile/UniversityIcon.tsx
index 48cfe3dc..4cb1abe6 100644
--- a/src/components/profile/UniversityIcon.tsx
+++ b/src/components/profile/UniversityIcon.tsx
@@ -1,10 +1,11 @@
 import React from 'react';
 import {ImageStyle, StyleProp, StyleSheet, ViewProps} from 'react-native';
 import {Image, Text, View} from 'react-native-animatable';
-import {getUniversityClass, normalize} from '../../utils';
+import {getUniversityBadge, getUniversityClass, normalize} from '../../utils';
+import {UniversityType} from '../../types';
 
 export interface UniversityIconProps extends ViewProps {
-  university: string;
+  university: UniversityType;
   university_class?: number;
   imageStyle?: StyleProp<ImageStyle>;
 }
@@ -18,19 +19,12 @@ const UniversityIcon: React.FC<UniversityIconProps> = ({
   university_class,
   imageStyle,
 }) => {
-  var universityIcon;
-  switch (university) {
-    case 'brown':
-      universityIcon = require('../../assets/universities/brown.png');
-      break;
-    default:
-      universityIcon = require('../../assets/universities/brown.png');
-      break;
-  }
-
   return (
     <View style={[styles.container, style]}>
-      <Image source={universityIcon} style={[styles.icon, imageStyle]} />
+      <Image
+        source={getUniversityBadge(university, 'Crest')}
+        style={[styles.icon, imageStyle]}
+      />
       {university_class && (
         <Text style={styles.univClass}>
           {getUniversityClass(university_class)}
diff --git a/src/components/search/SearchBar.tsx b/src/components/search/SearchBar.tsx
index 62bda77e..4824b56f 100644
--- a/src/components/search/SearchBar.tsx
+++ b/src/components/search/SearchBar.tsx
@@ -1,19 +1,21 @@
-import React, {useState, useEffect} from 'react';
+import React, {useEffect, useState} from 'react';
 import {
+  Keyboard,
+  NativeSyntheticEvent,
   StyleSheet,
-  TextInput,
-  TouchableOpacity,
   Text,
-  View,
+  TextInput,
   TextInputProps,
-  Keyboard,
-  NativeSyntheticEvent,
   TextInputSubmitEditingEventData,
+  TouchableOpacity,
+  View,
 } from 'react-native';
+import {normalize} from 'react-native-elements';
 import Animated, {interpolate} from 'react-native-reanimated';
 import Icon from 'react-native-vector-icons/Feather';
-import {normalize} from 'react-native-elements';
-import {SCREEN_HEIGHT, getSearchSuggestions} from '../../utils';
+import {useSelector} from 'react-redux';
+import {RootState} from '../../store/rootReducer';
+import {getSearchSuggestions, SCREEN_HEIGHT} from '../../utils';
 
 const AnimatedIcon = Animated.createAnimatedComponent(Icon);
 
@@ -37,9 +39,10 @@ const SearchBar: React.FC<SearchBarProps> = ({
     e.preventDefault();
     Keyboard.dismiss();
   };
+  const {university} = useSelector((state: RootState) => state.user.profile);
   const DEFAULT_PLACEHOLDER: string = 'Search';
   // the list of suggestions to cycle through. TODO: get this from the backend
-  const SEARCH_SUGGESTIONS: string[] = getSearchSuggestions();
+  const SEARCH_SUGGESTIONS: string[] = getSearchSuggestions(university);
   /*
    * index & id of current placeholder, used in selecting next placeholder. -1
    * indicates DEFAULT_PLACEHOLDER. TODO: make it appear more random by tracking
diff --git a/src/components/search/SearchResultCell.tsx b/src/components/search/SearchResultCell.tsx
index 9a8216e5..5a6ea110 100644
--- a/src/components/search/SearchResultCell.tsx
+++ b/src/components/search/SearchResultCell.tsx
@@ -2,7 +2,7 @@ import {useNavigation} from '@react-navigation/native';
 import React, {useEffect, useState} from 'react';
 import {Alert, Image, StyleSheet, Text, View} from 'react-native';
 import {TouchableOpacity} from 'react-native-gesture-handler';
-import {useDispatch, useStore} from 'react-redux';
+import {useDispatch, useSelector, useStore} from 'react-redux';
 import {ERROR_UNABLE_TO_VIEW_PROFILE} from '../../constants/strings';
 import {loadImageFromURL} from '../../services';
 import {RootState} from '../../store/rootReducer';
@@ -10,11 +10,13 @@ import {
   CategoryPreviewType,
   ProfilePreviewType,
   ScreenType,
+  UniversityType,
   UserType,
 } from '../../types';
 import {
   addCategoryToRecentlySearched,
   addUserToRecentlySearched,
+  getUniversityBadge,
   normalize,
   SCREEN_WIDTH,
 } from '../../utils';
@@ -43,6 +45,9 @@ const SearchResultsCell: React.FC<SearchResults> = ({
   loggedInUser,
 }) => {
   const [avatar, setAvatar] = useState<string | undefined>(undefined);
+
+  const {university} = useSelector((state: RootState) => state.user.profile);
+
   useEffect(() => {
     (async () => {
       if (thumbnail_url !== undefined) {
@@ -143,17 +148,17 @@ const SearchResultsCell: React.FC<SearchResults> = ({
     return require('../../assets/images/search.png');
   };
 
-  const universityIcon = () => {
-    return require('../../assets/images/bwbadges.png');
-  };
-
   const categoryCell = () => {
     return (
       <TouchableOpacity style={styles.cellContainer} onPress={onPressCategory}>
         <View style={[styles.imageContainer, styles.categoryBackground]}>
           <Image
             resizeMode="contain"
-            source={category === 'Brown' ? universityIcon() : searchIcon()}
+            source={
+              category in UniversityType
+                ? getUniversityBadge(university, 'Search')
+                : searchIcon()
+            }
             style={styles.categoryImage}
           />
         </View>
diff --git a/src/components/suggestedPeople/BadgesDropdown.tsx b/src/components/suggestedPeople/BadgesDropdown.tsx
index 99c03057..bc4e7a54 100644
--- a/src/components/suggestedPeople/BadgesDropdown.tsx
+++ b/src/components/suggestedPeople/BadgesDropdown.tsx
@@ -4,11 +4,12 @@ import {Image, StyleSheet} from 'react-native';
 import {TouchableOpacity} from 'react-native-gesture-handler';
 import LinearGradient from 'react-native-linear-gradient';
 import Animated, {Easing} from 'react-native-reanimated';
-import {UniversityBadge} from 'src/types';
+import {UniversityType, UniversityBadge} from '../../types';
 import {UniversityIcon} from '..';
 import {normalize, SCREEN_WIDTH} from '../../utils';
 import UniversityIconClicked from './UniversityIconClicked';
 interface BadgesDropdownProps {
+  university: UniversityType;
   localBadges: {
     badge: UniversityBadge;
     img: string;
@@ -17,6 +18,7 @@ interface BadgesDropdownProps {
 }
 
 const BadgesDropdown: React.FC<BadgesDropdownProps> = ({
+  university,
   localBadges,
   badges,
 }) => {
@@ -81,13 +83,13 @@ const BadgesDropdown: React.FC<BadgesDropdownProps> = ({
         }}>
         {displayBadges ? (
           <UniversityIconClicked
-            university="brown"
+            university={university}
             style={styles.universityIconContainer}
             imageStyle={{width: normalize(31), height: normalize(38)}}
           />
         ) : (
           <UniversityIcon
-            university="brown"
+            university={university}
             style={styles.universityIconContainer}
             imageStyle={{width: normalize(31), height: normalize(38)}}
           />
diff --git a/src/components/suggestedPeople/UniversityIconClicked.tsx b/src/components/suggestedPeople/UniversityIconClicked.tsx
index bde4e17f..41e27c8e 100644
--- a/src/components/suggestedPeople/UniversityIconClicked.tsx
+++ b/src/components/suggestedPeople/UniversityIconClicked.tsx
@@ -2,9 +2,9 @@ import React from 'react';
 import {ImageStyle, StyleProp, StyleSheet, ViewProps} from 'react-native';
 import {Image, Text, View} from 'react-native-animatable';
 import {getUniversityClass, normalize} from '../../utils';
-
+import {UniversityType} from '../../types';
 export interface UniversityIconClickedProps extends ViewProps {
-  university: string;
+  university: UniversityType;
   university_class?: number;
   imageStyle?: StyleProp<ImageStyle>;
 }
@@ -20,7 +20,10 @@ const UniversityIconClicked: React.FC<UniversityIconClickedProps> = ({
 }) => {
   var universityIcon;
   switch (university) {
-    case 'brown':
+    case UniversityType.Cornell:
+      universityIcon = require('../../assets/universities/cornell-clicked.png');
+      break;
+    case UniversityType.Brown:
       universityIcon = require('../../assets/universities/brown-clicked.png');
       break;
     default: