chore: rebrand application from Nantes to Marseille and update Antoine's color scheme from pink to blue

chore: add .env to gitignore to prevent environment variables from being committed
refactor: rebrand application from Paulin & Agathe to Vincent & Antoine and update API endpoint to July webhook
2026-06-02 18:21:49 +02:00 · 2026-06-02 18:16:42 +02:00 · 2026-06-02 18:16:21 +02:00 · 2026-02-14 17:55:38 +01:00 · 2026-02-13 21:36:18 +01:00 · 2026-02-13 19:16:19 +01:00
8 changed files with 234 additions and 66 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -22,3 +22,5 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
+
+.env
--- a/index.html
+++ b/index.html
@@ -2,7 +2,7 @@
 <html lang="en">
  <head>
    <meta charset="UTF-8" />
-    <meta name="description" content="Liste des annonces d'appartements à Nantes | Paulin et Agathe" />
+    <meta name="description" content="Liste des annonces d'appartements à Marseille | Vincent et Antoine" />
    <link rel="icon" href="/logo.png" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Appart List</title>
--- a/package-lock.json
+++ b/package-lock.json
@@ -2525,7 +2525,6 @@
      "integrity": "sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==",
      "dev": true,
      "license": "MIT",
-      "peer": true,
      "bin": {
        "jiti": "lib/jiti-cli.mjs"
      }
@@ -2627,7 +2626,6 @@
      "integrity": "sha512-utfs7Pr5uJyyvDETitgsaqSyjCb2qNRAtuqUeWIAKztsOYdcACf2KtARYXg2pSvhkt+9NfoaNY7fxjl6nuMjIQ==",
      "dev": true,
      "license": "MPL-2.0",
-      "peer": true,
      "dependencies": {
        "detect-libc": "^2.0.3"
      },
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -21,6 +21,93 @@ const SORT_OPTIONS = [
  { value: "recent", label: "Plus recent" },
 ];

+const DATE_RANGE_OPTIONS = [
+  { value: "", label: "Date: Toutes" },
+  { value: "today", label: "Aujourd'hui" },
+  { value: "yesterday", label: "Hier" },
+  { value: "last7", label: "7 derniers jours" },
+  { value: "last30", label: "30 derniers jours" },
+];
+
+const parseDate = (value) => {
+  if (!value) return null;
+
+  const toDate = (input) => {
+    const date = new Date(input);
+    return Number.isNaN(date.getTime()) ? null : date;
+  };
+
+  let date = value instanceof Date ? value : null;
+
+  if (!date && (typeof value === "number" || typeof value === "string")) {
+    date = toDate(value);
+
+    if (!date && typeof value === "string") {
+      const trimmed = value.trim();
+      const dayMatch = trimmed.match(/^([0-9]{1,2})[\/\-]([0-9]{1,2})[\/\-]([0-9]{2,4})$/);
+
+      if (dayMatch) {
+        const [, day, month, year] = dayMatch;
+        const normalizedYear = year.length === 2 ? `20${year}` : year;
+        date = toDate(`${normalizedYear.padStart(4, "0")}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`);
+      } else {
+        const monthMatch = trimmed.match(/^([0-9]{1,2})[\/\-]([0-9]{2,4})$/);
+        if (monthMatch) {
+          const [, month, year] = monthMatch;
+          const normalizedYear = year.length === 2 ? `20${year}` : year;
+          date = toDate(`${normalizedYear.padStart(4, "0")}-${month.padStart(2, "0")}-01`);
+        }
+      }
+    }
+  }
+
+  return date;
+};
+
+const matchesDateRange = (annonce, range) => {
+  if (!range) return true;
+
+  const today = new Date();
+  const startOfToday = new Date(today.getFullYear(), today.getMonth(), today.getDate());
+  const startOfTomorrow = new Date(startOfToday);
+  startOfTomorrow.setDate(startOfTomorrow.getDate() + 1);
+
+  let start = null;
+  let end = null;
+
+  switch (range) {
+    case "today":
+      start = startOfToday;
+      end = startOfTomorrow;
+      break;
+    case "yesterday": {
+      const startOfYesterday = new Date(startOfToday);
+      startOfYesterday.setDate(startOfYesterday.getDate() - 1);
+      start = startOfYesterday;
+      end = startOfToday;
+      break;
+    }
+    case "last7": {
+      start = new Date(startOfToday);
+      start.setDate(start.getDate() - 6);
+      end = startOfTomorrow;
+      break;
+    }
+    case "last30": {
+      start = new Date(startOfToday);
+      start.setDate(start.getDate() - 29);
+      end = startOfTomorrow;
+      break;
+    }
+    default:
+      return true;
+  }
+
+  const dates = [parseDate(annonce.DATE_DISPO), parseDate(annonce.createdAt)].filter(Boolean);
+  if (!dates.length) return false;
+  return dates.some((date) => date >= start && date < end);
+};
+
 function App() {
  const [annonces, setAnnonces] = useState([]);
  const [loading, setLoading] = useState(true);
@@ -33,6 +120,7 @@ function App() {
    balcon: null,
    maxPrix: "",
    minSurface: "",
+    dateRange: "",
  });
  const [showFilters, setShowFilters] = useState(false);

@@ -94,6 +182,9 @@ function App() {
    if (filters.minSurface) {
      list = list.filter((a) => a.SURFACE >= parseInt(filters.minSurface));
    }
+    if (filters.dateRange) {
+      list = list.filter((a) => matchesDateRange(a, filters.dateRange));
+    }

    switch (sort) {
      case "prix_asc":
@@ -108,7 +199,7 @@ function App() {
      case "note_desc":
        list.sort(
          (a, b) =>
-            (b.NOTE_P || 0) + (b.NOTE_A || 0) - ((a.NOTE_P || 0) + (a.NOTE_A || 0))
+            (b.NOTE_V || 0) + (b.NOTE_A || 0) - ((a.NOTE_V || 0) + (a.NOTE_A || 0))
        );
        break;
      case "recent":
@@ -127,6 +218,7 @@ function App() {
    filters.balcon !== null,
    !!filters.maxPrix,
    !!filters.minSurface,
+    !!filters.dateRange,
  ].filter(Boolean).length;

  const stats = useMemo(() => {
@@ -153,10 +245,10 @@ function App() {
              </div>
              <div>
                <h1 className="text-xl font-bold text-sand-900 tracking-tight">
-                  Appart Nantes
+                  Appart Marseille
                </h1>
                <p className="text-xs text-sand-500">
-                  Paulin & Agathe
+                  Vincent & Antoine
                  {stats && (
                    <span className="ml-1.5 text-sand-400">
                      -- {stats.count} annonce{stats.count > 1 ? "s" : ""} | moy.{" "}
@@ -302,6 +394,26 @@ function App() {
                />
              </div>

+              <div className="flex items-center gap-1.5">
+                <span className="text-xs text-sand-600 font-medium">Date</span>
+                <select
+                  value={filters.dateRange}
+                  onChange={(e) =>
+                    setFilters((f) => ({
+                      ...f,
+                      dateRange: e.target.value,
+                    }))
+                  }
+                  className="px-2 py-1 text-xs border border-sand-200 rounded-lg bg-white text-sand-700 focus:outline-none focus:ring-1 focus:ring-warm-300"
+                >
+                  {DATE_RANGE_OPTIONS.map((option) => (
+                    <option key={option.value} value={option.value}>
+                      {option.label}
+                    </option>
+                  ))}
+                </select>
+              </div>
+
              {activeFilterCount > 0 && (
                <button
                  onClick={() =>
@@ -311,6 +423,7 @@ function App() {
                      balcon: null,
                      maxPrix: "",
                      minSurface: "",
+                      dateRange: "",
                    })
                  }
                  className="text-xs text-warm-600 hover:text-warm-800 font-semibold"
--- a/src/api.js
+++ b/src/api.js
@@ -1,4 +1,4 @@
-const BASE = "https://n8n.holo795.fr/webhook/annonce_appart";
+const BASE = "https://n8n.holo795.fr/webhook/annonce_appart_july";

 export async function fetchAnnonces() {
  const res = await fetch(`${BASE}/get`);
--- a/src/components/AddModal.jsx
+++ b/src/components/AddModal.jsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useMemo, useState } from "react";
 import { X, Plus, Loader2, Link } from "lucide-react";

 export default function AddModal({ open, onClose, onSubmit, existingUrls }) {
@@ -6,11 +6,29 @@ export default function AddModal({ open, onClose, onSubmit, existingUrls }) {
  const [loading, setLoading] = useState(false);
  const [urlError, setUrlError] = useState("");

+  const normalizeUrl = (raw) => {
+    if (!raw) return "";
+    try {
+      const parsed = new URL(raw.trim());
+      parsed.hash = "";
+      parsed.search = "";
+      return `${parsed.origin}${parsed.pathname}`;
+    } catch (err) {
+      return raw.trim().split(/[?#]/)[0];
+    }
+  };
+
+  const normalizedExisting = useMemo(
+    () => existingUrls.map((item) => normalizeUrl(item)),
+    [existingUrls]
+  );
+
  if (!open) return null;

  const handleUrlChange = (val) => {
    setUrl(val);
-    if (existingUrls.includes(val.trim())) {
+    const normalized = normalizeUrl(val);
+    if (normalized && normalizedExisting.includes(normalized)) {
      setUrlError("Cette URL existe deja dans la liste !");
    } else {
      setUrlError("");
--- a/src/components/AppartCard.jsx
+++ b/src/components/AppartCard.jsx
@@ -1,11 +1,9 @@
-import { useState } from "react";
+import { useEffect, useRef, useState } from "react";
 import {
  MapPin,
  Euro,
  Maximize2,
  DoorOpen,
-  Bus,
-  Car,
  Calendar,
  Sofa,
  ParkingCircle,
@@ -65,12 +63,20 @@ const formatFrDate = (value) => {
    date = toDate(value);

    if (!date && typeof value === "string") {
-      const match = value.trim().match(/^([0-9]{1,2})[\/\-]([0-9]{1,2})[\/\-]([0-9]{2,4})$/);
+      const trimmed = value.trim();
+      const dayMatch = trimmed.match(/^([0-9]{1,2})[\/\-]([0-9]{1,2})[\/\-]([0-9]{2,4})$/);

-      if (match) {
-        const [, day, month, year] = match;
+      if (dayMatch) {
+        const [, day, month, year] = dayMatch;
        const normalizedYear = year.length === 2 ? `20${year}` : year;
        date = toDate(`${normalizedYear.padStart(4, "0")}-${month.padStart(2, "0")}-${day.padStart(2, "0")}`);
+      } else {
+        const monthMatch = trimmed.match(/^([0-9]{1,2})[\/\-]([0-9]{2,4})$/);
+        if (monthMatch) {
+          const [, month, year] = monthMatch;
+          const normalizedYear = year.length === 2 ? `20${year}` : year;
+          date = toDate(`${normalizedYear.padStart(4, "0")}-${month.padStart(2, "0")}-01`);
+        }
      }
    }
  }
@@ -84,30 +90,69 @@ const formatFrDate = (value) => {
  });
 };

+const normalizeFeedback = (noteV, noteA, commentV, commentA) => ({
+  NOTE_V: typeof noteV === "number" ? noteV : parseFloat(noteV) || 0,
+  NOTE_A: typeof noteA === "number" ? noteA : parseFloat(noteA) || 0,
+  COMMENTAIRE_V: commentV?.trim() ? commentV.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 [noteV, setNoteV] = useState(annonce.NOTE_V || 0);
  const [noteA, setNoteA] = useState(annonce.NOTE_A || 0);
-  const [commentP, setCommentP] = useState(annonce.COMMENTAIRE_P || "");
+  const [commentV, setCommentV] = useState(annonce.COMMENTAIRE_V || "");
  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(noteV, noteA, commentV, commentA)
+  );

-  const hasPaulinFeedback = (noteP ?? 0) > 0 || !!commentP?.trim();
-  const hasAgatheFeedback = (noteA ?? 0) > 0 || !!commentA?.trim();
+  const hasVincentFeedback = (noteV ?? 0) > 0 || !!commentV?.trim();
+  const hasAntoineFeedback = (noteA ?? 0) > 0 || !!commentA?.trim();
+
+  useEffect(() => {
+    const normalized = normalizeFeedback(noteV, noteA, commentV, commentA);
+    const lastSaved = lastSavedRef.current;
+
+    if (
+      normalized.NOTE_V === lastSaved.NOTE_V &&
+      normalized.NOTE_A === lastSaved.NOTE_A &&
+      normalized.COMMENTAIRE_V === lastSaved.COMMENTAIRE_V &&
+      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, commentV, noteA, noteV, onUpdated]);

  const handleSave = async () => {
    setSaving(true);
    await updateAnnonce(annonce.id, {
-      NOTE_P: noteP,
+      NOTE_V: noteV,
      NOTE_A: noteA,
-      COMMENTAIRE_P: commentP || null,
+      COMMENTAIRE_V: commentV || null,
      COMMENTAIRE_A: commentA || null,
    });
    onUpdated?.();
@@ -121,7 +166,7 @@ export default function AppartCard({ annonce, onDelete, onUpdated }) {
    setDeleting(false);
  };

-  const avgNote = noteP || noteA ? ((noteP + noteA) / (noteP && noteA ? 2 : 1)).toFixed(1) : null;
+  const avgNote = noteV || noteA ? ((noteV + noteA) / (noteV && noteA ? 2 : 1)).toFixed(1) : null;

  const dateDispo = formatFrDate(annonce.DATE_DISPO);
  const dateAjout = formatFrDate(annonce.createdAt);
@@ -181,11 +226,12 @@ export default function AppartCard({ annonce, onDelete, onUpdated }) {
        <div className="flex flex-wrap gap-x-4 gap-y-1.5">
          <InfoChip icon={Maximize2} value={`${annonce.SURFACE ?? 0} m2`} />
          <InfoChip icon={DoorOpen} value={`${annonce.NB_PIECE ?? 0} piece${(annonce.NB_PIECE ?? 0) > 1 ? "s" : ""}`} />
-          {annonce.DISTANCE_V > 0 && (
-            <InfoChip icon={Bus} label="Vatel" value={`${annonce.DISTANCE_V} min`} />
-          )}
-          {annonce.DISTANCE_S > 0 && (
-            <InfoChip icon={Car} label="Sup de Vinci" value={`${annonce.DISTANCE_S} min`} />
+          {annonce.ARRONDISSEMENT && (
+            <InfoChip
+              icon={MapPin}
+              label="Arrond."
+              value={`${annonce.ARRONDISSEMENT}${annonce.ARRONDISSEMENT === 1 ? "er" : "e"}`}
+            />
          )}
          {dateDispo && <InfoChip icon={Calendar} label="Dispo" value={dateDispo} />}
          {dateAjout && <InfoChip icon={Calendar} label="Ajout" value={dateAjout} />}
@@ -207,15 +253,15 @@ export default function AppartCard({ annonce, onDelete, onUpdated }) {
          <span className="flex items-center gap-1.5">
            <MessageSquare size={14} />
            Notes et commentaires
-            {(hasPaulinFeedback || hasAgatheFeedback) && (
+            {(hasVincentFeedback || hasAntoineFeedback) && (
              <span className="flex items-center gap-1">
-                {hasPaulinFeedback && (
+                {hasVincentFeedback && (
                  <span className="w-4 h-4 rounded-full bg-warm-500 text-white text-[9px] font-semibold flex items-center justify-center">
-                    P
+                    V
                  </span>
                )}
-                {hasAgatheFeedback && (
-                  <span className="w-4 h-4 rounded-full bg-pink-500 text-white text-[9px] font-semibold flex items-center justify-center">
+                {hasAntoineFeedback && (
+                  <span className="w-4 h-4 rounded-full bg-blue-600 text-white text-[9px] font-semibold flex items-center justify-center">
                    A
                  </span>
                )}
@@ -225,57 +271,48 @@ export default function AppartCard({ annonce, onDelete, onUpdated }) {
          {expanded ? <ChevronUp size={14} /> : <ChevronDown size={14} />}
        </button>

+        {(pendingSave || saving) && (
+          <div className="px-5 pb-2 text-xs text-sand-400">
+            {saving ? "Sauvegarde..." : "Sauvegarde automatique imminente..."}
+          </div>
+        )}
+
        {expanded && (
          <div className="px-5 pb-4 space-y-3">
-            {/* Paulin */}
+            {/* Vincent */}
            <div className="space-y-1.5">
              <div className="flex items-center justify-between">
                <span className="text-xs font-semibold text-warm-600 uppercase tracking-wide">
-                  Paulin
+                  Vincent
                </span>
-                <StarRating value={noteP} onChange={setNoteP} />
+                <StarRating value={noteV} onChange={setNoteV} />
              </div>
              <textarea
-                value={commentP}
-                onChange={(e) => setCommentP(e.target.value)}
-                placeholder="L'avis de Paulin..."
+                value={commentV}
+                onChange={(e) => setCommentV(e.target.value)}
+                placeholder="L'avis de Vincent..."
                rows={2}
                className="w-full px-3 py-2 text-sm border border-sand-200 rounded-xl resize-none focus:outline-none focus:ring-2 focus:ring-warm-200 placeholder:text-sand-300 text-sand-800 bg-sand-50/50"
              />
            </div>

-            {/* Agathe */}
+            {/* Antoine */}
            <div className="space-y-1.5">
              <div className="flex items-center justify-between">
-                <span className="text-xs font-semibold text-pink-500 uppercase tracking-wide">
-                  Agathe
+                <span className="text-xs font-semibold text-blue-700 uppercase tracking-wide">
+                  Antoine
                </span>
                <StarRating value={noteA} onChange={setNoteA} />
              </div>
              <textarea
                value={commentA}
                onChange={(e) => setCommentA(e.target.value)}
-                placeholder="L'avis d'Agathe..."
+                placeholder="L'avis d'Antoine..."
                rows={2}
-                className="w-full px-3 py-2 text-sm border border-sand-200 rounded-xl resize-none focus:outline-none focus:ring-2 focus:ring-pink-200 placeholder:text-sand-300 text-sand-800 bg-sand-50/50"
+                className="w-full px-3 py-2 text-sm border border-sand-200 rounded-xl resize-none focus:outline-none focus:ring-2 focus:ring-blue-200 placeholder:text-sand-300 text-sand-800 bg-sand-50/50"
              />
            </div>

-            {/* Save */}
-            {hasChanges && (
-              <button
-                onClick={handleSave}
-                disabled={saving}
-                className="flex items-center gap-1.5 px-4 py-1.5 bg-warm-500 text-white text-sm rounded-xl hover:bg-warm-600 transition-colors disabled:opacity-50 font-medium"
-              >
-                {saving ? (
-                  <Loader2 size={14} className="animate-spin" />
-                ) : (
-                  <Save size={14} />
-                )}
-                {saving ? "Sauvegarde..." : "Sauvegarder"}
-              </button>
-            )}
          </div>
        )}
      </div>
--- a/src/components/PasswordGate.jsx
+++ b/src/components/PasswordGate.jsx
@@ -1,7 +1,7 @@
 import { useState } from "react";
 import { Lock, Loader2 } from "lucide-react";

-const STORAGE_KEY = "appart_nantes_auth";
+const STORAGE_KEY = "appart_marseille_auth";

 export default function PasswordGate({ children }) {
  const [authenticated, setAuthenticated] = useState(
@@ -37,9 +37,9 @@ export default function PasswordGate({ children }) {
            <Lock size={24} className="text-white" />
          </div>
          <h1 className="text-2xl font-bold text-sand-900 tracking-tight">
-            Appart Nantes
+            Appart Marseille
          </h1>
-          <p className="text-sm text-sand-400 mt-1">Paulin & Agathe</p>
+          <p className="text-sm text-sand-400 mt-1">Vincent & Antoine</p>
        </div>

        <form
Author	SHA1	Message	Date
ɧσℓσ	1eeaa7c1e5	chore: rebrand application from Nantes to Marseille and update Antoine's color scheme from pink to blue	2026-06-02 18:21:49 +02:00
ɧσℓσ	0591ead62e	chore: add .env to gitignore to prevent environment variables from being committed	2026-06-02 18:16:42 +02:00
ɧσℓσ	46453604ac	refactor: rebrand application from Paulin & Agathe to Vincent & Antoine and update API endpoint to July webhook	2026-06-02 18:16:21 +02:00
ɧσℓσ	60055dddac	feat: enhance date parsing to support month-only formats and normalize URLs to prevent duplicates	2026-02-14 17:55:38 +01:00
ɧσℓσ	ba99b79d35	feat: add date range filter with predefined options for apartment availability and creation dates	2026-02-13 21:36:18 +01:00
ɧσℓσ	8f5c0cce5e	feat: implement auto-save for apartment feedback with debounced updates and save state indicators	2026-02-13 19:16:19 +01:00