add Zustand and del unnecessary files

app/location/edit/[id].jsx

@@ -1,8 +1,16 @@
-import { useState, useEffect } from 'react';
-import { StyleSheet, Platform, ScrollView, KeyboardAvoidingView, View, ActivityIndicator } from 'react-native';
-import { TextInput, Button, Snackbar, useTheme } from 'react-native-paper';
-import { useLocalSearchParams, useRouter } from 'expo-router';
-import { getLocation, updateLocation } from '@/api/locations';
+import { useState, useEffect } from "react";
+import {
+  StyleSheet,
+  Platform,
+  ScrollView,
+  KeyboardAvoidingView,
+  View,
+  ActivityIndicator,
+} from "react-native";
+import { TextInput, Button, Snackbar, useTheme } from "react-native-paper";
+import { useLocalSearchParams, useRouter } from "expo-router";
+// import { getLocation } from "@/api/locations";
+import useLocationStore from "@/locationStore";
 
 export default function EditLocation() {
   const theme = useTheme();
@@ -10,40 +18,34 @@ export default function EditLocation() {
   const router = useRouter();
   const [loading, setLoading] = useState(true);
   const [formData, setFormData] = useState({
-    name: '',
-    description: '',
-    image: '',
-    area: '',
-    population: '',
+    name: "",
+    description: "",
+    image: "",
+    area: "",
+    population: "",
   });
 
-  const [message, setMessage] = useState('');
+  const [message, setMessage] = useState("");
   const [visible, setVisible] = useState(false);
 
+  const updateLocation = useLocationStore((state) => state.updateLocation);
+  const getLocation = useLocationStore((state) => state.getLocation);
+
   useEffect(() => {
-    const fetchLocation = async () => {
-      try {
-        const data = await getLocation(id)
-
-        if (data) {
-          setFormData({
-            name: data.name,
-            description: data.description,
-            image: data.image,
-            area: data.area.toString(),
-            population: data.population.toString(),
-          });
-        }
-      } catch (error) {
-        console.error("Error fetching location:", error);
-      } finally {
-        setLoading(false);
-      }
+    const data = getLocation(id);
+    if (data) {
+      setFormData({
+        name: data.name,
+        description: data.description,
+        image: data.image,
+        area: data.area.toString(),
+        population: data.population.toString(),
+      });
     }
-    fetchLocation();
-  }, [id]);
+    setLoading(false);
+  }, [id, getLocation]);
 
-  const handleEditLocation = () => {
+  const handleEditLocation = async () => {
     if (
       formData.name &&
       formData.description &&
@@ -51,7 +53,8 @@ export default function EditLocation() {
       formData.area &&
       formData.population
     ) {
-      const response = updateLocation(id, {
+      // console.log("Form data:", formData);
+      const response = await updateLocation(id, {
         name: formData.name,
         description: formData.description,
         image: formData.image,
@@ -60,25 +63,30 @@ export default function EditLocation() {
       });
 
       if (response) {
-        setMessage('Lokalizacja została zaktualizowana!');
+        setMessage("Lokalizacja została zaktualizowana!");
         setVisible(true);
-        while (router.canGoBack()) { // Pop from stack until one element is left
-          router.back();
-        }
-        router.replace("/"); // Replace the last remaining stack element
+        // while (router.canGoBack()) {
+        // Pop from stack until one element is left
+        // router.back();
+        // }
+        setTimeout(() => {
+          router.replace("/");
+        }, 300); // Replace the last remaining stack element
       } else {
-        setMessage('Wystąpił błąd podczas aktualizacji lokalizacji!');
+        setMessage("Wystąpił błąd podczas aktualizacji lokalizacji!");
         setVisible(true);
       }
     } else {
-      setMessage('Wypełnij wszystkie pola!');
+      setMessage("Wypełnij wszystkie pola!");
       setVisible(true);
     }
   };
 
   if (loading) {
     return (
-      <View style={[styles.container, { backgroundColor: theme.colors.background }]}>
+      <View
+        style={[styles.container, { backgroundColor: theme.colors.background }]}
+      >
         <ActivityIndicator size="large" color={theme.colors.primary} />
       </View>
     );
@@ -87,7 +95,7 @@ export default function EditLocation() {
   return (
     <KeyboardAvoidingView
       style={{ flex: 1 }}
-      behavior={Platform.OS === 'ios' ? 'padding' : 'height'}
+      behavior={Platform.OS === "ios" ? "padding" : "height"}
     >
       <ScrollView contentContainerStyle={styles.container}>
         <Snackbar
@@ -101,7 +109,7 @@ export default function EditLocation() {
           mode="outlined"
           label="Nazwa"
           placeholder="Wpisz nazwę"
-          style={{ margin: 10, width: '100%' }}
+          style={{ margin: 10, width: "100%" }}
           value={formData.name}
           onChangeText={(e) => setFormData({ ...formData, name: e })}
         />
@@ -109,7 +117,7 @@ export default function EditLocation() {
           mode="outlined"
           label="Opis"
           placeholder="Wpisz opis"
-          style={{ margin: 10, width: '100%' }}
+          style={{ margin: 10, width: "100%" }}
           multiline={true}
           value={formData.description}
           onChangeText={(e) => setFormData({ ...formData, description: e })}
@@ -119,7 +127,7 @@ export default function EditLocation() {
           label="Link do zdjęcia"
           multiline={true}
           placeholder="Wpisz link do zdjęcia"
-          style={{ margin: 10, width: '100%' }}
+          style={{ margin: 10, width: "100%" }}
           value={formData.image}
           onChangeText={(e) => setFormData({ ...formData, image: e })}
         />
@@ -127,7 +135,7 @@ export default function EditLocation() {
           mode="outlined"
           label="Powierzchnia"
           placeholder="Wpisz powierzchnię"
-          style={{ margin: 10, width: '100%' }}
+          style={{ margin: 10, width: "100%" }}
           value={formData.area}
           keyboardType="numeric"
           onChangeText={(e) => setFormData({ ...formData, area: e })}
@@ -136,15 +144,15 @@ export default function EditLocation() {
           mode="outlined"
           label="Ludność"
           placeholder="Wpisz liczbę ludności"
-          style={{ margin: 10, width: '100%' }}
+          style={{ margin: 10, width: "100%" }}
           value={formData.population}
           keyboardType="numeric"
           onChangeText={(e) => setFormData({ ...formData, population: e })}
         />
         <Button
-          style={{ margin: 10, width: '100%' }}
+          style={{ margin: 10, width: "100%" }}
           icon="plus-circle-outline"
-          mode={'contained'}
+          mode={"contained"}
           onPress={handleEditLocation}
         >
           Edytuj
@@ -157,8 +165,8 @@ export default function EditLocation() {
 const styles = StyleSheet.create({
   container: {
     flex: 1,
-    backgroundColor: '#25292e',
-    justifyContent: 'flex-start',
-    alignItems: 'center',
+    backgroundColor: "#25292e",
+    justifyContent: "flex-start",
+    alignItems: "center",
   },
-});
+});