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, 28 deletions

diff --git a/src/routes/tabs/NavigationBar.tsx b/src/routes/tabs/NavigationBar.tsx
index c3a42739..f8b94470 100644
--- a/src/routes/tabs/NavigationBar.tsx
+++ b/src/routes/tabs/NavigationBar.tsx
@@ -1,23 +1,23 @@
-import {createBottomTabNavigator} from '@react-navigation/bottom-tabs';
-import React, {Fragment, useEffect, useState} from 'react';
-import {useSelector} from 'react-redux';
-import {NavigationIcon} from '../../components';
-import {NO_NOTIFICATIONS} from '../../store/initialStates';
-import {RootState} from '../../store/rootReducer';
-import {setNotificationsReadDate} from '../../services';
-import {ScreenType} from '../../types';
-import {haveUnreadNotifications} from '../../utils';
+import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
+import React, { Fragment, useEffect, useState } from 'react';
+import { useSelector } from 'react-redux';
+import { NavigationIcon } from '../../components';
+import { NO_NOTIFICATIONS } from '../../store/initialStates';
+import { RootState } from '../../store/rootReducer';
+import { setNotificationsReadDate } from '../../services';
+import { ScreenType } from '../../types';
+import { haveUnreadNotifications } from '../../utils';
 import MainStackScreen from '../main/MainStackScreen';
-import {NotificationPill} from '../../components/notifications';
+import { NotificationPill } from '../../components/notifications';
 
 const Tabs = createBottomTabNavigator();
 
 const NavigationBar: React.FC = () => {
-  const {isOnboardedUser, newNotificationReceived} = useSelector(
+  const { isOnboardedUser, newNotificationReceived } = useSelector(
     (state: RootState) => state.user,
   );
 
-  const {notifications: {notifications} = NO_NOTIFICATIONS} = useSelector(
+  const { notifications: { notifications } = NO_NOTIFICATIONS } = useSelector(
     (state: RootState) => state,
   );
   // Triggered if user clicks on Notifications page to close the pill
@@ -41,13 +41,13 @@ const NavigationBar: React.FC = () => {
     <>
       <NotificationPill showIcon={showIcon} />
       <Tabs.Navigator
-        screenOptions={({route}) => ({
-          tabBarIcon: ({focused}) => {
+        screenOptions={({ route }) => ({
+          tabBarIcon: ({ focused }) => {
             switch (route.name) {
               case 'Home':
                 return <NavigationIcon tab="Home" disabled={!focused} />;
-              case 'Search':
-                return <NavigationIcon tab="Search" disabled={!focused} />;
+              case 'Chat':
+                return <NavigationIcon tab="Chat" disabled={!focused} />;
               case 'Upload':
                 return <NavigationIcon tab="Upload" disabled={!focused} />;
               case 'Notifications':
@@ -60,8 +60,6 @@ const NavigationBar: React.FC = () => {
                     disabled={!focused}
                   />
                 );
-              case 'Chat':
-                return <NavigationIcon tab="Chat" disabled={!focused} />;
               case 'Profile':
                 return <NavigationIcon tab="Profile" disabled={!focused} />;
               case 'SuggestedPeople':
@@ -88,17 +86,22 @@ const NavigationBar: React.FC = () => {
         <Tabs.Screen
           name="SuggestedPeople"
           component={MainStackScreen}
-          initialParams={{screenType: ScreenType.SuggestedPeople}}
+          initialParams={{ screenType: ScreenType.SuggestedPeople }}
+        />
+        <Tabs.Screen
+          name="Chat"
+          component={MainStackScreen}
+          initialParams={{ screenType: ScreenType.Chat }}
         />
         <Tabs.Screen
-          name="Search"
+          name="Upload"
           component={MainStackScreen}
-          initialParams={{screenType: ScreenType.Search}}
+          initialParams={{ screenType: ScreenType.Upload }}
         />
         <Tabs.Screen
           name="Notifications"
           component={MainStackScreen}
-          initialParams={{screenType: ScreenType.Notifications}}
+          initialParams={{ screenType: ScreenType.Notifications }}
           listeners={{
             tabPress: (_) => {
               // Closes the pill once this screen has been opened
@@ -109,14 +112,9 @@ const NavigationBar: React.FC = () => {
           }}
         />
         <Tabs.Screen
-          name="Chat"
-          component={MainStackScreen}
-          initialParams={{screenType: ScreenType.Chat}}
-        />
-        <Tabs.Screen
           name="Profile"
           component={MainStackScreen}
-          initialParams={{screenType: ScreenType.Profile}}
+          initialParams={{ screenType: ScreenType.Profile }}
         />
       </Tabs.Navigator>
     </>