making call on badge selection to get badges

3 files changed, 25 insertions, 35 deletions

diff --git a/src/routes/main/MainStackNavigator.tsx b/src/routes/main/MainStackNavigator.tsx
index 6992f83f..fea375f6 100644
--- a/src/routes/main/MainStackNavigator.tsx
+++ b/src/routes/main/MainStackNavigator.tsx
@@ -81,7 +81,6 @@ export type MainStackParams = {
   };
   BadgeSelection: {
     editing: boolean;
-    prevSelectedBadges: string[];
   };
   MutualBadgeHolders: {
     badge_id: string;
diff --git a/src/screens/badge/BadgeSelection.tsx b/src/screens/badge/BadgeSelection.tsx
index a67206c4..755bb581 100644
--- a/src/screens/badge/BadgeSelection.tsx
+++ b/src/screens/badge/BadgeSelection.tsx
@@ -4,9 +4,13 @@ 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 {useDispatch, useSelector} from 'react-redux';
 import {MainStackParams} from '../../routes';
-import {addBadgesService, updateBadgesService} from '../../services';
+import {
+  addBadgesService,
+  getSuggestedPeopleProfile,
+  updateBadgesService,
+} from '../../services';
 import {BACKGROUND_GRADIENT_MAP} from '../../constants';
 import {BADGE_DATA} from '../../constants/badges';
 import {ERROR_BADGES_EXCEED_LIMIT} from '../../constants/strings';
@@ -16,6 +20,7 @@ import {SCREEN_HEIGHT, StatusBarHeight} from '../../utils';
 import BadgeList from './BadgeList';
 import BadgeScreenHeader from './BadgeScreenHeader';
 import {useNavigation} from '@react-navigation/native';
+import {RootState} from '../../store/rootReducer';
 
 /**
  * Home Screen for displaying Tagg Badge Selections
@@ -28,14 +33,27 @@ type BadgeSelectionProps = {
 };
 
 const BadgeSelection: React.FC<BadgeSelectionProps> = ({route}) => {
-  const prevSelectedBadges = route.params.prevSelectedBadges;
+  const {userId: loggedInUserId} = useSelector(
+    (state: RootState) => state.user.user,
+  );
   const [selectedBadges, setSelectedBadges] = useState<string[]>([]);
   const dispatch = useDispatch();
   const navigation = useNavigation();
 
   useEffect(() => {
-    setSelectedBadges(prevSelectedBadges);
-  }, [prevSelectedBadges]);
+    const loadData = async () => {
+      const response = await getSuggestedPeopleProfile(loggedInUserId);
+      if (response) {
+        const data = response.badges;
+        let extractedBadgeNames: string[] = [];
+        data.forEach((badge) => {
+          extractedBadgeNames.push(badge.name);
+        });
+        setSelectedBadges(extractedBadgeNames);
+      }
+    };
+    loadData();
+  }, []);
 
   navigation.setOptions({
     headerRight: () => (
diff --git a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx
index edab2865..5a9e23da 100644
--- a/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx
+++ b/src/screens/suggestedPeopleOnboarding/SuggestedPeopleUploadPictureScreen.tsx
@@ -13,7 +13,6 @@ import {TouchableOpacity} from 'react-native-gesture-handler';
 import ImagePicker from 'react-native-image-crop-picker';
 import {SafeAreaView} from 'react-native-safe-area-context';
 import {useDispatch, useSelector} from 'react-redux';
-import {UniversityBadge} from '../../types';
 import {TaggSquareButton, UniversityIcon} from '../../components';
 import TaggLoadingIndicator from '../../components/common/TaggLoadingIndicator';
 import {SP_HEIGHT, SP_WIDTH} from '../../constants';
@@ -40,13 +39,9 @@ type SuggestedPeopleUploadPictureScreenProps = {
 const SuggestedPeopleUploadPictureScreen: React.FC<SuggestedPeopleUploadPictureScreenProps> = ({
   route,
 }) => {
-  const {editing, updatedSelectedBadges} = route.params;
+  const {editing} = route.params;
   const [image, setImage] = useState<string | undefined>(undefined);
   const [oldImage, setOldImage] = useState<string | undefined>(undefined);
-  const [selectedBadges, setSelectedBadges] = useState<UniversityBadge[]>([]);
-  const [extractedSelectedBadges, setExtractedSelectedBadges] = useState<
-    string[]
-  >([]);
   const [loading, setLoading] = useState(false);
   const dispatch = useDispatch();
   const navigation = useNavigation();
@@ -59,7 +54,6 @@ const SuggestedPeopleUploadPictureScreen: React.FC<SuggestedPeopleUploadPictureS
       const response = await getSuggestedPeopleProfile(loggedInUserId);
       if (response) {
         setImage(response.suggested_people_url);
-        setSelectedBadges(response.badges);
         setOldImage(response.suggested_people_url);
       }
     };
@@ -69,25 +63,6 @@ const SuggestedPeopleUploadPictureScreen: React.FC<SuggestedPeopleUploadPictureS
     }
   }, []);
 
-  // Get list of badges from the backend and display here
-  useEffect(() => {
-    const extractBadgeNames = () => {
-      let extractedBadgeNames: string[] = updatedSelectedBadges
-        ? updatedSelectedBadges
-        : [];
-      // Receive undefined if you're coming from any screen
-      if (!updatedSelectedBadges) {
-        selectedBadges.forEach((badge) => {
-          if (!extractedBadgeNames.includes(badge.name)) {
-            extractedBadgeNames.push(badge.name);
-          }
-        });
-      }
-      setExtractedSelectedBadges(extractedBadgeNames);
-    };
-    extractBadgeNames();
-  }, [selectedBadges, updatedSelectedBadges]);
-
   const openImagePicker = () => {
     ImagePicker.openPicker({
       smartAlbums: [
@@ -187,9 +162,7 @@ const SuggestedPeopleUploadPictureScreen: React.FC<SuggestedPeopleUploadPictureS
             </View>
             <TouchableOpacity
               onPress={() => {
-                navigation.push('BadgeSelection', {
-                  prevSelectedBadges: extractedSelectedBadges,
-                });
+                navigation.push('BadgeSelection');
               }}>
               <FrontArrow style={styles.rightArrow} />
             </TouchableOpacity>