Cleaned up & Fixed Navigation Params for Open Messages, removed unuse…

…d params
NiketanG · Apr 22, 2021 · 73b7ac5 · 73b7ac5
1 parent f693427
commit 73b7ac5
Show file tree

Hide file tree

Showing 6 changed files with 24 additions and 46 deletions.
diff --git a/src/app/Routes/HomeStack.tsx b/src/app/Routes/HomeStack.tsx
@@ -15,18 +15,15 @@ const Stack = createStackNavigator<HomeStackNavigationParams>();
 type Props = {
 	route: RouteProp<TabNavigationParams, "Home">;
 	navigation: BottomTabNavigationProp<TabNavigationParams, "Home">;
+	openMessages: () => void;
 };
 
-const HomePageStack: React.FC<Props> = ({ route }) => (
+const HomePageStack: React.FC<Props> = ({ openMessages }) => (
 	<NavigationContainer independent>
 		<Stack.Navigator headerMode="none" initialRouteName="Home">
-			<Stack.Screen
-				name="Home"
-				component={Home}
-				initialParams={{
-					openMessages: route.params.openMessages,
-				}}
-			/>
+			<Stack.Screen name="Home">
+				{(props) => <Home {...props} openMessages={openMessages} />}
+			</Stack.Screen>
 			<Stack.Screen name="Comments" component={Comments} />
 			<Stack.Screen name="Profile" component={ProfilePageStack} />
 		</Stack.Navigator>

diff --git a/src/app/Routes/MessageStack.tsx b/src/app/Routes/MessageStack.tsx
@@ -28,11 +28,9 @@ const MessageStack: React.FC<Props> = ({ navigation }) => {
 	return (
 		<NavigationContainer independent>
 			<Stack.Navigator headerMode="none" initialRouteName="ChatList">
-				<Stack.Screen
-					name="ChatList"
-					component={ChatList}
-					initialParams={{ goBack }}
-				/>
+				<Stack.Screen name="ChatList">
+					{(props) => <ChatList {...props} goBack={goBack} />}
+				</Stack.Screen>
 				<Stack.Screen name="Messages" component={Messages} />
 				<Stack.Screen name="NewChat" component={NewChat} />
 				<Stack.Screen name="Profile" component={ProfilePageStack} />

diff --git a/src/app/Routes/Navigation.tsx b/src/app/Routes/Navigation.tsx
@@ -59,10 +59,6 @@ export const TabNavigation: React.FC<Props> = ({ navigation }) => {
 			>
 				<Tab.Screen
 					name="Home"
-					component={HomePageStack}
-					initialParams={{
-						openMessages,
-					}}
 					options={{
 						tabBarIcon: ({ color, focused }) => (
 							<TabBarIcon
@@ -71,7 +67,11 @@ export const TabNavigation: React.FC<Props> = ({ navigation }) => {
 							/>
 						),
 					}}
-				/>
+				>
+					{(props) => (
+						<HomePageStack {...props} openMessages={openMessages} />
+					)}
+				</Tab.Screen>
 				<Tab.Screen
 					name="Explore"
 					component={ExplorePageStack}

diff --git a/src/app/Screens/Home/index.tsx b/src/app/Screens/Home/index.tsx
@@ -24,18 +24,16 @@ import PostBottomSheetWrapper from "../../Components/PostBottomSheetWrapper";
 type Props = {
 	route: RouteProp<HomeStackNavigationParams, "Home">;
 	navigation: StackNavigationProp<HomeStackNavigationParams, "Home">;
+	openMessages: () => void;
 };
 
-const Home: React.FC<Props> = observer(({ route }) => {
+const Home: React.FC<Props> = observer(({ openMessages }) => {
 	const { colors, dark } = useTheme();
 
 	const { fetchFeed, loading, posts: feedPosts } = useFeed();
 
 	const { height } = useWindowDimensions();
 
-	const openMessages = () =>
-		route.params.openMessages && route.params.openMessages();
-
 	const [openedModalData, setOpenedModalData] = useState<{
 		modalType: "MENU" | "SHARE";
 		username: string;

diff --git a/src/app/Screens/Messages/ChatList.tsx b/src/app/Screens/Messages/ChatList.tsx
@@ -21,6 +21,7 @@ import { getTimeDistance } from "../../utils/utils";
 type Props = {
 	route: RouteProp<MessageStackNavigationParams, "ChatList">;
 	navigation: StackNavigationProp<MessageStackNavigationParams, "ChatList">;
+	goBack: () => void;
 };
 
 type UserItemProps = {
@@ -69,16 +70,14 @@ const UserListItem: React.FC<UserItemProps> = ({ item, openMessage }) => {
 	);
 };
 
-const MessagesList: React.FC<Props> = ({ navigation, route }) => {
+const MessagesList: React.FC<Props> = ({ navigation, route, goBack }) => {
 	const { colors, dark } = useTheme();
 	const { height } = useWindowDimensions();
 	const { messageList, loading, fetchMessageList } = useChatList();
 	const [searchTerm, setSearchTerm] = useState("");
 
 	const newMessage = () => navigation.navigate("NewChat");
 
-	const goBack = () => route.params.goBack && route.params.goBack();
-
 	const openMessage = (username: string) => {
 		navigation.navigate("Messages", {
 			username,

diff --git a/src/app/types/navigation.ts b/src/app/types/navigation.ts
@@ -5,17 +5,13 @@ import { User } from "../store/UsersStore";
 import { definitions } from "./supabase";
 
 export type MessageStackNavigationParams = {
-	ChatList: {
-		goBack: () => void;
-	};
+	ChatList: undefined;
 	NewChat: undefined;
 	Messages: {
 		username: string;
 	};
 	Comments: CommentsPageParams;
-	Profile: ProfilePageProps & {
-		goBack: () => void;
-	};
+	Profile: ProfilePageProps;
 	Post: {
 		post: Pick<Post, "caption" | "postedAt" | "postId" | "imageUrl">;
 		user: Pick<User, "username" | "profilePic">;
@@ -40,22 +36,16 @@ export type SwipeTabNavigationParams = {
 	Messages: undefined;
 };
 export type HomeStackNavigationParams = {
-	Home: {
-		openMessages: () => void;
-	};
+	Home: undefined;
 	Comments: CommentsPageParams;
-	Profile: ProfilePageProps & {
-		goBack: () => void;
-	};
+	Profile: ProfilePageProps;
 };
 
 export type ProfileStackParams = {
 	Messages: {
 		username: string;
 	};
-	ProfilePage: ProfilePageProps & {
-		goBack?: () => void;
-	};
+	ProfilePage: ProfilePageProps & { goBack: () => void };
 	Followers: ProfilePageProps & {
 		followers: Follower[];
 	};
@@ -82,9 +72,7 @@ export type ExploreStackNavigationParams = {
 		user: Pick<User, "username" | "profilePic">;
 	};
 	Comments: CommentsPageParams;
-	Profile: ProfilePageProps & {
-		goBack: () => void;
-	};
+	Profile: ProfilePageProps;
 };
 export type PostListParams = {
 	goBack: () => void;
@@ -103,9 +91,7 @@ export type PostStackNavigationParams = {
 };
 
 export type TabNavigationParams = {
-	Home: {
-		openMessages: () => void;
-	};
+	Home: undefined;
 	Explore: undefined;
 	// Activity: undefined;
 	New: undefined;