feat: Set default POI type in dropdown based on selected POI

components/PoiUpdateModal.js

@@ -1,8 +1,12 @@
 // pages/api/poiUpdateModal.js
 //
 import React, { useState, useEffect } from "react";
+import { useRecoilValue } from "recoil";
+import { selectedPoiState } from "../store/atoms/poiState";
+
 
 const PoiUpdateModal = ({ onClose, poiData }) => {
+  const selectedPoi = useRecoilValue(selectedPoiState);
   const [poiId, setPoiId] = useState(poiData ? poiData.idPoi : "");
   const [name, setName] = useState(poiData ? poiData.name : "");
   const [poiTypData, setPoiTypData] = useState([]);
@@ -89,17 +93,19 @@ const PoiUpdateModal = ({ onClose, poiData }) => {
       try {
         const response = await fetch("/api/readPoiTyp");
         const data = await response.json();
-        //console.log("POI Typ Daten:", data);
         setPoiTypData(data);
-        if (data && data.length > 0) {
-          setPoiTypeId(data[0].idPoiTyp); // Set the first type as default
+        if (selectedPoi && data) {
+          const matchingType = data.find(pt => pt.name === selectedPoi.typ);
+          if (matchingType) {
+            setPoiTypeId(matchingType.idPoiTyp);
+          }
         }
       } catch (error) {
         console.error("Fehler beim Abrufen der poiTyp Daten:", error);
       }
     };
     fetchPoiTypData();
-  }, []);
+  }, [selectedPoi]);
 
   // Fetch device data
   useEffect(() => {
@@ -166,6 +172,12 @@ const PoiUpdateModal = ({ onClose, poiData }) => {
     }
   };
 
+  //ausgewählte poi Informationen in Console anzeigen
+  console.log("Selected POI:", selectedPoi);
+  console.log("Selected POI Gerät id in poiUpdateModal.js:", selectedPoi.id);
+  console.log("Selected POI Typ name in poiUpdateModal.js:", selectedPoi.typ);//als Typ in dropdown menu
+  console.log("Selected POI Beschreibung in poiUpdateModal.js:", selectedPoi.description);
+
   return (
     <form onSubmit={handleSubmit} className="m-0 p-2 w-full">
       <div className="flex items-center mb-4">