137 lines
3.9 KiB
JavaScript
137 lines
3.9 KiB
JavaScript
import getData from "@/api";
|
|
import styles from "./style.module.scss";
|
|
import Fanfare from "@/components/fanfare";
|
|
import TimeSlot from "@/components/timeSlot";
|
|
import Empty from "@/components/empty";
|
|
export const dynamic = "force-dynamic";
|
|
|
|
export async function generateMetadata() {
|
|
const site = await getData("site", {
|
|
populate: {
|
|
edition: {
|
|
populate: {
|
|
flyer: {
|
|
fields: [
|
|
"name",
|
|
"url",
|
|
"alternativeText",
|
|
"caption",
|
|
"width",
|
|
"height",
|
|
],
|
|
},
|
|
programs: true,
|
|
},
|
|
fields: ["id", "introduction", "title", "subtitle"],
|
|
},
|
|
},
|
|
fields: ["author"],
|
|
});
|
|
const current_edition = site.data?.attributes.edition.data?.attributes;
|
|
const flyer =
|
|
site.data?.attributes.edition.data?.attributes.flyer.data.attributes;
|
|
const programs = current_edition?.programs.data;
|
|
const cityWide = programs?.filter(
|
|
(e) => e.attributes.type === "city-wide"
|
|
)[0];
|
|
|
|
return cityWide
|
|
? {
|
|
metadataBase: `${process.env.NEXT_PUBLIC_ORIGIN}`,
|
|
title: cityWide.attributes.title,
|
|
description: cityWide.attributes.description,
|
|
alternates: {
|
|
canonical: "/prog/city-wide",
|
|
},
|
|
openGraph: {
|
|
title: cityWide.attributes.title,
|
|
url: `${process.env.NEXT_PUBLIC_ORIGIN}/prog/city-wide`,
|
|
description: cityWide.attributes.description,
|
|
images: {
|
|
url: `${process.env.NEXT_PUBLIC_IMG_URI}${flyer.url}`,
|
|
width: flyer.width,
|
|
height: flyer.height,
|
|
},
|
|
authors: [site.data.attributes.author],
|
|
type: "website",
|
|
locale: "fr_FR",
|
|
siteName: "Le Fefan - Festival de Fanfares",
|
|
},
|
|
}
|
|
: {};
|
|
}
|
|
|
|
export default async function CityWide() {
|
|
const site = await getData("site", {
|
|
populate: {
|
|
edition: {
|
|
populate: {
|
|
programs: {
|
|
populate: {
|
|
bands: {
|
|
fields: ["*"],
|
|
},
|
|
time_slots: {
|
|
fields: ["*"],
|
|
},
|
|
},
|
|
},
|
|
},
|
|
},
|
|
},
|
|
});
|
|
const edition = site.data?.attributes.edition ?? {};
|
|
const program =
|
|
edition.data?.attributes.programs.data.filter(
|
|
({ attributes: r }) => r.type === "city-wide"
|
|
)[0] ?? {};
|
|
const time_slots = program.attributes?.time_slots.data ?? [];
|
|
|
|
return (
|
|
<main className={styles.main}>
|
|
{program.attributes ? (
|
|
<>
|
|
<h2>{program.attributes.title}</h2>
|
|
<section className={styles.program}>
|
|
{time_slots.map(({ id, attributes: attr }) => {
|
|
return (
|
|
<TimeSlot
|
|
key={id}
|
|
content={attr.content}
|
|
start={attr.start}
|
|
end={attr.end}
|
|
/>
|
|
);
|
|
})}
|
|
</section>
|
|
<section className={styles.program}>
|
|
<article className={styles.featuring}>
|
|
{program.attributes.bands.data.length === 0 ? null : (
|
|
<h3>Les Fanfares</h3>
|
|
)}
|
|
<p className={styles.introduction}>
|
|
{program.attributes.description}
|
|
</p>
|
|
{program.attributes.bands.data.map(({ id, attributes: attr }) => {
|
|
return (
|
|
<Fanfare key={id} location={attr.location} name={attr.name} />
|
|
);
|
|
})}
|
|
</article>
|
|
<iframe
|
|
className={styles.map}
|
|
src={program.attributes.map_uri}
|
|
width={640}
|
|
height={480}
|
|
></iframe>
|
|
</section>
|
|
|
|
<section className={styles.program}></section>
|
|
</>
|
|
) : (
|
|
<Empty message="Pas de programmation à afficher pour le moment"></Empty>
|
|
)}
|
|
</main>
|
|
);
|
|
}
|