fixes to app

This commit is contained in:
Patryk
2025-06-08 20:18:38 +02:00
parent dbf07cea0a
commit bcce392c9b
13 changed files with 1450 additions and 375 deletions

View File

@@ -37,6 +37,7 @@ export default function AccountDrawerLayout() {
name="userNotices"
options={{ title: "Moje ogłoszenia" }}
/>
<Drawer.Screen name="userOrders" options={{ title: "Moje zamówienia" }} />
</Drawer>
);
}

View File

@@ -37,7 +37,6 @@ export default function Account() {
return <Text>Nie udało się pobrać danych użytkownika.</Text>;
}
console.log(user);
return (
<VStack className=" flex-1 m-2">
<Box className="bg-white p-5 rounded-lg ">

View File

@@ -1,16 +1,46 @@
import { useNoticesStore } from "@/store/noticesStore";
import { NoticeCard } from "@/components/NoticeCard";
import { Button } from "react-native";
import { Button, ButtonIcon, ButtonText } from "@/components/ui/button";
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 } from "react";
import { useEffect, useState, useRef } from "react";
import { createOrder, createPayment } 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";
export default function UserNotices() {
const { notices, fetchNotices } = useNoticesStore();
const { notices, fetchNotices, deleteNotice } = useNoticesStore();
const [isLoading, setIsLoading] = useState(true);
const currentUserId = 1; // Tymczasowo, do czasu zaimplementowania logowania bo nie moge pobrac usera
const [isRedirecting, setIsRedirecting] = useState(false);
const currentUserId = 1;
const toast = useToast();
const appState = useRef(AppState.currentState);
const [toastId, setToastId] = useState(0);
useEffect(() => {
if (!isRedirecting) return;
const subscription = AppState.addEventListener("change", (state) => {
if (state === "active") {
setIsRedirecting(false);
const paymentStatus = "CORRECT";
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]);
useEffect(() => {
const loadNotices = async () => {
@@ -26,6 +56,58 @@ export default function UserNotices() {
loadNotices();
}, []);
const showNewToast = (title) => {
const newId = Math.random();
setToastId(newId);
toast.show({
id: newId,
placement: "top",
duration: 3000,
render: ({ id }) => {
const uniqueToastId = "toast-" + id;
return (
<Toast nativeID={uniqueToastId} action="muted" variant="solid">
<ToastTitle>{title}</ToastTitle>
</Toast>
);
},
});
};
const handleOrder = async (noticeId, type) => {
{
try {
const result = await createOrder(noticeId, type);
if (result) {
try {
const paymentResult = await createPayment(); //trzeba dodać orderId
if (paymentResult) {
setIsRedirecting(true);
Linking.openURL(paymentResult);
setWaitingForPayment(true);
} else {
console.log(`Nie udało się aktywować ogłoszenia ${noticeId}.`);
}
} catch (err) {
console.log("Błąd podczas aktywacji ogłoszenia:", err);
}
} else {
console.log(`Nie udało się aktywować ogłoszenia ${noticeId}.`);
}
} catch (err) {
console.log("Błąd podczas aktywacji ogłoszenia:", err);
}
}
};
const handleDeleteNotice = async (noticeId) => {
try {
await deleteNotice(noticeId);
} catch (err) {
console.error("Błąd podczas usuwania ogłoszenia:", err);
}
};
const userNotices = notices
.filter((notice) => notice.clientId === currentUserId)
.sort((a, b) => new Date(b.publishDate) - new Date(a.publishDate));
@@ -36,45 +118,61 @@ export default function UserNotices() {
return (
<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" />
<Text className="text-lg font-bold pt-2">
Przekierowanie do płatności...
</Text>
</Box>
)}
{/* <Text className="text-2xl font-bold mb-4">Moje ogłoszenia</Text> */}
{userNotices.length > 0 ? (
<FlatList
data={userNotices}
// numColumns={1}
// columnWrapperStyle={{
// marginBottom: 10,
// justifyContent: "space-between",
// }}
renderItem={({ item }) => (
<Box className="flex-1 mb-4 pb-2 bg-white rounded-lg">
<NoticeCard notice={item} />
<Box className="flex-row justify-between mt-2">
{item.status === "ACTIVE" ? (
<Button
title="Usuń"
onPress={() => {
console.log(`Promuj ogłoszenie ${item.noticeId}`);
}}
className="bg-primary-500 py-2 px-4 rounded-md"
></Button>
className="ml-2"
onPress={() => handleDeleteNotice(item.noticeId)}
size="md"
variant="outline"
action="primary"
>
<ButtonText>Usuń</ButtonText>
<Ionicons name="trash-outline" size={14} />
</Button>
) : (
<Button
title="Aktywj"
onPress={() => {
console.log(`Promuj ogłoszenie ${item.noticeId}`);
}}
className="bg-primary-500 py-2 px-4 rounded-md"
></Button>
className="ml-2"
size="md"
variant="solid"
action="primary"
onPress={() => handleOrder(item.noticeId, "ACTIVATE")}
>
<ButtonText>Aktywuj</ButtonText>
<Ionicons
name="arrow-redo-outline"
size={14}
color="#fff"
/>
</Button>
)}
{item.status === "ACTIVE" && (
<Button
className="mr-2"
size="md"
variant="solid"
action="primary"
onPress={() => handleOrder(item.noticeId, "BOOST")}
>
<ButtonText>Podbij</ButtonText>
<Ionicons name="arrow-up" size={14} color="#fff" />
</Button>
)}
<Button
title="Podbij"
onPress={() => {
// TODO: Implementacja podbicia ogłoszenia
console.log(`Podbij ogłoszenie ${item.noticeId}`);
}}
className="bg-primary-500 py-2 px-4 rounded-md"
></Button>
</Box>
</Box>
)}

View File

@@ -0,0 +1,24 @@
import { View, Text } from "react-native";
import { useState, useEffect, use } from "react";
import { listOrders } from "@/api/order";
export default function UserOrders() {
const [orders, setOrders] = useState([]);
useEffect(() => {
const fetchOrders = async () => {
try {
const data = await listOrders();
setOrders(data);
} catch (err) {}
};
fetchOrders();
}, []);
console.log("Orders:", orders);
return (
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<Text>Orders</Text>
</View>
);
}

View File

@@ -4,7 +4,6 @@ import { CategorySection } from "@/components/CategorySection";
import { NoticeSection } from "@/components/NoticeSection";
import { UserSection } from "@/components/UserSection";
import { SearchSection } from "@/components/SearchSection";
import { FlatList } from "react-native";
import { useAuthStore } from "@/store/authStore";
import { useRouter } from "expo-router";
import { useEffect, useState } from "react";
@@ -36,7 +35,7 @@ export default function Home() {
// console.log("Notices:", notices);
// console.log("Notices length:", notices.length);
const activeNotices = notices.filter((notice) => notice.status === "ACTIVE");
const activeNotices = notices.filter((notice) => notice.status == "ACTIVE");
// console.log("Activer Notices:", activeNotices.length);
const latestNotices = [...activeNotices]
.sort((a, b) => new Date(b.publishDate) - new Date(a.publishDate))

View File

@@ -1,256 +1,263 @@
import {useState, useEffect} from "react";
import {Image, StyleSheet} 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 * as ImagePicker from 'expo-image-picker';
import { useState, useEffect } from "react";
import { Image, StyleSheet } 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 * 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";
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);
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);
}
};
fetchSelectItems();
return () => {
isMounted = 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,
});
if (!title || !description || !price || !category) {
console.log("Error in form");
return;
}
setIsLoading(true);
try {
const result = await addNotice({
title: title,
clientId: 1,
description: description,
price: price,
category: category,
status: "ACTIVE",
image: image
});
if (result) {
console.log("Notice created successfully with ID: ", result.noticeId);
await fetchNotices();
clearForm();
router.push("/(tabs)/notices");
}
} catch (error) {
console.error("Error creating notice. Error message: ", error.message);
} finally {
setIsLoading(false);
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 takePicture = async () => {
const {status} = await ImagePicker.requestCameraPermissionsAsync();
if (status !== 'granted') {
return;
}
const result = await ImagePicker.launchCameraAsync({
allowsEditing: false,
});
fetchSelectItems();
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));
}
return () => {
isMounted = false;
};
}, []);
const clearForm = () => {
setTitle("");
setDescription("");
setPrice("");
setCategory("");
setImage([]);
setError({
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,
});
if (!title || !description || !price || !category) {
console.log("Error in form");
return;
}
return (
<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>
setIsLoading(true);
try {
const result = await addNotice({
title: title,
clientId: 1,
description: description,
price: price,
category: category,
status: "INACTIVE",
image: image,
});
<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>
if (result) {
console.log("Notice created successfully with ID: ", result.noticeId);
await fetchNotices();
clearForm();
<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>
router.push("/(tabs)/dashboard/userNotices");
}
} catch (error) {
console.error("Error creating notice. Error message: ", error.message);
} finally {
setIsLoading(false);
}
};
<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>
);
}
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,
});
};
return (
<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>
);
}