Merge branch 'fixesAfterMerge' of https://progit.zikor.pl/hamx/ArtisanConnectFrontend into fixesAfterMerge

Zdjęcia nie były centerowane względem szerokości

ArtisanConnect/api/client.jsx

@@ -12,10 +12,10 @@ export async function getUserById(userId) {
     });
     return response.data;
   } catch (err) {
-    console.error(
-      `Nie udało się pobrać danych użytkownika o ID ${userId}.`,
-      err.response.status
-    );
+    // console.error(
+    //   `Nie udało się pobrać danych użytkownika o ID ${userId}.`,
+    //   err.response.status
+    // );
     throw err;
   }
 }

ArtisanConnect/api/notices.jsx

@@ -73,9 +73,7 @@ export async function getAllImagesByNoticeId(noticeId) {
   const { token } = useAuthStore.getState();
   const headers = token ? { Authorization: `Bearer ${token}` } : {};
   try {
-    const listResponse = await axios.get(`${API_URL}/images/list/${noticeId}`, {
-      headers: headers,
-    });
+    const listResponse = await axios.get(`${API_URL}/images/list/${noticeId}`, {headers: headers});
 
     if (listResponse.data && listResponse.data.length > 0) {
       return listResponse.data.map((imageName) => ({
@@ -112,7 +110,7 @@ export const uploadImage = async (noticeId, imageUri) => {
   const type = match ? `image/${match[1]}` : "image/jpeg";
 
   formData.append("file", {
-    uri: imageUri.uri,
+    uri: imageUri,
     name: filename,
     type: type,
   });
@@ -129,6 +127,7 @@ export const uploadImage = async (noticeId, imageUri) => {
     return response.data;
   } catch (error) {
     console.log("imageURI:", imageUri);
+
     console.error(
       "Error uploading image:",
       error.response.data,
@@ -145,7 +144,7 @@ export const deleteNotice = async (noticeId) => {
   try {
     const response = await axios.delete(
       `${API_URL}/notices/delete/${noticeId}`,
-      { headers }
+      { headers: headers }
     );
     return response.data;
   } catch (error) {

ArtisanConnect/api/order.jsx

@@ -6,12 +6,11 @@ const API_URL = "https://hopp.zikor.pl/api/v1/orders";
 export async function createOrder(noticeId, orderType) {
   const { token } = useAuthStore.getState();
   const headers = token ? { Authorization: `Bearer ${token}` } : {};
-  const clientId = 1;
 
   try {
     const response = await axios.post(
       `${API_URL}/add`,
-      { clientId: clientId, noticeId: noticeId, orderType: orderType },
+      { noticeId: noticeId, orderType: orderType },
       {
         headers: headers,
       }
@@ -27,7 +26,6 @@ export async function createOrder(noticeId, orderType) {
 export async function createPayment(orderId) {
   const { token } = useAuthStore.getState();
   const headers = token ? { Authorization: `Bearer ${token}` } : {};
-  const clientId = 1;
   try {
     const response = await axios.post(
       `${API_URL}/token?orderId=${orderId}`,
@@ -48,7 +46,7 @@ export async function getOrder(orderId) {
   const headers = token ? { Authorization: `Bearer ${token}` } : {};
 
   try {
-    const response = await axios.get(`${API_URL}/get/${orderId}`, { headers });
+    const response = await axios.get(`${API_URL}/get/${orderId}`, { headers: headers });
     return response.data;
   } catch (error) {
     console.error(
@@ -65,7 +63,7 @@ export async function listOrders() {
   const headers = token ? { Authorization: `Bearer ${token}` } : {};
 
   try {
-    const response = await axios.get(`${API_URL}/get/all`, { headers });
+    const response = await axios.get(`${API_URL}/get/all`, { headers: headers });
     return response.data;
   } catch (error) {
     console.error(

ArtisanConnect/api/wishlist.jsx

@@ -12,7 +12,7 @@ export async function toggleNoticeStatus(noticeId) {
       `${API_URL}/toggle/${noticeId}`,
       {},
       {
-        headers,
+        headers: headers,
       }
     );
     return response.data;
@@ -27,7 +27,7 @@ export async function getWishlist() {
   const headers = token ? { Authorization: `Bearer ${token}` } : {};
 
   try {
-    const response = await axios.get(`${API_URL}/`, { headers });
+    const response = await axios.get(`${API_URL}/`, { headers: headers });
     return response.data;
   } catch (error) {
     console.error("Error fetching wishlist:", error);

ArtisanConnect/app.json

@@ -18,6 +18,18 @@
       "bundleIdentifier": "com.hamx.artisanconnect"
     },
     "android": {
+      "intentFilters": [
+        {
+          "action": "VIEW",
+          "autoVerify": true,
+          "data": [
+            {
+              "scheme": "com.hamx.artisanconnect"
+            }
+          ],
+          "category": ["BROWSABLE", "DEFAULT"]
+        }
+      ],
       "adaptiveIcon": {
         "foregroundImage": "./assets/adaptive-icon.png",
         "backgroundColor": "#ffffff"

ArtisanConnect/app/(auth)/login.jsx

@@ -1,7 +1,7 @@
 import React, {useEffect, useState} from 'react';
 import {StyleSheet, ActivityIndicator, SafeAreaView, View, Platform} from 'react-native';
 import {useAuthStore} from '@/store/authStore';
-import {useRouter, Link} from 'expo-router';
+import {useRouter} from 'expo-router';
 
 import {Box} from "@/components/ui/box"
 import {Button, ButtonText, ButtonIcon} from "@/components/ui/button"
@@ -73,6 +73,7 @@ export default function Login() {
                 user = await getUserInfo(response.authentication.accessToken)
                 await signInWithGoogle(response.authentication.accessToken);
                 alert(`Zalogowano jako ${user.email}`);
+                router.replace('/');
             }
 
         } else {

ArtisanConnect/app/(tabs)/dashboard/account.jsx

@@ -84,7 +84,7 @@ export default function Account() {
         </Link>
 
         {/*Tak dodałem, można zmienić na coś innego*/}
-        <Link href="/dashboard/userPaymentHistory" asChild>
+        <Link href="/dashboard/userOrders" asChild>
           <Pressable className="py-3 flex-row items-center border-b border-gray-100">
             <Text className="text-lg flex-1">Historia płatności</Text>
             <Text>▶</Text>

ArtisanConnect/app/(tabs)/dashboard/userNotices.jsx

@@ -6,50 +6,28 @@ import { Box } from "@/components/ui/box";
 import { Text } from "@/components/ui/text";
 import { VStack } from "@/components/ui/vstack";
 import { ActivityIndicator, FlatList } from "react-native";
-import { useEffect, useState, useRef } from "react";
+import { useEffect, useState } from "react";
 import { createOrder, createPayment, getOrder } from "@/api/order";
-import { Linking } from "react-native";
 import { Ionicons } from "@expo/vector-icons";
 import { useToast, Toast, ToastTitle } from "@/components/ui/toast";
-import { AppState } from "react-native";
 import { useAuthStore } from "@/store/authStore";
+import * as WebBrowser from 'expo-web-browser';
+import { useRouter } from "expo-router";
 
 export default function UserNotices() {
+  const router = useRouter();
   const { notices, fetchNotices, deleteNotice } = useNoticesStore();
   const [isLoading, setIsLoading] = useState(true);
   const [isRedirecting, setIsRedirecting] = useState(false);
   const toast = useToast();
-  const appState = useRef(AppState.currentState);
   const [toastId, setToastId] = useState(0);
   const { user_id } = useAuthStore.getState();
   const currentUserId = user_id;
   const [orderId, setOrderId] = useState(null);
 
   useEffect(() => {
-    if (!isRedirecting) return;
-    const subscription = AppState.addEventListener("change", (state) => {
-      if (state === "active") {
-        (async () => {
-          const lastOrder = await getOrder(orderId);
-          const lastPayments = lastOrder.payments;
-          const paymentStatus =
-            lastPayments.length > 0
-              ? lastPayments[lastPayments.length - 1].status
-              : null;
-          setIsRedirecting(false);
-          if (paymentStatus === "INCORRECT") {
-            showNewToast("Płatność została anulowana.");
-          } else if (paymentStatus === "CORRECT") {
-            showNewToast("Płatność została zrealizowana.");
-          } else {
-            showNewToast("Płatność jeszcze nie wpłynęła.");
-          }
-        })();
-      }
-      appState.current = state;
-    });
-    return () => subscription.remove();
-  }, [isRedirecting, toast, orderId]);
+    WebBrowser.maybeCompleteAuthSession();
+  }, []);
 
   useEffect(() => {
     const loadNotices = async () => {
@@ -84,28 +62,52 @@ export default function UserNotices() {
   };
 
   const handleOrder = async (noticeId, type) => {
-    {
-      try {
-        const result = await createOrder(noticeId, type);
-        if (result) {
-          setOrderId(result);
-          try {
-            const paymentResult = await createPayment(result);
-            if (paymentResult) {
-              setIsRedirecting(true);
-              await Linking.openURL(paymentResult);
-            } else {
-              console.log(`Nie udało się aktywować ogłoszenia 4 ${noticeId}.`);
-            }
-          } catch (err) {
-            // console.log("Błąd podczas aktywacji ogłoszenia 3:", err);
+    try {
+      const result = await createOrder(noticeId, type);
+      if (result) {
+        setOrderId(result);
+        try {
+          const paymentResult = await createPayment(result);
+          if (paymentResult) {
+            setIsRedirecting(true);
+
+
+            await WebBrowser.openAuthSessionAsync(paymentResult);
+
+
+            setTimeout(async () => {
+              setIsRedirecting(false);
+
+              try {
+                const lastOrder = await getOrder(result);
+                const lastPayments = lastOrder.payments;
+                const paymentStatus = lastPayments.length > 0
+                    ? lastPayments[lastPayments.length - 1].status
+                    : null;
+
+                if (paymentStatus === "CORRECT") {
+                  showNewToast("Płatność została zrealizowana.");
+                  await fetchNotices();
+                  router.replace("/notices");
+                } else {
+                  showNewToast("Sprawdzanie statusu płatności...");
+                }
+              } catch (err) {
+                console.log("Błąd podczas sprawdzania płatności:", err);
+                showNewToast("Nie udało się sprawdzić statusu płatności.");
+              }
+            }, 300);
+
+          } else {
+            console.log(`Nie udało się aktywować ogłoszenia ${noticeId}.`);
           }
-        } else {
-          // console.log(`Nie udało się aktywować ogłoszenia 2 ${noticeId}.`);
+        } catch (err) {
+          setIsRedirecting(false);
+          console.log("Błąd podczas aktywacji ogłoszenia:", err);
         }
-      } catch (err) {
-        console.log("Błąd podczas aktywacji ogłoszenia 1:", err);
       }
+    } catch (err) {
+      console.log("Błąd podczas aktywacji ogłoszenia:", err);
     }
   };
 
@@ -133,7 +135,7 @@ export default function UserNotices() {
     <VStack className="p-2">
       {isRedirecting && (
         <Box className="absolute inset-0 bg-white bg-opacity-30 justify-center items-center z-50">
-          <Ionicons name="card-outline" size="30" className="pt-4" />
+          <Ionicons name="card-outline" size={30} className="pt-4" />
           <Text className="text-lg font-bold pt-2">
             Przekierowanie do płatności...
           </Text>

ArtisanConnect/app/(tabs)/dashboard/userOrders.jsx

@@ -1,6 +1,10 @@
 import { View, Text } from "react-native";
 import { useState, useEffect, use } from "react";
+import { FlatList, RefreshControl } from "react-native";
 import { listOrders } from "@/api/order";
+import { Box } from "@/components/ui/box";
+import { VStack } from "@/components/ui/vstack";
+import { HStack } from "@/components/ui/hstack";
 
 export default function UserOrders() {
   const [orders, setOrders] = useState([]);
@@ -15,10 +19,31 @@ export default function UserOrders() {
     fetchOrders();
   }, []);
 
-  console.log("Orders:", orders);
+  if (orders.length === 0) {
+    return (
+      <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
+        <Text>Brak zamówień</Text>
+      </View>
+    );
+  }
+
   return (
-    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
-      <Text>Orders</Text>
-    </View>
+    <FlatList
+      className="m-2"
+      data={orders}
+      renderItem={({ item }) => (
+        <Box className="p-4 rounded-md bg-white mb-2">
+          <VStack>
+            <HStack>
+              <Text>{item.orderId}</Text>
+              <Text className="ml-2">{item.orderType}</Text>
+            </HStack>
+            <Text className="mt-2">{item.status}</Text>
+            <Text className="mt-2">Cena: {item.amount} zł</Text>
+            <Text className="mt-2">{item.createdAt}</Text>
+          </VStack>
+        </Box>
+      )}
+    />
   );
 }

ArtisanConnect/app/(tabs)/notice/create.jsx

@@ -1,280 +1,332 @@
-import {useState, useEffect} from "react";
-import {Image, StyleSheet, KeyboardAvoidingView, Platform, ActivityIndicator} from "react-native";
-import {Button, ButtonText} from "@/components/ui/button";
-import {FormControl} from "@/components/ui/form-control";
-import {Input, InputField} from "@/components/ui/input";
-import {Text} from "@/components/ui/text";
-import {VStack} from "@/components/ui/vstack";
-import {Textarea, TextareaInput} from "@/components/ui/textarea";
-import {ScrollView} from "@gluestack-ui/themed";
-import {Box} from "@/components/ui/box";
+import { useState, useEffect } from "react";
+import {
+  Image,
+  StyleSheet,
+  KeyboardAvoidingView,
+  Platform,
+  ActivityIndicator,
+} from "react-native";
+import { Button, ButtonText } from "@/components/ui/button";
+import { FormControl } from "@/components/ui/form-control";
+import { Input, InputField } from "@/components/ui/input";
+import { Text } from "@/components/ui/text";
+import { VStack } from "@/components/ui/vstack";
+import { Textarea, TextareaInput } from "@/components/ui/textarea";
+import { ScrollView } from "@gluestack-ui/themed";
+import { Box } from "@/components/ui/box";
 import * as ImagePicker from "expo-image-picker";
 import {
-    Select,
-    SelectTrigger,
-    SelectInput,
-    SelectIcon,
-    SelectPortal,
-    SelectBackdrop,
-    SelectContent,
-    SelectItem,
-    SelectScrollView,
+  Select,
+  SelectTrigger,
+  SelectInput,
+  SelectIcon,
+  SelectPortal,
+  SelectBackdrop,
+  SelectContent,
+  SelectItem,
+  SelectScrollView,
 } from "@/components/ui/select";
 
-import {ChevronDownIcon} from "@/components/ui/icon";
-import {useNoticesStore} from "@/store/noticesStore";
-import {listCategories} from "@/api/categories";
-import {useRouter} from "expo-router";
+import { ChevronDownIcon } from "@/components/ui/icon";
+import { useNoticesStore } from "@/store/noticesStore";
+import { listCategories } from "@/api/categories";
+import { useRouter } from "expo-router";
+import { attributes } from "@/data/attributesData"; // Assuming you have a separate file for attributes data}
 
 export default function CreateNotice() {
-    const router = useRouter();
-    const {addNotice, fetchNotices} = useNoticesStore();
-    const [title, setTitle] = useState("");
-    const [description, setDescription] = useState("");
-    const [price, setPrice] = useState("");
-    const [category, setCategory] = useState("");
-    const [image, setImage] = useState([]);
-    const [selectItems, setSelectItems] = useState([]);
-    const [isLoading, setIsLoading] = useState(false);
+  const router = useRouter();
+  const { addNotice, fetchNotices } = useNoticesStore();
+  const [title, setTitle] = useState("");
+  const [description, setDescription] = useState("");
+  const [price, setPrice] = useState("");
+  const [category, setCategory] = useState("");
+  const [image, setImage] = useState([]);
+  const [selectItems, setSelectItems] = useState([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [selectedAttributes, setSelectedAttributes] = useState({});
 
-    useEffect(() => {
-        let isMounted = true;
+  useEffect(() => {
+    let isMounted = true;
 
-        const fetchSelectItems = async () => {
-            try {
-                let data = await listCategories();
-                if (isMounted && Array.isArray(data)) {
-                    setSelectItems(data);
-                }
-            } catch (error) {
-                console.error("Error fetching select items:", error);
-            }
-        };
+    const fetchSelectItems = async () => {
+      try {
+        let data = await listCategories();
+        if (isMounted && Array.isArray(data)) {
+          setSelectItems(data);
+        }
+      } catch (error) {
+        console.error("Error fetching select items:", error);
+      }
+    };
 
-        fetchSelectItems();
+    fetchSelectItems();
 
-        return () => {
-            isMounted = false;
-        };
-    }, []);
+    return () => {
+      isMounted = false;
+    };
+  }, []);
 
-    const [error, setError] = useState({
-        title: false,
-        description: false,
-        price: false,
-        category: false,
+  const [error, setError] = useState({
+    title: false,
+    description: false,
+    price: false,
+    category: false,
+  });
+
+  const styles = StyleSheet.create({
+    container: {
+      flex: 1,
+      alignItems: "center",
+      justifyContent: "center",
+    },
+    image: {
+      width: 100,
+      height: 100,
+    },
+  });
+
+  const handleAddNotice = async () => {
+    setError({
+      title: !title,
+      description: !description,
+      price: !price,
+      category: !category,
     });
 
-    const styles = StyleSheet.create({
-        container: {
-            flex: 1,
-            alignItems: "center",
-            justifyContent: "center",
-        },
-        image: {
-            width: 100,
-            height: 100,
-        },
-    });
-
-    const handleAddNotice = async () => {
-        setError({
-            title: !title,
-            description: !description,
-            price: !price,
-            category: !category,
-        });
-
-        if (!title || !description || !price || !category) {
-            console.log("Error in form");
-            return;
-        }
-
-        setIsLoading(true);
-        try {
-            const result = await addNotice({
-                title: title,
-                description: description,
-                price: price,
-                category: category,
-                status: "INACTIVE",
-                image: image,
-            });
-
-            if (result) {
-                console.log("Notice created successfully with ID: ", result.noticeId);
-                await fetchNotices();
-                clearForm();
-
-                router.push("/(tabs)/dashboard/userNotices");
-            }
-        } catch (error) {
-            console.error("Error creating notice. Error message: ", error.message);
-        } finally {
-            setIsLoading(false);
-        }
-    };
-
-    const takePicture = async () => {
-        const {status} = await ImagePicker.requestCameraPermissionsAsync();
-        if (status !== "granted") {
-            return;
-        }
-        const result = await ImagePicker.launchCameraAsync({
-            allowsEditing: false,
-        });
-
-        if (!result.canceled && result.assets) {
-            setImage(result.assets.map((asset) => asset.uri));
-        }
-    };
-
-    const pickImage = async () => {
-        let result = await ImagePicker.launchImageLibraryAsync({
-            mediaTypes: "images",
-            selectionLimit: 8,
-            allowsEditing: false,
-            allowsMultipleSelection: true,
-            aspect: [4, 3],
-            quality: 0.5,
-        });
-
-        if (!result.canceled) {
-            setImage(result.assets.map((asset) => asset.uri));
-        }
-    };
-
-    const clearForm = () => {
-        setTitle("");
-        setDescription("");
-        setPrice("");
-        setCategory("");
-        setImage([]);
-        setError({
-            title: false,
-            description: false,
-            price: false,
-            category: false,
-        });
-    };
-
-    if (isLoading) {
-        return (
-            <Box className="items-center justify-center flex-1">
-                <ActivityIndicator size="large" color="#787878"/>
-                <Text size="md" bold="true" className='mt-5'>
-                    Dodajemy ogłoszenie...
-                </Text>
-            </Box>
-        );
+    if (!title || !description || !price || !category) {
+      console.log("Error in form");
+      return;
     }
-
-    return (
-        <KeyboardAvoidingView
-            behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
-            style={{flex: 1}}
-            keyboardVerticalOffset={Platform.OS === 'ios' ? 64 : 0}
-        >
-            <ScrollView h="$80" w="$80">
-                <FormControl className="p-4 border rounded-lg border-outline-300">
-                    <VStack space="xl">
-                        <VStack space="md">
-                            <Text className="text-typography-500">Zdjęcia</Text>
-                            <Button onPress={pickImage}>
-                                <ButtonText>Wybierz zdjęcia</ButtonText>
-                            </Button>
-                            <Button onPress={takePicture}>
-                                <ButtonText>Zrób zdjęcie</ButtonText>
-                            </Button>
-                            <Text size="sm" bold="true">
-                                Pierwsze zdjęcie będzie zdjęciem głównym
-                            </Text>
-                            {image && image.length > 0 && (
-                                <VStack space="xs" className="flex-row flex-wrap">
-                                    {image.map((img, index) => (
-                                        <Image
-                                            key={index}
-                                            source={{uri: img}}
-                                            style={styles.image}
-                                            className="m-1"
-                                        />
-                                    ))}
-                                </VStack>
-                            )}
-                        </VStack>
-
-                        <VStack space="xs">
-                            <Text className="text-typography-500">Tytuł</Text>
-                            <Input className="min-w-[250px]" isInvalid={error.title}>
-                                <InputField
-                                    type="text"
-                                    value={title}
-                                    onChangeText={(value) => setTitle(value)}
-                                />
-                            </Input>
-                        </VStack>
-
-                        <VStack space="xs">
-                            <Text className="text-typography-500">Opis</Text>
-                            <Textarea
-                                size="md"
-                                className="min-w-[250px] "
-                                isInvalid={error.description}
-                            >
-                                <TextareaInput
-                                    placeholder="Opisz produkt"
-                                    value={description}
-                                    onChangeText={(value) => setDescription(value)}
-                                />
-                            </Textarea>
-                        </VStack>
-
-                        <VStack space="xs">
-                            <Text className="text-typography-500">Cena</Text>
-                            <Input className="min-w-[250px]" isInvalid={error.price}>
-                                <InputField
-                                    type="text"
-                                    value={price}
-                                    onChangeText={(value) => setPrice(value)}
-                                />
-                            </Input>
-                        </VStack>
-                        <VStack space="xs">
-                            <Text className="text-typography-500">Kategoria</Text>
-                            <Select
-                                onValueChange={(value) => setCategory(value)}
-                                isInvalid={error.category}
-                            >
-                                <SelectTrigger variant="outline" size="md">
-                                    <SelectInput placeholder="Wybierz kategorię"/>
-                                    <SelectIcon className="mr-3" as={ChevronDownIcon}/>
-                                </SelectTrigger>
-                                <SelectPortal>
-                                    <SelectBackdrop/>
-                                    <SelectContent style={{maxHeight: 400}}>
-                                        <SelectScrollView>
-                                            {selectItems.map((item) => (
-                                                <SelectItem
-                                                    key={item.value}
-                                                    label={item.label}
-                                                    value={item.value}
-                                                />
-                                            ))}
-                                        </SelectScrollView>
-                                    </SelectContent>
-                                </SelectPortal>
-                            </Select>
-                        </VStack>
-                        <Button
-                            className="mt-5 w-full"
-                            onPress={handleAddNotice}
-                            disabled={isLoading}
-                        >
-                            <ButtonText className="text-typography-0">Dodaj</ButtonText>
-                        </Button>
-                    </VStack>
-                </FormControl>
-            </ScrollView>
-        </KeyboardAvoidingView>
+    const formattedAttributes = Object.entries(selectedAttributes).map(
+      ([name, value]) => ({
+        name: name,
+        value: value,
+      })
     );
+    // console.log("Selected attributes:", formattedAttributes);
+    setIsLoading(true);
+    try {
+      const result = await addNotice({
+        title: title,
+        description: description,
+        price: price,
+        category: category,
+        status: "INACTIVE",
+        image: image,
+        attributes: formattedAttributes,
+      });
+
+      if (result) {
+        console.log("Notice created successfully with ID: ", result.noticeId);
+        await fetchNotices();
+        clearForm();
+
+        router.push("/(tabs)/dashboard/userNotices");
+      }
+    } catch (error) {
+      console.error("Error creating notice. Error message: ", error.message);
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const takePicture = async () => {
+    const { status } = await ImagePicker.requestCameraPermissionsAsync();
+    if (status !== "granted") {
+      return;
+    }
+    const result = await ImagePicker.launchCameraAsync({
+      allowsEditing: false,
+    });
+
+    if (!result.canceled && result.assets) {
+      setImage(result.assets.map((asset) => asset.uri));
+    }
+  };
+
+  const pickImage = async () => {
+    let result = await ImagePicker.launchImageLibraryAsync({
+      mediaTypes: "images",
+      selectionLimit: 8,
+      allowsEditing: false,
+      allowsMultipleSelection: true,
+      aspect: [4, 3],
+      quality: 0.5,
+    });
+
+    if (!result.canceled) {
+      setImage(result.assets.map((asset) => asset.uri));
+    }
+  };
+
+  const clearForm = () => {
+    setTitle("");
+    setDescription("");
+    setPrice("");
+    setCategory("");
+    setImage([]);
+    setSelectedAttributes({});
+    setError({
+      title: false,
+      description: false,
+      price: false,
+      category: false,
+    });
+  };
+
+  if (isLoading) {
+    return (
+      <Box className="items-center justify-center flex-1">
+        <ActivityIndicator size="large" color="#787878" />
+        <Text size="md" bold="true" className="mt-5">
+          Dodajemy ogłoszenie...
+        </Text>
+      </Box>
+    );
+  }
+
+  return (
+    <KeyboardAvoidingView
+      behavior={Platform.OS === "ios" ? "padding" : "height"}
+      style={{ flex: 1 }}
+      keyboardVerticalOffset={Platform.OS === "ios" ? 64 : 0}
+    >
+      <ScrollView h="$80" w="$80">
+        <FormControl className="p-4 border rounded-lg border-outline-300">
+          <VStack space="xl">
+            <VStack space="md">
+              <Text className="text-typography-500">Zdjęcia</Text>
+              <Button onPress={pickImage}>
+                <ButtonText>Wybierz zdjęcia</ButtonText>
+              </Button>
+              <Button onPress={takePicture}>
+                <ButtonText>Zrób zdjęcie</ButtonText>
+              </Button>
+              <Text size="sm" bold="true">
+                Pierwsze zdjęcie będzie zdjęciem głównym
+              </Text>
+              {image && image.length > 0 && (
+                <VStack space="xs" className="flex-row flex-wrap">
+                  {image.map((img, index) => (
+                    <Image
+                      key={index}
+                      source={{ uri: img }}
+                      style={styles.image}
+                      className="m-1"
+                    />
+                  ))}
+                </VStack>
+              )}
+            </VStack>
+
+            <VStack space="xs">
+              <Text className="text-typography-500">Tytuł*</Text>
+              <Input className="min-w-[250px]" isInvalid={error.title}>
+                <InputField
+                  type="text"
+                  value={title}
+                  onChangeText={(value) => setTitle(value)}
+                />
+              </Input>
+            </VStack>
+
+            <VStack space="xs">
+              <Text className="text-typography-500">Opis*</Text>
+              <Textarea
+                size="md"
+                className="min-w-[250px] "
+                isInvalid={error.description}
+              >
+                <TextareaInput
+                  placeholder="Opisz produkt"
+                  value={description}
+                  onChangeText={(value) => setDescription(value)}
+                />
+              </Textarea>
+            </VStack>
+
+            <VStack space="xs">
+              <Text className="text-typography-500">Cena*</Text>
+              <Input className="min-w-[250px]" isInvalid={error.price}>
+                <InputField
+                  type="text"
+                  value={price}
+                  onChangeText={(value) => setPrice(value)}
+                />
+              </Input>
+            </VStack>
+            <VStack space="xs">
+              <Text className="text-typography-500">Kategoria*</Text>
+              <Select
+                onValueChange={(value) => setCategory(value)}
+                isInvalid={error.category}
+              >
+                <SelectTrigger variant="outline" size="md">
+                  <SelectInput placeholder="Wybierz kategorię" />
+                  <SelectIcon className="mr-3" as={ChevronDownIcon} />
+                </SelectTrigger>
+                <SelectPortal>
+                  <SelectBackdrop />
+                  <SelectContent style={{ maxHeight: 400 }}>
+                    <SelectScrollView>
+                      {selectItems.map((item) => (
+                        <SelectItem
+                          key={item.value}
+                          label={item.label}
+                          value={item.value}
+                        />
+                      ))}
+                    </SelectScrollView>
+                  </SelectContent>
+                </SelectPortal>
+              </Select>
+            </VStack>
+
+            {Object.entries(attributes).map(([label, options]) => (
+              <VStack key={label} space="xs">
+                <Text className="text-typography-500">{label}</Text>
+                <Select
+                  onValueChange={(value) =>
+                    setSelectedAttributes((prev) => ({
+                      ...prev,
+                      [label]: value,
+                    }))
+                  }
+                >
+                  <SelectTrigger variant="outline" size="md">
+                    <SelectInput
+                      placeholder={`Wybierz ${label.toLowerCase()}`}
+                    />
+                    <SelectIcon className="mr-3" as={ChevronDownIcon} />
+                  </SelectTrigger>
+                  <SelectPortal>
+                    <SelectBackdrop />
+                    <SelectContent style={{ maxHeight: 400 }}>
+                      <SelectScrollView>
+                        {options.map((option) => (
+                          <SelectItem
+                            key={option}
+                            label={option}
+                            value={option}
+                          />
+                        ))}
+                      </SelectScrollView>
+                    </SelectContent>
+                  </SelectPortal>
+                </Select>
+              </VStack>
+            ))}
+
+            <Button
+              className="mt-5 w-full"
+              onPress={handleAddNotice}
+              disabled={isLoading}
+            >
+              <ButtonText className="text-typography-0">Dodaj</ButtonText>
+            </Button>
+          </VStack>
+        </FormControl>
+      </ScrollView>
+    </KeyboardAvoidingView>
+  );
 }

ArtisanConnect/app/(tabs)/notices.jsx

@@ -39,11 +39,11 @@ import {
   SelectDragIndicator,
   SelectDragIndicatorWrapper,
   SelectItem,
+  SelectScrollView,
 } from "@/components/ui/select";
-import { ScrollView } from "react-native-gesture-handler";
+import { attributes } from "@/data/attributesData";
 
 export default function Notices() {
-  // Hooks
   const { notices, fetchNotices } = useNoticesStore();
   const [refreshing, setRefreshing] = useState(false);
   const [isLoading, setIsLoading] = useState(true);
@@ -52,6 +52,7 @@ export default function Notices() {
   const [showSortSheet, setShowSortSheet] = useState(false);
   const [categories, setCategories] = useState([]);
   const [filteredNotices, setFilteredNotices] = useState([]);
+  const [selectedAttributes, setSelectedAttributes] = useState({});
   const params = useLocalSearchParams();
   const router = useRouter();
 
@@ -131,6 +132,21 @@ export default function Notices() {
       });
     }
 
+    Object.keys(params).forEach((key) => {
+      if (key.startsWith("attribute_")) {
+        // console.log("Filtering by attribute:", key);
+        const attributeName = key.replace("attribute_", "");
+        const attributeValue = params[key];
+
+        result = result.filter((notice) =>
+          notice.attributes?.some(
+            (attr) =>
+              attr.name === attributeName && attr.value === attributeValue
+          )
+        );
+      }
+    });
+
     setFilteredNotices(result);
   }, [
     notices,
@@ -139,6 +155,8 @@ export default function Notices() {
     params.priceFrom,
     params.priceTo,
     params.search,
+    params.attribute_Kolor,
+    params.attribute_Materiał,
   ]);
 
   let filterActive =
@@ -146,7 +164,8 @@ export default function Notices() {
     !!params.sort ||
     !!params.priceFrom ||
     !!params.priceTo ||
-    !!params.search;
+    !!params.search ||
+    Object.keys(params).some((key) => key.startsWith("attribute_"));
 
   const loadData = async () => {
     setIsLoading(true);
@@ -181,6 +200,20 @@ export default function Notices() {
     });
   };
 
+  const handleAttributeSelect = (attributeName, value) => {
+    const newParams = { ...params };
+
+    if (value) {
+      newParams[`attribute_${attributeName}`] = value;
+    }
+
+    // console.log("New Params:", newParams);
+    router.replace({
+      pathname: "/notices",
+      params: newParams,
+    });
+  };
+
   const handleClose = () => setShowActionsheet(false);
 
   const handleSort = (value) => {
@@ -217,6 +250,8 @@ export default function Notices() {
       categories?.find((cat) => cat.value === params.category)) ||
     null;
 
+  // console.log("Filtered Notices:", filteredNotices);
+
   return (
     <>
       <Box
@@ -321,6 +356,42 @@ export default function Notices() {
                 </SelectPortal>
               </Select>
             </Box>
+            <Box>
+              {Object.entries(attributes).map(([label, options]) => (
+                <Box className="mb-4" key={label}>
+                  {/* <Text className="text-typography-500">{label}</Text> */}
+                  <Select
+                    style={{ flex: 1 }}
+                    onValueChange={(value) =>
+                      handleAttributeSelect(label, value)
+                    }
+                  >
+                    <SelectTrigger variant="outline" size="md">
+                      <SelectInput
+                        style={{ flex: 1 }}
+                        placeholder={`Wybierz ${label.toLowerCase()}`}
+                        value={params[`attribute_${label}`] || ""}
+                      />
+                      <SelectIcon className="mr-3" as={ChevronDownIcon} />
+                    </SelectTrigger>
+                    <SelectPortal>
+                      <SelectBackdrop />
+                      <SelectContent style={{ maxHeight: 400 }}>
+                        <SelectScrollView>
+                          {options.map((option) => (
+                            <SelectItem
+                              key={option}
+                              label={option}
+                              value={option}
+                            />
+                          ))}
+                        </SelectScrollView>
+                      </SelectContent>
+                    </SelectPortal>
+                  </Select>
+                </Box>
+              ))}
+            </Box>
           </KeyboardAwareScrollView>
         </ActionsheetContent>
       </Actionsheet>

ArtisanConnect/app/_layout.jsx

@@ -1,31 +1,31 @@
-import { Stack, Redirect } from "expo-router";
+import {Stack} from "expo-router";
 import "@/global.css";
-import { GluestackUIProvider } from "@/components/ui/gluestack-ui-provider";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+import {GluestackUIProvider} from "@/components/ui/gluestack-ui-provider";
+import {QueryClient, QueryClientProvider} from "@tanstack/react-query";
 
 const queryClient = new QueryClient();
 export default function RootLayout() {
-  
-return (
-    <QueryClientProvider client={queryClient}>
-      <GluestackUIProvider>
-        <Stack
-          screenOptions={{
-            headerTintColor: "#1c1c1e",
-            headerBackTitleVisible: false,
-            headerBackTitle: "Wróć",
-          }}
-        >
-          <Stack.Screen name="(tabs)" options={{ headerShown: false }} />
-            <Stack.Screen name="user" options={{ headerShown: false }} />
-          <Stack.Screen
-            name="(auth)/login"
-            options={{ headerShown: false }}/>
-          <Stack.Screen 
-          name="registration"
-          options={{ headerShown: false }}/>
-        </Stack>
-      </GluestackUIProvider>
-    </QueryClientProvider>
-  );
+
+    return (
+        <QueryClientProvider client={queryClient}>
+            <GluestackUIProvider>
+                <Stack
+                    screenOptions={{
+                        headerTintColor: "#1c1c1e",
+                        headerBackTitleVisible: false,
+                        headerBackTitle: "Wróć",
+                    }}
+                >
+                    <Stack.Screen name="(tabs)" options={{headerShown: false}}/>
+                    {/*<Stack.Screen name="user" options={{headerShown: false}}/>*/}
+                    <Stack.Screen
+                        name="(auth)/login"
+                        options={{headerShown: false}}/>
+                    <Stack.Screen
+                        name="registration"
+                        options={{headerShown: false}}/>
+                </Stack>
+            </GluestackUIProvider>
+        </QueryClientProvider>
+    );
 }

ArtisanConnect/app/notice/[id].jsx

@@ -1,25 +1,37 @@
-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";
 import { Ionicons } from "@expo/vector-icons";
+import {
+  Avatar,
+  AvatarImage,
+  AvatarFallbackText,
+} from "@/components/ui/avatar";
 import {
   ActivityIndicator,
   Dimensions,
   FlatList,
   View,
   TextInput,
+  Alert,
 } from "react-native";
 import { useEffect, useState, useRef } from "react";
 import { useNoticesStore } from "@/store/noticesStore";
 import { useWishlist } from "@/store/wishlistStore";
 import { Pressable, ScrollView } from "react-native";
 import { getUserById } from "@/api/client";
-
-const { width } = Dimensions.get("window");
+import * as ScreenOrientation from "expo-screen-orientation";
+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();
@@ -30,20 +42,87 @@ export default function NoticeDetails() {
   const [notice, setNotice] = useState(null);
   const [user, setUser] = useState(null);
   const [isUserLoading, setIsUserLoading] = useState(true);
+  const [isLandscape, setIsLandscape] = useState(false);
   const flatListRef = useRef(null);
   const [currentIndex, setCurrentIndex] = useState(0);
-
   const [isMessageFormVisible, setIsMessageFormVisible] = useState(false);
   const [message, setMessage] = useState("");
-  const [Email, setEmail] = useState("");
-  const handleSendMessage = () => {
-    console.log("Wiadomość do:", user?.email);
-    console.log("Email nadawcy:", Email);
-    console.log("Treść:", message);
+  const [isSending, setIsSending] = useState(false);
+  const router = useRouter();
 
-    setIsMessageFormVisible(false);
-    setMessage("");
-    setEmail("");
+  const {width} = Dimensions.get("window");
+
+  const handleSendMessage = async () => {
+    setIsSending(true);
+    console.log("Rozpoczynanie procesu wysyłania wiadomości...");
+
+    const { user_id, token } = useAuthStore.getState();
+    console.log("Dane z authStore:", { user_id, token });
+
+    if (!user_id || !token) {
+      console.error("Brak danych zalogowanego użytkownika.");
+      Alert.alert("Błąd", "Zaloguj się, aby wysłać wiadomość.");
+      setIsSending(false);
+      return;
+    }
+
+    let currentUserEmail = "";
+    try {
+      console.log(`Pobieranie danych użytkownika dla user_id : $ { user_id }`);
+      const currentUser = await getUserById(user_id);
+      console.log("Dane zalogowanego użytkownika:", currentUser);
+      currentUserEmail = currentUser?.email;
+      if (!currentUserEmail) {
+        console.error("Nie znaleziono adresu email zalogowanego użytkownika.");
+        Alert.alert(
+          "Błąd",
+          "Nie znaleziono adresu email zalogowanego użytkownika."
+        );
+        setIsSending(false);
+        return;
+      }
+      console.log(`Pobrano email zalogowanego użytkownika
+                  : $ { currentUserEmail }`);
+    } catch (error) {
+      console.error("Błąd podczas pobierania danych użytkownika:", error);
+      Alert.alert(
+        "Błąd",
+        "Nie udało się pobrać danych użytkownika. Spróbuj ponownie później."
+      );
+      setIsSending(false);
+      return;
+    }
+
+    const emailData = {
+      to: user?.email || "",
+      subject: `Zapytanie ${currentUserEmail} o ogłoszenie ${notice.title}`,
+      body: message,
+    };
+    console.log("Dane emaila do wysyłki:", emailData);
+
+    if (!emailData.to || !emailData.subject || !emailData.body) {
+      console.error("Walidacja nieudana: brakujące pola w emailData.");
+      Alert.alert("Błąd", "Wszystkie pola są wymagane!");
+      setIsSending(false);
+      return;
+    }
+
+    const result = await sendEmail(emailData);
+    if (result.success) {
+      console.log("Wiadomość wysłana pomyślnie!", result.result);
+      setIsMessageFormVisible(false);
+      setMessage("");
+      Alert.alert("Sukces", "Wiadomość została wysłana!");
+    } else {
+      console.error("Błąd podczas wysyłania wiadomości:", result.error);
+      Alert.alert(
+        "Błąd",
+        `Nie udało się wysłać wiadomości
+                  : $ { result.error }`
+      );
+    }
+    setIsSending(false);
+    console.log("Zakończono proces wysyłania wiadomości.");
   };
 
   const formatDate = (dateString) => {
@@ -73,6 +152,51 @@ export default function NoticeDetails() {
     itemVisiblePercentThreshold: 70,
   }).current;
 
+  useEffect(() => {
+    const unlockOrientation = async () => {
+      try {
+        await ScreenOrientation.unlockAsync();
+      } catch (err) {
+        console.error("Error unlocking orientation:", err);
+      }
+    };
+
+    const getInitialOrientation = async () => {
+      try {
+        const orientation = await ScreenOrientation.getOrientationAsync();
+        setIsLandscape(
+          orientation === ScreenOrientation.Orientation.LANDSCAPE_LEFT ||
+            orientation === ScreenOrientation.Orientation.LANDSCAPE_RIGHT
+        );
+      } catch (err) {
+        console.error("Error getting initial orientation:", err);
+      }
+    };
+
+    unlockOrientation();
+    getInitialOrientation();
+
+    const subscription = ScreenOrientation.addOrientationChangeListener(
+      ({ orientationInfo }) => {
+        const isLandscapeMode =
+          orientationInfo.orientation ===
+            ScreenOrientation.Orientation.LANDSCAPE_LEFT ||
+          orientationInfo.orientation ===
+            ScreenOrientation.Orientation.LANDSCAPE_RIGHT;
+        setIsLandscape(isLandscapeMode);
+      }
+    );
+
+    return () => {
+      ScreenOrientation.removeOrientationChangeListener(subscription);
+      ScreenOrientation.lockAsync(
+        ScreenOrientation.OrientationLock.PORTRAIT_UP
+      ).catch((err) =>
+        console.error("Error locking orientation on unmount:", err)
+      );
+    };
+  }, []);
+
   useEffect(() => {
     const fetchNotice = async () => {
       setIsLoading(true);
@@ -107,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);
         }
@@ -150,10 +274,12 @@ 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={{
           title: notice.title,
+          headerShown: !isLandscape,
         }}
       />
       {isImageLoading ? (
@@ -161,25 +287,57 @@ export default function NoticeDetails() {
           <ActivityIndicator size="large" color="#3b82f6" />
         </Box>
       ) : (
-        <Box className="sticky top-0 z-10 bg-white">
+        <Box
+          className="sticky top-0 z-10 bg-white"
+          style={
+            isLandscape
+              ? {
+                  position: "absolute",
+                  top: 0,
+                  left: 0,
+                  right: 0,
+                  bottom: 0,
+                  zIndex: 30,
+                }
+              : {}
+          }
+        >
           <FlatList
             ref={flatListRef}
             data={images}
             horizontal
-            snapToInterval={width}
             snapToAlignment="start"
+            snapToInterval={width}
             decelerationRate="fast"
             showsHorizontalScrollIndicator={false}
             pagingEnabled
             onViewableItemsChanged={onViewableItemsChanged}
             viewabilityConfig={viewabilityConfig}
+            style={isLandscape ? { flex: 1 } : {}}
             renderItem={({ item, index }) => (
-              <View style={{ width: width }} className="p-1">
+              <View
+                style={{ width: width }}
+                className="p-1"
+              >
                 <Image
                   source={item}
-                  className="h-auto w-auto rounded-md aspect-[1/1]"
+                  // className="h-auto w-auto rounded-md aspect-[1/1]"
                   alt={`Zdjęcie ${index + 1}`}
                   resizeMode="cover"
+                  renderMode="contain"
+                  className={
+                    isLandscape
+                      ? "w-auto h-full"
+                      : "h-auto w-auto rounded-md aspect-[1/1]"
+                  }
+                  style={
+                    isLandscape
+                      ? {
+                          resizeMode: "contain",
+                        }
+                      : {}
+                  }
+                  // resizeMode={isLandscape ? "cover" : "contain"}
                 />
               </View>
             )}
@@ -206,7 +364,7 @@ export default function NoticeDetails() {
           <Text className="text-sm font-normal mb-2 text-typography-700">
             {formatDate(notice.publishDate)}
           </Text>
-          <Text className="text-2xl text-gray-950 font-bold mb-2 text-center bg-gray-50 rounded-md p-2">
+          <Text className="text-2xl text-gray-950 font-bold mb-2 text-left bg-gray-50 rounded-md p-2">
             {notice.title}
           </Text>
 
@@ -235,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}
@@ -248,15 +407,20 @@ export default function NoticeDetails() {
             ) : user ? (
               <>
                 <Box className="mr-4">
-                  <Image
-                    source={{
-                      uri:
-                        user.profileImage ||
-                        "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"
-                  />
+                  <Avatar size="md">
+                    <AvatarImage
+                        source={{
+                          uri:
+                              user.image ||
+                              "https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain",
+                        }}
+                        alt="Zdjęcie profilowe"
+                    />
+                    <AvatarFallbackText>
+                      {user.firstName?.[0]}
+                      {user.lastName?.[0]}
+                    </AvatarFallbackText>
+                  </Avatar>
                 </Box>
 
                 <Box className="flex-1">
@@ -274,11 +438,12 @@ export default function NoticeDetails() {
                       Wyślij wiadomość
                     </Text>
                   </Pressable>
-                  <Link href={`/user/${notice.clientId}`}>
-                    <Text className="text-xl p-3 font-bold text-center text-typography-700 mt-3">
-                      Zobacz więcej ogłoszeń od {user.firstName}
-                    </Text>
-                  </Link>
+
+                  <Button variant="outline" className="mt-2" onPress={() => router.replace(`/user/${notice.clientId}`)}>
+                      <ButtonText>
+                        Zobacz więcej ogłoszeń od {user.firstName}
+                      </ButtonText>
+                    </Button>
                 </Box>
               </>
             ) : (
@@ -288,51 +453,60 @@ export default function NoticeDetails() {
         </VStack>
       </ScrollView>
       {isMessageFormVisible && (
-        <View className="absolute inset-0 bg-black 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>
+        <KeyboardAvoidingView
+          behavior={Platform.OS === "ios" ? "padding" : "height"}
+          className="absolute inset-0 bg-black/50 justify-center items-center z-20"
+        >
+          <View className="bg-white p-4 rounded-lg w-4/5 max-h-4/5">
+            <ScrollView showsVerticalScrollIndicator={false}>
+              <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}
-            />
+              <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">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"
-              multiline
-              numberOfLines={4}
-              placeholder="Napisz swoją wiadomość..."
-              value={message}
-              onChangeText={setMessage}
-            />
+              <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>
+              <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>
+                <Pressable
+                  onPress={handleSendMessage}
+                  className="bg-blue-500 py-2 px-4 rounded-md"
+                  disabled={isSending}
+                >
+                  {isSending ? (
+                    <ActivityIndicator color="#fff" />
+                  ) : (
+                    <Text className="text-white">Wyślij</Text>
+                  )}
+                </Pressable>
+              </View>
+            </ScrollView>
           </View>
-        </View>
+        </KeyboardAvoidingView>
       )}
     </Card>
+      </SafeAreaView>
+
   );
 }

ArtisanConnect/app/user/[userId].jsx

@@ -1,4 +1,4 @@
-import { useLocalSearchParams } from "expo-router";
+import { useLocalSearchParams, Stack } from "expo-router";
 import { useState, useEffect } from "react";
 import { FlatList, ActivityIndicator, Text } from "react-native";
 import { Box } from "@/components/ui/box";
@@ -10,60 +10,75 @@ import { useNoticesStore } from "@/store/noticesStore";
 import { NoticeCard } from "@/components/NoticeCard";
 
 export default function UserProfile() {
-    const { userId } = useLocalSearchParams();
-    const [user, setUser] = useState(null);
-    const [isUserLoading, setIsUserLoading] = useState(true);
-    const { notices } = useNoticesStore();
+  const { userId } = useLocalSearchParams();
+  const [user, setUser] = useState(null);
+  const [isUserLoading, setIsUserLoading] = useState(true);
+  const { notices } = useNoticesStore();
 
-    useEffect(() => {
-        const fetchUser = async () => {
-            setIsUserLoading(true);
-            try {
-                const userData = await getUserById(Number(userId));
-                setUser(userData);
-            } catch (err) {
-                console.error("Błąd podczas pobierania danych użytkownika:", err);
-                setUser(null);
-            } finally {
-                setIsUserLoading(false);
-            }
-        };
-        fetchUser();
-    }, [userId]);
+  useEffect(() => {
+    const fetchUser = async () => {
+      setIsUserLoading(true);
+      try {
+        const userData = await getUserById(Number(userId));
+        setUser(userData);
+      } catch (err) {
+        console.error("Błąd podczas pobierania danych użytkownika:", err);
+        setUser(null);
+      } finally {
+        setIsUserLoading(false);
+      }
+    };
+    fetchUser();
+  }, [userId]);
 
-    if (isUserLoading) {
-        return <ActivityIndicator />;
-    }
+  if (isUserLoading) {
+    return <ActivityIndicator />;
+  }
 
-    if (!user) {
-        return <Text>Nie znaleziono użytkownika</Text>;
-    }
+  if (!user) {
+    return <Text>Nie znaleziono użytkownika</Text>;
+  }
 
-    const userNotices = notices.filter(notice => notice.clientId === Number(userId));
+  const userNotices = notices.filter(
+    (notice) => notice.clientId === Number(userId)
+  );
 
-    return (
-        <VStack className="p-4">
-            <Box className="flex-row items-center mb-4">
-                <Image
-                    source={{ uri: user.profileImage || "https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain" }}
-                    className="h-16 w-16 rounded-full mr-4"
-                    alt="Zdjęcie profilowe"
-                />
-                <Heading size="lg">
-                    {user.firstName} {user.lastName}
-                </Heading>
-            </Box>
-            {userNotices.length > 0 ? (
-                <FlatList
-                    data={userNotices}
-                    numColumns={2}
-                    columnWrapperStyle={{ marginBottom: 10, justifyContent: "space-between" }}
-                    renderItem={({ item }) => <NoticeCard notice={item} />}
-                    keyExtractor={(item) => item.noticeId.toString()}
-                />
-            ) : (
-                <Text>Ten użytkownik nie ma żadnych ogłoszeń.</Text>
-            )}
-        </VStack>
-    );
-}
+  return (
+    <VStack className="p-4">
+      <Stack.Screen
+        options={{
+          title: "Ogłoszenia użytkownika",
+        }}
+      />
+      <Box className="flex-row items-center mb-4">
+        <Image
+          source={{
+            uri:
+              user.profileImage ||
+              "https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain",
+          }}
+          className="h-16 w-16 rounded-full mr-4"
+          alt="Zdjęcie profilowe"
+        />
+        <Heading size="lg">
+          {user.firstName} {user.lastName}
+        </Heading>
+      </Box>
+      {userNotices.length > 0 ? (
+        <FlatList
+          data={userNotices}
+          numColumns={2}
+          columnWrapperStyle={{
+            marginBottom: 10,
+            justifyContent: "space-between",
+            gap: 8,
+          }}
+          renderItem={({ item }) => <NoticeCard notice={item} />}
+          keyExtractor={(item) => item.noticeId.toString()}
+        />
+      ) : (
+        <Text>Ten użytkownik nie ma żadnych ogłoszeń.</Text>
+      )}
+    </VStack>
+  );
+}

ArtisanConnect/app/user/_layout.jsx

@@ -1,11 +0,0 @@
-import { Stack } from 'expo-router';
-
-export default function UserLayout() {
-    return (
-        <Stack
-            screenOptions={{
-                headerTitle: 'Ogłoszenia użytkownika',
-            }}
-        />
-    );
-}

ArtisanConnect/components/UserBlock.jsx

@@ -1,23 +1,35 @@
-import { VStack } from '@/components/ui/vstack';
-import { Avatar, AvatarImage, AvatarFallbackText } from "@/components/ui/avatar";
+import { VStack } from "@/components/ui/vstack";
+import {
+  Avatar,
+  AvatarImage,
+  AvatarFallbackText,
+} from "@/components/ui/avatar";
 import { Heading } from "@/components/ui/heading";
-import { Box } from '@/components/ui/box';
+import { Box } from "@/components/ui/box";
+import { Link } from "expo-router";
 
 export default function UserBlock({ user }) {
-      
-      return (
-      <Box className="rounded-md bg-white p-4 items-center justify-center mb-6" >
-      <VStack space="md" className='items-center'>
-        <Avatar>
-          <AvatarFallbackText>{user.firstName} {user.lastName}</AvatarFallbackText>
-          <AvatarImage
-            source={{
-              uri: user.image,
-            }}
-          />
-        </Avatar>
-          <Heading size="sm">{user.firstName} {user.lastName}</Heading>
-      </VStack>
+  return (
+    <Link href={`/user/${user.id}`}>
+      <Box className="rounded-md bg-white p-4 items-center justify-center mb-6">
+        <VStack space="md" className="items-center">
+          <Avatar>
+            <AvatarFallbackText>
+              {user.firstName} {user.lastName}
+            </AvatarFallbackText>
+            <AvatarImage
+              source={{
+                uri:
+                  user.image ||
+                  "https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain",
+              }}
+            />
+          </Avatar>
+          <Heading size="sm">
+            {user.firstName} {user.lastName}
+          </Heading>
+        </VStack>
       </Box>
-      );
-}
+    </Link>
+  );
+}

ArtisanConnect/components/UserSection.jsx

@@ -14,7 +14,9 @@ export function UserSection({ notices, title }) {
   useEffect(() => {
     if (token) {
       axios
-        .get("https://hopp.zikor.pl/api/v1/clients/get/all", { headers })
+        .get("https://hopp.zikor.pl/api/v1/clients/get/all", {
+          headers: headers,
+        })
         .then((res) => setUsers(res.data))
         .catch(() => setUsers([]));
     }

ArtisanConnect/data/attributesData.jsx

@@ -0,0 +1,28 @@
+export const attributes = {
+  Kolor: [
+    "Zielony",
+    "Czerwony",
+    "Niebieski",
+    "Żółty",
+    "Biały",
+    "Czarny",
+    "Różowy",
+    "Szary",
+    "Fioletowy",
+    "Pomarańczowy",
+    "Inny",
+  ],
+  Materiał: [
+    "Bawełna",
+    "Wełna",
+    "Syntetyk",
+    "Skóra",
+    "Len",
+    "Jedwab",
+    "Poliester",
+    "Akryl",
+    "Wiskoza",
+    "Nylon",
+    "Inny",
+  ],
+};

ArtisanConnect/store/authStore.jsx

@@ -19,6 +19,7 @@ export const useAuthStore = create(
               (error.response && error.response.status === 401) ||
               error.response.status === 403
             ) {
+              console.warn(error.response.data);
               set({ user_id: null, token: null, isLoading: false });
               delete axios.defaults.headers.common["Authorization"];
               router.replace("/login");