diff --git a/src/components/AppartCard.jsx b/src/components/AppartCard.jsx index c70317f..1bf1630 100644 --- a/src/components/AppartCard.jsx +++ b/src/components/AppartCard.jsx @@ -1,4 +1,4 @@ -import { useState } from "react"; +import { useEffect, useRef, useState } from "react"; import { MapPin, Euro, @@ -84,24 +84,63 @@ const formatFrDate = (value) => { }); }; +const normalizeFeedback = (noteP, noteA, commentP, commentA) => ({ + NOTE_P: typeof noteP === "number" ? noteP : parseFloat(noteP) || 0, + NOTE_A: typeof noteA === "number" ? noteA : parseFloat(noteA) || 0, + COMMENTAIRE_P: commentP?.trim() ? commentP.trim() : null, + COMMENTAIRE_A: commentA?.trim() ? commentA.trim() : null, +}); + export default function AppartCard({ annonce, onDelete, onUpdated }) { const [noteP, setNoteP] = useState(annonce.NOTE_P || 0); const [noteA, setNoteA] = useState(annonce.NOTE_A || 0); const [commentP, setCommentP] = useState(annonce.COMMENTAIRE_P || ""); const [commentA, setCommentA] = useState(annonce.COMMENTAIRE_A || ""); const [saving, setSaving] = useState(false); + const [pendingSave, setPendingSave] = useState(false); const [expanded, setExpanded] = useState(false); const [deleting, setDeleting] = useState(false); - const hasChanges = - noteP !== (annonce.NOTE_P || 0) || - noteA !== (annonce.NOTE_A || 0) || - commentP !== (annonce.COMMENTAIRE_P || "") || - commentA !== (annonce.COMMENTAIRE_A || ""); + const lastSavedRef = useRef( + normalizeFeedback(noteP, noteA, commentP, commentA) + ); const hasPaulinFeedback = (noteP ?? 0) > 0 || !!commentP?.trim(); const hasAgatheFeedback = (noteA ?? 0) > 0 || !!commentA?.trim(); + useEffect(() => { + const normalized = normalizeFeedback(noteP, noteA, commentP, commentA); + const lastSaved = lastSavedRef.current; + + if ( + normalized.NOTE_P === lastSaved.NOTE_P && + normalized.NOTE_A === lastSaved.NOTE_A && + normalized.COMMENTAIRE_P === lastSaved.COMMENTAIRE_P && + normalized.COMMENTAIRE_A === lastSaved.COMMENTAIRE_A + ) { + return; + } + + setPendingSave(true); + + const timeout = setTimeout(async () => { + setPendingSave(false); + setSaving(true); + try { + await updateAnnonce(annonce.id, normalized); + lastSavedRef.current = normalized; + onUpdated?.(); + } catch (err) { + console.error("Erreur sauvegarde annonce", err); + setPendingSave(true); + } finally { + setSaving(false); + } + }, 700); + + return () => clearTimeout(timeout); + }, [annonce.id, commentA, commentP, noteA, noteP, onUpdated]); + const handleSave = async () => { setSaving(true); await updateAnnonce(annonce.id, { @@ -225,6 +264,12 @@ export default function AppartCard({ annonce, onDelete, onUpdated }) { {expanded ? : } + {(pendingSave || saving) && ( +
+ {saving ? "Sauvegarde..." : "Sauvegarde automatique imminente..."} +
+ )} + {expanded && (
{/* Paulin */} @@ -261,21 +306,6 @@ export default function AppartCard({ annonce, onDelete, onUpdated }) { />
- {/* Save */} - {hasChanges && ( - - )} )}