// ============================================================
// LGM — Main App (router + pages)
// ============================================================
const { useState: us, useEffect: ue, useMemo: um, useRef: ur } = React;
// ---------- Supabase fetch layer ----------
const SUPABASE_URL = "https://vhlghqgkqvghlsfdiukv.supabase.co";
const SUPABASE_ANON_KEY = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InZobGdocWdrcXZnaGxzZmRpdWt2Iiwicm9sZSI6ImFub24iLCJpYXQiOjE3NzYwOTYxMzUsImV4cCI6MjA5MTY3MjEzNX0.zxMer-1e0SQbUNtDADxeWEN2GaNJjR-9chxw90t6W2k";
// Parsea "Parking: 4" y "Año: 2021" de features[]. Devuelve { parking, year, features }.
function extractMetaFromFeatures(features) {
const clean = [];
let parking = null, year = null;
(features || []).forEach(f => {
const mP = /^Parking:\s*(\d+)/i.exec(f);
const mY = /^(?:Año|Ano|Year):\s*(\d+)/i.exec(f);
if (mP) { parking = parseInt(mP[1], 10); return; }
if (mY) { year = parseInt(mY[1], 10); return; }
clean.push(f);
});
return { parking, year, features: clean };
}
// Remapea fila DB → shape LGM que consume el landing
function mapDbRowToLgm(r) {
const { parking, year, features } = extractMetaFromFeatures(r.features);
// Nuevo formato: location="Ciudad, Provincia", region=Ciudad, area=Zona (texto)
// Legacy : location="Zona, Ciudad", region=Ciudad, area=m² (numérico)
const locParts = (r.location || "").split(",").map(s => s.trim()).filter(Boolean);
const city = r.region || locParts[0] || "";
const rawArea = r.area;
const areaStr = (rawArea == null) ? "" : String(rawArea).trim();
// Detecta m² legacy: "1240", "300 m", "120m2", "95m²" o duplicado de construction_sqm
const isNumericLegacy = areaStr !== "" && (
/^\d+(?:[.,]\d+)?\s*(?:m2?|m²)?\.?$/i.test(areaStr) ||
(r.construction_sqm != null && areaStr === String(r.construction_sqm))
);
// Zona nueva: area es texto válido (no numérico, distinto de city)
let zone = (areaStr && !isNumericLegacy && areaStr.toLowerCase() !== city.toLowerCase()) ? areaStr : "";
// Legacy fallback: zona vive en locParts[0] cuando difiere de la ciudad
if (!zone && r.region && locParts[0] && locParts[0].toLowerCase() !== r.region.toLowerCase()) {
zone = locParts[0];
}
// Promueve legacy numérico a construction_sqm display si falta
const legacyConstructionSqm = isNumericLegacy ? (parseFloat(areaStr.replace(",", ".")) || null) : null;
// province = 2da parte de "ciudad, provincia"; fallback lookup por ciudad
let province = locParts[1] || "";
if (!province && city && window.LGM_PROVINCES) {
const hit = window.LGM_PROVINCES.find(p => p.cities.includes(city));
if (hit) province = hit.name;
}
return {
id: r.slug,
_dbId: r.id,
name: r.name,
ref: r.badge || r.slug,
zone,
city,
province,
type: r.property_type || "villa",
operation: r.listing_type || "sale",
price: r.price,
rent: r.rental_price,
currency: r.currency || "USD",
beds: r.beds || 0,
baths: r.baths || 0,
parking: parking ?? 0,
area: r.construction_sqm ?? legacyConstructionSqm ?? 0,
lotArea: r.sqm ?? null,
featured: !!r.featured,
title: !!r.has_title,
deslinde: !!r.has_deslinde,
year: year ?? null,
description: r.description || "",
features,
coords: [r.lat ?? 19.79, r.lng ?? -70.69],
images: (r.images && r.images.length) ? r.images : [],
amenities: Array.isArray(r.amenities) ? r.amenities : [],
};
}
async function fetchPropertiesFromSupabase() {
const url = `${SUPABASE_URL}/rest/v1/properties?select=*&status=eq.active&order=sort_order.asc.nullslast,created_at.desc`;
const res = await fetch(url, {
headers: {
apikey: SUPABASE_ANON_KEY,
Authorization: `Bearer ${SUPABASE_ANON_KEY}`,
},
});
if (!res.ok) throw new Error(`Supabase ${res.status}`);
const rows = await res.json();
return rows.map(mapDbRowToLgm);
}
// Detect browser language → map to supported
function detectLang() {
const supported = ["es", "en", "fr", "de", "it", "ru"];
const stored = localStorage.getItem("lgm_lang");
if (stored && supported.includes(stored)) return stored;
const nav = (navigator.language || "es").slice(0, 2).toLowerCase();
return supported.includes(nav) ? nav : "es";
}
function App() {
const [lang, setLangRaw] = us(detectLang);
const setLang = (l) => { setLangRaw(l); localStorage.setItem("lgm_lang", l); };
const t = window.LGM_I18N[lang];
// Version bump al llegar data del panel admin (Supabase)
const [dataVersion, setDataVersion] = us(0);
ue(() => {
let alive = true;
fetchPropertiesFromSupabase()
.then(list => {
if (!alive || !list || !list.length) return;
window.LGM_PROPERTIES = list;
setDataVersion(v => v + 1);
// debug
console.log(`[LGM] ${list.length} propiedades cargadas desde Supabase`);
})
.catch(err => {
console.warn("[LGM] Fetch Supabase falló, uso data local:", err);
});
return () => { alive = false; };
}, []);
const { route, go } = useRoute();
const [tweaks, setTweaks] = us({
palette: localStorage.getItem("lgm_palette") || "light",
hero: "fullbleed",
cards: "editorial",
display: "cormorant",
nav: "top",
});
// Tweaks mode listener
const [tweaksVisible, setTweaksVisible] = us(false);
ue(() => {
const onMsg = (e) => {
if (e.data?.type === "__activate_edit_mode") setTweaksVisible(true);
if (e.data?.type === "__deactivate_edit_mode") setTweaksVisible(false);
};
window.addEventListener("message", onMsg);
window.parent?.postMessage({ type: "__edit_mode_available" }, "*");
return () => window.removeEventListener("message", onMsg);
}, []);
// Apply palette
ue(() => {
document.body.classList.remove("theme-light", "theme-coastal");
if (tweaks.palette === "light") document.body.classList.add("theme-light");
if (tweaks.palette === "coastal") document.body.classList.add("theme-coastal");
localStorage.setItem("lgm_palette", tweaks.palette);
}, [tweaks.palette]);
// Apply display font
ue(() => {
const map = {
cormorant: "'Cormorant Garamond', serif",
playfair: "'Playfair Display', serif",
italiana: "'Italiana', serif",
canela: "'DM Serif Display', serif",
};
document.documentElement.style.setProperty("--f-display", map[tweaks.display] || map.cormorant);
}, [tweaks.display]);
// Favorites + visited (visited con TTL 48h por entrada)
const VISITED_TTL_MS = 48 * 60 * 60 * 1000;
const [favorites, setFavorites] = useLocalStorage("lgm_fav", []);
const [visited, setVisited] = useLocalStorage("lgm_visited", []);
const [visitedTs, setVisitedTs] = useLocalStorage("lgm_visited_ts", {});
const [favDrawerOpen, setFavDrawerOpen] = us(false);
// Prune visitadas vencidas (>48h) al montar + cada hora mientras sesión abierta
ue(() => {
const prune = () => {
const now = Date.now();
setVisitedTs(m => {
const seeded = { ...m };
// Seed timestamp now para entradas legacy sin ts (evita borrado masivo en primera visita post-fix)
(visited || []).forEach(id => { if (!seeded[id]) seeded[id] = now; });
const kept = {};
Object.entries(seeded).forEach(([id, t]) => {
if (now - t < VISITED_TTL_MS) kept[id] = t;
});
setVisited(v => (v || []).filter(id => kept[id]));
return kept;
});
};
prune();
const h = setInterval(prune, 60 * 60 * 1000); // 1h
return () => clearInterval(h);
}, []);
const toggleFav = (id) => {
setFavorites(f => f.includes(id) ? f.filter(x => x !== id) : [...f, id]);
};
// Modal
const [modalProp, setModalProp] = us(null);
const openProp = (p) => {
setModalProp(p);
setVisited(v => [p.id, ...v.filter(x => x !== p.id)].slice(0, 50));
setVisitedTs(m => ({ ...m, [p.id]: Date.now() }));
window.__modalOpen = true;
};
const closeProp = () => { setModalProp(null); window.__modalOpen = false; };
// Search from Hero → navega a /propiedades con filtros pre-aplicados
const [incomingFilters, setIncomingFilters] = us(null);
const onSearch = (filters) => {
setIncomingFilters(filters);
go("/propiedades");
};
const allProps = window.LGM_PROPERTIES;
const featured = allProps.filter(p => p.featured);
const waNumber = "18294832697";
const path = route.path;
useReveal(path);
useScrollEnhancements();
// Render current route
let page = null;
if (path === "/" || path === "") {
page = ;
} else if (path === "/propiedades") {
page = ;
} else if (path === "/sobre-mi") {
page = ;
} else if (path === "/servicios") {
page = ;
} else if (path === "/vender") {
page = ;
} else {
page = ;
}
// Footer solo si no en /propiedades? Se muestra siempre; contacto solo en Home
const showContact = path === "/";
return (
<>
{/* Scroll progress */}
{/* Cursor */}
{/* Nav */}