Email is updated to version before merge, also bug fixed with 'link' in android

ArtisanConnect/app/notice/[id].jsx

@@ -1,8 +1,9 @@
-import { Link, Stack, useLocalSearchParams } from "expo-router";
+import { Stack, useLocalSearchParams } from "expo-router";
 import { KeyboardAvoidingView, Platform } from "react-native";
 import { Box } from "@/components/ui/box";
 import { Card } from "@/components/ui/card";
 import { Heading } from "@/components/ui/heading";
+import {useRouter} from 'expo-router';
 import { Image } from "@/components/ui/image";
 import { Text } from "@/components/ui/text";
 import { VStack } from "@/components/ui/vstack";
@@ -18,7 +19,6 @@ import {
   FlatList,
   View,
   TextInput,
-  SafeAreaView,
   Alert,
 } from "react-native";
 import { useEffect, useState, useRef } from "react";
@@ -31,6 +31,7 @@ import { useAuthStore } from "@/store/authStore";
 import { sendEmail } from "@/api/email";
 // import { Button } from "@gluestack-ui/themed";
 import { Button, ButtonText } from "@/components/ui/button";
+import { SafeAreaView } from 'react-native-safe-area-context';
 
 export default function NoticeDetails() {
   const { id } = useLocalSearchParams();
@@ -46,8 +47,8 @@ export default function NoticeDetails() {
   const [currentIndex, setCurrentIndex] = useState(0);
   const [isMessageFormVisible, setIsMessageFormVisible] = useState(false);
   const [message, setMessage] = useState("");
-  const [Email, setEmail] = useState("");
   const [isSending, setIsSending] = useState(false);
+  const router = useRouter();
 
   const {width} = Dimensions.get("window");
 
@@ -230,7 +231,7 @@ export default function NoticeDetails() {
           );
         } catch (err) {
           console.error("Error while loading images:", err);
-          setImage({ uri: "https://http.cat/404.jpg" });
+          setImages({ uri: "https://http.cat/404.jpg" });
         } finally {
           setIsImageLoading(false);
         }
@@ -273,6 +274,7 @@ export default function NoticeDetails() {
   }
 
   return (
+      <SafeAreaView className="flex-1" edges={['right', 'bottom', 'left']}>
     <Card className="p-0 rounded-lg m-3 flex-1">
       <Stack.Screen
         options={{
@@ -391,6 +393,7 @@ export default function NoticeDetails() {
             </Text>
           </Box>
           <Box className="mt-4 bg-gray-50 p-3 rounded-lg shadow-sm">
+
             <Text className="text-2xl text-gray-950">Opis ogloszenia</Text>
             <Text className="text-sm text-typography-700">
               {notice.description}
@@ -404,15 +407,20 @@ export default function NoticeDetails() {
             ) : user ? (
               <>
                 <Box className="mr-4">
-                  <Image
+                  <Avatar size="md">
+                    <AvatarImage
                         source={{
                           uri:
-                        user.profileImage ||
+                              user.image ||
                               "https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain",
-                    }} // Domyślny obraz, jeśli brak zdjęcia profilowego
-                    className="h-12 w-12 rounded-full"
+                        }}
                         alt="Zdjęcie profilowe"
                     />
+                    <AvatarFallbackText>
+                      {user.firstName?.[0]}
+                      {user.lastName?.[0]}
+                    </AvatarFallbackText>
+                  </Avatar>
                 </Box>
 
                 <Box className="flex-1">
@@ -431,13 +439,11 @@ export default function NoticeDetails() {
                     </Text>
                   </Pressable>
 
-                  <Link href={`/user/${notice.clientId}`} asChild>
-                    <Button variant="outline" className="mt-2">
+                  <Button variant="outline" className="mt-2" onPress={() => router.replace(`/user/${notice.clientId}`)}>
                       <ButtonText>
                         Zobacz więcej ogłoszeń od {user.firstName}
                       </ButtonText>
                     </Button>
-                  </Link>
                 </Box>
               </>
             ) : (
@@ -446,52 +452,6 @@ export default function NoticeDetails() {
           </Box>
         </VStack>
       </ScrollView>
-      {/* {isMessageFormVisible && (
-        <View className="absolute inset-0 bg-black/50 bg-opacity-50 justify-center items-center z-20">
-          <View className="bg-white p-4 rounded-lg w-4/5">
-            <Text className="text-lg font-bold mb-4">
-              Wyślij wiadomość do {user?.firstName}
-            </Text>
-
-            <Text className="text-sm font-medium mb-1">Do:</Text>
-            <Text className="bg-gray-100 p-3 rounded text-gray-500">
-              {user?.email || "Brak adresu e-mail"}
-            </Text>
-            <Text className="text-sm font-medium mb-1">Twój e-mail:</Text>
-            <TextInput
-              className="border border-gray-300 p-2 rounded"
-              placeholder="Wpisz swój adres e-mail"
-              value={Email}
-              onChangeText={setEmail}
-            />
-
-            <TextInput
-              className="border border-gray-300 rounded-md p-2 mb-4 h-32 text-left"
-              multiline
-              numberOfLines={4}
-              placeholder="Napisz swoją wiadomość..."
-              value={message}
-              onChangeText={setMessage}
-            />
-
-            <View className="flex-row justify-end space-x-2">
-              <Pressable
-                onPress={() => setIsMessageFormVisible(false)}
-                className="bg-gray-300 py-2 px-4 rounded-md"
-              >
-                <Text className="text-gray-800">Anuluj</Text>
-              </Pressable>
-
-              <Pressable
-                onPress={handleSendMessage}
-                className="bg-primary-500 py-2 px-4 rounded-md"
-              >
-                <Text className="text-white">Wyślij</Text>
-              </Pressable>
-            </View>
-          </View>
-        </View>
-      )} */}
       {isMessageFormVisible && (
         <KeyboardAvoidingView
           behavior={Platform.OS === "ios" ? "padding" : "height"}
@@ -507,13 +467,10 @@ export default function NoticeDetails() {
               <Text className="bg-gray-100 p-3 rounded text-gray-500">
                 {user?.email || "Brak adresu e-mail"}
               </Text>
-              <Text className="text-sm font-medium mb-1">Twój e-mail:</Text>
-              <TextInput
-                className="border border-gray-300 p-2 rounded mb-4"
-                placeholder="Wpisz swój adres e-mail"
-                value={Email}
-                onChangeText={setEmail}
-              />
+              <Text className="text-sm font-medium mb-1">Temat:</Text>
+              <Text className="bg-gray-100 p-3 rounded text-gray-500">
+                Zapytanie o ogłoszenie '{notice.title || "Brak nazwy ogłoszenia"}'
+              </Text>
 
               <TextInput
                 className="border border-gray-300 rounded-md p-2 mb-4 h-32 text-left"
@@ -549,5 +506,7 @@ export default function NoticeDetails() {
         </KeyboardAvoidingView>
       )}
     </Card>
+      </SafeAreaView>
+
   );
 }