Filtrer les dates passées et afficher les prochaines dates avant la galerie sur la page spectacle

This commit is contained in:
Jalil Arfaoui 2026-03-09 17:30:46 +01:00
parent 7c631be667
commit 12846c0f3a

View file

@ -43,6 +43,9 @@ if (liveStory) {
if (!spectacle) { if (!spectacle) {
return Astro.redirect('/spectacles/'); return Astro.redirect('/spectacles/');
} }
const now = new Date();
upcomingDates = upcomingDates.filter(event => new Date(event.date) >= now);
--- ---
<Layout title={`${spectacle.title} — Compagnie AspiRêves`}> <Layout title={`${spectacle.title} — Compagnie AspiRêves`}>
@ -118,28 +121,9 @@ if (!spectacle) {
</div> </div>
</div> </div>
<!-- Gallery -->
{spectacle.gallery.length > 0 && (
<section class="fade-up mb-16 md:mb-24">
<h2 class="font-display text-3xl md:text-5xl text-night mb-8 md:mb-12 text-center">Galerie</h2>
<div class="columns-1 sm:columns-2 gap-6 md:gap-8">
{spectacle.gallery.map((img, index) => (
<div class="mb-6 md:mb-8 break-inside-avoid overflow-hidden rounded-2xl md:rounded-3xl shadow-xl shadow-night/5 border-4 border-white">
<img
src={img}
alt={`${spectacle.title} - photo ${index + 1}`}
class="w-full h-auto"
referrerpolicy="no-referrer"
/>
</div>
))}
</div>
</section>
)}
<!-- Upcoming dates --> <!-- Upcoming dates -->
{upcomingDates.length > 0 && ( {upcomingDates.length > 0 && (
<section class="fade-up"> <section class="fade-up mb-16 md:mb-24">
<h2 class="font-display text-3xl md:text-5xl text-night mb-8 md:mb-12 text-center">Prochaines dates</h2> <h2 class="font-display text-3xl md:text-5xl text-night mb-8 md:mb-12 text-center">Prochaines dates</h2>
<div class="space-y-4 max-w-2xl mx-auto"> <div class="space-y-4 max-w-2xl mx-auto">
{upcomingDates.map(event => { {upcomingDates.map(event => {
@ -180,6 +164,25 @@ if (!spectacle) {
</div> </div>
</section> </section>
)} )}
<!-- Gallery -->
{spectacle.gallery.length > 0 && (
<section class="fade-up">
<h2 class="font-display text-3xl md:text-5xl text-night mb-8 md:mb-12 text-center">Galerie</h2>
<div class="columns-1 sm:columns-2 gap-6 md:gap-8">
{spectacle.gallery.map((img, index) => (
<div class="mb-6 md:mb-8 break-inside-avoid overflow-hidden rounded-2xl md:rounded-3xl shadow-xl shadow-night/5 border-4 border-white">
<img
src={img}
alt={`${spectacle.title} - photo ${index + 1}`}
class="w-full h-auto"
referrerpolicy="no-referrer"
/>
</div>
))}
</div>
</section>
)}
</div> </div>
</div> </div>
</Layout> </Layout>