hamx/ArtisanConnectFrontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

indent fix

Browse Source
This commit is contained in:
Andrii Solianyk
2025-06-09 11:07:58 +02:00
parent 44f5239328
commit 8e6d7ca150
1 changed files with 103 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

206
ArtisanConnect/components/NoticeCard.jsx
View File

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