indent fix
This commit is contained in:
@@ -1,115 +1,115 @@
|
||||
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 { Link } from "expo-router";
|
||||
import { Pressable, ActivityIndicator, View } from "react-native";
|
||||
import { useWishlist } from "@/store/wishlistStore";
|
||||
import { useNoticesStore } from "@/store/noticesStore";
|
||||
import { Ionicons } from "@expo/vector-icons";
|
||||
import { useEffect, useState } from "react";
|
||||
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 {Link} from "expo-router";
|
||||
import {Pressable, ActivityIndicator, View} from "react-native";
|
||||
import {useWishlist} from "@/store/wishlistStore";
|
||||
import {useNoticesStore} from "@/store/noticesStore";
|
||||
import {Ionicons} from "@expo/vector-icons";
|
||||
import {useEffect, useState} from "react";
|
||||
|
||||
export function NoticeCard({ notice }) {
|
||||
const noticeId = notice?.noticeId;
|
||||
export function NoticeCard({notice}) {
|
||||
const noticeId = notice?.noticeId;
|
||||
|
||||
const toggleNoticeInWishlist = useWishlist(
|
||||
(state) => state.toggleNoticeInWishlist
|
||||
);
|
||||
const isInWishlist = useWishlist((state) =>
|
||||
noticeId
|
||||
? state.wishlistNotices.some((item) => item.noticeId === noticeId)
|
||||
: false
|
||||
);
|
||||
const toggleNoticeInWishlist = useWishlist(
|
||||
(state) => state.toggleNoticeInWishlist
|
||||
);
|
||||
const isInWishlist = useWishlist((state) =>
|
||||
noticeId
|
||||
? state.wishlistNotices.some((item) => item.noticeId === noticeId)
|
||||
: false
|
||||
);
|
||||
|
||||
const [image, setImage] = useState(null);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
const [image, setImage] = useState(null);
|
||||
const [isLoading, setIsLoading] = useState(true);
|
||||
|
||||
const { getAllImagesByNoticeId } = useNoticesStore();
|
||||
const {getAllImagesByNoticeId} = useNoticesStore();
|
||||
|
||||
useEffect(() => {
|
||||
let isMounted = true;
|
||||
useEffect(() => {
|
||||
let isMounted = true;
|
||||
|
||||
const fetchImage = async () => {
|
||||
if (!noticeId) {
|
||||
if (isMounted) {
|
||||
setImage({uri: "https://http.cat/404.jpg"});
|
||||
setIsLoading(false);
|
||||
}
|
||||
return;
|
||||
}
|
||||
const fetchImage = async () => {
|
||||
if (!noticeId) {
|
||||
if (isMounted) {
|
||||
setImage({uri: "https://http.cat/404.jpg"});
|
||||
setIsLoading(false);
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
||||
setIsLoading(true);
|
||||
try {
|
||||
const images = await getAllImagesByNoticeId(noticeId);
|
||||
if (isMounted) {
|
||||
setImage(
|
||||
images && images.length > 0 ? images[0] : {uri: "https://http.cat/404.jpg"}
|
||||
);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(`Error while loading image: ${error}`);
|
||||
if (isMounted) {
|
||||
setImage({uri: "https://http.cat/404.jpg"});
|
||||
}
|
||||
} finally {
|
||||
if (isMounted) {
|
||||
setIsLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
setIsLoading(true);
|
||||
try {
|
||||
const images = await getAllImagesByNoticeId(noticeId);
|
||||
if (isMounted) {
|
||||
setImage(
|
||||
images && images.length > 0 ? images[0] : {uri: "https://http.cat/404.jpg"}
|
||||
);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(`Error while loading image: ${error}`);
|
||||
if (isMounted) {
|
||||
setImage({uri: "https://http.cat/404.jpg"});
|
||||
}
|
||||
} finally {
|
||||
if (isMounted) {
|
||||
setIsLoading(false);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
fetchImage();
|
||||
fetchImage();
|
||||
|
||||
return () => {
|
||||
isMounted = false;
|
||||
};
|
||||
}, [noticeId]);
|
||||
return () => {
|
||||
isMounted = false;
|
||||
};
|
||||
}, [noticeId]);
|
||||
|
||||
if (!notice) {
|
||||
return <View style={{ flex: 1 }} />;
|
||||
}
|
||||
if (!notice) {
|
||||
return <View style={{flex: 1}}/>;
|
||||
}
|
||||
|
||||
return (
|
||||
<Link href={`/notice/${noticeId}`} asChild>
|
||||
<Pressable className="flex-1">
|
||||
<Card className="p-0 rounded-lg max-w-[460px] flex-1">
|
||||
{isLoading ? (
|
||||
<Box className="h-auto w-full rounded-md aspect-[1/1] bg-gray-100 items-center justify-center">
|
||||
<ActivityIndicator size="large" color="#3b82f6" />
|
||||
</Box>
|
||||
) : (
|
||||
<Image
|
||||
source={image}
|
||||
className="h-auto w-full rounded-md aspect-[1/1]"
|
||||
alt="image"
|
||||
resizeMode="cover"
|
||||
/>
|
||||
)}
|
||||
<VStack className="p-2">
|
||||
<Text className="text-sm font-normal mb-2 text-typography-700">
|
||||
{notice.title}
|
||||
</Text>
|
||||
<Box className="flex-row items-center">
|
||||
<Heading size="md" className="flex-1">
|
||||
{notice.price}zł
|
||||
</Heading>
|
||||
<Pressable
|
||||
onPress={() => {
|
||||
toggleNoticeInWishlist(noticeId);
|
||||
}}
|
||||
>
|
||||
<Ionicons
|
||||
name={isInWishlist ? "heart" : "heart-outline"}
|
||||
size={24}
|
||||
color={"primary-heading-500"}
|
||||
/>
|
||||
</Pressable>
|
||||
</Box>
|
||||
</VStack>
|
||||
</Card>
|
||||
</Pressable>
|
||||
</Link>
|
||||
);
|
||||
return (
|
||||
<Link href={`/notice/${noticeId}`} asChild>
|
||||
<Pressable className="flex-1">
|
||||
<Card className="p-0 rounded-lg max-w-[460px] flex-1">
|
||||
{isLoading ? (
|
||||
<Box className="h-auto w-full rounded-md aspect-[1/1] bg-gray-100 items-center justify-center">
|
||||
<ActivityIndicator size="large" color="#3b82f6"/>
|
||||
</Box>
|
||||
) : (
|
||||
<Image
|
||||
source={image}
|
||||
className="h-auto w-full rounded-md aspect-[1/1]"
|
||||
alt="image"
|
||||
resizeMode="cover"
|
||||
/>
|
||||
)}
|
||||
<VStack className="p-2">
|
||||
<Text className="text-sm font-normal mb-2 text-typography-700">
|
||||
{notice.title}
|
||||
</Text>
|
||||
<Box className="flex-row items-center">
|
||||
<Heading size="md" className="flex-1">
|
||||
{notice.price}zł
|
||||
</Heading>
|
||||
<Pressable
|
||||
onPress={() => {
|
||||
toggleNoticeInWishlist(noticeId);
|
||||
}}
|
||||
>
|
||||
<Ionicons
|
||||
name={isInWishlist ? "heart" : "heart-outline"}
|
||||
size={24}
|
||||
color={"primary-heading-500"}
|
||||
/>
|
||||
</Pressable>
|
||||
</Box>
|
||||
</VStack>
|
||||
</Card>
|
||||
</Pressable>
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user