fix(card): navigation user by clicked

src/screens/feed/card.tsx

@@ -5,11 +5,13 @@ import {
   faUserGroup,
 } from '@fortawesome/free-solid-svg-icons';
 import { FontAwesomeIcon } from '@fortawesome/react-native-fontawesome';
+import { useNavigation } from '@react-navigation/native';
 import React, { useEffect, useState } from 'react';
 
 import type { Snap } from '@/api';
 import { client } from '@/api/common';
 import { getUserState } from '@/core';
+import type { UserType } from '@/core/auth/utils';
 import { Button, Image, Pressable, Text, TouchableOpacity, View } from '@/ui';
 
 import CommentButton from './comment-button';
@@ -50,8 +52,16 @@ const CardHeader = ({
   snap: Snap;
   formattedDate: string;
 }) => {
+  const navigate = useNavigation();
+  const handlePress = async () => {
+    const { data: user } = await client.identity.get<UserType>(
+      `/api/auth/users/${snap.author}`
+    );
+
+    navigate.navigate('UserProfile', { user });
+  };
   return (
-    <TouchableOpacity className="group block shrink-0">
+    <TouchableOpacity className="group block shrink-0" onPress={handlePress}>
       <CardSharedInfo snap={snap} />
       <View className="flex flex-row items-center">
         <Image

src/screens/profile/components/profile-bio.tsx

@@ -10,20 +10,20 @@ type ProfileBioProps = {
 export const ProfileBio = ({ user }: ProfileBioProps) => {
   return (
     <>
-      <View className="mt-2 text-center">
+      <View className="text-center">
         <Text className="mb-1 text-2xl font-bold leading-normal text-slate-700">
           {user?.first_name} {user?.last_name}
         </Text>
-        <View className="mb-2 mt-0 text-xs font-bold uppercase text-slate-400">
-          <Text className="fas fa-map-marker-alt mr-2 text-slate-400 opacity-75">
+        <View className="mb-2 text-xs font-bold uppercase text-slate-400">
+          <Text className="fas fa-map-marker-alt mr-2 text-sm text-slate-400 opacity-75">
             {user?.ubication}
           </Text>
         </View>
       </View>
-      <View className="mt-1 border-t border-slate-200 py-3 text-center">
+      <View className="border-t border-slate-200 pt-3 text-center">
         <View className="flex flex-wrap justify-center">
-          <View className="w-full px-4">
-            <Text className="mb-4 font-light leading-relaxed text-slate-600">
+          <View className="w-full px-1">
+            <Text className="mb-4 text-sm font-light leading-relaxed text-slate-600">
               {user?.bio_msg || 'No bio'}
             </Text>
           </View>

src/screens/profile/components/profle-header.tsx

@@ -14,7 +14,7 @@ export const ProfileHeader = ({ user }: ProfileHeaderProps) => {
         <View className="relative">
           <Image
             source={user?.profile_photo_id}
-            className="order-1 h-32 w-32 rounded-full" // Adjusted size to h-32 and w-32
+            className="order-1 h-28 w-28 rounded-full" // Adjusted size to h-32 and w-32
           />
         </View>
       </View>

src/screens/profile/profile-view.tsx

@@ -40,7 +40,7 @@ const ProfileScreenView = ({
   }, [user]);
 
   return (
-    <View className="mx-auto mb-6 mt-3 w-full px-6">
+    <View className="mx-auto mb-2 mt-3 w-full px-6">
       <ProfileHeader user={user} />
       <FollowActions
         user={user}