fix wishlist in notice screen
This commit is contained in:
Patryk
@@ -1,331 +1,337 @@
|
||||
import {Link, Stack, useLocalSearchParams} from "expo-router";
|
||||
import {Box} from "@/components/ui/box";
|
||||
import {Card} from "@/components/ui/card";
|
||||
import {Heading} from "@/components/ui/heading";
|
||||
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 {ActivityIndicator, Dimensions, FlatList, View, TextInput} 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 { Link, Stack, useLocalSearchParams } from "expo-router";
|
||||
import { Box } from "@/components/ui/box";
|
||||
import { Card } from "@/components/ui/card";
|
||||
import { Heading } from "@/components/ui/heading";
|
||||
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 {
|
||||
ActivityIndicator,
|
||||
Dimensions,
|
||||
FlatList,
|
||||
View,
|
||||
TextInput,
|
||||
} 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");
|
||||
|
||||
export default function NoticeDetails() {
|
||||
const {id} = useLocalSearchParams();
|
||||
const [images, setImages] = useState([]);
|
||||
const [isImageLoading, setIsImageLoading] = useState(true);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [error, setError] = useState(null);
|
||||
const [notice, setNotice] = useState(null);
|
||||
const [user, setUser] = useState(null);
|
||||
const [isUserLoading, setIsUserLoading] = useState(true);
|
||||
const flatListRef = useRef(null);
|
||||
const [currentIndex, setCurrentIndex] = useState(0);
|
||||
const { id } = useLocalSearchParams();
|
||||
const [images, setImages] = useState([]);
|
||||
const [isImageLoading, setIsImageLoading] = useState(true);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [error, setError] = useState(null);
|
||||
const [notice, setNotice] = useState(null);
|
||||
const [user, setUser] = useState(null);
|
||||
const [isUserLoading, setIsUserLoading] = useState(true);
|
||||
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 [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);
|
||||
setIsMessageFormVisible(false);
|
||||
setMessage("");
|
||||
setEmail("");
|
||||
};
|
||||
|
||||
setIsMessageFormVisible(false);
|
||||
setMessage('');
|
||||
setEmail('');
|
||||
const formatDate = (dateString) => {
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleDateString("pl-PL", {
|
||||
year: "numeric",
|
||||
month: "2-digit",
|
||||
day: "2-digit",
|
||||
});
|
||||
};
|
||||
|
||||
const { getNoticeById, getAllImagesByNoticeId } = useNoticesStore();
|
||||
const toggleNoticeInWishlist = useWishlist(
|
||||
(state) => state.toggleNoticeInWishlist
|
||||
);
|
||||
|
||||
const isInWishlist = useWishlist((state) =>
|
||||
id ? state.wishlistNotices.some((item) => item.noticeId == id) : false
|
||||
);
|
||||
const onViewableItemsChanged = useRef(({ viewableItems }) => {
|
||||
if (viewableItems.length > 0) {
|
||||
setCurrentIndex(viewableItems[0].index);
|
||||
}
|
||||
}).current;
|
||||
|
||||
const viewabilityConfig = useRef({
|
||||
itemVisiblePercentThreshold: 70,
|
||||
}).current;
|
||||
|
||||
useEffect(() => {
|
||||
const fetchNotice = async () => {
|
||||
setIsLoading(true);
|
||||
try {
|
||||
const noticeData = getNoticeById(Number(id));
|
||||
if (noticeData) {
|
||||
setNotice(noticeData);
|
||||
setError(null);
|
||||
} else {
|
||||
setError(new Error(`Notice with ID ${id} not found.`));
|
||||
}
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
|
||||
const formatDate = (dateString) => {
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleDateString('pl-PL', {
|
||||
year: 'numeric',
|
||||
month: '2-digit',
|
||||
day: '2-digit'
|
||||
});
|
||||
fetchNotice();
|
||||
}, [id]);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchImage = async () => {
|
||||
setIsImageLoading(true);
|
||||
if (notice) {
|
||||
try {
|
||||
const fetchedImages = await getAllImagesByNoticeId(notice.noticeId);
|
||||
setImages(
|
||||
fetchedImages && fetchedImages.length > 0
|
||||
? fetchedImages
|
||||
: ["https://http.cat/404.jpg"]
|
||||
);
|
||||
} catch (err) {
|
||||
console.error("Error while loading images:", err);
|
||||
setImage("https://http.cat/404.jpg");
|
||||
} finally {
|
||||
setIsImageLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const {getNoticeById, getAllImagesByNoticeId} = useNoticesStore();
|
||||
const addNoticeToWishlist = useWishlist((state) => state.addNoticeToWishlist);
|
||||
const removeNoticeFromWishlist = useWishlist((state) => state.removeNoticeFromWishlist);
|
||||
const isInWishlist = useWishlist((state) =>
|
||||
notice ? state.wishlistNotices.some((item) => item.noticeId === notice.noticeId) : false
|
||||
);
|
||||
const onViewableItemsChanged = useRef(({ viewableItems }) => {
|
||||
if (viewableItems.length > 0) {
|
||||
setCurrentIndex(viewableItems[0].index);
|
||||
if (notice) {
|
||||
fetchImage();
|
||||
}
|
||||
}, [notice]);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchUser = async () => {
|
||||
if (notice && notice.clientId) {
|
||||
setIsUserLoading(true);
|
||||
try {
|
||||
const userData = await getUserById(notice.clientId);
|
||||
setUser(userData);
|
||||
} catch (err) {
|
||||
console.error("Nie udało się pobrać danych użytkownika:", err);
|
||||
} finally {
|
||||
setIsUserLoading(false);
|
||||
}
|
||||
}).current;
|
||||
}
|
||||
};
|
||||
|
||||
const viewabilityConfig = useRef({
|
||||
itemVisiblePercentThreshold: 70,
|
||||
}).current;
|
||||
fetchUser();
|
||||
}, [notice]);
|
||||
|
||||
if (isLoading) {
|
||||
return <ActivityIndicator />;
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
const fetchNotice = async () => {
|
||||
setIsLoading(true);
|
||||
try {
|
||||
const noticeData = getNoticeById(Number(id));
|
||||
if (noticeData) {
|
||||
setNotice(noticeData);
|
||||
setError(null);
|
||||
} else {
|
||||
setError(new Error(`Notice with ID ${id} not found.`));
|
||||
}
|
||||
} catch (err) {
|
||||
setError(err);
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
}
|
||||
};
|
||||
if (error) {
|
||||
return <Text>Błąd, spróbuj ponownie póżniej: {error.message}</Text>;
|
||||
}
|
||||
|
||||
fetchNotice();
|
||||
}, [id]);
|
||||
if (!notice) {
|
||||
return <Text>Nie znaleziono ogłoszenia</Text>;
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
const fetchImage = async () => {
|
||||
setIsImageLoading(true);
|
||||
if (notice) {
|
||||
try {
|
||||
const fetchedImages = await getAllImagesByNoticeId(notice.noticeId);
|
||||
setImages(fetchedImages && fetchedImages.length > 0 ? fetchedImages : ["https://http.cat/404.jpg"]);
|
||||
|
||||
} catch (err) {
|
||||
console.error("Error while loading images:", err);
|
||||
setImage("https://http.cat/404.jpg");
|
||||
} finally {
|
||||
setIsImageLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
if (notice) {
|
||||
fetchImage();
|
||||
}
|
||||
}, [notice]);
|
||||
|
||||
useEffect(() => {
|
||||
const fetchUser = async () => {
|
||||
if (notice && notice.clientId) {
|
||||
setIsUserLoading(true);
|
||||
try {
|
||||
const userData = await getUserById(notice.clientId);
|
||||
setUser(userData);
|
||||
} catch (err) {
|
||||
console.error("Nie udało się pobrać danych użytkownika:", err);
|
||||
} finally {
|
||||
setIsUserLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
fetchUser();
|
||||
}, [notice]);
|
||||
|
||||
|
||||
if (isLoading) {
|
||||
return <ActivityIndicator/>;
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return <Text>Błąd, spróbuj ponownie póżniej: {error.message}</Text>;
|
||||
}
|
||||
|
||||
if (!notice) {
|
||||
return <Text>Nie znaleziono ogłoszenia</Text>;
|
||||
}
|
||||
|
||||
return (
|
||||
<Card className="p-0 rounded-lg m-3 flex-1">
|
||||
<Stack.Screen
|
||||
options={{
|
||||
title: notice.title,
|
||||
}}
|
||||
/>
|
||||
{isImageLoading ? (
|
||||
<Box className="h-auto w-full rounded-md aspect-[1/1] bg-gray-100 items-center justify-center">
|
||||
<ActivityIndicator size="large" color="#3b82f6" />
|
||||
</Box>
|
||||
) : (
|
||||
<Box className="sticky top-0 z-10 bg-white">
|
||||
<FlatList
|
||||
ref={flatListRef}
|
||||
data={images}
|
||||
horizontal
|
||||
snapToAlignment="center"
|
||||
decelerationRate="fast"
|
||||
showsHorizontalScrollIndicator={false}
|
||||
pagingEnabled
|
||||
onViewableItemsChanged={onViewableItemsChanged}
|
||||
viewabilityConfig={viewabilityConfig}
|
||||
renderItem={({ item, index }) => (
|
||||
<View style={{ width: width }}>
|
||||
<Image
|
||||
source={{ uri: item }}
|
||||
className="h-auto w-full rounded-md aspect-square"
|
||||
alt={`Zdjęcie ${index + 1}`}
|
||||
resizeMode="contain"
|
||||
/>
|
||||
</View>
|
||||
)}
|
||||
keyExtractor={(item, index) => index.toString()}
|
||||
/>
|
||||
|
||||
{images.length > 1 && (
|
||||
<Box className="flex-row justify-center mt-2">
|
||||
{images.map((_, index) => (
|
||||
<Box
|
||||
key={index}
|
||||
className={`w-2 h-2 rounded-full mx-1 ${index === currentIndex ? 'bg-primary-500' : 'bg-gray-300'}`}
|
||||
/>
|
||||
))}
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
return (
|
||||
<Card className="p-0 rounded-lg m-3 flex-1">
|
||||
<Stack.Screen
|
||||
options={{
|
||||
title: notice.title,
|
||||
}}
|
||||
/>
|
||||
{isImageLoading ? (
|
||||
<Box className="h-auto w-full rounded-md aspect-[1/1] bg-gray-100 items-center justify-center">
|
||||
<ActivityIndicator size="large" color="#3b82f6" />
|
||||
</Box>
|
||||
) : (
|
||||
<Box className="sticky top-0 z-10 bg-white">
|
||||
<FlatList
|
||||
ref={flatListRef}
|
||||
data={images}
|
||||
horizontal
|
||||
snapToAlignment="center"
|
||||
decelerationRate="fast"
|
||||
showsHorizontalScrollIndicator={false}
|
||||
pagingEnabled
|
||||
onViewableItemsChanged={onViewableItemsChanged}
|
||||
viewabilityConfig={viewabilityConfig}
|
||||
renderItem={({ item, index }) => (
|
||||
<View style={{ width: width }}>
|
||||
<Image
|
||||
source={{ uri: item }}
|
||||
className="h-auto w-full rounded-md aspect-square"
|
||||
alt={`Zdjęcie ${index + 1}`}
|
||||
resizeMode="contain"
|
||||
/>
|
||||
</View>
|
||||
)}
|
||||
keyExtractor={(item, index) => index.toString()}
|
||||
/>
|
||||
|
||||
<ScrollView
|
||||
showsVerticalScrollIndicator={false}
|
||||
{images.length > 1 && (
|
||||
<Box className="flex-row justify-center mt-2">
|
||||
{images.map((_, index) => (
|
||||
<Box
|
||||
key={index}
|
||||
className={`w-2 h-2 rounded-full mx-1 ${
|
||||
index === currentIndex ? "bg-primary-500" : "bg-gray-300"
|
||||
}`}
|
||||
/>
|
||||
))}
|
||||
</Box>
|
||||
)}
|
||||
</Box>
|
||||
)}
|
||||
|
||||
<ScrollView showsVerticalScrollIndicator={false}>
|
||||
<VStack className="p-2">
|
||||
<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">
|
||||
{notice.title}
|
||||
</Text>
|
||||
|
||||
<Box className="flex-row items-center bg-gray-50 rounded-md p-2">
|
||||
<Heading size="md" className="flex-1 text-xl text-gray-950">
|
||||
<Text className="text-sm text-typography-500">Cena: </Text>
|
||||
{notice.price} zł
|
||||
</Heading>
|
||||
|
||||
<Pressable
|
||||
onPress={() => {
|
||||
toggleNoticeInWishlist(id);
|
||||
}}
|
||||
>
|
||||
<VStack className="p-2">
|
||||
<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">
|
||||
{notice.title}
|
||||
</Text>
|
||||
<Ionicons
|
||||
name={isInWishlist ? "heart" : "heart-outline"}
|
||||
size={24}
|
||||
color={"primary-heading-500"}
|
||||
/>
|
||||
</Pressable>
|
||||
</Box>
|
||||
<Box className="mt-4 bg-gray-50 p-3 rounded-lg shadow-sm">
|
||||
<Text className="text-sm text-typography-500">
|
||||
Kategoria:{" "}
|
||||
<Text className="font-bold text-gray-950">{notice.category}</Text>
|
||||
</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}
|
||||
</Text>
|
||||
</Box>
|
||||
|
||||
<Box className="flex-row items-center bg-gray-50 rounded-md p-2">
|
||||
<Heading size="md" className="flex-1 text-xl text-gray-950">
|
||||
<Text className="text-sm text-typography-500">Cena: </Text>
|
||||
{notice.price} zł
|
||||
</Heading>
|
||||
|
||||
<Pressable
|
||||
onPress={() => {
|
||||
if (isInWishlist) {
|
||||
removeNoticeFromWishlist(notice.noticeId);
|
||||
} else {
|
||||
addNoticeToWishlist(notice);
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Ionicons
|
||||
name={isInWishlist ? "heart" : "heart-outline"}
|
||||
size={24}
|
||||
color={"primary-heading-500"}
|
||||
/>
|
||||
</Pressable>
|
||||
</Box>
|
||||
<Box className="mt-4 bg-gray-50 p-3 rounded-lg shadow-sm">
|
||||
<Text className="text-sm text-typography-500">
|
||||
Kategoria: <Text className="font-bold text-gray-950">{notice.category}</Text>
|
||||
</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}
|
||||
</Text>
|
||||
<Box className="mt-4 bg-gray-50 p-3 rounded-lg shadow-sm">
|
||||
<Text className="text-sm text-typography-500">Uzytkownik:</Text>
|
||||
{isUserLoading ? (
|
||||
<ActivityIndicator />
|
||||
) : 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"
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Box className="mt-4 bg-gray-50 p-3 rounded-lg shadow-sm">
|
||||
<Text className="text-sm text-typography-500">
|
||||
Uzytkownik:
|
||||
<Box className="flex-1">
|
||||
<Text className="text-xl font-bold text-gray-950">
|
||||
{user.firstName} {user.lastName}
|
||||
</Text>
|
||||
<Text className="text-sm text-typography-700">
|
||||
Email: {user.email}
|
||||
</Text>
|
||||
<Pressable
|
||||
onPress={() => setIsMessageFormVisible(true)}
|
||||
className="mt-3 bg-primary-500 py-2 px-4 rounded-md"
|
||||
>
|
||||
<Text className="text-white text-center font-bold">
|
||||
Wyślij wiadomość
|
||||
</Text>
|
||||
{isUserLoading ? (
|
||||
<ActivityIndicator />
|
||||
) : 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"
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Box className="flex-1">
|
||||
<Text className="text-xl font-bold text-gray-950">
|
||||
{user.firstName} {user.lastName}
|
||||
</Text>
|
||||
<Text className="text-sm text-typography-700">
|
||||
Email: {user.email}
|
||||
</Text>
|
||||
<Pressable
|
||||
onPress={() => setIsMessageFormVisible(true)}
|
||||
className="mt-3 bg-primary-500 py-2 px-4 rounded-md"
|
||||
>
|
||||
<Text className="text-white text-center font-bold">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>
|
||||
</Box>
|
||||
</>
|
||||
) : (
|
||||
<Text>Błąd podczas ładowania danych użytkownika</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>
|
||||
</Box>
|
||||
</>
|
||||
) : (
|
||||
<Text>Błąd podczas ładowania danych użytkownika</Text>
|
||||
)}
|
||||
</Box>
|
||||
</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>
|
||||
|
||||
</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>
|
||||
<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">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}
|
||||
/>
|
||||
|
||||
<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>
|
||||
</View>
|
||||
</View>
|
||||
)}
|
||||
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
<Pressable
|
||||
onPress={handleSendMessage}
|
||||
className="bg-primary-500 py-2 px-4 rounded-md"
|
||||
>
|
||||
<Text className="text-white">Wyślij</Text>
|
||||
</Pressable>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
)}
|
||||
</Card>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user