fix: Clipboard-Kopierfunktion in CoordinatePopup.js mit Fallback abgesichert

- Clipboard-API Nutzung abgesichert gegen nicht unterstützte Umgebungen
- Fallback mit document.execCommand implementiert für ältere Browser
- Fehlerbehandlung und Benutzer-Feedback verbessert

components/CoordinatePopup.js

@@ -4,33 +4,56 @@ import React from "react";
 const CoordinatePopup = ({ isOpen, coordinates, onClose }) => {
   if (!isOpen) return null;
 
+  const copyToClipboard = () => {
+    if (typeof navigator !== "undefined" && navigator.clipboard) {
+      navigator.clipboard
+        .writeText(coordinates)
+        .then(() => {
+          alert("Koordinaten kopiert!");
+        })
+        .catch((err) => {
+          console.error("Clipboard-API Fehler:", err);
+          fallbackCopyToClipboard(coordinates);
+        });
+    } else {
+      fallbackCopyToClipboard(coordinates);
+    }
+  };
+
+  const fallbackCopyToClipboard = (text) => {
+    const textArea = document.createElement("textarea");
+    textArea.value = text;
+    document.body.appendChild(textArea);
+    textArea.focus();
+    textArea.select();
+    try {
+      const successful = document.execCommand("copy");
+      if (successful) {
+        alert("Koordinaten kopiert!");
+      } else {
+        alert("Kopieren fehlgeschlagen (Fallback).");
+      }
+    } catch (err) {
+      alert("Kopieren fehlgeschlagen: " + err.message);
+    }
+    document.body.removeChild(textArea);
+  };
+
   return (
     <div
       className="fixed inset-0 bg-black bg-opacity-30 flex justify-center z-50"
-      onClick={onClose} // Schließt das Popup, wenn der Hintergrund angeklickt wird
+      onClick={onClose}
       style={{
-        alignItems: "flex-start", // Positioniert das Popup oben
-        paddingTop: "5px", // Abstand von oben
+        alignItems: "flex-start",
+        paddingTop: "5px",
       }}
     >
-      <div
-        className="bg-white p-4 rounded-lg shadow-xl"
-        style={{
-          width: "300px",
-        }}
-        onClick={(e) => e.stopPropagation()} // Verhindert das Schließen, wenn innerhalb des Popups geklickt wird
-      >
+      <div className="bg-white p-4 rounded-lg shadow-xl" style={{ width: "300px" }} onClick={(e) => e.stopPropagation()}>
         <h2 className="text-xl font-bold text-center mb-2 text-gray-800">Koordinaten</h2>
         <p className="text-center text-lg text-gray-600 font-mono mb-0">lat , lng</p>
         <p className="text-center text-lg text-gray-600 font-mono mb-6">{coordinates}</p>
         <div className="flex justify-center gap-4">
-          <button
-            onClick={() => {
-              navigator.clipboard.writeText(coordinates);
-              alert("Koordinaten kopiert!");
-            }}
-            className="bg-blue-500 text-white px-6 py-2 rounded-lg shadow hover:bg-blue-600 transition-all"
-          >
+          <button onClick={copyToClipboard} className="bg-blue-500 text-white px-6 py-2 rounded-lg shadow hover:bg-blue-600 transition-all">
             Kopieren
           </button>
           <button onClick={onClose} className="bg-gray-300 text-gray-800 px-6 py-2 rounded-lg shadow hover:bg-gray-400 transition-all">