Compare commits

...

5 Commits

Author SHA1 Message Date
7b275c4e39 Little fix due to better mark 2025-06-17 19:09:27 +02:00
5e2926b9ef fix... 2025-05-24 18:41:38 +02:00
f1198a8281 fix of tests 2025-05-24 18:41:15 +02:00
7873321be0 few cosmetic fixes 2025-05-24 09:00:48 +02:00
443d4b0366 fix of api url 2025-05-23 21:31:36 +02:00
9 changed files with 389 additions and 274 deletions

View File

@@ -22,22 +22,34 @@ describe('Location API Functions', () => {
"name": "Warszawa", "name": "Warszawa",
"description": "Stolica Polski, położona w centralnej części kraju. Warszawa jest największym miastem w Polsce, znanym z bogatej historii, kultury i architektury. Warto zobaczyć Zamek Królewski, Stare Miasto oraz Muzeum Powstania Warszawskiego. Miasto oferuje wiele atrakcji turystycznych, w tym parki, muzea i teatry. Warszawa jest również ważnym ośrodkiem gospodarczym i kulturalnym.", "description": "Stolica Polski, położona w centralnej części kraju. Warszawa jest największym miastem w Polsce, znanym z bogatej historii, kultury i architektury. Warto zobaczyć Zamek Królewski, Stare Miasto oraz Muzeum Powstania Warszawskiego. Miasto oferuje wiele atrakcji turystycznych, w tym parki, muzea i teatry. Warszawa jest również ważnym ośrodkiem gospodarczym i kulturalnym.",
"image": "https://www.niesamowitapolska.eu/images/mazowieckie/warszawa/38607734_m.jpg", "image": "https://www.niesamowitapolska.eu/images/mazowieckie/warszawa/38607734_m.jpg",
"area": 517.21, "imageSource": {
"population": 1790658 "uri": "https://www.niesamowitapolska.eu/images/mazowieckie/warszawa/38607734_m.jpg",
},
"area": 517.24,
"population": 1790658,
"longitude": 52.232887,
"latitude": 20.896273
}, },
{ {
"id": 2, "id": 2,
"name": "Kielce", "name": "Kielce",
"description": "Stolica województwa świętokrzyskiego, położona w centralnej Polsce. Kielce to miasto w centralnej Polsce, znane z pięknych krajobrazów i bogatej historii. Warto odwiedzić Kielecki Park Etnograficzny, Muzeum Zabawek oraz Katedrę Wniebowzięcia Najświętszej Maryi Panny. Kielce są również znane z licznych festiwali i wydarzeń kulturalnych. Miasto oferuje wiele atrakcji turystycznych, w tym parki, muzea i teatry.", "description": "Stolica województwa świętokrzyskiego, położona w centralnej Polsce. Kielce to miasto w centralnej Polsce, znane z pięknych krajobrazów i bogatej historii. Warto odwiedzić Kielecki Park Etnograficzny, Muzeum Zabawek oraz Katedrę Wniebowzięcia Najświętszej Maryi Panny. Kielce są również znane z licznych festiwali i wydarzeń kulturalnych. Miasto oferuje wiele atrakcji turystycznych, w tym parki, muzea i teatry.",
"image": "https://as2.ftcdn.net/jpg/05/42/90/67/1000_F_542906717_cf5i6HeCJsPluuH5tqq5MbsSdfpopmtT.webp", "image": "https://as2.ftcdn.net/jpg/05/42/90/67/1000_F_542906717_cf5i6HeCJsPluuH5tqq5MbsSdfpopmtT.webp",
"area": 109.2, "imageSource": {
"population": 196000 "uri": "https://as2.ftcdn.net/jpg/05/42/90/67/1000_F_542906717_cf5i6HeCJsPluuH5tqq5MbsSdfpopmtT.webp",
},
"area": 109.4,
"population": 196000,
"longitude": 50.85416,
"latitude": 20.533003
} }
]; ];
axios.get.mockResolvedValueOnce({ data: mockLocations }); axios.get.mockResolvedValueOnce({data: mockLocations});
const result = await listLocations(); const result = await listLocations();
console.log(result);
expect(axios.get).toHaveBeenCalledWith('https://hopp.zikor.pl/locations/all'); expect(axios.get).toHaveBeenCalledWith('https://hopp.zikor.pl/locations/all');
expect(result).toEqual(mockLocations); expect(result).toEqual(mockLocations);
}); });
@@ -52,21 +64,47 @@ describe('Location API Functions', () => {
describe('getLocation', () => { describe('getLocation', () => {
test('should fetch a location by id successfully', async () => { test('should fetch a location by id successfully', async () => {
const mockLocation = { const mockLocation = [
"id": 1, {
"name": "Warszawa", id: 1,
"description": "Stolica Polski, położona w centralnej części kraju.", name: 'Warszawa',
"image": "https://www.niesamowitapolska.eu/images/mazowieckie/warszawa/38607734_m.jpg", description: 'Stolica Polski, położona w centralnej części kraju. Warszawa jest największym miastem w Polsce, znanym z bogatej historii, kultury i architektury. Warto zobaczyć Zamek Królewski, Stare Miasto oraz Muzeum Powstania Warszawskiego. Miasto oferuje wiele atrakcji turystycznych, w tym parki, muzea i teatry. Warszawa jest również ważnym ośrodkiem gospodarczym i kulturalnym.',
"area": 517.21, image: 'https://www.niesamowitapolska.eu/images/mazowieckie/warszawa/38607734_m.jpg',
"population": 1790658 imageSource: {
}; uri: 'https://www.niesamowitapolska.eu/images/mazowieckie/warszawa/38607734_m.jpg'
},
area: 517.24,
population: 1790658,
longitude: 52.232887,
latitude: 20.896273
}
];
axios.get.mockResolvedValueOnce({ data: mockLocation }); const toCheck = [
{
id: 1,
name: 'Warszawa',
description: 'Stolica Polski, położona w centralnej części kraju. Warszawa jest największym miastem w Polsce, znanym z bogatej historii, kultury i architektury. Warto zobaczyć Zamek Królewski, Stare Miasto oraz Muzeum Powstania Warszawskiego. Miasto oferuje wiele atrakcji turystycznych, w tym parki, muzea i teatry. Warszawa jest również ważnym ośrodkiem gospodarczym i kulturalnym.',
image: 'https://www.niesamowitapolska.eu/images/mazowieckie/warszawa/38607734_m.jpg',
imageSource: {
uri: 'https://www.niesamowitapolska.eu/images/mazowieckie/warszawa/38607734_m.jpg'
},
area: 517.24,
population: 1790658,
longitude: 52.232887,
latitude: 20.896273
},
{"image" : null}
];
axios.get.mockResolvedValueOnce({data: mockLocation});
const result = await getLocation(1); const result = await getLocation(1);
console.log(result);
expect(axios.get).toHaveBeenCalledWith('https://hopp.zikor.pl/locations/1'); expect(axios.get).toHaveBeenCalledWith('https://hopp.zikor.pl/locations/1');
expect(result).toEqual(mockLocation); expect(result).toEqual(toCheck);
}); });
test('should handle error when fetching a location fails', async () => { test('should handle error when fetching a location fails', async () => {
@@ -92,14 +130,14 @@ describe('Location API Functions', () => {
...newLocation ...newLocation
}; };
axios.post.mockResolvedValueOnce({ data: responseLocation }); axios.post.mockResolvedValueOnce({data: responseLocation});
const result = await addLocation(newLocation); const result = await addLocation(newLocation);
expect(axios.post).toHaveBeenCalledWith( expect(axios.post).toHaveBeenCalledWith(
'https://hopp.zikor.pl/locations/add', 'https://hopp.zikor.pl/locations/add',
newLocation, newLocation,
{ headers: { "Content-Type": "application/json" } } {headers: {"Content-Type": "application/json"}}
); );
expect(result).toEqual(responseLocation); expect(result).toEqual(responseLocation);
}); });
@@ -123,21 +161,21 @@ describe('Location API Functions', () => {
"population": 200000 "population": 200000
}; };
axios.put.mockResolvedValueOnce({ data: responseLocation }); axios.put.mockResolvedValueOnce({data: responseLocation});
const result = await updateLocation(locationId, updatedDetails); const result = await updateLocation(locationId, updatedDetails);
expect(axios.put).toHaveBeenCalledWith( expect(axios.put).toHaveBeenCalledWith(
`https://hopp.zikor.pl/locations/${locationId}`, `https://hopp.zikor.pl/locations/${locationId}`,
updatedDetails, updatedDetails,
{ headers: { "Content-Type": "application/json" } } {headers: {"Content-Type": "application/json"}}
); );
expect(result).toEqual(responseLocation); expect(result).toEqual(responseLocation);
}); });
test('should handle error when updating a location fails', async () => { test('should handle error when updating a location fails', async () => {
const locationId = 999; const locationId = 999;
const updatedDetails = { population: 300000 }; const updatedDetails = {population: 300000};
axios.put.mockRejectedValueOnce(new Error('Failed to add location')); axios.put.mockRejectedValueOnce(new Error('Failed to add location'));
@@ -145,7 +183,7 @@ describe('Location API Functions', () => {
expect(axios.put).toHaveBeenCalledWith( expect(axios.put).toHaveBeenCalledWith(
`https://hopp.zikor.pl/locations/${locationId}`, `https://hopp.zikor.pl/locations/${locationId}`,
updatedDetails, updatedDetails,
{ headers: { "Content-Type": "application/json" } } {headers: {"Content-Type": "application/json"}}
); );
}); });
}); });
@@ -153,9 +191,9 @@ describe('Location API Functions', () => {
describe('deleteLocation', () => { describe('deleteLocation', () => {
test('should delete a location successfully', async () => { test('should delete a location successfully', async () => {
const locationId = 2; const locationId = 2;
const responseData = { success: true, message: "Location deleted successfully" }; const responseData = {success: true, message: "Location deleted successfully"};
axios.delete.mockResolvedValueOnce({ data: responseData }); axios.delete.mockResolvedValueOnce({data: responseData});
const result = await deleteLocation(locationId); const result = await deleteLocation(locationId);

View File

@@ -1,6 +1,6 @@
import axios from "axios"; import axios from "axios";
const API_URL = "http://192.168.0.118:9000"; const API_URL = "http://192.168.0.130:9010";
export async function listLocations() { export async function listLocations() {
try { try {
@@ -9,6 +9,8 @@ export async function listLocations() {
return "No locations found"; return "No locations found";
} }
console.log("Locations fetched successfully");
return response.data.map(location => ({ return response.data.map(location => ({
...location, ...location,
imageSource: normalizeImageSource(location.image) imageSource: normalizeImageSource(location.image)
@@ -63,6 +65,7 @@ export async function addLocation(location) {
console.log("Error adding location"); console.log("Error adding location");
return("Failed to add location"); return("Failed to add location");
} }
console.log("Location added successfully:", response.data);
return response.data; return response.data;
} catch (error) { } catch (error) {
console.error("Error adding location:", error); console.error("Error adding location:", error);
@@ -79,6 +82,7 @@ export async function updateLocation(id, location) {
console.log("Failed to update location"); console.log("Failed to update location");
return("Failed to update location"); return("Failed to update location");
} }
console.log("Location updated successfully:", response.data);
return response.data; return response.data;
} catch (error) { } catch (error) {
console.error("Error while updating location:", error); console.error("Error while updating location:", error);
@@ -93,6 +97,7 @@ export async function deleteLocation(id) {
console.log("Error deleting location"); console.log("Error deleting location");
return("Failed to delete location"); return("Failed to delete location");
} }
console.log("Location deleted successfully:", response.data);
return response.data; return response.data;
} catch (error) { } catch (error) {
console.error("Error while deleting location:", error); console.error("Error while deleting location:", error);

View File

@@ -90,6 +90,7 @@ export default function FormScreen() {
const result = await launchCameraAsync({ const result = await launchCameraAsync({
allowsEditing: false, allowsEditing: false,
base64: true, base64: true,
quality: 0.2,
}); });
if (!result.canceled && result.assets && result.assets.length > 0) { if (!result.canceled && result.assets && result.assets.length > 0) {

View File

@@ -3,28 +3,36 @@ import {
StyleSheet, StyleSheet,
FlatList, FlatList,
} from "react-native"; } from "react-native";
import { useTheme, Card, Text, Button } from "react-native-paper"; import {useTheme, Card, Text, Button, ActivityIndicator} from "react-native-paper";
import { Link } from "expo-router"; import {Link} from "expo-router";
import useLocationStore from "@/locationStore"; import useLocationStore from "@/locationStore";
export default function Index() { export default function Index() {
const theme = useTheme(); const theme = useTheme();
const { locations } = useLocationStore(); const {locations, loading} = useLocationStore();
if (loading) {
return (
<View style={[styles.container, {backgroundColor: theme.colors.background}]}>
<ActivityIndicator size="large" color={theme.colors.primary}/>
</View>
);
}
return ( return (
<View <View
style={[styles.container, { backgroundColor: theme.colors.background }]} style={[styles.container, {backgroundColor: theme.colors.background}]}
> >
<FlatList <FlatList
data={locations} data={locations}
keyExtractor={(item) => item.id.toString()} keyExtractor={(item) => item.id.toString()}
renderItem={({ item }) => ( renderItem={({item}) => (
<Card style={{ margin: 10 }}> <Card style={{margin: 10}}>
<Card.Cover <Card.Cover
style={{ marginBottom: 10 }} style={{marginBottom: 10}}
source={item.imageSource} source={item.imageSource}
/> />
<Card.Content style={{ marginBottom: 10 }}> <Card.Content style={{marginBottom: 10}}>
<Text variant="titleLarge">{item.name}</Text> <Text variant="titleLarge">{item.name}</Text>
<Text variant="bodyMedium"> <Text variant="bodyMedium">
{item.description && item.description.split(".")[0]}... {item.description && item.description.split(".")[0]}...

View File

@@ -16,7 +16,6 @@ export default function RootLayout() {
fetchLocations(); fetchLocations();
}, []); }, []);
console.log();
const deleteLocation = useLocationStore((state) => state.deleteLocation); const deleteLocation = useLocationStore((state) => state.deleteLocation);
const handleDelete = async (id) => { const handleDelete = async (id) => {

View File

@@ -1,6 +1,6 @@
import { View, ScrollView, StyleSheet } from "react-native"; import { View, ScrollView, StyleSheet } from "react-native";
import { useEffect } from "react"; import { useEffect } from "react";
import { useTheme, Text, Card } from "react-native-paper"; import {useTheme, Text, Card, ActivityIndicator} from "react-native-paper";
import { useLocalSearchParams } from "expo-router"; import { useLocalSearchParams } from "expo-router";
import useLocationStore from "@/locationStore"; import useLocationStore from "@/locationStore";
@@ -19,7 +19,15 @@ export default function Location() {
} }
}, [location, loading, fetchLocations]); }, [location, loading, fetchLocations]);
if (loading || !location) { if (loading) {
return (
<View style={[styles.container, {backgroundColor: theme.colors.background}]}>
<ActivityIndicator size="large" color={theme.colors.primary}/>
</View>
);
}
if (!location) {
return ( return (
<View style={styles.container}> <View style={styles.container}>
<Text style={styles.text}>Brak lokalizacji - {id}</Text> <Text style={styles.text}>Brak lokalizacji - {id}</Text>
@@ -27,6 +35,7 @@ export default function Location() {
); );
} }
return ( return (
<View style={[styles.container, {backgroundColor: theme.colors.background}]}> <View style={[styles.container, {backgroundColor: theme.colors.background}]}>
<ScrollView> <ScrollView>

View File

@@ -6,10 +6,12 @@ import {
KeyboardAvoidingView, KeyboardAvoidingView,
View, View,
ActivityIndicator, ActivityIndicator,
Image,
} from "react-native"; } from "react-native";
import {TextInput, Button, Snackbar, useTheme} from "react-native-paper"; import {TextInput, Button, Snackbar, useTheme, Text} from "react-native-paper";
import {useLocalSearchParams, useRouter} from "expo-router"; import {useLocalSearchParams, useRouter} from "expo-router";
import useLocationStore from "@/locationStore"; import useLocationStore from "@/locationStore";
import {normalizeImageSource} from "@/api/locations";
export default function EditLocation() { export default function EditLocation() {
const theme = useTheme(); const theme = useTheme();
@@ -89,6 +91,16 @@ export default function EditLocation() {
} }
}; };
const isBase64Image = (str) => {
let image = normalizeImageSource(str);
return image && (
image.uri.startsWith('data:image/jpeg;base64,') ||
image.uri.startsWith('data:image/png;base64,') ||
image.uri.startsWith('data:image/gif;base64,') ||
image.uri.startsWith('data:image/webp;base64,')
);
};
if (loading) { if (loading) {
return ( return (
<View <View
@@ -99,6 +111,14 @@ export default function EditLocation() {
); );
} }
if (!formData) {
return (
<View style={styles.container}>
<Text style={styles.text}>Brak lokalizacji - {id}</Text>
</View>
);
}
return ( return (
<KeyboardAvoidingView <KeyboardAvoidingView
style={{flex: 1}} style={{flex: 1}}
@@ -112,6 +132,30 @@ export default function EditLocation() {
> >
{message} {message}
</Snackbar> </Snackbar>
{isBase64Image(formData.image) ? (
<View style={styles.imageContainer}>
<Text style={{color: theme.colors.onBackground, marginBottom: 5}}>
Aktualne zdjęcie:
</Text>
<Image
source={normalizeImageSource(formData.image)}
style={styles.imagePreview}
resizeMode="contain"
/>
</View>
) : (
<TextInput
mode="outlined"
label="Link do zdjęcia"
multiline={true}
placeholder="Wpisz link do zdjęcia"
style={{margin: 10, width: "100%"}}
value={formData.image}
onChangeText={(e) => setFormData({...formData, image: e})}
/>
)}
<TextInput <TextInput
mode="outlined" mode="outlined"
label="Nazwa" label="Nazwa"
@@ -129,15 +173,6 @@ export default function EditLocation() {
value={formData.description} value={formData.description}
onChangeText={(e) => setFormData({...formData, description: e})} onChangeText={(e) => setFormData({...formData, description: e})}
/> />
<TextInput
mode="outlined"
label="Link do zdjęcia"
multiline={true}
placeholder="Wpisz link do zdjęcia"
style={{margin: 10, width: "100%"}}
value={formData.image}
onChangeText={(e) => setFormData({...formData, image: e})}
/>
<TextInput <TextInput
mode="outlined" mode="outlined"
label="Powierzchnia" label="Powierzchnia"
@@ -194,4 +229,15 @@ const styles = StyleSheet.create({
alignItems: "center", alignItems: "center",
flexGrow: 1, flexGrow: 1,
}, },
imageContainer: {
margin: 10,
width: "100%",
alignItems: "center",
padding: 10,
},
imagePreview: {
width: "100%",
height: 200,
borderRadius: 5,
}
}); });

View File

@@ -1,4 +1,4 @@
import { create } from "zustand"; import {create} from "zustand";
import * as api from "@/api/locations"; import * as api from "@/api/locations";
const useLocationStore = create((set, get) => ({ const useLocationStore = create((set, get) => ({
@@ -7,17 +7,16 @@ const useLocationStore = create((set, get) => ({
error: null, error: null,
fetchLocations: async () => { fetchLocations: async () => {
set({ loading: true, error: null }); set({loading: true, error: null});
try { try {
const data = await api.listLocations(); const data = await api.listLocations();
set({ locations: data, loading: false }); set({locations: data, loading: false});
} catch (error) { } catch (error) {
set({ error, loading: false }); set({error, loading: false});
} }
}, },
addLocation: async (location) => { addLocation: async (location) => {
set({ loading: true, error: null });
try { try {
const newLoc = await api.addLocation(location); const newLoc = await api.addLocation(location);
const normalizedLoc = { const normalizedLoc = {
@@ -26,53 +25,63 @@ addLocation: async (location) => {
}; };
set((state) => ({ set((state) => ({
locations: [...state.locations, normalizedLoc], locations: [...state.locations, normalizedLoc],
loading: false,
})); }));
return normalizedLoc; return normalizedLoc;
} catch (error) { } catch (error) {
set({ error, loading: false }); set({error, loading: false});
return null; return null;
} }
}, },
updateLocation: async (id, location) => { updateLocation: async (id, location) => {
set({ loading: true, error: null });
try { try {
const updated = await api.updateLocation(id, location); const updated = await api.updateLocation(id, location);
const normalizedLoc = {
...updated,
imageSource: api.normalizeImageSource(updated.image)
};
const stringId = String(id);
set((state) => ({ set((state) => ({
locations: state.locations.map((loc) => locations: state.locations.map((loc) =>
loc.id === id ? updated : loc String(loc.id) === stringId ? normalizedLoc : loc
), ),
loading: false,
})); }));
return updated; return normalizedLoc;
} catch (error) { } catch (error) {
set({ error, loading: false }); set({error, loading: false});
return null; return null;
} }
}, },
deleteLocation: async (id) => { deleteLocation: async (id) => {
set({ loading: true, error: null });
try { try {
const deleted = await api.deleteLocation(id); const deleted = await api.deleteLocation(id);
const stringId = String(id);
set((state) => ({ set((state) => ({
locations: state.locations.filter((loc) => loc.id !== id), locations: state.locations.filter((loc) => String(loc.id) !== stringId),
loading: false, loading: false,
})); }));
if(deleted) {
return true; return deleted;
}
} catch (error) { } catch (error) {
set({ error, loading: false }); set({error, loading: false});
return false; return false;
} }
}, },
getLocation: (id) => { getLocation: (id) => {
return get().locations.find((loc) => String(loc.id) === String(id)); const location = get().locations.find((loc) => String(loc.id) === String(id));
if (location && !location.imageSource) {
return {
...location,
imageSource: api.normalizeImageSource(location.image)
};
}
return location;
}, },
})); }));

View File

@@ -15,16 +15,16 @@
"expo": "^53.0.0", "expo": "^53.0.0",
"expo-constants": "~17.1.6", "expo-constants": "~17.1.6",
"expo-linking": "~7.1.4", "expo-linking": "~7.1.4",
"expo-router": "~5.0.7", "expo-router": "~5.1.0",
"expo-status-bar": "~2.2.3", "expo-status-bar": "~2.2.3",
"expo-image-picker": "~16.1.4", "expo-image-picker": "~16.1.4",
"expo-location": "~18.1.5", "expo-location": "~18.1.5",
"react": "19.0.0", "react": "19.0.0",
"react-dom": "19.0.0", "react-dom": "19.0.0",
"react-native": "0.79.2", "react-native": "0.79.3",
"react-native-paper": "^5.13.1", "react-native-paper": "^5.13.1",
"react-native-safe-area-context": "5.4.0", "react-native-safe-area-context": "5.4.0",
"react-native-screens": "~4.10.0", "react-native-screens": "~4.11.1",
"react-native-web": "^0.20.0", "react-native-web": "^0.20.0",
"zustand": "^5.0.3" "zustand": "^5.0.3"
}, },