Removed the search icon from the navigation bar and replaced it with the upload icon (along with the corresponding routing). Small tweaks on navigation and design will be needed. Commented out the code for navigation to search page - should be deleted soon.

1 files changed, 26 insertions, 24 deletions

diff --git a/src/screens/profile/CaptionScreen.tsx b/src/screens/profile/CaptionScreen.tsx
index 75533a9b..e18679dc 100644
--- a/src/screens/profile/CaptionScreen.tsx
+++ b/src/screens/profile/CaptionScreen.tsx
@@ -1,6 +1,6 @@
-import {RouteProp} from '@react-navigation/native';
-import {StackNavigationProp} from '@react-navigation/stack';
-import React, {Fragment, useEffect, useState} from 'react';
+import { RouteProp } from '@react-navigation/native';
+import { StackNavigationProp } from '@react-navigation/stack';
+import React, { Fragment, useEffect, useState } from 'react';
 import {
   Alert,
   Image,
@@ -13,29 +13,29 @@ import {
   TouchableWithoutFeedback,
   View,
 } from 'react-native';
-import {MentionInputControlled} from '../../components';
-import {Button, normalize} from 'react-native-elements';
-import {useDispatch, useSelector} from 'react-redux';
+import { MentionInputControlled } from '../../components';
+import { Button, normalize } from 'react-native-elements';
+import { useDispatch, useSelector } from 'react-redux';
 import FrontArrow from '../../assets/icons/front-arrow.svg';
-import {SearchBackground} from '../../components';
-import {CaptionScreenHeader} from '../../components/';
+import { SearchBackground } from '../../components';
+import { CaptionScreenHeader } from '../../components/';
 import TaggLoadingIndicator from '../../components/common/TaggLoadingIndicator';
-import {TAGG_LIGHT_BLUE_2} from '../../constants';
+import { TAGG_LIGHT_BLUE_2 } from '../../constants';
 import {
   ERROR_SOMETHING_WENT_WRONG_REFRESH,
   ERROR_UPLOAD,
   SUCCESS_PIC_UPLOAD,
 } from '../../constants/strings';
-import {MainStackParams} from '../../routes';
-import {patchMoment, postMoment, postMomentTags} from '../../services';
+import { MainStackParams } from '../../routes';
+import { patchMoment, postMoment, postMomentTags } from '../../services';
 import {
   loadUserMoments,
   updateProfileCompletionStage,
 } from '../../store/actions';
-import {RootState} from '../../store/rootReducer';
-import {MomentTagType} from '../../types';
-import {SCREEN_WIDTH, StatusBarHeight} from '../../utils';
-import {mentionPartTypes} from '../../utils/comments';
+import { RootState } from '../../store/rootReducer';
+import { MomentTagType } from '../../types';
+import { SCREEN_WIDTH, StatusBarHeight } from '../../utils';
+import { mentionPartTypes } from '../../utils/comments';
 
 /**
  * Upload Screen to allow users to upload posts to Tagg
@@ -50,10 +50,10 @@ interface CaptionScreenProps {
   navigation: CaptionScreenNavigationProp;
 }
 
-const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
-  const {title, image, screenType, selectedTags, moment} = route.params;
+const CaptionScreen: React.FC<CaptionScreenProps> = ({ route, navigation }) => {
+  const { title, image, screenType, selectedTags, moment } = route.params;
   const {
-    user: {userId},
+    user: { userId },
   } = useSelector((state: RootState) => state.user);
   const dispatch = useDispatch();
   const [caption, setCaption] = useState(moment ? moment.caption : '');
@@ -179,7 +179,9 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
                 title="Cancel"
                 buttonStyle={styles.button}
                 onPress={() =>
-                  moment ? navigation.goBack() : navigateToProfile()
+                  // There is issue here with navigations on the commented code below
+                  // moment ? navigation.goBack() : navigateToProfile()
+                  navigation.goBack()
                 }
               />
               <Button
@@ -191,12 +193,12 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
             </View>
             <CaptionScreenHeader
               style={styles.header}
-              {...{title: moment ? moment.moment_category : title}}
+              {...{ title: moment ? moment.moment_category : title }}
             />
             {/* this is the image we want to center our tags' initial location within */}
             <Image
               style={styles.image}
-              source={{uri: moment ? moment.moment_url : image?.path}}
+              source={{ uri: moment ? moment.moment_url : image?.path }}
               resizeMode={'contain'}
             />
             <MentionInputControlled
@@ -213,8 +215,8 @@ const CaptionScreen: React.FC<CaptionScreenProps> = ({route, navigation}) => {
                   imagePath: moment
                     ? moment.moment_url
                     : image
-                    ? image.path
-                    : '',
+                      ? image.path
+                      : '',
                   selectedTags: tags,
                 })
               }
@@ -296,7 +298,7 @@ const styles = StyleSheet.create({
     letterSpacing: normalize(0.3),
     textAlign: 'right',
   },
-  tagIcon: {width: 20, height: 20},
+  tagIcon: { width: 20, height: 20 },
 });
 
 export default CaptionScreen;