From 5803b35affd506b049ca6161f7e958d324a7d425 Mon Sep 17 00:00:00 2001
From: VGeorgiev <vgeorgiev@up2technology.com>
Date: Sat, 17 Sep 2022 20:45:38 +0300
Subject: [PATCH] feat: Add navigation to the Profile screens

---
 src/components/FeedPost.tsx   | 12 +++++++++---
 src/navigation/index.tsx      |  4 ++++
 src/screens/ProfileScreen.tsx |  6 +++++-
 3 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/src/components/FeedPost.tsx b/src/components/FeedPost.tsx
index bcaac61..679e774 100644
--- a/src/components/FeedPost.tsx
+++ b/src/components/FeedPost.tsx
@@ -1,4 +1,4 @@
-import { StyleSheet, Text, View, Image } from "react-native";
+import { StyleSheet, Text, View, Image, TouchableOpacity } from "react-native";
 import like from "../../assets/images/like.png";
 import {
   Entypo,
@@ -7,16 +7,22 @@ import {
   MaterialCommunityIcons,
 } from "@expo/vector-icons";
 import IconButton from "./IconButton";
+import { useNavigation } from "@react-navigation/native";
 
 interface FeedPostProps {
   post: Post;
 }
 
 const FeedPost: React.FC<FeedPostProps> = ({ post }) => {
+  const navigation = useNavigation();
+  const navigateToProfile = () => {
+    // @ts-ignore
+    navigation.navigate("Profile");
+  };
   return (
     <View style={styles.post}>
       {/* Header */}
-      <View style={styles.header}>
+      <TouchableOpacity onPress={navigateToProfile} style={styles.header}>
         <Image source={{ uri: post.User.image }} style={styles.profileImage} />
         <View>
           <Text style={styles.name}>{post.User.name}</Text>
@@ -28,7 +34,7 @@ const FeedPost: React.FC<FeedPostProps> = ({ post }) => {
           color="gray"
           style={styles.icon}
         />
-      </View>
+      </TouchableOpacity>
       {/* Body */}
       {post.description && (
         <Text style={styles.description}>{post.description}</Text>
diff --git a/src/navigation/index.tsx b/src/navigation/index.tsx
index 62c7f10..c9b2288 100644
--- a/src/navigation/index.tsx
+++ b/src/navigation/index.tsx
@@ -2,6 +2,8 @@ import { NavigationContainer } from "@react-navigation/native";
 import { createNativeStackNavigator } from "@react-navigation/native-stack";
 import FeedScreen from "../screens/FeedScreen";
 import CreatePostScreen from "../screens/CreatePostScreen";
+import ProfileScreen from "../screens/ProfileScreen";
+import UpdateProfileScreen from "../screens/UpdateProfileScreen";
 
 const Stack = createNativeStackNavigator();
 
@@ -15,6 +17,8 @@ const Navigator = () => {
           options={{ headerShown: false }}
         />
         <Stack.Screen name="Create Post" component={CreatePostScreen} />
+        <Stack.Screen name="Profile" component={ProfileScreen} />
+        <Stack.Screen name="Edit Profile" component={UpdateProfileScreen} />
       </Stack.Navigator>
     </NavigationContainer>
   );
diff --git a/src/screens/ProfileScreen.tsx b/src/screens/ProfileScreen.tsx
index b775983..27ec010 100644
--- a/src/screens/ProfileScreen.tsx
+++ b/src/screens/ProfileScreen.tsx
@@ -41,6 +41,10 @@ const ProfileScreenHeader = ({
   if (!user) {
     return <ActivityIndicator />;
   }
+  const editProfile = () => {
+    // @ts-ignore
+    navigation.navigate("Edit Profile");
+  };
 
   return (
     <View style={styles.container}>
@@ -60,7 +64,7 @@ const ProfileScreenHeader = ({
                 Add to Story
               </Text>
             </Pressable>
-            <Pressable style={styles.button}>
+            <Pressable style={styles.button} onPress={editProfile}>
               <MaterialCommunityIcons name="pencil" size={16} color="black" />
               <Text style={styles.buttonText}>Edit Profile</Text>
             </Pressable>