Ajout d'images pour les cartes de lieux (restaurants, plages, épiceries)

- Téléchargement d'images depuis Unsplash
- Images stockées dans public/images/
- Mise à jour de places.json avec chemins locaux
- Composant PlaceCard affiche maintenant les images dans l'en-tête
- Fallback automatique vers placeholder si image manquante
This commit is contained in:
2025-11-23 19:52:37 +01:00
parent fa4ef6320a
commit 908bf5f0c2
22 changed files with 27 additions and 14 deletions

View File

@ -1,5 +1,6 @@
"use client";
import { useState } from "react";
import { MapPin, ExternalLink } from "lucide-react";
import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
@ -10,6 +11,9 @@ interface PlaceCardProps {
}
export default function PlaceCard({ place }: PlaceCardProps) {
const [imageError, setImageError] = useState(false);
const hasValidImage = place.image && place.image !== "";
const handleOpenMaps = () => {
let url: string;
if (place.gmapLink && place.gmapLink !== "LIEN_GOOGLE_MAPS_A_INSERER") {
@ -22,10 +26,19 @@ export default function PlaceCard({ place }: PlaceCardProps) {
return (
<Card className="overflow-hidden">
<div className="relative h-48 bg-gradient-to-br from-primary/20 to-secondary">
<div className="absolute inset-0 flex items-center justify-center">
<MapPin className="h-16 w-16 text-primary/30" />
</div>
<div className="relative h-48 bg-gradient-to-br from-primary/20 to-secondary overflow-hidden">
{hasValidImage && !imageError ? (
<img
src={place.image}
alt={place.name}
className="w-full h-full object-cover"
onError={() => setImageError(true)}
/>
) : (
<div className="absolute inset-0 flex items-center justify-center">
<MapPin className="h-16 w-16 text-primary/30" />
</div>
)}
</div>
<CardHeader>
<div className="flex items-start justify-between gap-2">

View File

@ -7,7 +7,7 @@
"description": "LE lieu pour déjeuner les pieds dans l'eau. Poisson cru légendaire. Le cadre est inoubliable.",
"keywords": ["Lagon", "Poisson Cru", "Ambiance", "Incontournable"],
"contact": "+689 40 93 40 15",
"image": "/placeholder-restaurant.jpg",
"image": "/images/restaurant-lagon.jpg",
"location": {
"lat": -16.3167,
"lng": -145.6167,
@ -23,7 +23,7 @@
"description": "Super vue sur le lagon, parfait pour un déjeuner simple et bon. Leur Fish Burger est très apprécié.",
"keywords": ["Décontracté", "Vue", "Fish Burger", "Poisson Grillé"],
"contact": "+689 40 98 43 97",
"image": "/placeholder-restaurant.jpg",
"image": "/images/restaurant-snack.jpg",
"location": {
"lat": -16.3177,
"lng": -145.6177,
@ -38,7 +38,7 @@
"type": "Plage",
"description": "La plage la plus photogénique du Nord de Fakarava. Vous y trouverez le célèbre cocotier penché, parfait pour une photo \"carte postale\". Idéal pour le farniente et la baignade tranquille.",
"keywords": ["Photogénique", "Cocotier", "Baignade", "Farniente"],
"image": "/placeholder-beach.jpg",
"image": "/images/plage-cocotier.jpg",
"location": {
"lat": -16.3187,
"lng": -145.6187,
@ -54,7 +54,7 @@
"type": "Point de vue",
"description": "Un peu plus loin après le PK 9, le phare n'est pas une plage en soi, mais le lieu offre une vue unique sur l'Océan Pacifique (côté \"océan\" et non lagon). Ambiance de \"bout du monde\".",
"keywords": ["Phare", "Vue panoramique", "Océan", "Point de vue"],
"image": "/placeholder-beach.jpg",
"image": "/images/plage-phare.jpg",
"location": {
"lat": -16.3197,
"lng": -145.6197,
@ -70,7 +70,7 @@
"type": "Spot de snorkeling",
"description": "L'une des plus grandes passes de Polynésie. On n'y va pas pour la plage, mais pour l'activité de snorkeling en dérivante qui y est spectaculaire (à faire avec un club). Le paysage est impressionnant.",
"keywords": ["Passe", "Snorkeling", "Dérivante", "Spectaculaire"],
"image": "/placeholder-beach.jpg",
"image": "/images/plage-snorkeling.jpg",
"location": {
"lat": -16.3207,
"lng": -145.6207,
@ -86,7 +86,7 @@
"type": "Plage exceptionnelle",
"description": "L'excursion la plus célèbre de Fakarava. Il s'agit d'une plage unique de sable aux nuances rosées, à la pointe Sud de l'atoll.",
"keywords": ["Sable rose", "Exceptionnel", "Passe Sud", "Excursion"],
"image": "/placeholder-beach.jpg",
"image": "/images/plage-sable-rose.jpg",
"location": {
"lat": -16.3217,
"lng": -145.6217,
@ -102,7 +102,7 @@
"type": "Plage privée",
"description": "N'hésitez pas à mettre en avant votre propre plage et ponton ! Idéal pour un snorkeling facile et sécurisé.",
"keywords": ["Plage privée", "Ponton", "Snorkeling", "Sécurisé"],
"image": "/placeholder-beach.jpg",
"image": "/images/plage-pension.jpg",
"location": {
"lat": -16.3227,
"lng": -145.6227,
@ -118,7 +118,7 @@
"type": "Épicerie principale",
"description": "L'épicerie principale du village, idéale pour le ravitaillement. Bien achalandée avec les produits essentiels.",
"keywords": ["Épicerie", "Ravitaillement", "Village", "Principal"],
"image": "/placeholder-store.jpg",
"image": "/images/epicerie-principale.jpg",
"location": {
"lat": -16.3237,
"lng": -145.6237,
@ -135,7 +135,7 @@
"type": "Snack / Dépannage",
"description": "Souvent mentionné pour sa cuisine, il est aussi un point de vente pour quelques nécessités.",
"keywords": ["Snack", "Dépannage", "Cuisine", "Nécessités"],
"image": "/placeholder-store.jpg",
"image": "/images/epicerie-snack.jpg",
"location": {
"lat": -16.3247,
"lng": -145.6247,
@ -152,7 +152,7 @@
"type": "Épiceries locales",
"description": "Les autres magasins sont plus petits et moins achalandés, mais pratiques si vous êtes loin du centre.",
"keywords": ["Petites épiceries", "Locales", "Dépannage"],
"image": "/placeholder-store.jpg",
"image": "/images/epicerie-locale.jpg",
"location": {
"lat": -16.3257,
"lng": -145.6257,

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 60 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 60 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 60 KiB

BIN
public/images/plage-1.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

BIN
public/images/plage-2.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

BIN
public/images/plage-3.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 193 KiB

BIN
public/images/plage-4.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 112 KiB

BIN
public/images/plage-5.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 193 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 112 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 142 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 118 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 124 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 124 KiB