refactor(map): useDrawLines.js auf Redux umgestellt

- fetch-Aufruf ersetzt durch Redux-Thunk fetchGisLinesThunk
- gisLines aus Redux-Store bezogen mit selectGisLines
- Datenmapping erfolgt reaktiv via useEffect
- Version auf 1.1.174 erhöht
This commit is contained in:
ISA
2025-05-26 11:50:39 +02:00
parent bbca980b5b
commit ff55481273
3 changed files with 68 additions and 32 deletions

View File

@@ -4,6 +4,39 @@ Alle bedeutenden Änderungen an diesem Projekt werden in dieser Datei dokumentie
---
[1.1.174] 2025-05-26
♻️ Refactor
useDrawLines.js vollständig auf Redux umgestellt:
Entfernt: direkter fetch("/api/talas_v5_DB/gisLines/readGisLines")
Stattdessen: Redux fetchGisLinesThunk() + selectGisLines verwendet
Datenverarbeitung der points erfolgt reaktiv über Redux-State
🧠 Architektur
useDrawLines.js verwendet jetzt:
fetchGisLinesService (Service)
fetchGisLinesThunk (Thunk)
gisLinesSlice mit Selektor selectGisLines
State wird automatisch im Redux verwaltet (loading/succeeded/failed)
✅ Cleanup
Promise-Kette .then().catch() durch useSelector-basierten Effekt ersetzt
Fehlerausgabe bei ungültigen points strukturiert behandelt
Hook ist nun Redux-konform und testbar
🔧 Version
📦 Version erhöht auf 1.1.174
---
[1.1.173] 2025-05-26
♻️ Refactor
useMapComponentState.js vollständig auf Redux umgestellt:

View File

@@ -1,2 +1,2 @@
// /config/appVersion
export const APP_VERSION = "1.1.174";
export const APP_VERSION = "1.1.175";

View File

@@ -1,37 +1,40 @@
// /hooks/layers/useDrawLines.js
import { useEffect } from "react";
const useDrawLines = (setLinePositions) => {
// Linien auf die Karte zeichnen
useEffect(() => {
const endpoint = "/api/talas_v5_DB/gisLines/readGisLines";
//const endpoint = "http://localhost/talas5/ClientData/WebServiceMap.asmx/GisLinesStatus?idMap=10";
fetch(endpoint)
.then((response) => {
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
return response.json();
})
.then((data) => {
const newLinePositions = data.map((item) => {
//console.log("item.idLD", item.idLD);
//console.log("item.idModul", item.idModul);
import { useDispatch, useSelector } from "react-redux";
import { fetchGisLinesThunk } from "../../redux/thunks/database/polylines/fetchGisLinesThunk";
import { selectGisLines } from "../../redux/slices/database/polylines/gisLinesSlice";
if (item.points && Array.isArray(item.points)) {
return {
coordinates: item.points.map((point) => [point.x, point.y]),
idModul: item.idModul,
idLD: item.idLD,
};
} else {
throw new Error("Points missing or not an array");
}
});
setLinePositions(newLinePositions);
})
.catch((error) => {
console.error("Error fetching data:", error.message);
const useDrawLines = (setLinePositions) => {
const dispatch = useDispatch();
const gisLines = useSelector(selectGisLines);
// Daten laden (nur einmal)
useEffect(() => {
dispatch(fetchGisLinesThunk());
}, [dispatch]);
// Linien aus GIS-Daten berechnen
useEffect(() => {
if (!Array.isArray(gisLines)) return;
try {
const newLinePositions = gisLines.map((item) => {
if (item.points && Array.isArray(item.points)) {
return {
coordinates: item.points.map((point) => [point.x, point.y]),
idModul: item.idModul,
idLD: item.idLD,
};
} else {
throw new Error("Points missing or not an array");
}
});
}, []);
setLinePositions(newLinePositions);
} catch (err) {
console.error("❌ Fehler beim Zeichnen der Linien:", err.message);
}
}, [gisLines, setLinePositions]);
};
export default useDrawLines;