commented out search bar, added screen to onboarding flow, fixed some layout issues

1 files changed, 29 insertions, 34 deletions

diff --git a/src/screens/badge/BadgeSelection.tsx b/src/screens/badge/BadgeSelection.tsx
index 9ed1b08f..4754960b 100644
--- a/src/screens/badge/BadgeSelection.tsx
+++ b/src/screens/badge/BadgeSelection.tsx
@@ -1,18 +1,21 @@
+import AsyncStorage from '@react-native-community/async-storage';
+import {StackNavigationProp} from '@react-navigation/stack';
 import React, {useEffect, useState} from 'react';
-import {StatusBar, SafeAreaView, View, StyleSheet} from 'react-native';
-import {BackgroundGradientType} from '../../types';
-import {StatusBarHeight, SCREEN_HEIGHT} from '../../utils';
+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 {BACKGROUND_GRADIENT_MAP} from '../../constants';
+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';
-import {ADD_USER_BADGES} from '../../constants';
-import {getTokenOrLogout} from './../../utils';
-import Animated from 'react-native-reanimated';
-
-import {SearchBar} from '../../components';
-
-import {StackNavigationProp} from '@react-navigation/stack';
 
 /**
  * Home Screen for displaying Tagg Badge Selections
@@ -136,10 +139,6 @@ const DATA = [
   },
 ];
 
-import {TouchableOpacity} from 'react-native-gesture-handler';
-import {Text} from 'react-native-animatable';
-import {useDispatch} from 'react-redux';
-
 type BadgeSelectionParamList = {
   BadgeList: any[];
 };
@@ -167,14 +166,9 @@ const BadgeSelection: React.FC<BadgeSelectionProps> = ({navigation}) => {
         <Text style={styles.rightButton}>{canSubmit ? 'Done' : 'Skip'}</Text>
       </TouchableOpacity>
     ),
-    headerLeft: () => (
-      <TouchableOpacity style={styles.leftButtonContainer}>
-        <Text style={styles.leftButton}>Cancel</Text>
-      </TouchableOpacity>
-    ),
   });
 
-  const [selectedBadges, setSelectedBadges] = useState(Array<string>());
+  const [selectedBadges, setSelectedBadges] = useState<string[]>([]);
   const selectKey = (key: string) => {
     if (selectedBadges.includes(key)) {
       const selectedBadgesArray = [...selectedBadges];
@@ -195,25 +189,25 @@ const BadgeSelection: React.FC<BadgeSelectionProps> = ({navigation}) => {
 
   const uploadUserSelection = async () => {
     try {
-      const token = await getTokenOrLogout(dispatch);
-      const reqBody = JSON.stringify({
-        badges: selectedBadges,
-      });
-      console.log(ADD_USER_BADGES);
-      console.log(reqBody);
+      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': 'application/json',
+          'Content-Type': 'multipart/form-data',
           Authorization: 'Token ' + token,
         },
-        body: reqBody,
+        body: form,
       });
-      const status = response.status;
-      const data = await response.json();
-      console.log(data);
+      if (response.status === 400) {
+        Alert.alert(ERROR_BADGES_EXCEED_LIMIT);
+        return;
+      }
+      dispatch(suggestedPeopleBadgesFinished());
     } catch (error) {
       console.log(error);
+      Alert.alert(ERROR_UPLOAD_BADGES);
     }
   };
 
@@ -225,11 +219,12 @@ const BadgeSelection: React.FC<BadgeSelectionProps> = ({navigation}) => {
       <SafeAreaView>
         <View style={styles.listContainer}>
           <BadgeScreenHeader />
-          <SearchBar
+          {/* filter not working, comment out for now */}
+          {/* <SearchBar
             style={styles.searchBarStyle}
             onCancel={() => {}}
             top={Animated.useValue(0)}
-          />
+          /> */}
           <BadgeList
             data={DATA}
             selectedBadges={selectedBadges}