add(blockRenderer): add blockRenderer component to add link open to a new page

next/app/prog/village/page.js

@@ -1,38 +1,38 @@
-import Empty from "@/components/empty";
-import styles from "./style.module.scss";
-import getData from "@/api";
-import ImageBlock from "@/components/imageBlock";
-import { BlocksRenderer } from "@strapi/blocks-react-renderer";
-import TimeSlot from "@/components/timeSlot";
-export const dynamic = "force-dynamic";
+import getData from '@/api';
+import BlockRenderer from '@/components/blockRenderer';
+import Empty from '@/components/empty';
+import ImageBlock from '@/components/imageBlock';
+import TimeSlot from '@/components/timeSlot';
+import styles from './style.module.scss';
+export const dynamic = 'force-dynamic';
 
 export async function generateMetadata() {
-  const site = await getData("site", {
+  const site = await getData('site', {
     populate: {
       edition: {
         populate: {
           flyer: {
             fields: [
-              "name",
-              "url",
-              "alternativeText",
-              "caption",
-              "width",
-              "height",
+              'name',
+              'url',
+              'alternativeText',
+              'caption',
+              'width',
+              'height',
             ],
           },
           programs: true,
         },
-        fields: ["id", "introduction", "title", "subtitle"],
+        fields: ['id', 'introduction', 'title', 'subtitle'],
       },
     },
-    fields: ["author"],
+    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 village = programs?.filter((e) => e.attributes.type === "village")[0];
+  const village = programs?.filter((e) => e.attributes.type === 'village')[0];
 
   return village
     ? {
@@ -40,7 +40,7 @@ export async function generateMetadata() {
         title: village.attributes.title,
         description: village.attributes.description,
         alternates: {
-          canonical: "/prog/village",
+          canonical: '/prog/village',
         },
         openGraph: {
           title: village.attributes.title,
@@ -52,29 +52,29 @@ export async function generateMetadata() {
             height: flyer.height,
           },
           authors: [site.data.attributes.author],
-          type: "website",
-          locale: "fr_FR",
-          siteName: "Le Fefan - Festival de Fanfares",
+          type: 'website',
+          locale: 'fr_FR',
+          siteName: 'Le Fefan - Festival de Fanfares',
         },
       }
     : {};
 }
 
 export default async function Village() {
-  const site = await getData("site", {
+  const site = await getData('site', {
     populate: {
       edition: {
         populate: {
           programs: {
             populate: {
               sticker: {
-                fields: ["alternativeText", "url"],
+                fields: ['alternativeText', 'url'],
               },
               bands: {
-                fields: ["*"],
+                fields: ['*'],
               },
               time_slots: {
-                fields: ["*"],
+                fields: ['*'],
               },
             },
           },
@@ -85,7 +85,7 @@ export default async function Village() {
   const edition = site.data?.attributes.edition ?? {};
   const program =
     edition.data?.attributes.programs.data.filter(
-      ({ attributes: r }) => r.type === "village"
+      ({ attributes: r }) => r.type === 'village',
     )[0] ?? {};
   const time_slots = program.attributes?.time_slots.data ?? [];
 
@@ -93,11 +93,11 @@ export default async function Village() {
     <main className={styles.main}>
       {program.attributes ? (
         <>
-          <h2>{program.attributes?.title ?? "Le Village"}</h2>
+          <h2>{program.attributes?.title ?? 'Le Village'}</h2>
           <section className={styles.villageSection}>
             <article>
               {program.attributes?.introduction ? (
-                <BlocksRenderer content={program.attributes.introduction} />
+                <BlockRenderer content={program.attributes.introduction} />
               ) : null}
             </article>
             {program.attributes?.sticker?.data ? (