c85b0ee0ba
Gängige Praxis: *Slice.js Verwendung: Wenn du Redux Toolkit und createSlice nutzt, ist der Postfix Slice gängiger. Begründung: createSlice ist ein Begriff aus Redux Toolkit. Der Name vermittelt, dass die Datei nicht nur den Reducer enthält, sondern auch Aktionen und den initialen Zustand. Häufig in modernen Projekten verwendet.
49 lines
1.6 KiB
JavaScript
49 lines
1.6 KiB
JavaScript
// hooks/useMapComponentState.js
|
|
import { useState, useEffect } from "react";
|
|
import usePoiTypData from "./usePoiTypData";
|
|
import { useRecoilValue } from "recoil";
|
|
import { poiLayerVisibleState } from "../redux/slices/poiLayerVisibleSlice";
|
|
|
|
export const useMapComponentState = () => {
|
|
const { poiTypData, isPoiTypLoaded } = usePoiTypData("/api/talas_v5_DB/poiTyp/readPoiTyp");
|
|
const [deviceName, setDeviceName] = useState("");
|
|
const [locationDeviceData, setLocationDeviceData] = useState([]);
|
|
const [priorityConfig, setPriorityConfig] = useState([]);
|
|
const [menuItemAdded, setMenuItemAdded] = useState(false);
|
|
const poiLayerVisible = useRecoilValue(poiLayerVisibleState);
|
|
|
|
// Fetch devices when the component is mounted
|
|
useEffect(() => {
|
|
const fetchDeviceData = async () => {
|
|
try {
|
|
const response = await fetch("/api/talas5/location_device"); // API call to get devices
|
|
const data = await response.json();
|
|
setLocationDeviceData(data); // Set the device data
|
|
|
|
// Optional: set a default deviceName if needed
|
|
if (data.length > 0) {
|
|
setDeviceName(data[0].name); // Set the first device's name
|
|
}
|
|
} catch (error) {
|
|
console.error("Error fetching device data:", error);
|
|
}
|
|
};
|
|
|
|
fetchDeviceData();
|
|
}, []); // Runs only once when the component is mounted
|
|
|
|
return {
|
|
poiTypData,
|
|
isPoiTypLoaded,
|
|
deviceName,
|
|
setDeviceName,
|
|
locationDeviceData,
|
|
setLocationDeviceData,
|
|
priorityConfig,
|
|
setPriorityConfig,
|
|
menuItemAdded,
|
|
setMenuItemAdded,
|
|
poiLayerVisible,
|
|
};
|
|
};
|