init frontend

frontend/src/utils/fetchHosting.tsx

@@ -0,0 +1,76 @@
+import { useState, useEffect } from 'react';
+import type { Hosting } from '../types';
+
+const mockData: Hosting = {
+    1: {
+        reservedBy: "",
+        name: "Матрац 160см",
+        capacity: 2
+    },
+    2: {
+        reservedBy: "Vasya",
+        name: "Кровать 120см",
+        capacity: 2
+    },
+    3: {
+        reservedBy: "",
+        name: "Диван",
+        capacity: 1
+    },
+};
+
+const useFetchHosting = () => {
+    const [data, setData] = useState(mockData);
+    const [error, setError] = useState<string | null>(null);
+    const [loading, setLoading] = useState(false);
+
+    const fetchData = async () => {
+        setLoading(true);
+        setError(null);
+        try {
+            const response = await fetch('https://example.backend.com/hosting');
+            if (!response.ok) {
+                throw new Error('Network response was not ok');
+            }
+            const result = await response.json();
+            setData(result);
+        } catch (error) {
+            setError(error instanceof Error ? error.message : 'Unknown error');
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    const updateData = async (name: string, id: number) => {
+        setLoading(true);
+        setError(null);
+        try {
+            const response = await fetch(`https://example.backend.com/hosting/${id}`, {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({ reservedBy: name })
+            });
+
+            if (!response.ok) {
+                throw new Error('Network response was not ok');
+            }
+
+            // Optional: Fetch the updated data after reservation
+            await fetchData(); 
+        } catch (error) {
+            setError(error instanceof Error ? error.message : 'Unknown error');
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    useEffect(() => {
+        //fetchData(); // Initial fetch on mount
+    }, []);
+
+    return { data, error, loading, refetch: fetchData, update: updateData };
+};
+
+export default useFetchHosting;