diff --git a/src/components/EditarModal.jsx b/src/components/EditarModal.jsx
new file mode 100644
index 0000000..cf79479
--- /dev/null
+++ b/src/components/EditarModal.jsx
@@ -0,0 +1,97 @@
+export default function EditarModal({ tipo, coord, show, close, setCoords }) {
+ const handleSubmit = (e) => {
+ e.preventDefault();
+
+ const formData = new FormData(e.target);
+ const x = formData.get("x");
+ const y = formData.get("y");
+ const z = formData.get("z");
+
+ let storedTipo = localStorage.getItem(tipo);
+ if (storedTipo) {
+ let arr = JSON.parse(storedTipo);
+ const index = arr.findIndex((item) => item.num === coord.num);
+ if (index !== -1) {
+ arr[index] = {
+ ...coord,
+ x: Number(x),
+ y: y ? Number(y) : null,
+ z: Number(z),
+ };
+ localStorage.setItem(tipo, JSON.stringify(arr));
+ setCoords(arr);
+ }
+ }
+ close();
+ };
+
+ if (!show) {
+ return null;
+ }
+
+ return (
+
+ );
+}
diff --git a/src/components/TimedToast.jsx b/src/components/TimedToast.jsx
new file mode 100644
index 0000000..8009425
--- /dev/null
+++ b/src/components/TimedToast.jsx
@@ -0,0 +1,35 @@
+import { useEffect } from "react";
+
+export default function TimedToast({ message, durationMs, show, setShow }) {
+ useEffect(() => {
+ const timer = setTimeout(() => {
+ setShow(false);
+ }, durationMs);
+
+ return () => clearTimeout(timer);
+ }, [durationMs]);
+
+ if (!show) return null;
+
+ return (
+
+
+
+ Notification
+
+
+
{message}
+
+
+ );
+}
diff --git a/src/components/coordkeeper.jsx b/src/components/coordkeeper.jsx
index 400214b..4d3002b 100644
--- a/src/components/coordkeeper.jsx
+++ b/src/components/coordkeeper.jsx
@@ -4,6 +4,8 @@ import EditarIcon from "./EditarIcon";
import ShareIcon from "./ShareIcon";
import RemoveIcon from "./RemoveIcon";
import StaticModal from "./StaticModal";
+import EditarModal from "./EditarModal";
+import TimedToast from "./TimedToast";
function Modall({ show, CloseModal, Coord, Coords, EliminarCoord, tipo }) {
if (show === true && Coord !== null) {
@@ -26,10 +28,13 @@ export default function Keeper({ tipo }) {
const [coords, setCoords] = useState(
JSON.parse(localStorage.getItem(tipo) || "[]"),
);
+
const collapseRef = useRef(null);
const [showModal, setModal] = useState(false);
- //const [showShareToast, setShowShareToast] = useState(false);
+ const [showEditar, setEditar] = useState(false);
+ const [showToast, setShowToast] = useState(false);
const [selCoord, setCoord] = useState(null);
+
useEffect(() => {
const storedCoords = JSON.parse(localStorage.getItem(tipo) || "[]");
@@ -39,12 +44,16 @@ export default function Keeper({ tipo }) {
}
}, [tipo]);
- const Editar = () => {
- //wip
+ const Editar = (coord) => {
+ setCoord(coord);
+ setEditar(true);
};
- const Compartir = () => {
- //wip
+ const Compartir = (coord) => {
+ setCoord(coord);
+ const textToCopy = `X: ${coord.x}${coord.y ? ` Y: ${coord.y}` : ""} Z: ${coord.z}`;
+ navigator.clipboard.writeText(textToCopy);
+ setShowToast(true);
};
const Remover = (coord) => {
@@ -69,6 +78,22 @@ export default function Keeper({ tipo }) {
EliminarCoord={setCoords}
tipo={tipo}
/>
+
+ setEditar(false)}
+ tipo={tipo}
+ coord={selCoord}
+ setCoords={setCoords}
+ />
+
+
+
@@ -134,13 +159,13 @@ export default function Keeper({ tipo }) {
|
|