4 files changed, 88 insertions, 22 deletions
diff --git a/src/screens/moments/CameraScreen.tsx b/src/screens/moments/CameraScreen.tsx
index 75638c40..be153d0c 100644
--- a/src/screens/moments/CameraScreen.tsx
+++ b/src/screens/moments/CameraScreen.tsx
@@ -30,7 +30,7 @@ interface CameraScreenProps {
   navigation: CameraScreenNavigationProps;
 }
 const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
-  const {title, screenType} = route.params;
+  const {screenType} = route.params;
   const cameraRef = createRef<RNCamera>();
   const tabBarHeight = useBottomTabBarHeight();
   const [cameraType, setCameraType] = useState<keyof CameraType>('front');
@@ -72,7 +72,6 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
   const navigateToCropper = (uri: string) => {
     navigation.navigate('ZoomInCropper', {
       screenType,
-      title,
       media: {
         uri,
         isVideo: false,
@@ -83,7 +82,6 @@ const CameraScreen: React.FC<CameraScreenProps> = ({route, navigation}) => {
   const navigateToCaptionScreen = (isVideo: boolean, uri: string) => {
     navigation.navigate('CaptionScreen', {
       screenType,
-      title,
       media: {
         uri,
         isVideo,
diff --git a/src/screens/profile/CaptionScreen.tsx b/src/screens/profile/CaptionScreen.tsx
index 67d1fd04..025d81a7 100644
--- a/src/screens/profile/CaptionScreen.tsx
+++ b/src/screens/profile/CaptionScreen.tsx
@@ -14,7 +14,6 @@ import {
   TouchableWithoutFeedback,
   View,
 } from 'react-native';
-import {openContactForm} from 'react-native-contacts';
 import {Button} from 'react-native-elements';
 import Video from 'react-native-video';
 import {useDispatch, useSelector} from 'react-redux';
@@ -48,27 +47,28 @@ import {mentionPartTypes} from '../../utils/comments';
  * Upload Screen to allow users to upload posts to Tagg
  */
 type CaptionScreenRouteProp = RouteProp<MainStackParams, 'CaptionScreen'>;
+
 type CaptionScreenNavigationProp = StackNavigationProp<
   MainStackParams,
   'CaptionScreen'
 >;
+
 interface CaptionScreenProps {
   route: CaptionScreenRouteProp;
   navigation: CaptionScreenNavigationProp;
 }
 
 const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
-  const {title, screenType, selectedTags, moment} = route.params;
+  const {screenType, moment} = route.params;
   const {
     user: {userId},
   } = useSelector((state: RootState) => state.user);
   const dispatch = useDispatch();
   const [caption, setCaption] = useState(moment ? moment.caption : '');
   const [loading, setLoading] = useState(false);
-  const [tags, setTags] = useState<MomentTagType[]>(
-    selectedTags ? selectedTags : [],
-  );
+  const [tags, setTags] = useState<MomentTagType[]>([]);
   const [taggedUsersText, setTaggedUsersText] = useState('');
+  const [momentCategory, setMomentCategory] = useState<string | undefined>();
   const mediaUri = moment ? moment.moment_url : route.params.media!.uri;
   // TODO: change this once moment refactor is done
   const isMediaAVideo = moment
@@ -81,8 +81,12 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
     : route.params.media?.isVideo ?? false;
 
   useEffect(() => {
-    setTags(selectedTags ? selectedTags : []);
-  }, [selectedTags]);
+    setTags(route.params.selectedTags ?? []);
+  }, [route.params.selectedTags]);
+
+  useEffect(() => {
+    setMomentCategory(route.params.selectedCategory);
+  }, [route.params.selectedCategory]);
 
   useEffect(() => {
     let listString = '';
@@ -145,7 +149,7 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
 
   const handleShare = async () => {
     setLoading(true);
-    if (moment || !title) {
+    if (moment || !momentCategory) {
       handleFailed();
       return;
     }
@@ -153,7 +157,7 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
     let momentId;
     // separate upload logic for image/video
     if (isMediaAVideo) {
-      const presignedURLResponse = await handlePresignedURL(title);
+      const presignedURLResponse = await handlePresignedURL(momentCategory);
       if (!presignedURLResponse) {
         handleFailed();
         return;
@@ -166,7 +170,12 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
         handleFailed();
       }
     } else {
-      const momentResponse = await postMoment(mediaUri, caption, title, userId);
+      const momentResponse = await postMoment(
+        mediaUri,
+        caption,
+        momentCategory,
+        userId,
+      );
       if (!momentResponse) {
         handleFailed();
         return;
@@ -276,15 +285,7 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
             <SelectableItem
               text={'Category'}
               imageUri={require('../../assets/images/images.png')}
-              onPress={() =>
-                navigation.navigate('TagFriendsScreen', {
-                  media: {
-                    uri: mediaUri,
-                    isVideo: isMediaAVideo,
-                  },
-                  selectedTags: tags,
-                })
-              }
+              onPress={() => navigation.navigate('ChoosingCategoryScreen', {})}
             />
             <SelectableItem
               text={'Tag Friends'}
diff --git a/src/screens/profile/ChoosingCategoryScreen.tsx b/src/screens/profile/ChoosingCategoryScreen.tsx
new file mode 100644
index 00000000..285732e7
--- /dev/null
+++ b/src/screens/profile/ChoosingCategoryScreen.tsx
@@ -0,0 +1,66 @@
+import AsyncStorage from '@react-native-community/async-storage';
+import {useBottomTabBarHeight} from '@react-navigation/bottom-tabs';
+import {RouteProp, useNavigation} from '@react-navigation/native';
+import React, {FC} from 'react';
+import {
+  ScrollView,
+  StyleSheet,
+  Text,
+  TouchableOpacity,
+  View,
+} from 'react-native';
+import {SafeAreaView, useSafeAreaInsets} from 'react-native-safe-area-context';
+import {CaptionScreenHeader, SearchBackground} from '../../components';
+import {MainStackParams} from '../../routes';
+import {StatusBarHeight} from '../../utils';
+
+type ChoosingCategoryScreenRouteProps = RouteProp<
+  MainStackParams,
+  'ChoosingCategoryScreen'
+>;
+
+interface ChoosingCategoryScreenProps {
+  route: ChoosingCategoryScreenRouteProps;
+}
+
+const ChoosingCategoryScreen: React.FC<ChoosingCategoryScreenProps> = ({
+  route,
+}) => {
+  const navigation = useNavigation();
+  const tabBarHeight = useBottomTabBarHeight();
+  const insetTop = useSafeAreaInsets().top;
+  const MomentItem: FC<{
+    title: string;
+  }> = ({title}) => (
+    <TouchableOpacity
+      onPress={async () => {
+        await AsyncStorage.setItem('selectedMomentCategory', title);
+        navigation.goBack();
+      }}>
+      <Text style={{height: 100, backgroundColor: 'green'}}>foo</Text>
+    </TouchableOpacity>
+  );
+  return (
+    <SearchBackground>
+      {/* <SafeAreaView style={styles.container}> */}
+      {/* <CaptionScreenHeader style={styles.header} title={'Moments'} /> */}
+      <View style={{marginTop: StatusBarHeight + insetTop}}>
+        <ScrollView contentContainerStyle={{paddingBottom: tabBarHeight}}>
+          {[0, 0, 0, 0].map((item) => (
+            <MomentItem />
+          ))}
+        </ScrollView>
+      </View>
+      {/* </SafeAreaView> */}
+    </SearchBackground>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    marginTop: StatusBarHeight,
+  },
+  scrollContainer: {},
+});
+
+export default ChoosingCategoryScreen;
diff --git a/src/screens/profile/index.ts b/src/screens/profile/index.ts
index ea0505a2..101101b8 100644
--- a/src/screens/profile/index.ts
+++ b/src/screens/profile/index.ts
@@ -13,3 +13,4 @@ export {default as AccountType} from './AccountType';
 export {default as CategorySelection} from './CategorySelection';
 export {default as CreateCustomCategory} from './CreateCustomCategory';
 export {default as CommentReactionScreen} from './CommentReactionScreen';
+export {default as ChoosingCategoryScreen} from './ChoosingCategoryScreen';