49 Commits

Author SHA1 Message Date
2d0f5b9e56 Merge remote-tracking branch 'origin/main' 2025-06-13 22:32:45 +02:00
dd73dc070d little mistake fix 2025-06-13 22:32:31 +02:00
7efe9d91c3 dumb fix 2025-06-13 18:17:42 +02:00
67cf21230d images were uploaded doubled 2025-06-13 17:58:14 +02:00
945d225a9f mały fix odnośnie błędu na starcie aplikacji 2025-06-12 10:13:20 +02:00
Patryk
0790285ae5 fix title 2025-06-11 21:43:04 +02:00
Patryk
e1672ab319 fix edit header 2025-06-11 21:41:56 +02:00
Patryk
2630b35afd fix uset notice list 2025-06-11 21:11:07 +02:00
Patryk
3c042d2cfb add edit notice and clean code 2025-06-11 20:56:39 +02:00
b323f02654 isMainImage przekazywane na Backend 2025-06-11 19:04:56 +02:00
59db79eaf7 Przeniesiono autoryzacje do osobnego pliku api/auth.jsx 2025-06-11 15:21:44 +02:00
1d2a2420c2 All clients get api 2025-06-11 14:45:53 +02:00
Patryk
fd1c387cdb Merge branch 'fixesAfterMerge' of https://progit.zikor.pl/hamx/ArtisanConnectFrontend into fixesAfterMerge 2025-06-11 07:48:43 +02:00
Patryk
2871a83470 init notice edit 2025-06-10 23:39:58 +02:00
121d9d1e53 ekran autoryzacji przerobiony 2025-06-10 21:39:52 +02:00
56877548ed Merge remote-tracking branch 'origin/fixesAfterMerge' into fixesAfterMerge 2025-06-10 21:38:26 +02:00
90ada963bf Added new atributes to view in notice id
Also added SafeAreView to userid
2025-06-10 21:38:10 +02:00
Patryk
e0e5d10062 Merge branch 'fixesAfterMerge' of https://progit.zikor.pl/hamx/ArtisanConnectFrontend into fixesAfterMerge 2025-06-10 21:34:07 +02:00
Patryk
bcc646e4ef add attribures to notices list 2025-06-10 21:34:02 +02:00
b96e8f264b Merge remote-tracking branch 'origin/fixesAfterMerge' into fixesAfterMerge 2025-06-10 21:18:04 +02:00
bb9a896161 Email is updated to version before merge, also bug fixed with 'link' in android 2025-06-10 21:17:50 +02:00
Patryk
83f105eff1 add required label 2025-06-10 20:42:13 +02:00
Patryk
413c9ac5ee add attributes 2025-06-10 20:39:29 +02:00
735801d14a użycie expo web browser do płatności 2025-06-10 19:52:22 +02:00
8f72f28566 Order zwracał 403, bo nie było headerów
Zdjęcia nie były centerowane względem szerokości
2025-06-10 11:24:08 +02:00
Patryk
c0b8800f83 add link to user section home 2025-06-10 01:14:10 +02:00
Patryk
97d3927acc del xomments 2025-06-10 01:07:30 +02:00
Patryk
0157d0015a fix landscape slider 2025-06-10 01:07:01 +02:00
Patryk
8a2498b467 fix stylees on notice card 2025-06-10 00:46:00 +02:00
Patryk
871225ea3a fix notice page 2025-06-10 00:35:28 +02:00
Patryk
1cc0f601fb fixes 2025-06-09 23:57:18 +02:00
Patryk
366ea4ada3 Merge remote-tracking branch 'origin/main' into fixesAfterMerge 2025-06-09 23:41:24 +02:00
Patryk
a527d00e1d add order list 2025-06-09 23:40:21 +02:00
301687a609 headersy 2025-06-09 23:36:48 +02:00
42408816f4 zdjęcia naprawione po raz drugi 2025-06-09 23:26:38 +02:00
Patryk
a04ef906cd fix merge 2025-06-09 21:49:07 +02:00
Patryk
a51345fd93 Merge remote-tracking branch 'origin/ScreenRotation' 2025-06-09 21:21:15 +02:00
Patryk
c2d4f5fb79 category and logout fiexes 2025-06-09 21:17:30 +02:00
Patryk
207f8f7161 Merge branch 'main' of https://progit.zikor.pl/hamx/ArtisanConnectFrontend 2025-06-09 20:59:46 +02:00
Patryk
27175ffa91 some fixes 2025-06-09 20:59:43 +02:00
b34ce7fd20 wysyłanie jednego zdjęcie nie działało 2025-06-09 20:35:56 +02:00
77c3a694f8 oba przyciski muszą być
a co jak będę chciał usunąć ogłoszenie które nie jest aktywne?
2025-06-09 12:09:44 +02:00
9c3e883741 kręcące się kółko
przy dodawaniu
2025-06-09 11:50:33 +02:00
2b31863ed3 KeyboardAvoidingView
ekran dodawania
2025-06-09 11:18:02 +02:00
8e6d7ca150 indent fix 2025-06-09 11:07:58 +02:00
44f5239328 zdjęcia wyświetlają się poprawnie teraz na karcie produktu. Nie wychodzą poza swoje granice 2025-06-09 10:09:28 +02:00
5344acbdd1 zdjęcia się wyświetlają na karcie produktu 2025-06-09 10:02:16 +02:00
2218c5eb33 zdjęcia pobierają się na głównej stronie + naprawiono kilka innych bugów.
takich jak wyświetlanie "Moich ogłoszeń nie dla poprawnego id etc."
2025-06-08 22:31:52 +02:00
Patryk
bcce392c9b fixes to app 2025-06-08 20:18:38 +02:00
33 changed files with 2393 additions and 963 deletions

View File

@@ -0,0 +1,63 @@
import axios from "axios";
const API_URL = "https://hopp.zikor.pl/api/v1";
export async function login(userData) {
try {
const response = await axios.post(`${API_URL}/auth/login`, userData, {
headers: {"Content-Type": "application/json"},
});
return response.data;
} catch (error) {
console.error("Login failed:", error);
throw error.response?.data?.message || "Login failed";
}
}
export async function register(userData) {
try {
const response = await axios.post(`${API_URL}/auth/register`, userData, {
headers: {"Content-Type": "application/json"},
});
return response.data;
} catch (error) {
console.error("Registration failed:", error);
throw error.response?.data?.message || "Registration failed";
}
}
export async function googleLogin(googleToken) {
try {
const response = await axios.post(
`${API_URL}/auth/google`,
{ googleToken: googleToken },
{
headers: { "Content-Type": "application/json" },
}
);
return response.data;
} catch (error) {
console.error("Google login failed:", error);
throw error.response?.data?.message || "Google login failed";
}
}
export async function logout(token) {
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try {
const response = await axios.post(
`${API_URL}/auth/logout`,
{},
{
headers: headers,
}
);
return response.data;
} catch (error) {
console.error("Logout failed:", error);
throw error.response?.data?.message || "Logout failed";
}
}

View File

@@ -8,9 +8,11 @@ export async function listCategories() {
const headers = token ? { Authorization: `Bearer ${token}` } : {}; const headers = token ? { Authorization: `Bearer ${token}` } : {};
try { try {
const response = await axios.get(`${API_URL}/vars/categories`, { headers }); const response = await axios.get(`${API_URL}/vars/categories`, {
headers: headers,
});
return response.data; return response.data;
} catch (err) { } catch (err) {
console.error("Nie udało się pobrać listy kategorii.", err.response.status); // console.error("Nie udało się pobrać listy kategorii.", err.response.status);
} }
} }

View File

@@ -1,10 +1,15 @@
import axios from "axios"; import axios from "axios";
import { useAuthStore } from "@/store/authStore";
const API_URL = "https://hopp.zikor.pl/api/v1"; const API_URL = "https://hopp.zikor.pl/api/v1";
export async function getUserById(userId) { export async function getUserById(userId) {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try { try {
const response = await axios.get(`${API_URL}/clients/get/${userId}`); const response = await axios.get(`${API_URL}/clients/get/${userId}`, {
headers: headers,
});
return response.data; return response.data;
} catch (err) { } catch (err) {
console.error( console.error(
@@ -14,3 +19,21 @@ export async function getUserById(userId) {
throw err; throw err;
} }
} }
export async function getAllUsers() {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try {
const response = await axios.get(`${API_URL}/clients/get/all`, {
headers: headers,
});
return response.data;
} catch (err) {
console.error(
`Nie udało się pobrać danych o użytkownikach`,
err.response.status
);
throw err;
}
}

View File

@@ -2,8 +2,6 @@ import axios from "axios";
import FormData from "form-data"; import FormData from "form-data";
import { useAuthStore } from "@/store/authStore"; import { useAuthStore } from "@/store/authStore";
// const API_URL = "https://testowe.zikor.pl/api/v1";
const API_URL = "https://hopp.zikor.pl/api/v1"; const API_URL = "https://hopp.zikor.pl/api/v1";
export async function listNotices() { export async function listNotices() {
@@ -14,9 +12,11 @@ export async function listNotices() {
headers: headers, headers: headers,
}); });
const data = await response.json(); const data = await response.json();
if (!response.ok) { if (!response.ok) {
throw new Error(response.toString()); throw new Error(response.toString());
} }
// console.info("Notices fetched successfully:", data);
return data; return data;
} }
@@ -31,16 +31,21 @@ export async function getNoticeById(noticeId) {
} }
export async function createNotice(notice) { export async function createNotice(notice) {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try { try {
const response = await axios.post(`${API_URL}/notices/add`, notice, { const response = await axios.post(`${API_URL}/notices/add`, notice, {
headers: { headers: headers,
"Content-Type": "application/json",
},
}); });
if (response.data.noticeId !== null) { if (response.data.noticeId !== null) {
for (const imageUri of notice.image) { for (const image of notice.image) {
await uploadImage(response.data.noticeId, imageUri); if (notice.image.indexOf(image) === 0) {
await uploadImage(response.data.noticeId, image, true);
} else {
await uploadImage(response.data.noticeId, image, false);
}
console.log("Image uploaded successfully");
} }
} }
@@ -61,64 +66,70 @@ export async function getImageByNoticeId(noticeId) {
return imageUrl; return imageUrl;
} catch (err) { } catch (err) {
console.log(`Zdjęcie nie istnieje dla notice o id: ${noticeId}`);
imageUrl = "https://http.cat/404.jpg"; imageUrl = "https://http.cat/404.jpg";
return imageUrl; return imageUrl;
} }
} }
export async function getAllImagesByNoticeId(noticeId) { export async function getAllImagesByNoticeId(noticeId) {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try { try {
const listResponse = await axios.get(`${API_URL}/images/list/${noticeId}`); const listResponse = await axios.get(`${API_URL}/images/list/${noticeId}`, {
headers: headers,
});
if (listResponse.data && listResponse.data.length > 0) { if (listResponse.data && listResponse.data.length > 0) {
return listResponse.data.map( return listResponse.data.map((imageName) => ({
(imageName) => `${API_URL}/images/get/${imageName}` uri: `${API_URL}/images/get/${imageName}`,
); headers: headers,
}));
} }
return ["https://http.cat/404.jpg"]; return [{ uri: "https://http.cat/404.jpg" }];
} catch (err) { } catch (err) {
if (err.response.status === 404) { if (err.response.status === 404) {
// console.info(`Ogłoszenie o id: ${noticeId} nie posiada zdjęć.`); // console.info(`Ogłoszenie o id: ${noticeId} nie posiada zdjęć.`);
return ["https://http.cat/404.jpg"]; return [{ uri: "https://http.cat/404.jpg" }];
} }
console.warn( console.warn(
`Nie udało się pobrać listy zdjęć dla ogłoszenia o id: ${noticeId}`, `Nie udało się pobrać listy zdjęć dla ogłoszenia o id: ${noticeId}`,
err err
); );
return ["https://http.cat/404.jpg"]; return [{ uri: "https://http.cat/404.jpg" }];
} }
} }
export const uploadImage = async (noticeId, imageUri) => { export const uploadImage = async (noticeId, imageObj, isFirst) => {
const { token } = useAuthStore.getState();
const headers = {
...(token ? { Authorization: `Bearer ${token}` } : {}),
"Content-Type": "multipart/form-data",
};
const formData = new FormData(); const formData = new FormData();
const filename = imageUri.split("/").pop(); const filename = imageObj.split("/").pop();
const match = /\.(\w+)$/.exec(filename); const match = /\.(\w+)$/.exec(filename);
const type = match ? `image/${match[1]}` : "image/jpeg"; const type = match ? `image/${match[1]}` : "image/jpeg";
formData.append("file", { formData.append("file", {
uri: imageUri, uri: imageObj,
name: filename, name: filename,
type: type, type: type,
}); });
try { try {
const response = await axios.post( const response = await axios.post(
`${API_URL}/images/upload/${noticeId}`, `${API_URL}/images/upload/${noticeId}?isMainImage=${isFirst}`,
formData, formData,
{ {
headers: { headers: headers,
"Content-Type": "multipart/form-data",
},
} }
); );
console.info("Upload successful:", response.data); console.log("Upload successful:", response.data);
return response.data; return response.data;
} catch (error) { } catch (error) {
console.log("imageURI:", imageUri);
console.error( console.error(
"Error uploading image:", "Error uploading image:",
error.response.data, error.response.data,
@@ -127,3 +138,85 @@ export const uploadImage = async (noticeId, imageUri) => {
throw error; throw error;
} }
}; };
export const deleteNotice = async (noticeId) => {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try {
const response = await axios.delete(
`${API_URL}/notices/delete/${noticeId}`,
{ headers: headers }
);
return response.data;
} catch (error) {
console.error(
"Error deleting notice:",
error.response?.data,
error.response?.status
);
throw error;
}
};
export const editNotice = async (noticeId, notice) => {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try {
const response = await axios.put(
`${API_URL}/notices/edit/${noticeId}`,
{
title: notice.title,
description: notice.description,
price: notice.price,
category: notice.category,
status: notice.status,
attributes: notice.attributes,
},
{
headers: headers,
}
);
if (response.data && notice.image && notice.image.length > 0) {
for (let i = 0; i < notice.image.length; i++) {
const image = notice.image[i];
const isFirst = i === 0;
if (typeof image === "string" && !image.startsWith("http")) {
await uploadImage(noticeId, image, isFirst);
}
}
}
return response.data;
} catch (error) {
console.error(
"Error editing notice:",
error.response?.data,
error.response?.status
);
throw error;
}
};
export const deleteImage = async (filename) => {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try {
const response = await axios.delete(
`${API_URL}/images/delete/${filename}`,
{ headers: headers }
);
return response.data;
} catch (error) {
console.error(
"Error deleting image:",
error.response?.data,
error.response?.status
);
throw error;
}
};

View File

@@ -1,12 +1,76 @@
import axios from "axios"; import axios from "axios";
import FormData from "form-data"; import { useAuthStore } from "@/store/authStore";
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}` } : {};
try {
const response = await axios.post(
`${API_URL}/add`,
{ noticeId: noticeId, orderType: orderType },
{
headers: headers,
}
);
return response.data;
} catch (error) {
console.log("Error", error.response?.data, error.response?.status);
return null;
}
}
export async function createPayment(orderId) {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try {
const response = await axios.post(
`${API_URL}/token?orderId=${orderId}`,
{},
{
headers: headers,
}
);
return response.data;
} catch (error) {
console.log("Error", error.response?.data, error.response?.status);
return null;
}
}
export async function getOrder(orderId) {
const { token } = useAuthStore.getState();
const headers = token ? { Authorization: `Bearer ${token}` } : {};
try {
const response = await axios.get(`${API_URL}/get/${orderId}`, { headers: headers });
return response.data;
} catch (error) {
console.error(
"Error fetching order:",
error.response?.data,
error.response?.status
);
throw error;
}
}
const API_URL = "https://hopp.zikor.pl/api/v1";
export async function listOrders() { export async function listOrders() {
const response = await fetch(`${API_URL}/orders/get/all`); const { token } = useAuthStore.getState();
const data = await response.json(); const headers = token ? { Authorization: `Bearer ${token}` } : {};
if (!response.ok) {
throw new Error(response.toString()); try {
const response = await axios.get(`${API_URL}/get/all`, { headers: headers });
return response.data;
} catch (error) {
console.error(
"Error fetching orders:",
error.response?.data,
error.response?.status
);
throw error;
} }
return data;
} }

View File

@@ -1,6 +1,5 @@
import axios from "axios"; import axios from "axios";
import { useAuthStore } from "@/store/authStore"; import { useAuthStore } from "@/store/authStore";
// import FormData from 'form-data'
const API_URL = "https://hopp.zikor.pl/api/v1/wishlist"; const API_URL = "https://hopp.zikor.pl/api/v1/wishlist";
@@ -13,7 +12,7 @@ export async function toggleNoticeStatus(noticeId) {
`${API_URL}/toggle/${noticeId}`, `${API_URL}/toggle/${noticeId}`,
{}, {},
{ {
headers, headers: headers,
} }
); );
return response.data; return response.data;
@@ -28,11 +27,11 @@ export async function getWishlist() {
const headers = token ? { Authorization: `Bearer ${token}` } : {}; const headers = token ? { Authorization: `Bearer ${token}` } : {};
try { try {
const response = await axios.get(`${API_URL}/`, { headers }); const response = await axios.get(`${API_URL}/`, { headers: headers });
console.log("Wishlist response:", response.data);
return response.data; return response.data;
} catch (error) { } catch (error) {
console.error("Error fetching wishlist:", error); console.error("Error fetching wishlist:", error);
throw error; throw error;
} }
} }
``;

View File

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

View File

@@ -1,17 +1,17 @@
import React, {useEffect, useState} from 'react'; import React, {useEffect, useState} from 'react';
import {StyleSheet, ActivityIndicator, SafeAreaView, View, Platform} from 'react-native'; import {StyleSheet, ActivityIndicator, SafeAreaView, View, Platform, KeyboardAvoidingView} from 'react-native';
import {useAuthStore} from '@/store/authStore'; import {useAuthStore} from '@/store/authStore';
import {useRouter, Link} from 'expo-router'; import {useRouter} from 'expo-router';
import {Box} from "@/components/ui/box" import {Box} from "@/components/ui/box"
import {Button, ButtonText, ButtonIcon} from "@/components/ui/button" import {Button, ButtonText, ButtonIcon} from "@/components/ui/button"
import {Center} from "@/components/ui/center" import {Center} from "@/components/ui/center"
import {Heading} from "@/components/ui/heading" import {Heading} from "@/components/ui/heading"
import {Input, InputField} from "@/components/ui/input" import {Input, InputField, InputIcon, InputSlot} from "@/components/ui/input"
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 {HStack} from "@/components/ui/hstack" import {HStack} from "@/components/ui/hstack"
import {ArrowRightIcon} from "@/components/ui/icon" import {ArrowRightIcon, EyeIcon, EyeOffIcon} from "@/components/ui/icon"
import {Divider} from '@/components/ui/divider'; import {Divider} from '@/components/ui/divider';
import {Ionicons} from "@expo/vector-icons"; import {Ionicons} from "@expo/vector-icons";
@@ -30,6 +30,8 @@ WebBrowser.maybeCompleteAuthSession();
export default function Login() { export default function Login() {
const [email, setEmail] = useState(''); const [email, setEmail] = useState('');
const [password, setPassword] = useState(''); const [password, setPassword] = useState('');
const [emailError, setEmailError] = useState('');
const [showPassword, setShowPassword] = useState(false)
const {signIn, isLoading, signInWithGoogle} = useAuthStore(); const {signIn, isLoading, signInWithGoogle} = useAuthStore();
const router = useRouter(); const router = useRouter();
@@ -52,6 +54,11 @@ export default function Login() {
return; return;
} }
if (!validateEmail(email)) {
setEmailError('Nieprawidłowy format adresu email');
return;
}
try { try {
await signIn(email, password); await signIn(email, password);
alert(`Zalogowano jako ${email}`); alert(`Zalogowano jako ${email}`);
@@ -73,6 +80,7 @@ export default function Login() {
user = await getUserInfo(response.authentication.accessToken) user = await getUserInfo(response.authentication.accessToken)
await signInWithGoogle(response.authentication.accessToken); await signInWithGoogle(response.authentication.accessToken);
alert(`Zalogowano jako ${user.email}`); alert(`Zalogowano jako ${user.email}`);
router.replace('/');
} }
} else { } else {
@@ -102,6 +110,17 @@ export default function Login() {
} }
} }
const validateEmail = (email) => {
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return emailRegex.test(email);
};
const handleShowPassword = () => {
setShowPassword((showState) => {
return !showState
})
}
if (isLoading) { if (isLoading) {
return ( return (
<View style={styles.container}> <View style={styles.container}>
@@ -111,6 +130,11 @@ export default function Login() {
} }
return ( return (
<KeyboardAvoidingView
behavior={Platform.OS === "ios" ? "padding" : "height"}
style={{flex: 1}}
keyboardVerticalOffset={Platform.OS === "ios" ? 64 : 0}
>
<SafeAreaView style={styles.container}> <SafeAreaView style={styles.container}>
<Center> <Center>
<Box className="p-5 max-w-96 border border-background-300 rounded-lg"> <Box className="p-5 max-w-96 border border-background-300 rounded-lg">
@@ -118,7 +142,8 @@ export default function Login() {
<Heading className="leading-[30px]">Logowanie</Heading> <Heading className="leading-[30px]">Logowanie</Heading>
<Box className="flex flex-row"> <Box className="flex flex-row">
{/* <Link href="/registration" asChild> */} {/* <Link href="/registration" asChild> */}
<Button variant="link" size="sm" className="p-0" onPress={() => router.replace("/registration")}> <Button variant="link" size="sm" className="p-0"
onPress={() => router.replace("/registration")}>
<ButtonText style={styles.signupbutton}>Nie masz jeszcze konta? Załóz je <ButtonText style={styles.signupbutton}>Nie masz jeszcze konta? Załóz je
tutaj!</ButtonText> tutaj!</ButtonText>
<ButtonIcon className="mr-1" size="md" as={ArrowRightIcon}/> <ButtonIcon className="mr-1" size="md" as={ArrowRightIcon}/>
@@ -127,12 +152,26 @@ export default function Login() {
</Box> </Box>
</VStack> </VStack>
<VStack space="xl" className="py-2"> <VStack space="xl" className="py-2">
<Input> {emailError ? <Text style={styles.errorText}>{emailError}</Text> : null}
<InputField className="py-2" placeholder="Login" onChangeText={setEmail}/> <Input isRequired={true} isInvalid={!!emailError}>
<InputField className="py-2" inputMode="email" placeholder="Login"
onChangeText={(text) => {
setEmail(text);
if (text && !validateEmail(text)) {
setEmailError('Nieprawidłowy format adresu email');
} else {
setEmailError('');
}
}}
/>
</Input> </Input>
<Input> <Input isRequired={true}>
<InputField type="password" className="py-2" placeholder="Hasło" <InputField type={showPassword ? "text" : "password"} className="py-2"
placeholder="Hasło"
onChangeText={setPassword}/> onChangeText={setPassword}/>
<InputSlot className="pr-3" onPress={handleShowPassword}>
<InputIcon as={showPassword ? EyeIcon : EyeOffIcon}/>
</InputSlot>
</Input> </Input>
</VStack> </VStack>
<VStack space="lg" className="pt-4"> <VStack space="lg" className="pt-4">
@@ -154,6 +193,7 @@ export default function Login() {
</Box> </Box>
</Center> </Center>
</SafeAreaView> </SafeAreaView>
</KeyboardAvoidingView>
); );
} }
@@ -172,7 +212,7 @@ const styles = StyleSheet.create({
}, },
errorText: { errorText: {
color: 'red', color: 'red',
marginBottom: 10, fontSize: 12,
}, },
signupbutton: { signupbutton: {
fontWeight: '300', fontWeight: '300',

View File

@@ -3,11 +3,12 @@ import { Ionicons } from "@expo/vector-icons";
import { useAuthStore } from "@/store/authStore"; import { useAuthStore } from "@/store/authStore";
export default function TabLayout() { export default function TabLayout() {
const token = useAuthStore((state) => state.token); const { token } = useAuthStore.getState();
if (!token) { if (!token) {
return <Redirect href="/login" />; return <Redirect href="/login" />;
} }
return ( return (
<Tabs <Tabs
screenOptions={{ screenOptions={{

View File

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

View File

@@ -37,7 +37,6 @@ export default function Account() {
return <Text>Nie udało się pobrać danych użytkownika.</Text>; return <Text>Nie udało się pobrać danych użytkownika.</Text>;
} }
console.log(user);
return ( return (
<VStack className=" flex-1 m-2"> <VStack className=" flex-1 m-2">
<Box className="bg-white p-5 rounded-lg "> <Box className="bg-white p-5 rounded-lg ">
@@ -45,7 +44,7 @@ export default function Account() {
<Image <Image
source={{ source={{
uri: uri:
user.profileImage || user.image ||
"https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain", "https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain",
}} }}
className="h-24 w-24 rounded-full border-4 border-white shadow-md" className="h-24 w-24 rounded-full border-4 border-white shadow-md"
@@ -85,7 +84,7 @@ export default function Account() {
</Link> </Link>
{/*Tak dodałem, można zmienić na coś innego*/} {/*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"> <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 className="text-lg flex-1">Historia płatności</Text>
<Text></Text> <Text></Text>

View File

@@ -1,17 +1,34 @@
import { useNoticesStore } from "@/store/noticesStore"; import { useNoticesStore } from "@/store/noticesStore";
import { NoticeCard } from "@/components/NoticeCard"; import { NoticeCard } from "@/components/NoticeCard";
import { Button } from "react-native"; import { Button, ButtonText } from "@/components/ui/button";
import { usePathname } from "expo-router";
import { Box } from "@/components/ui/box"; import { Box } from "@/components/ui/box";
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 { ActivityIndicator, FlatList } from "react-native"; import { ActivityIndicator, FlatList } from "react-native";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { createOrder, createPayment, getOrder } from "@/api/order";
import { Ionicons } from "@expo/vector-icons";
import { useToast, Toast, ToastTitle } from "@/components/ui/toast";
import { useAuthStore } from "@/store/authStore"; import { useAuthStore } from "@/store/authStore";
import * as WebBrowser from "expo-web-browser";
import { useRouter } from "expo-router";
export default function UserNotices() { export default function UserNotices() {
const { notices, fetchNotices } = useNoticesStore(); const router = useRouter();
const currentUserId = useAuthStore((state) => state.user_id); const pathname = usePathname();
const { notices, fetchNotices, deleteNotice } = useNoticesStore();
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
const [isRedirecting, setIsRedirecting] = useState(false);
const toast = useToast();
const [toastId, setToastId] = useState(0);
const { user_id } = useAuthStore.getState();
const currentUserId = user_id;
const [orderId, setOrderId] = useState(null);
useEffect(() => {
WebBrowser.maybeCompleteAuthSession();
}, []);
useEffect(() => { useEffect(() => {
const loadNotices = async () => { const loadNotices = async () => {
@@ -25,57 +42,165 @@ export default function UserNotices() {
} }
}; };
loadNotices(); loadNotices();
}, [fetchNotices]); }, [pathname, fetchNotices]);
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) {
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}.`);
}
} catch (err) {
setIsRedirecting(false);
console.log("Błąd podczas aktywacji ogłoszenia:", err);
}
}
} 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 const userNotices = notices
.filter((notice) => notice.clientId === currentUserId) .filter((notice) => notice.clientId === currentUserId)
.sort((a, b) => new Date(b.publishDate) - new Date(a.publishDate)); .sort((a, b) => new Date(b.publishDate) - new Date(a.publishDate));
if (isLoading) { if (isLoading) {
return <ActivityIndicator />; return (
<Box className="items-center justify-center flex-1">
<ActivityIndicator size="large" color="#787878" />
</Box>
);
} }
return ( return (
<VStack className="p-2"> <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> */} {/* <Text className="text-2xl font-bold mb-4">Moje ogłoszenia</Text> */}
{userNotices.length > 0 ? ( {userNotices.length > 0 ? (
<FlatList <FlatList
data={userNotices} data={userNotices}
// numColumns={1}
// columnWrapperStyle={{
// marginBottom: 10,
// justifyContent: "space-between",
// }}
renderItem={({ item }) => ( renderItem={({ item }) => (
<Box className="flex-1 mb-4 pb-2 bg-white rounded-lg"> <Box className="flex-1 mb-4 pb-2 bg-white rounded-lg">
<NoticeCard notice={item} /> <NoticeCard notice={item} />
<Box className="flex-row justify-between mt-2"> <Box className="flex-row justify-between mt-2">
<Box className="flex-row items-center">
<Button
className="ml-2"
onPress={() => handleDeleteNotice(item.noticeId)}
size="md"
variant="outline"
action="primary"
>
<ButtonText>Usuń</ButtonText>
<Ionicons name="trash-outline" size={14} />
</Button>
{item.status === "INACTIVE" && (
<Button
className="ml-2"
onPress={() => {
router.replace(`notice/edit/${item.noticeId}`);
}}
size="md"
variant="outline"
action="primary"
>
<ButtonText>Edytuj</ButtonText>
<Ionicons name="pencil" size={14} />
</Button>
)}
</Box>
{item.status === "ACTIVE" ? ( {item.status === "ACTIVE" ? (
<Button <Button
title="Usuń" className="mr-2"
onPress={() => { size="md"
console.log(`Promuj ogłoszenie ${item.noticeId}`); variant="solid"
}} action="primary"
className="bg-primary-500 py-2 px-4 rounded-md" onPress={() => handleOrder(item.noticeId, "BOOST")}
></Button> >
<ButtonText>Podbij</ButtonText>
<Ionicons name="arrow-up" size={14} color="#fff" />
</Button>
) : ( ) : (
<Button <Button
title="Aktywj" className="mr-2"
onPress={() => { size="md"
console.log(`Promuj ogłoszenie ${item.noticeId}`); variant="solid"
}} action="primary"
className="bg-primary-500 py-2 px-4 rounded-md" onPress={() => handleOrder(item.noticeId, "ACTIVATION")}
></Button> >
<ButtonText>Aktywuj</ButtonText>
<Ionicons
name="arrow-redo-outline"
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>
</Box> </Box>
)} )}

View File

@@ -0,0 +1,49 @@
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([]);
useEffect(() => {
const fetchOrders = async () => {
try {
const data = await listOrders();
setOrders(data);
} catch (err) {}
};
fetchOrders();
}, []);
if (orders.length === 0) {
return (
<View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
<Text>Brak zamówień</Text>
</View>
);
}
return (
<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} </Text>
<Text className="mt-2">{item.createdAt}</Text>
</VStack>
</Box>
)}
/>
);
}

View File

@@ -1,17 +1,16 @@
import { ScrollView, View } from "react-native"; import { ScrollView } from "react-native";
import { useNoticesStore } from "@/store/noticesStore"; import { useNoticesStore } from "@/store/noticesStore";
import { CategorySection } from "@/components/CategorySection"; import { CategorySection } from "@/components/CategorySection";
import { NoticeSection } from "@/components/NoticeSection"; import { NoticeSection } from "@/components/NoticeSection";
import { UserSection } from "@/components/UserSection"; import { UserSection } from "@/components/UserSection";
import { SearchSection } from "@/components/SearchSection"; import { SearchSection } from "@/components/SearchSection";
import { FlatList } from "react-native";
import { useAuthStore } from "@/store/authStore"; import { useAuthStore } from "@/store/authStore";
import { useRouter } from "expo-router"; import { useRouter } from "expo-router";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { SafeAreaView } from "react-native"; import { SafeAreaView } from "react-native";
export default function Home() { export default function Home() {
const token = useAuthStore((state) => state.token); const { token } = useAuthStore.getState();
const router = useRouter(); const router = useRouter();
const [isReady, setIsReady] = useState(false); const [isReady, setIsReady] = useState(false);
const fetchNotices = useNoticesStore((state) => state.fetchNotices); const fetchNotices = useNoticesStore((state) => state.fetchNotices);
@@ -30,14 +29,11 @@ export default function Home() {
if (token) { if (token) {
fetchNotices(); fetchNotices();
} }
}, [token, fetchNotices]); }, [token]);
const notices = useNoticesStore((state) => state.notices); const notices = useNoticesStore((state) => state.notices);
// 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] const latestNotices = [...activeNotices]
.sort((a, b) => new Date(b.publishDate) - new Date(a.publishDate)) .sort((a, b) => new Date(b.publishDate) - new Date(a.publishDate))
.slice(0, 6); .slice(0, 6);

View File

@@ -1,13 +1,20 @@
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import {Image, StyleSheet} from "react-native"; import {
Image,
StyleSheet,
KeyboardAvoidingView,
Platform,
ActivityIndicator,
} from "react-native";
import { Button, ButtonText } from "@/components/ui/button"; import { Button, ButtonText } from "@/components/ui/button";
import { FormControl } from "@/components/ui/form-control"; import { FormControl } from "@/components/ui/form-control";
import { Input, InputField } from "@/components/ui/input"; import { Input, InputField } from "@/components/ui/input";
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 { Textarea, TextareaInput } from "@/components/ui/textarea"; import { Textarea, TextareaInput } from "@/components/ui/textarea";
import {ScrollView} from '@gluestack-ui/themed'; import { ScrollView } from "@gluestack-ui/themed";
import * as ImagePicker from 'expo-image-picker'; import { Box } from "@/components/ui/box";
import * as ImagePicker from "expo-image-picker";
import { import {
Select, Select,
SelectTrigger, SelectTrigger,
@@ -24,6 +31,7 @@ import {ChevronDownIcon} from "@/components/ui/icon";
import { useNoticesStore } from "@/store/noticesStore"; import { useNoticesStore } from "@/store/noticesStore";
import { listCategories } from "@/api/categories"; import { listCategories } from "@/api/categories";
import { useRouter } from "expo-router"; import { useRouter } from "expo-router";
import { attributes } from "@/data/attributesData"; // Assuming you have a separate file for attributes data}
export default function CreateNotice() { export default function CreateNotice() {
const router = useRouter(); const router = useRouter();
@@ -35,6 +43,7 @@ export default function CreateNotice() {
const [image, setImage] = useState([]); const [image, setImage] = useState([]);
const [selectItems, setSelectItems] = useState([]); const [selectItems, setSelectItems] = useState([]);
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [selectedAttributes, setSelectedAttributes] = useState({});
useEffect(() => { useEffect(() => {
let isMounted = true; let isMounted = true;
@@ -46,7 +55,7 @@ export default function CreateNotice() {
setSelectItems(data); setSelectItems(data);
} }
} catch (error) { } catch (error) {
console.error('Error fetching select items:', error); console.error("Error fetching select items:", error);
} }
}; };
@@ -67,8 +76,8 @@ export default function CreateNotice() {
const styles = StyleSheet.create({ const styles = StyleSheet.create({
container: { container: {
flex: 1, flex: 1,
alignItems: 'center', alignItems: "center",
justifyContent: 'center', justifyContent: "center",
}, },
image: { image: {
width: 100, width: 100,
@@ -85,27 +94,32 @@ export default function CreateNotice() {
}); });
if (!title || !description || !price || !category) { if (!title || !description || !price || !category) {
console.log("Error in form");
return; return;
} }
const formattedAttributes = Object.entries(selectedAttributes).map(
([name, value]) => ({
name: name,
value: value,
})
);
setIsLoading(true); setIsLoading(true);
try { try {
const result = await addNotice({ const result = await addNotice({
title: title, title: title,
clientId: 1,
description: description, description: description,
price: price, price: price,
category: category, category: category,
status: "ACTIVE", status: "INACTIVE",
image: image image: image,
attributes: formattedAttributes,
}); });
if (result) { if (result) {
console.log("Notice created successfully with ID: ", result.noticeId); console.log("Notice created successfully with ID: ", result.noticeId);
await fetchNotices(); await fetchNotices();
clearForm(); clearForm();
router.push("/(tabs)/notices");
router.push("/(tabs)/dashboard/userNotices");
} }
} catch (error) { } catch (error) {
console.error("Error creating notice. Error message: ", error.message); console.error("Error creating notice. Error message: ", error.message);
@@ -116,7 +130,7 @@ export default function CreateNotice() {
const takePicture = async () => { const takePicture = async () => {
const { status } = await ImagePicker.requestCameraPermissionsAsync(); const { status } = await ImagePicker.requestCameraPermissionsAsync();
if (status !== 'granted') { if (status !== "granted") {
return; return;
} }
const result = await ImagePicker.launchCameraAsync({ const result = await ImagePicker.launchCameraAsync({
@@ -124,13 +138,13 @@ export default function CreateNotice() {
}); });
if (!result.canceled && result.assets) { if (!result.canceled && result.assets) {
setImage(result.assets.map(asset => asset.uri)); setImage(result.assets.map((asset) => asset.uri));
}
} }
};
const pickImage = async () => { const pickImage = async () => {
let result = await ImagePicker.launchImageLibraryAsync({ let result = await ImagePicker.launchImageLibraryAsync({
mediaTypes: 'images', mediaTypes: "images",
selectionLimit: 8, selectionLimit: 8,
allowsEditing: false, allowsEditing: false,
allowsMultipleSelection: true, allowsMultipleSelection: true,
@@ -139,7 +153,7 @@ export default function CreateNotice() {
}); });
if (!result.canceled) { if (!result.canceled) {
setImage(result.assets.map(asset => asset.uri)); setImage(result.assets.map((asset) => asset.uri));
} }
}; };
@@ -149,43 +163,62 @@ export default function CreateNotice() {
setPrice(""); setPrice("");
setCategory(""); setCategory("");
setImage([]); setImage([]);
setSelectedAttributes({});
setError({ setError({
title: false, title: false,
description: false, description: false,
price: false, price: false,
category: 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 ( return (
<KeyboardAvoidingView
behavior={Platform.OS === "ios" ? "padding" : "height"}
style={{ flex: 1 }}
keyboardVerticalOffset={Platform.OS === "ios" ? 64 : 0}
>
<ScrollView h="$80" w="$80"> <ScrollView h="$80" w="$80">
<FormControl className="p-4 border rounded-lg border-outline-300"> <FormControl className="p-4 border rounded-lg border-outline-300">
<VStack space="xl"> <VStack space="xl">
<VStack space="md"> <VStack space="md">
<Text className="text-typography-500">Zdjęcia</Text> <Text className="text-typography-500">Zdjęcia</Text>
<Button onPress={pickImage}> <Button onPress={pickImage}>
<ButtonText> <ButtonText>Wybierz zdjęcia</ButtonText>
Wybierz zdjęcia
</ButtonText>
</Button> </Button>
<Button onPress={takePicture}> <Button onPress={takePicture}>
<ButtonText>Zrób zdjęcie</ButtonText> <ButtonText>Zrób zdjęcie</ButtonText>
</Button> </Button>
<Text size="sm" <Text size="sm" bold="true">
bold="true" Pierwsze zdjęcie będzie zdjęciem głównym
> </Text>
Pierwsze zdjęcie będzie zdjęciem głównym</Text>
{image && image.length > 0 && ( {image && image.length > 0 && (
<VStack space="xs" className="flex-row flex-wrap"> <VStack space="xs" className="flex-row flex-wrap">
{image.map((img, index) => ( {image.map((img, index) => (
<Image key={index} source={{uri: img}} style={styles.image} className="m-1"/> <Image
key={index}
source={{ uri: img }}
style={styles.image}
className="m-1"
/>
))} ))}
</VStack> </VStack>
)} )}
</VStack> </VStack>
<VStack space="xs"> <VStack space="xs">
<Text className="text-typography-500">Tytuł</Text> <Text className="text-typography-500">Tytuł*</Text>
<Input className="min-w-[250px]" isInvalid={error.title}> <Input className="min-w-[250px]" isInvalid={error.title}>
<InputField <InputField
type="text" type="text"
@@ -196,7 +229,7 @@ export default function CreateNotice() {
</VStack> </VStack>
<VStack space="xs"> <VStack space="xs">
<Text className="text-typography-500">Opis</Text> <Text className="text-typography-500">Opis*</Text>
<Textarea <Textarea
size="md" size="md"
className="min-w-[250px] " className="min-w-[250px] "
@@ -211,7 +244,7 @@ export default function CreateNotice() {
</VStack> </VStack>
<VStack space="xs"> <VStack space="xs">
<Text className="text-typography-500">Cena</Text> <Text className="text-typography-500">Cena*</Text>
<Input className="min-w-[250px]" isInvalid={error.price}> <Input className="min-w-[250px]" isInvalid={error.price}>
<InputField <InputField
type="text" type="text"
@@ -221,7 +254,7 @@ export default function CreateNotice() {
</Input> </Input>
</VStack> </VStack>
<VStack space="xs"> <VStack space="xs">
<Text className="text-typography-500">Kategoria</Text> <Text className="text-typography-500">Kategoria*</Text>
<Select <Select
onValueChange={(value) => setCategory(value)} onValueChange={(value) => setCategory(value)}
isInvalid={error.category} isInvalid={error.category}
@@ -235,13 +268,53 @@ export default function CreateNotice() {
<SelectContent style={{ maxHeight: 400 }}> <SelectContent style={{ maxHeight: 400 }}>
<SelectScrollView> <SelectScrollView>
{selectItems.map((item) => ( {selectItems.map((item) => (
<SelectItem key={item.value} label={item.label} value={item.value}/> <SelectItem
key={item.value}
label={item.label}
value={item.value}
/>
))} ))}
</SelectScrollView> </SelectScrollView>
</SelectContent> </SelectContent>
</SelectPortal> </SelectPortal>
</Select> </Select>
</VStack> </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 <Button
className="mt-5 w-full" className="mt-5 w-full"
onPress={handleAddNotice} onPress={handleAddNotice}
@@ -252,5 +325,6 @@ export default function CreateNotice() {
</VStack> </VStack>
</FormControl> </FormControl>
</ScrollView> </ScrollView>
</KeyboardAvoidingView>
); );
} }

View File

@@ -39,11 +39,11 @@ import {
SelectDragIndicator, SelectDragIndicator,
SelectDragIndicatorWrapper, SelectDragIndicatorWrapper,
SelectItem, SelectItem,
SelectScrollView,
} from "@/components/ui/select"; } from "@/components/ui/select";
import { ScrollView } from "react-native-gesture-handler"; import { attributes } from "@/data/attributesData";
export default function Notices() { export default function Notices() {
// Hooks
const { notices, fetchNotices } = useNoticesStore(); const { notices, fetchNotices } = useNoticesStore();
const [refreshing, setRefreshing] = useState(false); const [refreshing, setRefreshing] = useState(false);
const [isLoading, setIsLoading] = useState(true); const [isLoading, setIsLoading] = useState(true);
@@ -52,6 +52,7 @@ export default function Notices() {
const [showSortSheet, setShowSortSheet] = useState(false); const [showSortSheet, setShowSortSheet] = useState(false);
const [categories, setCategories] = useState([]); const [categories, setCategories] = useState([]);
const [filteredNotices, setFilteredNotices] = useState([]); const [filteredNotices, setFilteredNotices] = useState([]);
const [selectedAttributes, setSelectedAttributes] = useState({});
const params = useLocalSearchParams(); const params = useLocalSearchParams();
const router = useRouter(); const router = useRouter();
@@ -131,6 +132,20 @@ export default function Notices() {
}); });
} }
Object.keys(params).forEach((key) => {
if (key.startsWith("attribute_")) {
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); setFilteredNotices(result);
}, [ }, [
notices, notices,
@@ -139,6 +154,8 @@ export default function Notices() {
params.priceFrom, params.priceFrom,
params.priceTo, params.priceTo,
params.search, params.search,
params.attribute_Kolor,
params.attribute_Materiał,
]); ]);
let filterActive = let filterActive =
@@ -146,7 +163,8 @@ export default function Notices() {
!!params.sort || !!params.sort ||
!!params.priceFrom || !!params.priceFrom ||
!!params.priceTo || !!params.priceTo ||
!!params.search; !!params.search ||
Object.keys(params).some((key) => key.startsWith("attribute_"));
const loadData = async () => { const loadData = async () => {
setIsLoading(true); setIsLoading(true);
@@ -181,6 +199,19 @@ export default function Notices() {
}); });
}; };
const handleAttributeSelect = (attributeName, value) => {
const newParams = { ...params };
if (value) {
newParams[`attribute_${attributeName}`] = value;
}
router.replace({
pathname: "/notices",
params: newParams,
});
};
const handleClose = () => setShowActionsheet(false); const handleClose = () => setShowActionsheet(false);
const handleSort = (value) => { const handleSort = (value) => {
@@ -321,6 +352,42 @@ export default function Notices() {
</SelectPortal> </SelectPortal>
</Select> </Select>
</Box> </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> </KeyboardAwareScrollView>
</ActionsheetContent> </ActionsheetContent>
</Actionsheet> </Actionsheet>

View File

@@ -4,25 +4,34 @@ import { NoticeCard } from "@/components/NoticeCard";
import { Ionicons } from "@expo/vector-icons"; import { Ionicons } from "@expo/vector-icons";
import { Box } from "@/components/ui/box"; import { Box } from "@/components/ui/box";
import { Text } from "@/components/ui/text"; import { Text } from "@/components/ui/text";
import { useEffect } from "react"; import { useCallback } from "react";
import { useFocusEffect } from "@react-navigation/native";
export default function Wishlist() { export default function Wishlist() {
const wishlistNotices = useWishlist((state) => state.wishlistNotices); const wishlistNotices = useWishlist((state) => state.wishlistNotices);
const fetchWishlist = useWishlist((state) => state.fetchWishlist); const fetchWishlist = useWishlist((state) => state.fetchWishlist);
useEffect(() => { useFocusEffect(
useCallback(() => {
fetchWishlist(); fetchWishlist();
}, []); }, [fetchWishlist])
);
const styles = {
container: {
margin: 10,
},
};
// console.log("Wishlist notices:", wishlistNotices);
if (wishlistNotices.length === 0) { if (wishlistNotices.length === 0) {
return ( return (
<Box className="flex-row flex-1 justify-center"> <Box style={styles.container} className="flex-row flex-1 justify-center">
<Ionicons name="sad-outline" size={24} color="black" /> <Ionicons name="sad-outline" size={24} color="black" />
<Text>Brak ulubionych ogłoszeń</Text> <Text>Brak ulubionych ogłoszeń</Text>
</Box> </Box>
); );
} }
return ( return (
<FlatList <FlatList
data={wishlistNotices} data={wishlistNotices}
@@ -30,7 +39,6 @@ export default function Wishlist() {
numColumns={2} numColumns={2}
columnContainerClassName="m-2" columnContainerClassName="m-2"
columnWrapperClassName="gap-2 m-2" columnWrapperClassName="gap-2 m-2"
k
renderItem={({ item }) => <NoticeCard notice={item} />} renderItem={({ item }) => <NoticeCard notice={item} />}
/> />
); );

View File

@@ -1,4 +1,4 @@
import { Stack, Redirect } from "expo-router"; import {Stack} from "expo-router";
import "@/global.css"; import "@/global.css";
import {GluestackUIProvider} from "@/components/ui/gluestack-ui-provider"; import {GluestackUIProvider} from "@/components/ui/gluestack-ui-provider";
import {QueryClient, QueryClientProvider} from "@tanstack/react-query"; import {QueryClient, QueryClientProvider} from "@tanstack/react-query";
@@ -17,7 +17,7 @@ return (
}} }}
> >
<Stack.Screen name="(tabs)" options={{headerShown: false}}/> <Stack.Screen name="(tabs)" options={{headerShown: false}}/>
<Stack.Screen name="user" options={{ headerShown: false }} /> {/*<Stack.Screen name="user" options={{headerShown: false}}/>*/}
<Stack.Screen <Stack.Screen
name="(auth)/login" name="(auth)/login"
options={{headerShown: false}}/> options={{headerShown: false}}/>

View File

@@ -1,19 +1,25 @@
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 { 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 { useRouter } from "expo-router";
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 { Avatar, AvatarImage, AvatarFallbackText } from "@gluestack-ui/themed";
import { Ionicons } from "@expo/vector-icons"; import { Ionicons } from "@expo/vector-icons";
import {
Avatar,
AvatarImage,
AvatarFallbackText,
} from "@/components/ui/avatar";
import { import {
ActivityIndicator, ActivityIndicator,
Dimensions, Dimensions,
FlatList, FlatList,
View, View,
TextInput, TextInput,
SafeAreaView, Alert, Alert,
} from "react-native"; } from "react-native";
import { useEffect, useState, useRef } from "react"; import { useEffect, useState, useRef } from "react";
import { useNoticesStore } from "@/store/noticesStore"; import { useNoticesStore } from "@/store/noticesStore";
@@ -23,6 +29,9 @@ import { getUserById } from "@/api/client";
import * as ScreenOrientation from "expo-screen-orientation"; import * as ScreenOrientation from "expo-screen-orientation";
import { useAuthStore } from "@/store/authStore"; import { useAuthStore } from "@/store/authStore";
import { sendEmail } from "@/api/email"; 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() { export default function NoticeDetails() {
const { id } = useLocalSearchParams(); const { id } = useLocalSearchParams();
@@ -39,14 +48,14 @@ export default function NoticeDetails() {
const [isMessageFormVisible, setIsMessageFormVisible] = useState(false); const [isMessageFormVisible, setIsMessageFormVisible] = useState(false);
const [message, setMessage] = useState(""); const [message, setMessage] = useState("");
const [isSending, setIsSending] = useState(false); const [isSending, setIsSending] = useState(false);
const router = useRouter();
const { width } = Dimensions.get("window");
const handleSendMessage = async () => { const handleSendMessage = async () => {
setIsSending(true); setIsSending(true);
console.log("Rozpoczynanie procesu wysyłania wiadomości...");
const { user_id, token } = useAuthStore.getState(); const { user_id, token } = useAuthStore.getState();
console.log("Dane z authStore:", { user_id, token });
if (!user_id || !token) { if (!user_id || !token) {
console.error("Brak danych zalogowanego użytkownika."); console.error("Brak danych zalogowanego użytkownika.");
@@ -57,20 +66,23 @@ export default function NoticeDetails() {
let currentUserEmail = ""; let currentUserEmail = "";
try { try {
console.log(`Pobieranie danych użytkownika dla user_id: ${user_id}`);
const currentUser = await getUserById(user_id); const currentUser = await getUserById(user_id);
console.log("Dane zalogowanego użytkownika:", currentUser);
currentUserEmail = currentUser?.email; currentUserEmail = currentUser?.email;
if (!currentUserEmail) { if (!currentUserEmail) {
console.error("Nie znaleziono adresu email zalogowanego użytkownika."); console.error("Nie znaleziono adresu email zalogowanego użytkownika.");
Alert.alert("Błąd", "Nie znaleziono adresu email zalogowanego użytkownika."); Alert.alert(
"Błąd",
"Nie znaleziono adresu email zalogowanego użytkownika."
);
setIsSending(false); setIsSending(false);
return; return;
} }
console.log(`Pobrano email zalogowanego użytkownika: ${currentUserEmail}`);
} catch (error) { } catch (error) {
console.error("Błąd podczas pobierania danych użytkownika:", 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."); Alert.alert(
"Błąd",
"Nie udało się pobrać danych użytkownika. Spróbuj ponownie później."
);
setIsSending(false); setIsSending(false);
return; return;
} }
@@ -80,7 +92,6 @@ export default function NoticeDetails() {
subject: `Zapytanie ${currentUserEmail} o ogłoszenie ${notice.title}`, subject: `Zapytanie ${currentUserEmail} o ogłoszenie ${notice.title}`,
body: message, body: message,
}; };
console.log("Dane emaila do wysyłki:", emailData);
if (!emailData.to || !emailData.subject || !emailData.body) { if (!emailData.to || !emailData.subject || !emailData.body) {
console.error("Walidacja nieudana: brakujące pola w emailData."); console.error("Walidacja nieudana: brakujące pola w emailData.");
@@ -91,16 +102,18 @@ export default function NoticeDetails() {
const result = await sendEmail(emailData); const result = await sendEmail(emailData);
if (result.success) { if (result.success) {
console.log("Wiadomość wysłana pomyślnie!", result.result);
setIsMessageFormVisible(false); setIsMessageFormVisible(false);
setMessage(""); setMessage("");
Alert.alert("Sukces", "Wiadomość została wysłana!"); Alert.alert("Sukces", "Wiadomość została wysłana!");
} else { } else {
console.error("Błąd podczas wysyłania wiadomości:", result.error); 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}`); Alert.alert(
"Błąd",
`Nie udało się wysłać wiadomości
: $ { result.error }`
);
} }
setIsSending(false); setIsSending(false);
console.log("Zakończono proces wysyłania wiadomości.");
}; };
const formatDate = (dateString) => { const formatDate = (dateString) => {
@@ -118,9 +131,8 @@ export default function NoticeDetails() {
); );
const isInWishlist = useWishlist((state) => const isInWishlist = useWishlist((state) =>
id ? state.wishlistNotices.some((item) => item.noticeId == id) : false id ? state.wishlistNotices.some((item) => item.noticeId === id) : false
); );
const onViewableItemsChanged = useRef(({ viewableItems }) => { const onViewableItemsChanged = useRef(({ viewableItems }) => {
if (viewableItems.length > 0) { if (viewableItems.length > 0) {
setCurrentIndex(viewableItems[0].index); setCurrentIndex(viewableItems[0].index);
@@ -203,15 +215,14 @@ export default function NoticeDetails() {
if (notice) { if (notice) {
try { try {
const fetchedImages = await getAllImagesByNoticeId(notice.noticeId); const fetchedImages = await getAllImagesByNoticeId(notice.noticeId);
console.log("Fetched images:", fetchedImages);
setImages( setImages(
fetchedImages && fetchedImages.length > 0 fetchedImages && fetchedImages.length > 0
? fetchedImages ? fetchedImages
: ["https://http.cat/404.jpg"] : { uri: "https://http.cat/404.jpg" }
); );
} catch (err) { } catch (err) {
console.error("Error while loading images:", err); console.error("Error while loading images:", err);
setImages(["https://http.cat/404.jpg"]); setImages({ uri: "https://http.cat/404.jpg" });
} finally { } finally {
setIsImageLoading(false); setIsImageLoading(false);
} }
@@ -246,91 +257,111 @@ export default function NoticeDetails() {
} }
if (error) { if (error) {
return <Text>Błąd, spróbuj ponownie źniej: {error.message}</Text>; return <Text>Błąd, spróbuj ponownie żniej: {error.message}</Text>;
} }
if (!notice) { if (!notice) {
return <Text>Nie znaleziono ogłoszenia</Text>; return <Text>Nie znaleziono ogłoszenia</Text>;
} }
const renderImageSection = () => {
if (isImageLoading) {
return ( return (
<Box <SafeAreaView className="flex-1" edges={["right", "bottom", "left"]}>
className={`h-auto w-full rounded-md ${ <Card className="p-0 rounded-lg m-3 flex-1">
isLandscape ? "h-screen" : "aspect-[1/1]" <Stack.Screen
} bg-gray-100 items-center justify-center`} options={{
> title: notice.title,
headerShown: !isLandscape,
}}
/>
{isImageLoading ? (
<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>
); ) : (
<Box
className="sticky top-0 z-10 bg-white"
style={
isLandscape
? {
position: "absolute",
top: 0,
left: 0,
right: 0,
bottom: 0,
zIndex: 30,
} }
: {}
return ( }
<Box className={isLandscape ? "h-screen" : "sticky top-0 z-10 bg-white"}> >
<FlatList <FlatList
ref={flatListRef} ref={flatListRef}
data={images} data={images}
horizontal horizontal
snapToAlignment="center" snapToAlignment="start"
snapToInterval={width}
decelerationRate="fast" decelerationRate="fast"
showsHorizontalScrollIndicator={false} showsHorizontalScrollIndicator={false}
pagingEnabled pagingEnabled
onViewableItemsChanged={onViewableItemsChanged} onViewableItemsChanged={onViewableItemsChanged}
viewabilityConfig={viewabilityConfig} viewabilityConfig={viewabilityConfig}
style={isLandscape ? { flex: 1 } : {}}
renderItem={({ item, index }) => ( renderItem={({ item, index }) => (
<View style={{ width: Dimensions.get("window").width }}> <View style={{ width: width }} className="p-1">
<Image <Image
source={{ uri: item }} source={item}
className={`h-auto w-full rounded-md ${ // className="h-auto w-auto rounded-md aspect-[1/1]"
isLandscape ? "h-full" : "aspect-square"
}`}
alt={`Zdjęcie ${index + 1}`} alt={`Zdjęcie ${index + 1}`}
resizeMode={isLandscape ? "cover" : "contain"} resizeMode="cover"
onError={(e) => console.error("Image load error:", e.nativeEvent.error)} 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> </View>
)} )}
keyExtractor={(item, index) => index.toString()} keyExtractor={(item, index) => index.toString()}
/> />
{images.length > 1 && ( {images.length > 1 && (
<Box className="flex-row justify-center mt-2"> <Box className="flex-row justify-center mt-2">
{images.map((_, index) => ( {images.map((_, index) => (
<Box <Box
key={index} key={index}
className={`w-2 h-2 rounded-full mx-1 ${ className={`w-2 h-2 rounded-full mx-1 ${
index === currentIndex ? "bg-primary-500" : "bg-gray-500"} index === currentIndex ? "bg-primary-500" : "bg-gray-300"
}`} }`}
/> />
))} ))}
</Box> </Box>
)} )}
</Box> </Box>
); )}
};
return (
<SafeAreaView style={{ flex: 1 }}>
<Card className="flex-1 p-4 m-3 rounded-lg shadow-sm">
<Stack.Screen
options={{
title: notice.title,
}}
/>
<ScrollView showsVerticalScrollIndicator={false}> <ScrollView showsVerticalScrollIndicator={false}>
{renderImageSection()} <VStack className="p-2">
<VStack className="p-4"> <Text className="text-sm font-normal mb-2 text-typography-700">
<Text className="text-sm font-normal mb-2 text-gray-600">
{formatDate(notice.publishDate)} {formatDate(notice.publishDate)}
</Text> </Text>
<Text className="text-2xl font-bold mb-2 text-center bg-gray-100 rounded-md p-4"> <Text className="text-2xl text-gray-950 font-bold mb-2 text-left bg-gray-50 rounded-md p-2">
{notice.title} {notice.title}
</Text> </Text>
<Box className="flex-row items-center bg-gray-100 rounded-md p-2">
<Heading size="md" className="flex-1 text-lg"> <Box className="flex-row items-center bg-gray-50 rounded-md p-2">
<Text className="text-sm text-gray-500">Cena: </Text> <Heading size="md" className="flex-1 text-xl text-gray-950">
<Text className="text-sm text-typography-500">Cena: </Text>
{notice.price} {notice.price}
</Heading> </Heading>
<Pressable <Pressable
onPress={() => { onPress={() => {
toggleNoticeInWishlist(id); toggleNoticeInWishlist(id);
@@ -339,22 +370,42 @@ export default function NoticeDetails() {
<Ionicons <Ionicons
name={isInWishlist ? "heart" : "heart-outline"} name={isInWishlist ? "heart" : "heart-outline"}
size={24} size={24}
color="#3b82f6" color={"primary-heading-500"}
/> />
</Pressable> </Pressable>
</Box> </Box>
<Box className="mt-4 bg-gray-100 p-3 rounded-lg"> <Box className="mt-4 bg-gray-50 p-3 rounded-lg shadow-sm">
<Text className="text-sm text-gray-500"> <Text className="text-sm text-typography-500">
Kategoria:{" "} Kategoria:{" "}
<Text className="font-bold text-gray-900">{notice.category}</Text> <Text className="font-bold text-gray-950">
{notice.category}
</Text>
</Text> </Text>
</Box> </Box>
<Box className="mt-4 bg-gray-100 p-3 rounded-lg"> {notice.attributes && notice.attributes.length > 0 && (
<Text className="text-xl font-bold text-gray-900">Opis ogłoszenia</Text> <Box className="mt-4 bg-gray-50 p-3 rounded-lg shadow-sm">
<Text className="text-sm text-gray-700">{notice.description}</Text> {notice.attributes.map((attribute, index) => (
<Text
key={index}
className="text-sm text-typography-500 mb-1"
>
{attribute.name}:{" "}
<Text className="font-bold text-gray-950">
{attribute.value}
</Text>
</Text>
))}
</Box> </Box>
<Box className="mt-4 bg-gray-100 p-3 rounded-lg"> )}
<Text className="text-sm text-gray-500">Użytkownik:</Text> <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="mt-4 bg-gray-50 p-3 rounded-lg shadow-sm">
<Text className="text-sm text-typography-500">Uzytkownik:</Text>
{isUserLoading ? ( {isUserLoading ? (
<ActivityIndicator /> <ActivityIndicator />
) : user ? ( ) : user ? (
@@ -375,26 +426,32 @@ export default function NoticeDetails() {
</AvatarFallbackText> </AvatarFallbackText>
</Avatar> </Avatar>
</Box> </Box>
<Box className="flex-1"> <Box className="flex-1">
<Text className="text-lg font-bold text-gray-900"> <Text className="text-xl font-bold text-gray-950">
{user.firstName} {user.lastName} {user.firstName} {user.lastName}
</Text> </Text>
<Text className="text-sm text-gray-700"> <Text className="text-sm text-typography-700">
Email: {user.email} Email: {user.email}
</Text> </Text>
<Pressable <Pressable
onPress={() => setIsMessageFormVisible(true)} onPress={() => setIsMessageFormVisible(true)}
className="mt-3 bg-blue-500 py-2 px-4 rounded-md" className="mt-3 bg-primary-500 py-2 px-4 rounded-md"
> >
<Text className="text-white text-center font-bold"> <Text className="text-white text-center font-bold">
Wyślij wiadomość Wyślij wiadomość
</Text> </Text>
</Pressable> </Pressable>
<Link href={`/user/${notice.clientId}`}>
<Text className="text-lg font-bold text-center text-blue-600 mt-3"> <Button
variant="outline"
className="mt-2"
onPress={() => router.replace(`/user/${notice.clientId}`)}
>
<ButtonText>
Zobacz więcej ogłoszeń od {user.firstName} Zobacz więcej ogłoszeń od {user.firstName}
</Text> </ButtonText>
</Link> </Button>
</Box> </Box>
</> </>
) : ( ) : (
@@ -404,20 +461,26 @@ export default function NoticeDetails() {
</VStack> </VStack>
</ScrollView> </ScrollView>
{isMessageFormVisible && ( {isMessageFormVisible && (
<View className="absolute inset-0 bg-black bg-opacity-50 justify-center items-center z-20"> <KeyboardAvoidingView
<View className="bg-white p-4 rounded-lg w-4/5"> 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"> <Text className="text-lg font-bold mb-4">
Wyślij wiadomość do {user?.firstName} Wyślij wiadomość do {user?.firstName}
</Text> </Text>
<Text className="text-sm font-medium mb-1">Do:</Text> <Text className="text-sm font-medium mb-1">Do:</Text>
<Text className="bg-gray-100 p-3 rounded text-gray-500"> <Text className="bg-gray-100 p-3 rounded text-gray-500">
{user?.email || "Brak adresu e-mail"} {user?.email || "Brak adresu e-mail"}
</Text> </Text>
<Text className="text-sm font-medium mb-1">Temat:</Text> <Text className="text-sm font-medium mb-1">Temat:</Text>
<Text className="bg-gray-100 p-3 rounded text-gray-500"> <Text className="bg-gray-100 p-3 rounded text-gray-500">
Zapytanie o ogłoszenie '{notice.title || "Brak nazwy ogłoszenia"}' Zapytanie o ogłoszenie '
{notice.title || "Brak nazwy ogłoszenia"}'
</Text> </Text>
<Text className="text-sm font-medium mb-1">Treść:</Text>
<TextInput <TextInput
className="border border-gray-300 rounded-md p-2 mb-4 h-32 text-left" className="border border-gray-300 rounded-md p-2 mb-4 h-32 text-left"
multiline multiline
@@ -426,6 +489,7 @@ export default function NoticeDetails() {
value={message} value={message}
onChangeText={setMessage} onChangeText={setMessage}
/> />
<View className="flex-row justify-end space-x-2"> <View className="flex-row justify-end space-x-2">
<Pressable <Pressable
onPress={() => setIsMessageFormVisible(false)} onPress={() => setIsMessageFormVisible(false)}
@@ -433,6 +497,7 @@ export default function NoticeDetails() {
> >
<Text className="text-gray-800">Anuluj</Text> <Text className="text-gray-800">Anuluj</Text>
</Pressable> </Pressable>
<Pressable <Pressable
onPress={handleSendMessage} onPress={handleSendMessage}
className="bg-blue-500 py-2 px-4 rounded-md" className="bg-blue-500 py-2 px-4 rounded-md"
@@ -445,8 +510,9 @@ export default function NoticeDetails() {
)} )}
</Pressable> </Pressable>
</View> </View>
</ScrollView>
</View> </View>
</View> </KeyboardAvoidingView>
)} )}
</Card> </Card>
</SafeAreaView> </SafeAreaView>

View File

@@ -0,0 +1,389 @@
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,
} 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 { attributes } from "@/data/attributesData";
import { useLocalSearchParams, Stack } from "expo-router";
import { Ionicons } from "@expo/vector-icons";
export default function EditNotice() {
const { id } = useLocalSearchParams();
const router = useRouter();
const { editNotice, fetchNotices, notices } = useNoticesStore();
const [title, setTitle] = useState("");
const [description, setDescription] = useState("");
const [price, setPrice] = useState("");
const [category, setCategory] = useState("");
const [image, setImage] = useState([]);
const [isImageLoading, setIsImageLoading] = useState(true);
const [selectItems, setSelectItems] = useState([]);
const [isLoading, setIsLoading] = useState(false);
const [selectedAttributes, setSelectedAttributes] = useState({});
const { getNoticeById, getAllImagesByNoticeId } = useNoticesStore();
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;
};
}, []);
useEffect(() => {
const notice = notices.find((notice) => notice.noticeId == id);
if (notice) {
setTitle(notice.title || "");
setDescription(notice.description || "");
setPrice(notice.price?.toString() || "");
setCategory(notice.category || "");
if (notice.attributes && Array.isArray(notice.attributes)) {
const attributesObj = {};
notice.attributes.forEach((attr) => {
attributesObj[attr.name] = attr.value;
});
setSelectedAttributes(attributesObj);
}
}
const fetchImage = async () => {
setIsImageLoading(true);
try {
const fetchedImages = await getAllImagesByNoticeId(notice.noticeId);
if (fetchedImages && fetchedImages.length > 0) {
setImage(fetchedImages);
} else {
setImage([]);
}
} catch (err) {
console.error("Error while loading images:", err);
setImage([]);
} finally {
setIsImageLoading(false);
}
};
if (notice) {
fetchImage();
}
}, [notices, id]);
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 handleEditNotice = async () => {
setError({
title: !title,
description: !description,
price: !price,
category: !category,
});
if (!title || !description || !price || !category) {
console.log("Error in form");
return;
}
const formattedAttributes = Object.entries(selectedAttributes).map(
([name, value]) => ({
name: name,
value: value,
})
);
setIsLoading(true);
try {
const result = await editNotice(id, {
title: title,
description: description,
price: price,
category: category,
status: "INACTIVE",
image: image,
attributes: formattedAttributes,
});
if (result) {
await fetchNotices();
router.push("/(tabs)/dashboard/userNotices");
}
} catch (error) {
console.error("Error editing 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));
}
};
if (isLoading) {
return (
<Box className="items-center justify-center flex-1">
<ActivityIndicator size="large" color="#787878" />
<Text size="md" bold="true" className="mt-5">
Edytuj ogłoszenie...
</Text>
</Box>
);
}
return (
<KeyboardAvoidingView
behavior={Platform.OS === "ios" ? "padding" : "height"}
style={{ flex: 1 }}
keyboardVerticalOffset={Platform.OS === "ios" ? 64 : 0}
>
<Stack.Screen
options={{
title: "Edycja",
headerLeft: () => (
<Button
variant="link"
size="sm"
onPress={() => router.replace("/(tabs)/dashboard/userNotices")}
className="mr-2"
>
<Ionicons name="arrow-back" size={24} color="#1c1c1e" />
<ButtonText className="text-typography-900">Wróć</ButtonText>
</Button>
),
}}
/>
<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) => {
const imageSource =
typeof img === "string" ? { uri: img } : img;
return (
<Image
key={index}
source={imageSource}
style={styles.image}
className="m-1"
onError={(error) =>
console.log(`Image ${index} error:`, error)
}
/>
);
})}
</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}
selectedValue={category || ""}
>
<SelectTrigger variant="outline" size="md">
<SelectInput
placeholder="Wybierz kategorię"
value={
selectItems.find((item) => item.value === category)
?.label || ""
}
/>
<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
selectedValue={selectedAttributes[label] || ""}
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={handleEditNotice}
disabled={isLoading}
>
<ButtonText className="text-typography-0">Edytuj</ButtonText>
</Button>
</VStack>
</FormControl>
</ScrollView>
</KeyboardAvoidingView>
);
}

View File

@@ -1,22 +1,24 @@
import React, {useState} from 'react'; import React, {useState} from 'react';
import {StyleSheet, ActivityIndicator, SafeAreaView, View} from 'react-native'; import {StyleSheet, ActivityIndicator, SafeAreaView, View, Platform, KeyboardAvoidingView} from 'react-native';
import {useAuthStore} from '@/store/authStore'; import {useAuthStore} from '@/store/authStore';
import {useRouter} from 'expo-router'; import {useRouter} from 'expo-router';
import {Box} from "@/components/ui/box" import {Box} from "@/components/ui/box"
import {Button, ButtonText, ButtonIcon} from "@/components/ui/button" import {Button, ButtonText, ButtonIcon} from "@/components/ui/button"
import {ArrowRightIcon} from "@/components/ui/icon" import {ArrowRightIcon, EyeIcon, EyeOffIcon} from "@/components/ui/icon"
import {Center} from "@/components/ui/center" import {Center} from "@/components/ui/center"
import {Heading} from "@/components/ui/heading" import {Heading} from "@/components/ui/heading"
import {Input, InputField} from "@/components/ui/input" import {Input, InputField, InputIcon, InputSlot} from "@/components/ui/input"
import {VStack} from "@/components/ui/vstack" import {VStack} from "@/components/ui/vstack"
import {Link} from "expo-router" import {Text} from "@/components/ui/text";
export default function Registration() { export default function Registration() {
const [email, setEmail] = useState(''); const [email, setEmail] = useState('');
const [password, setPassword] = useState(''); const [password, setPassword] = useState('');
const [firstName, setFirstName] = useState(''); const [firstName, setFirstName] = useState('');
const [lastName, setLastName] = useState(''); const [lastName, setLastName] = useState('');
const [emailError, setEmailError] = useState('');
const [showPassword, setShowPassword] = useState(false)
const {signUp, isLoading} = useAuthStore(); const {signUp, isLoading} = useAuthStore();
const router = useRouter(); const router = useRouter();
@@ -26,6 +28,11 @@ export default function Registration() {
return; return;
} }
if (!validateEmail(email)) {
setEmailError('Nieprawidłowy format adresu email');
return;
}
try { try {
await signUp({email, password, firstName, lastName}); await signUp({email, password, firstName, lastName});
alert(`Zalogowano jako ${email}`); alert(`Zalogowano jako ${email}`);
@@ -35,6 +42,17 @@ export default function Registration() {
} }
} }
const validateEmail = (email) => {
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return emailRegex.test(email);
};
const handleShowPassword = () => {
setShowPassword((showState) => {
return !showState
})
}
if (isLoading) { if (isLoading) {
return ( return (
<View style={styles.container}> <View style={styles.container}>
@@ -44,6 +62,11 @@ export default function Registration() {
} }
return ( return (
<KeyboardAvoidingView
behavior={Platform.OS === "ios" ? "padding" : "height"}
style={{flex: 1}}
keyboardVerticalOffset={Platform.OS === "ios" ? 64 : 0}
>
<SafeAreaView style={styles.container}> <SafeAreaView style={styles.container}>
<Center> <Center>
@@ -52,7 +75,8 @@ export default function Registration() {
<Heading className="leading-[30px]">Rejestracja</Heading> <Heading className="leading-[30px]">Rejestracja</Heading>
<Box className="flex flex-row"> <Box className="flex flex-row">
{/* <Link href="/login" asChild> */} {/* <Link href="/login" asChild> */}
<Button variant="link" size="sm" className="p-0" onPress={() => router.replace("/login")}> <Button variant="link" size="sm" className="p-0"
onPress={() => router.replace("/login")}>
<ButtonText style={styles.signupbutton}>Masz już konto? Zaloguj się!</ButtonText> <ButtonText style={styles.signupbutton}>Masz już konto? Zaloguj się!</ButtonText>
<ButtonIcon className="mr-1" size="md" as={ArrowRightIcon}/> <ButtonIcon className="mr-1" size="md" as={ArrowRightIcon}/>
</Button> </Button>
@@ -60,18 +84,32 @@ export default function Registration() {
</Box> </Box>
</VStack> </VStack>
<VStack space="xl" className="py-2"> <VStack space="xl" className="py-2">
<Input> {emailError ? <Text className="m-0 color-red-600">{emailError}</Text> : null}
<InputField type="email" className="py-2" placeholder="E-mail" onChangeText={setEmail}/> <Input isRequired={true}>
<InputField type="email" className="py-2" placeholder="E-mail"
onChangeText={(text) => {
setEmail(text);
if (text && !validateEmail(text)) {
setEmailError('Nieprawidłowy format adresu email');
} else {
setEmailError('');
}
}}
/>
</Input> </Input>
<Input> <Input isRequired={true}>
<InputField className="py-2" placeholder="Imię" onChangeText={setFirstName}/> <InputField className="py-2" placeholder="Imię" onChangeText={setFirstName}/>
</Input> </Input>
<Input> <Input isRequired={true}>
<InputField className="py-2" placeholder="Nazwisko" onChangeText={setLastName}/> <InputField className="py-2" placeholder="Nazwisko" onChangeText={setLastName}/>
</Input> </Input>
<Input> <Input isRequired={true}>
<InputField type="password" className="py-2" placeholder="Hasło" <InputField type={showPassword ? "text" : "password"} className="py-2"
placeholder="Hasło"
onChangeText={setPassword}/> onChangeText={setPassword}/>
<InputSlot className="pr-3" onPress={handleShowPassword}>
<InputIcon as={showPassword ? EyeIcon : EyeOffIcon}/>
</InputSlot>
</Input> </Input>
</VStack> </VStack>
<VStack space="lg" className="pt-4"> <VStack space="lg" className="pt-4">
@@ -83,6 +121,7 @@ export default function Registration() {
</Center> </Center>
</SafeAreaView> </SafeAreaView>
</KeyboardAvoidingView>
); );
} }

View File

@@ -1,6 +1,6 @@
import { useLocalSearchParams } from "expo-router"; import { useLocalSearchParams, Stack } from "expo-router";
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import { FlatList, ActivityIndicator, Text } from "react-native"; import {FlatList, ActivityIndicator, Text, SafeAreaView} from "react-native";
import { Box } from "@/components/ui/box"; import { Box } from "@/components/ui/box";
import { Image } from "@/components/ui/image"; import { Image } from "@/components/ui/image";
import { VStack } from "@/components/ui/vstack"; import { VStack } from "@/components/ui/vstack";
@@ -39,13 +39,25 @@ export default function UserProfile() {
return <Text>Nie znaleziono użytkownika</Text>; 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 ( return (
<SafeAreaView className="flex-1" edges={['right', 'bottom', 'left']}>
<VStack className="p-4"> <VStack className="p-4">
<Stack.Screen
options={{
title: "Ogłoszenia użytkownika",
}}
/>
<Box className="flex-row items-center mb-4"> <Box className="flex-row items-center mb-4">
<Image <Image
source={{ uri: user.profileImage || "https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain" }} source={{
uri:
user.image ||
"https://th.bing.com/th/id/OIP.3coo_N8sieled8QNroQmkgHaHa?rs=1&pid=ImgDetMain",
}}
className="h-16 w-16 rounded-full mr-4" className="h-16 w-16 rounded-full mr-4"
alt="Zdjęcie profilowe" alt="Zdjęcie profilowe"
/> />
@@ -57,7 +69,11 @@ export default function UserProfile() {
<FlatList <FlatList
data={userNotices} data={userNotices}
numColumns={2} numColumns={2}
columnWrapperStyle={{ marginBottom: 10, justifyContent: "space-between" }} columnWrapperStyle={{
marginBottom: 10,
justifyContent: "space-between",
gap: 8,
}}
renderItem={({ item }) => <NoticeCard notice={item} />} renderItem={({ item }) => <NoticeCard notice={item} />}
keyExtractor={(item) => item.noticeId.toString()} keyExtractor={(item) => item.noticeId.toString()}
/> />
@@ -65,5 +81,6 @@ export default function UserProfile() {
<Text>Ten użytkownik nie ma żadnych ogłoszeń.</Text> <Text>Ten użytkownik nie ma żadnych ogłoszeń.</Text>
)} )}
</VStack> </VStack>
</SafeAreaView>
); );
} }

View File

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

View File

@@ -1,6 +1,5 @@
import { View, FlatList } from "react-native"; import { View, FlatList } from "react-native";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { useAuthStore } from "@/store/authStore";
import { Heading } from "@/components/ui/heading"; import { Heading } from "@/components/ui/heading";
import { Text } from "@/components/ui/text"; import { Text } from "@/components/ui/text";
import { Link } from "expo-router"; import { Link } from "expo-router";
@@ -17,9 +16,8 @@ export function CategorySection({ notices, title }) {
setCategoryMap(data); setCategoryMap(data);
} }
}; };
fetchCategories(); fetchCategories();
}); }, []);
const categories = Array.from( const categories = Array.from(
new Set(notices.map((notice) => notice.category)) new Set(notices.map((notice) => notice.category))

View File

@@ -34,7 +34,7 @@ export function NoticeCard({ notice }) {
const fetchImage = async () => { const fetchImage = async () => {
if (!noticeId) { if (!noticeId) {
if (isMounted) { if (isMounted) {
setImage("https://http.cat/404.jpg"); setImage({uri: "https://http.cat/404.jpg"});
setIsLoading(false); setIsLoading(false);
} }
return; return;
@@ -45,13 +45,13 @@ export function NoticeCard({ notice }) {
const images = await getAllImagesByNoticeId(noticeId); const images = await getAllImagesByNoticeId(noticeId);
if (isMounted) { if (isMounted) {
setImage( setImage(
images && images.length > 0 ? images[0] : "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("https://http.cat/404.jpg"); setImage({uri: "https://http.cat/404.jpg"});
} }
} finally { } finally {
if (isMounted) { if (isMounted) {
@@ -81,9 +81,7 @@ export function NoticeCard({ notice }) {
</Box> </Box>
) : ( ) : (
<Image <Image
source={{ source={image}
uri: 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"

View File

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

View File

@@ -2,28 +2,36 @@ import { View } from "react-native";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { Heading } from "@/components/ui/heading"; import { Heading } from "@/components/ui/heading";
import { FlatList } from "react-native"; import { FlatList } from "react-native";
import axios from "axios";
import UserBlock from "@/components/UserBlock"; import UserBlock from "@/components/UserBlock";
import { getAllUsers } from "@/api/client";
import { useAuthStore } from "@/store/authStore"; import { useAuthStore } from "@/store/authStore";
export function UserSection({ notices, title }) { export function UserSection({ notices, title }) {
const token = useAuthStore((state) => state.token);
const headers = token ? { Authorization: `Bearer ${token}` } : {};
const [users, setUsers] = useState([]); const [users, setUsers] = useState([]);
const { token } = useAuthStore.getState();
useEffect(() => { useEffect(() => {
const fetchUsers = async () => {
try {
const data = await getAllUsers();
setUsers(data);
} catch (error) {
setUsers([]);
}
};
if (token) { if (token) {
axios fetchUsers();
.get("https://hopp.zikor.pl/api/v1/clients/get/all", { headers })
.then((res) => setUsers(res.data))
.catch(() => setUsers([]));
} }
}, [token]); }, [token]);
const usersWithNoticeCount = users.map((user) => { const usersWithNoticeCount =
users && users.length > 0
? users.map((user) => {
const count = notices.filter((n) => n.clientId === user.id).length; const count = notices.filter((n) => n.clientId === user.id).length;
return { ...user, noticeCount: count }; return { ...user, noticeCount: count };
}); })
: [];
const topUsers = usersWithNoticeCount const topUsers = usersWithNoticeCount
.sort((a, b) => b.noticeCount - a.noticeCount) .sort((a, b) => b.noticeCount - a.noticeCount)

View File

@@ -0,0 +1,240 @@
'use client';
import React from 'react';
import { createToastHook } from '@gluestack-ui/toast';
import { AccessibilityInfo, Text, View, ViewStyle } from 'react-native';
import { tva } from '@gluestack-ui/nativewind-utils/tva';
import { cssInterop } from 'nativewind';
import {
Motion,
AnimatePresence,
MotionComponentProps,
} from '@legendapp/motion';
import {
withStyleContext,
useStyleContext,
} from '@gluestack-ui/nativewind-utils/withStyleContext';
import type { VariantProps } from '@gluestack-ui/nativewind-utils';
type IMotionViewProps = React.ComponentProps<typeof View> &
MotionComponentProps<typeof View, ViewStyle, unknown, unknown, unknown>;
const MotionView = Motion.View as React.ComponentType<IMotionViewProps>;
const useToast = createToastHook(MotionView, AnimatePresence);
const SCOPE = 'TOAST';
cssInterop(MotionView, { className: 'style' });
const toastStyle = tva({
base: 'p-4 m-1 rounded-md gap-1 web:pointer-events-auto shadow-hard-5 border-outline-100',
variants: {
action: {
error: 'bg-error-800',
warning: 'bg-warning-700',
success: 'bg-success-700',
info: 'bg-info-700',
muted: 'bg-background-800',
},
variant: {
solid: '',
outline: 'border bg-background-0',
},
},
});
const toastTitleStyle = tva({
base: 'text-typography-0 font-medium font-body tracking-md text-left',
variants: {
isTruncated: {
true: '',
},
bold: {
true: 'font-bold',
},
underline: {
true: 'underline',
},
strikeThrough: {
true: 'line-through',
},
size: {
'2xs': 'text-2xs',
'xs': 'text-xs',
'sm': 'text-sm',
'md': 'text-base',
'lg': 'text-lg',
'xl': 'text-xl',
'2xl': 'text-2xl',
'3xl': 'text-3xl',
'4xl': 'text-4xl',
'5xl': 'text-5xl',
'6xl': 'text-6xl',
},
},
parentVariants: {
variant: {
solid: '',
outline: '',
},
action: {
error: '',
warning: '',
success: '',
info: '',
muted: '',
},
},
parentCompoundVariants: [
{
variant: 'outline',
action: 'error',
class: 'text-error-800',
},
{
variant: 'outline',
action: 'warning',
class: 'text-warning-800',
},
{
variant: 'outline',
action: 'success',
class: 'text-success-800',
},
{
variant: 'outline',
action: 'info',
class: 'text-info-800',
},
{
variant: 'outline',
action: 'muted',
class: 'text-background-800',
},
],
});
const toastDescriptionStyle = tva({
base: 'font-normal font-body tracking-md text-left',
variants: {
isTruncated: {
true: '',
},
bold: {
true: 'font-bold',
},
underline: {
true: 'underline',
},
strikeThrough: {
true: 'line-through',
},
size: {
'2xs': 'text-2xs',
'xs': 'text-xs',
'sm': 'text-sm',
'md': 'text-base',
'lg': 'text-lg',
'xl': 'text-xl',
'2xl': 'text-2xl',
'3xl': 'text-3xl',
'4xl': 'text-4xl',
'5xl': 'text-5xl',
'6xl': 'text-6xl',
},
},
parentVariants: {
variant: {
solid: 'text-typography-50',
outline: 'text-typography-900',
},
},
});
const Root = withStyleContext(View, SCOPE);
type IToastProps = React.ComponentProps<typeof Root> & {
className?: string;
} & VariantProps<typeof toastStyle>;
const Toast = React.forwardRef<React.ComponentRef<typeof Root>, IToastProps>(
function Toast(
{ className, variant = 'solid', action = 'muted', ...props },
ref
) {
return (
<Root
ref={ref}
className={toastStyle({ variant, action, class: className })}
context={{ variant, action }}
{...props}
/>
);
}
);
type IToastTitleProps = React.ComponentProps<typeof Text> & {
className?: string;
} & VariantProps<typeof toastTitleStyle>;
const ToastTitle = React.forwardRef<
React.ComponentRef<typeof Text>,
IToastTitleProps
>(function ToastTitle({ className, size = 'md', children, ...props }, ref) {
const { variant: parentVariant, action: parentAction } =
useStyleContext(SCOPE);
React.useEffect(() => {
// Issue from react-native side
// Hack for now, will fix this later
AccessibilityInfo.announceForAccessibility(children as string);
}, [children]);
return (
<Text
{...props}
ref={ref}
aria-live="assertive"
aria-atomic="true"
role="alert"
className={toastTitleStyle({
size,
class: className,
parentVariants: {
variant: parentVariant,
action: parentAction,
},
})}
>
{children}
</Text>
);
});
type IToastDescriptionProps = React.ComponentProps<typeof Text> & {
className?: string;
} & VariantProps<typeof toastDescriptionStyle>;
const ToastDescription = React.forwardRef<
React.ComponentRef<typeof Text>,
IToastDescriptionProps
>(function ToastDescription({ className, size = 'md', ...props }, ref) {
const { variant: parentVariant } = useStyleContext(SCOPE);
return (
<Text
ref={ref}
{...props}
className={toastDescriptionStyle({
size,
class: className,
parentVariants: {
variant: parentVariant,
},
})}
/>
);
});
Toast.displayName = 'Toast';
ToastTitle.displayName = 'ToastTitle';
ToastDescription.displayName = 'ToastDescription';
export { useToast, Toast, ToastTitle, ToastDescription };

View File

@@ -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",
],
};

View File

@@ -1788,7 +1788,9 @@
} }
}, },
"node_modules/@expo/fingerprint": { "node_modules/@expo/fingerprint": {
"version": "0.12.4", "version": "0.13.0",
"resolved": "https://registry.npmjs.org/@expo/fingerprint/-/fingerprint-0.13.0.tgz",
"integrity": "sha512-3IwpH0p3uO8jrJSLOUNDzJVh7VEBod0emnCBq0hD72sy6ICmzauM6Xf4he+2Tip7fzImCJRd63GaehV+CCtpvA==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@expo/spawn-async": "^1.7.2", "@expo/spawn-async": "^1.7.2",
@@ -1796,7 +1798,8 @@
"chalk": "^4.1.2", "chalk": "^4.1.2",
"debug": "^4.3.4", "debug": "^4.3.4",
"find-up": "^5.0.0", "find-up": "^5.0.0",
"getenv": "^1.0.0", "getenv": "^2.0.0",
"ignore": "^5.3.1",
"minimatch": "^9.0.0", "minimatch": "^9.0.0",
"p-limit": "^3.1.0", "p-limit": "^3.1.0",
"resolve-from": "^5.0.0", "resolve-from": "^5.0.0",
@@ -1806,8 +1809,19 @@
"fingerprint": "bin/cli.js" "fingerprint": "bin/cli.js"
} }
}, },
"node_modules/@expo/fingerprint/node_modules/getenv": {
"version": "2.0.0",
"resolved": "https://registry.npmjs.org/getenv/-/getenv-2.0.0.tgz",
"integrity": "sha512-VilgtJj/ALgGY77fiLam5iD336eSWi96Q15JSAG1zi8NRBysm3LXKdGnHb4m5cuyxvOLQQKWpBZAT6ni4FI2iQ==",
"license": "MIT",
"engines": {
"node": ">=6"
}
},
"node_modules/@expo/fingerprint/node_modules/semver": { "node_modules/@expo/fingerprint/node_modules/semver": {
"version": "7.7.2", "version": "7.7.2",
"resolved": "https://registry.npmjs.org/semver/-/semver-7.7.2.tgz",
"integrity": "sha512-RF0Fw+rO5AMf9MAyaRXI4AV0Ulj5lMHqVxxdSgiVbixSCXoEmmX/jk0CuJw4+3SqroYO9VoUh+HcuJivvtJemA==",
"license": "ISC", "license": "ISC",
"bin": { "bin": {
"semver": "bin/semver.js" "semver": "bin/semver.js"
@@ -2579,6 +2593,8 @@
}, },
"node_modules/@gluestack-ui/toast": { "node_modules/@gluestack-ui/toast": {
"version": "1.0.9", "version": "1.0.9",
"resolved": "https://registry.npmjs.org/@gluestack-ui/toast/-/toast-1.0.9.tgz",
"integrity": "sha512-aMlPczeoH/PZTMnhV29fqqW1Xc/9QmYEsR0bU9BfLyAGM9UMjW3vGe4yZSgxX7xjQ9C7+KO5WnTH0FmPoAbVtg==",
"dependencies": { "dependencies": {
"@gluestack-ui/hooks": "0.1.13", "@gluestack-ui/hooks": "0.1.13",
"@gluestack-ui/overlay": "^0.1.20", "@gluestack-ui/overlay": "^0.1.20",
@@ -6006,6 +6022,8 @@
}, },
"node_modules/commander": { "node_modules/commander": {
"version": "7.2.0", "version": "7.2.0",
"resolved": "https://registry.npmjs.org/commander/-/commander-7.2.0.tgz",
"integrity": "sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==",
"license": "MIT", "license": "MIT",
"engines": { "engines": {
"node": ">= 10" "node": ">= 10"
@@ -6702,16 +6720,16 @@
} }
}, },
"node_modules/expo": { "node_modules/expo": {
"version": "53.0.10", "version": "53.0.11",
"resolved": "https://registry.npmjs.org/expo/-/expo-53.0.10.tgz", "resolved": "https://registry.npmjs.org/expo/-/expo-53.0.11.tgz",
"integrity": "sha512-rN3HcQOeum4i+4Fq1+wBuTWbUjHZqTE7YgGGioOtY2WnhYt+4OSrTlxjRjp13AtkLuKSKkh34gkdFMlUepKlXA==", "integrity": "sha512-+QtvU+6VPd7/o4vmtwuRE/Li2rAiJtD25I6BOnoQSxphaWWaD0PdRQnIV3VQ0HESuJYRuKJ3DkAHNJ3jI6xwzA==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@babel/runtime": "^7.20.0", "@babel/runtime": "^7.20.0",
"@expo/cli": "0.24.14", "@expo/cli": "0.24.14",
"@expo/config": "~11.0.10", "@expo/config": "~11.0.10",
"@expo/config-plugins": "~10.0.2", "@expo/config-plugins": "~10.0.2",
"@expo/fingerprint": "0.12.4", "@expo/fingerprint": "0.13.0",
"@expo/metro-config": "0.20.14", "@expo/metro-config": "0.20.14",
"@expo/vector-icons": "^14.0.0", "@expo/vector-icons": "^14.0.0",
"babel-preset-expo": "~13.2.0", "babel-preset-expo": "~13.2.0",
@@ -6720,7 +6738,7 @@
"expo-file-system": "~18.1.10", "expo-file-system": "~18.1.10",
"expo-font": "~13.3.1", "expo-font": "~13.3.1",
"expo-keep-awake": "~14.1.4", "expo-keep-awake": "~14.1.4",
"expo-modules-autolinking": "2.1.10", "expo-modules-autolinking": "2.1.11",
"expo-modules-core": "2.4.0", "expo-modules-core": "2.4.0",
"react-native-edge-to-edge": "1.6.0", "react-native-edge-to-edge": "1.6.0",
"whatwg-url-without-unicode": "8.0.0-3" "whatwg-url-without-unicode": "8.0.0-3"
@@ -6890,7 +6908,9 @@
} }
}, },
"node_modules/expo-modules-autolinking": { "node_modules/expo-modules-autolinking": {
"version": "2.1.10", "version": "2.1.11",
"resolved": "https://registry.npmjs.org/expo-modules-autolinking/-/expo-modules-autolinking-2.1.11.tgz",
"integrity": "sha512-KrWQo+cE4gWYNePBBhmHGVzf63gYV19ZLXe9EIH3GHTkViVzIX+Lp618H/7GxfawpN5kbhvilATH1QEKKnUUww==",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@expo/spawn-async": "^1.7.2", "@expo/spawn-async": "^1.7.2",
@@ -6907,6 +6927,8 @@
}, },
"node_modules/expo-modules-autolinking/node_modules/glob": { "node_modules/expo-modules-autolinking/node_modules/glob": {
"version": "10.4.5", "version": "10.4.5",
"resolved": "https://registry.npmjs.org/glob/-/glob-10.4.5.tgz",
"integrity": "sha512-7Bv8RF0k6xjo7d4A/PxYLbUCfb6c+Vpd2/mB2yRDlew7Jb5hEXiCD9ibfO7wpk8i4sevK6DFny9h7EYbM3/sHg==",
"license": "ISC", "license": "ISC",
"dependencies": { "dependencies": {
"foreground-child": "^3.1.0", "foreground-child": "^3.1.0",
@@ -6925,6 +6947,8 @@
}, },
"node_modules/expo-modules-autolinking/node_modules/minipass": { "node_modules/expo-modules-autolinking/node_modules/minipass": {
"version": "7.1.2", "version": "7.1.2",
"resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.2.tgz",
"integrity": "sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==",
"license": "ISC", "license": "ISC",
"engines": { "engines": {
"node": ">=16 || 14 >=14.17" "node": ">=16 || 14 >=14.17"
@@ -7642,6 +7666,15 @@
], ],
"license": "BSD-3-Clause" "license": "BSD-3-Clause"
}, },
"node_modules/ignore": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
"integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
"license": "MIT",
"engines": {
"node": ">= 4"
}
},
"node_modules/image-size": { "node_modules/image-size": {
"version": "1.2.1", "version": "1.2.1",
"resolved": "https://registry.npmjs.org/image-size/-/image-size-1.2.1.tgz", "resolved": "https://registry.npmjs.org/image-size/-/image-size-1.2.1.tgz",

View File

@@ -40,6 +40,7 @@
"expo-auth-session": "~6.2.0", "expo-auth-session": "~6.2.0",
"expo-camera": "~16.1.7", "expo-camera": "~16.1.7",
"expo-constants": "~17.1.5", "expo-constants": "~17.1.5",
"expo-crypto": "~14.1.4",
"expo-image-picker": "~16.1.4", "expo-image-picker": "~16.1.4",
"expo-linking": "~7.1.4", "expo-linking": "~7.1.4",
"expo-router": "~5.0.5", "expo-router": "~5.0.5",
@@ -62,7 +63,6 @@
"react-native-web": "~0.20.0", "react-native-web": "~0.20.0",
"tailwindcss": "^3.4.17", "tailwindcss": "^3.4.17",
"zustand": "^5.0.3", "zustand": "^5.0.3",
"expo-crypto": "~14.1.4",
"expo-screen-orientation": "~8.1.7" "expo-screen-orientation": "~8.1.7"
}, },
"devDependencies": { "devDependencies": {

View File

@@ -2,14 +2,15 @@ import { create } from "zustand";
import { createJSONStorage, persist } from "zustand/middleware"; import { createJSONStorage, persist } from "zustand/middleware";
import AsyncStorage from "@react-native-async-storage/async-storage"; import AsyncStorage from "@react-native-async-storage/async-storage";
import axios from "axios"; import axios from "axios";
import * as api from "@/api/auth";
import { router } from "expo-router";
const API_URL = "https://hopp.zikor.pl/api/v1"; let interceptorInitialized = false;
export const useAuthStore = create( export const useAuthStore = create(
persist( persist(
(set, get) => { (set, get) => {
// Dodaj interceptor tylko raz if (!interceptorInitialized.current) {
if (!axios.interceptors.response.handlers.length) {
axios.interceptors.response.use( axios.interceptors.response.use(
(response) => response, (response) => response,
(error) => { (error) => {
@@ -17,14 +18,16 @@ export const useAuthStore = create(
(error.response && error.response.status === 401) || (error.response && error.response.status === 401) ||
error.response.status === 403 error.response.status === 403
) { ) {
set({ user: null, token: null, isLoading: false }); console.warn(error.response.data);
set({ user_id: null, token: null, isLoading: false });
delete axios.defaults.headers.common["Authorization"]; delete axios.defaults.headers.common["Authorization"];
router.replace("/login");
} }
return Promise.reject(error); return Promise.reject(error);
} }
); );
interceptorInitialized = true;
} }
return { return {
user_id: null, user_id: null,
token: null, token: null,
@@ -34,16 +37,8 @@ export const useAuthStore = create(
signIn: async (email, password) => { signIn: async (email, password) => {
set({ isLoading: true, error: null }); set({ isLoading: true, error: null });
try { try {
const response = await axios.post(`${API_URL}/auth/login`, { const response = await api.login({email, password});
email, set({ user_id: response.user_id, token: response.token, isLoading: false });
password,
});
const user_id = response.data.user_id;
const token = response.data.token;
set({ user_id: user_id, token: token, isLoading: false });
axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
} catch (error) { } catch (error) {
set({ set({
error: error.response?.data?.message || error.message, error: error.response?.data?.message || error.message,
@@ -56,19 +51,8 @@ export const useAuthStore = create(
signUp: async (userData) => { signUp: async (userData) => {
set({ isLoading: true, error: null }); set({ isLoading: true, error: null });
try { try {
const response = await axios.post( const response = await api.register(userData);
`${API_URL}/auth/register`, set({ user_id: response.user_id, token: response.token, isLoading: false });
userData,
{
headers: { "Content-Type": "application/json" },
}
);
const user_id = response.data.user_id;
const token = response.data.token;
set({ user_id: user_id, token: token, isLoading: false });
axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
} catch (error) { } catch (error) {
set({ set({
error: error.response?.data?.message || error.message, error: error.response?.data?.message || error.message,
@@ -81,18 +65,8 @@ export const useAuthStore = create(
signInWithGoogle: async (googleToken) => { signInWithGoogle: async (googleToken) => {
set({ isLoading: true, error: null }); set({ isLoading: true, error: null });
try { try {
const response = await axios.post( const response = await api.googleLogin(googleToken);
`${API_URL}/auth/google`, set({ user_id: response.user_id, token: response.token, isLoading: false });
{ googleToken: googleToken },
{
headers: { "Content-Type": "application/json" },
}
);
const user_id = response.data.user_id;
const token = response.data.token;
set({ user_id: user_id, token: token, isLoading: false });
axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
} catch (error) { } catch (error) {
set({ set({
error: error.response?.data?.message || error.message, error: error.response?.data?.message || error.message,
@@ -103,34 +77,16 @@ export const useAuthStore = create(
}, },
signOut: async () => { signOut: async () => {
const { token } = get();
try { try {
await axios.post(`${API_URL}/auth/logout`); await api.logout(token);
} catch (error) { } catch (error) {
console.error("Logout error:", error); console.error("Logout error:", error);
} finally { } finally {
delete axios.defaults.headers.common["Authorization"];
set({ user_id: null, token: null }); set({ user_id: null, token: null });
router.replace("/login");
} }
}, },
// checkAuth: async () => {
// const { token } = useAuthStore.getState();
// if (!token) return null;
// set({ isLoading: true });
// try {
// axios.defaults.headers.common["Authorization"] = `Bearer ${token}`;
// const response = await axios.get(`${API_URL}/auth/me`);
// set({ user_id: response.data, isLoading: false });
// return response.data;
// } catch (error) {
// delete axios.defaults.headers.common["Authorization"];
// set({ user_id: null, token: null, isLoading: false });
// return null;
// }
// },
}; };
}, },
{ {

View File

@@ -26,8 +26,38 @@ export const useNoticesStore = create((set, get) => ({
} }
}, },
editNotice: async (noticeId, notice) => {
try {
if (notice.image.length > 0 && typeof notice.image[0] == "string") {
const currentImages = await api.getAllImagesByNoticeId(noticeId);
if (currentImages && currentImages.length > 0) {
for (const image of currentImages) {
const filename = image.uri
? image.uri.split("/").pop()
: image.split("/").pop();
await api.deleteImage(filename);
}
}
}
const updatedNotice = await api.editNotice(noticeId, notice);
set((state) => ({
notices: state.notices.map((n) =>
n.noticeId == noticeId ? updatedNotice : n
),
}));
return updatedNotice;
} catch (error) {
console.error("Error editing notice:", error);
set({ error });
throw error;
}
},
getNoticeById: (noticeId) => { getNoticeById: (noticeId) => {
return get().notices.find((notice) => String(notice.noticeId) === String(noticeId)); return get().notices.find(
(notice) => String(notice.noticeId) === String(noticeId)
);
}, },
getAllImagesByNoticeId: async (noticeId) => { getAllImagesByNoticeId: async (noticeId) => {
@@ -37,5 +67,16 @@ export const useNoticesStore = create((set, get) => ({
console.error("Error while getting images:", error); console.error("Error while getting images:", error);
return ["https://http.cat/404.jpg"]; return ["https://http.cat/404.jpg"];
} }
} },
deleteNotice: async (noticeId) => {
try {
await api.deleteNotice(noticeId);
set((state) => ({
notices: state.notices.filter((notice) => notice.noticeId !== noticeId),
}));
} catch (error) {
console.error("Error deleting notice:", error);
}
},
})); }));