Ismail/nodeMap
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor

Browse Source
This commit is contained in:
ISA
2025-05-26 11:12:45 +02:00
parent c8d7fbe434
commit 03a1f480e0
20 changed files with 87 additions and 86 deletions
Download Patch File Download Diff File Expand all files Collapse all files

81
hooks/useMapComponentState.js
View File

@@ -1,52 +1,48 @@
// /hooks/useMapComponentState.js
// POI -> Kontextmenü -> POI bearbeiten -> Dropdown Geräteauswahl
import { useState, useEffect } from "react";
import { useSelector } from "react-redux";
import { useEffect, useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { fetchPoiTypThunk } from "../redux/thunks/database/pois/fetchPoiTypThunk";
import { selectPoiTypData, selectPoiTypStatus } from "../redux/slices/database/pois/poiTypSlice";
import { selectPoiLayerVisible } from "../redux/slices/database/pois/poiLayerVisibleSlice";
export const useMapComponentState = () => {
const [poiTypData, setPoiTypData] = useState([]);
const [isPoiTypLoaded, setIsPoiTypLoaded] = useState(false);
const [deviceName, setDeviceName] = useState("");
const [locationDeviceData, setLocationDeviceData] = useState([]);
const [priorityConfig, setPriorityConfig] = useState([]);
const [menuItemAdded, setMenuItemAdded] = useState(false);
const dispatch = useDispatch();
// ✅ Redux: Zustand der Sichtbarkeit des POI-Layers
// Redux: POI-Typen
const poiTypData = useSelector(selectPoiTypData);
const poiTypStatus = useSelector(selectPoiTypStatus);
// Redux: Sichtbarkeit des POI-Layers
const poiLayerVisible = useSelector((state) => state.poiLayerVisible.visible);
// Lokaler State: Geräte und Kontextmenü
const [deviceName, setDeviceName] = useState("");
const [locationDeviceData, setLocationDeviceData] = useState([]);
const [priorityConfig, setPriorityConfig] = useState([]); // TODO: Redux
const [menuItemAdded, setMenuItemAdded] = useState(false);
// Optional: Nur im Mock-Modus POI-Typen lokal setzen
useEffect(() => {
const fetchPoiTypData = async () => {
if (process.env.NEXT_PUBLIC_USE_MOCK_API === "true") {
console.log("⚠️ Mock-API: POI Typen geladen (Mock)");
const mockData = [
{ idPoiTyp: 1, name: "Mock Zähleranschlusskasten", icon: 4, onlySystemTyp: 0 },
{ idPoiTyp: 2, name: "Mock Geräteschrank", icon: 2, onlySystemTyp: 0 },
{ idPoiTyp: 4, name: "Mock Parkplatz", icon: 3, onlySystemTyp: 0 },
{ idPoiTyp: 6, name: "Mock Zufahrt", icon: 4, onlySystemTyp: 0 },
{ idPoiTyp: 20, name: "Mock Zählgerät", icon: 5, onlySystemTyp: 110 },
{ idPoiTyp: 21, name: "Mock Messschleife", icon: 6, onlySystemTyp: 110 },
{ idPoiTyp: 25, name: "Mock Sonstige", icon: 0, onlySystemTyp: 0 },
{ idPoiTyp: 33, name: "Mock Autobahnauffahrt", icon: 4, onlySystemTyp: null },
];
setPoiTypData(mockData);
setIsPoiTypLoaded(true);
return;
}
try {
const response = await fetch("/api/talas_v5_DB/poiTyp/readPoiTyp");
const data = await response.json();
setPoiTypData(data);
setIsPoiTypLoaded(true);
} catch (error) {
console.error("❌ Fehler beim Abrufen der POI-Typen:", error);
setPoiTypData([]);
setIsPoiTypLoaded(true);
}
};
if (process.env.NEXT_PUBLIC_USE_MOCK_API === "true") {
const mockData = [
{ idPoiTyp: 1, name: "Mock Zähleranschlusskasten", icon: 4, onlySystemTyp: 0 },
{ idPoiTyp: 2, name: "Mock Geräteschrank", icon: 2, onlySystemTyp: 0 },
{ idPoiTyp: 4, name: "Mock Parkplatz", icon: 3, onlySystemTyp: 0 },
{ idPoiTyp: 6, name: "Mock Zufahrt", icon: 4, onlySystemTyp: 0 },
{ idPoiTyp: 20, name: "Mock Zählgerät", icon: 5, onlySystemTyp: 110 },
{ idPoiTyp: 21, name: "Mock Messschleife", icon: 6, onlySystemTyp: 110 },
{ idPoiTyp: 25, name: "Mock Sonstige", icon: 0, onlySystemTyp: 0 },
{ idPoiTyp: 33, name: "Mock Autobahnauffahrt", icon: 4, onlySystemTyp: null },
];
// Du kannst das Redux-Mock-Datenhandling später noch global regeln
console.warn("⚠️ POI-Typen im Mock-Modus geladen.");
} else if (poiTypStatus === "idle") {
dispatch(fetchPoiTypThunk());
}
}, [dispatch, poiTypStatus]);
// Geräte-Daten lokal laden (kann später durch fetchLocationDevicesThunk ersetzt werden)
useEffect(() => {
const fetchDeviceData = async () => {
try {
const protocol = window.location.protocol;
@@ -71,13 +67,12 @@ export const useMapComponentState = () => {
}
};
fetchPoiTypData();
fetchDeviceData();
}, []);
return {
poiTypData,
isPoiTypLoaded,
isPoiTypLoaded: poiTypStatus === "succeeded",
deviceName,
setDeviceName,
locationDeviceData,