feat: display responsible

src/components/MarkdownDisplay.astro

@@ -3,7 +3,7 @@ import { getLangFromUrl, useTranslations } from "@i18n/utils";
 import { formatDate } from "@js/utils";
 import type { CollectionEntry } from "astro:content";
 import Card from "./Card";
-import FichesMetasDisplay from "./FichesMetasDisplay.astro";
+import FichesMetasDisplay from "./fiches/FichesMetasDisplay.astro";
 import FichesTableValidation from "./fiches/FichesTableValidation.astro";
 
 const REF_NAME = process.env.PUBLIC_REF_NAME;

src/components/MetaItem.astro

@@ -4,17 +4,37 @@ import {
   getLangFromUrl,
   useTranslations,
 } from "@i18n/utils";
+import { getEntry } from "astro:content";
 
 const {
   frontmatter,
   meta,
   fontSize = "normal",
   displayTitle = false,
+  collectionType = undefined,
+  collectionTypeMeta = undefined,
 } = Astro.props;
 const values = frontmatter[meta];
 const toDisplay = values;
 const lang = getLangFromUrl(Astro.url);
 const t = useTranslations(lang);
+
+const PUBLIC_BASE =
+  import.meta.env.PUBLIC_BASE || process.env.PUBLIC_BASE
+    ? (import.meta.env.PUBLIC_BASE || process.env.PUBLIC_BASE) + "/"
+    : "";
+
+const getDatas = async ({ collectionType, item, meta, collectionTypeMeta }) => {
+  const id = item[meta]
+    .replace(`src/content/${collectionType}/`, "")
+    .replace(".mdx", "");
+  const o: any = await getEntry(collectionType, id);
+  const [lang, ...slug] = o.slug.split("/");
+  return {
+    label: o.data[collectionTypeMeta],
+    path: `/${PUBLIC_BASE}${lang}/${collectionType}/${slug}`,
+  };
+};
 ---
 
 {
@@ -32,7 +52,25 @@ const t = useTranslations(lang);
         <strong>{capitalizeFirstLetter(t(meta))} : </strong>
       )}
       <ul class="mb-0">
-        {toDisplay.map((item, index) => {
+        {toDisplay.map(async (item, index) => {
+          console.log(item !== null && typeof item === "object");
+          if (item !== null && typeof item === "object") {
+            const value = await getDatas({
+              meta,
+              collectionType,
+              collectionTypeMeta,
+              item,
+            });
+            return (
+              <li
+                class="my-2 max-h-5 whitespace-nowrap p-0 leading-4"
+                data-pagefind-filter="tags[data-content]"
+                data-content={`${capitalizeFirstLetter(meta.replace("_", " "))} → ${value.label}`}
+              >
+                → <a href={value.path}>{value.label}</a>
+              </li>
+            );
+          }
           return (
             <li
               class="my-2 max-h-5 whitespace-nowrap p-0 leading-4"

src/components/FichesMetasDisplay.astro → src/components/fiches/FichesMetasDisplay.astro

@@ -1,6 +1,6 @@
 ---
 import { getLangFromUrl, useTranslations } from "@i18n/utils";
-import MetaItem from "./MetaItem.astro";
+import MetaItem from "../MetaItem.astro";
 
 type Props = {
   className?: string;
@@ -48,7 +48,14 @@ const t = useTranslations(lang);
     />
     {/* <MetaItem frontmatter={frontmatter} meta="people" displayTitle /> */}
     {/* <MetaItem frontmatter={frontmatter} meta="state_validation" /> */}
-    {/* <MetaItem frontmatter={frontmatter} meta="responsible" /> */}
+    <MetaItem
+      frontmatter={frontmatter}
+      meta="responsible"
+      collectionType="personas"
+      collectionTypeMeta="shortName"
+      displayTitle
+      fontSize="sm"
+    />
   </ul>
   <div
     class="border-t-2 border-neutral-transparent md:border-r-2 lg:border-t-2"

src/content/config.ts

@@ -52,6 +52,7 @@ const personas = defineCollection({
   schema: ({ image }) =>
     z.object({
       title: z.string(),
+      shortName: z.string(),
       createdAt: z.date(),
       updatedAt: z.date(),
       published: z.boolean().optional(),

src/content/personas/fr/codeuseur-developpeuser.mdx

@@ -1,5 +1,6 @@
 ---
 title: Code(use·ur) → Développeu·se·r
+shortName: DEV
 createdAt: 2024-01-20T13:45:26.018Z
 updatedAt: 2024-01-25T11:44:07.991Z
 language: fr
@@ -10,11 +11,11 @@ published: true
 
 ## Profil :
 
-* Vous devez réaliser un site web (ou un site e-commerce) pour votre entreprise (ou pour un de vos clients) et vous ou ce dernier avez conscience que l'impact du numérique n'est pas nul ([4% de la production de GES mondial](https://www.greenit.fr/etude-empreinte-environnementale-du-numerique-mondial/)) ;
-* Vous devez délivrer vite tout en gardant sous contrôle autant que possible les impacts environnementaux ;
-* Vous avez besoin des bonnes informations rapidement et qu'elles soient applicables sans vous écarter de votre devis ;
-* Vous voulez connaître tous les points à vérifier, de l'installation à la livraison ;
-* Vous êtes un développeur mais vous ne savez pas ce qui a un impact ni comment le réduire. Vous venez donc chercher des informations.
+- Vous devez réaliser un site web (ou un site e-commerce) pour votre entreprise (ou pour un de vos clients) et vous ou ce dernier avez conscience que l'impact du numérique n'est pas nul ([4% de la production de GES mondial](https://www.greenit.fr/etude-empreinte-environnementale-du-numerique-mondial/)) ;
+- Vous devez délivrer vite tout en gardant sous contrôle autant que possible les impacts environnementaux ;
+- Vous avez besoin des bonnes informations rapidement et qu'elles soient applicables sans vous écarter de votre devis ;
+- Vous voulez connaître tous les points à vérifier, de l'installation à la livraison ;
+- Vous êtes un développeur mais vous ne savez pas ce qui a un impact ni comment le réduire. Vous venez donc chercher des informations.
 
 ## Catégorisation :
 
@@ -30,7 +31,7 @@ Ne vous inquiétez pas, il y aura une solution pour chaque profil. Il y en a une
 
 **Consultez les autres profils :**
 
-* [No-code → Madame et Monsieur tout le monde](./no-code-madame-et-monsieur-tout-le-monde)
-* [Low-code → Freelance et développeur Front-End d'agences](./low-code-freelance-et-developpeur-front-end-d-agences)
-* [Designeu(se·r)](./designeuser)
-* [Code(use·ur) → Développeu·se·r](./codeuseur-developpeuser)
+- [No-code → Madame et Monsieur tout le monde](./no-code-madame-et-monsieur-tout-le-monde)
+- [Low-code → Freelance et développeur Front-End d'agences](./low-code-freelance-et-developpeur-front-end-d-agences)
+- [Designeu(se·r)](./designeuser)
+- [Code(use·ur) → Développeu·se·r](./codeuseur-developpeuser)

src/content/personas/fr/designeuser.mdx

@@ -1,5 +1,6 @@
 ---
 title: Designeu(se·r)
+shortName: UX/UI
 createdAt: 2024-01-21T15:37:54.981Z
 updatedAt: 2024-01-25T11:44:47.624Z
 language: fr
@@ -10,10 +11,10 @@ published: true
 
 ## Profil :
 
-* Vous devez réaliser un site web (ou un site e-commerce) pour votre entreprise (ou pour un de vos clients) et vous ou ce dernier avez conscience que l'impact du numérique n'est pas nul ([4% de la production de GES mondial](https://www.greenit.fr/etude-empreinte-environnementale-du-numerique-mondial/)) ;
-* Vous devez délivrer vite tout en gardant sous contrôle autant que possible les impacts environnementaux ;
-* Vous avez besoin des bonnes informations rapidement et qu'elles soient applicables sans vous écarter de votre devis ;
-* Vous voulez connaître tous les points à vérifier, de la conception des wireframes, lors de la phase de maquettage du site, à la livraison des assets aux développeurs ;
+- Vous devez réaliser un site web (ou un site e-commerce) pour votre entreprise (ou pour un de vos clients) et vous ou ce dernier avez conscience que l'impact du numérique n'est pas nul ([4% de la production de GES mondial](https://www.greenit.fr/etude-empreinte-environnementale-du-numerique-mondial/)) ;
+- Vous devez délivrer vite tout en gardant sous contrôle autant que possible les impacts environnementaux ;
+- Vous avez besoin des bonnes informations rapidement et qu'elles soient applicables sans vous écarter de votre devis ;
+- Vous voulez connaître tous les points à vérifier, de la conception des wireframes, lors de la phase de maquettage du site, à la livraison des assets aux développeurs ;
 
 ## Vous vous retrouvez dans ces affirmations :
 
@@ -29,7 +30,7 @@ Ne vous inquiétez pas, il y aura une solution pour chaque profil. Il y en a une
 
 **Consultez les autres profils :**
 
-* [No-code → Madame et Monsieur tout le monde](./no-code-madame-et-monsieur-tout-le-monde)
-* [Low-code → Freelance et développeur Front-End d'agences](./low-code-freelance-et-developpeur-front-end-d-agences)
-* [Designeu(se·r)](./designeuser)
-* [Code(use·ur) → Développeu·se·r](./codeuseur-developpeuser)
+- [No-code → Madame et Monsieur tout le monde](./no-code-madame-et-monsieur-tout-le-monde)
+- [Low-code → Freelance et développeur Front-End d'agences](./low-code-freelance-et-developpeur-front-end-d-agences)
+- [Designeu(se·r)](./designeuser)
+- [Code(use·ur) → Développeu·se·r](./codeuseur-developpeuser)

src/content/personas/fr/low-code-freelance-et-developpeur-front-end-d-agences.mdx

@@ -1,5 +1,6 @@
 ---
 title: Low-code → Freelance et développeur Front-End d'agences
+shortName: Low-code
 createdAt: 2024-01-21T15:38:48.370Z
 updatedAt: 2024-01-25T11:45:14.388Z
 language: fr
@@ -10,11 +11,11 @@ published: true
 
 ### Profil :
 
-* Vous devez réaliser un site web (ou un site e-commerce) pour vous ou pour un de vos clients et vous ou ce dernier avez conscience que l'impact du numérique n'est pas nul ([4% de la production de GES mondial](https://www.greenit.fr/etude-empreinte-environnementale-du-numerique-mondial/)) ;
-* Vous devez délivrer vite tout en gardant sous contrôle autant que possible les impacts environnementaux ;
-* Vous avez besoin des bonnes informations rapidement et qu'elles soient applicables sans vous écarter de votre devis ;
-* Vous voulez connaître tous les points à checker, de la conception à la livraison ;
-* Vous n'êtes pourtant pas un développeur, vous avez donc besoin d'informations adaptées et compréhensibles.
+- Vous devez réaliser un site web (ou un site e-commerce) pour vous ou pour un de vos clients et vous ou ce dernier avez conscience que l'impact du numérique n'est pas nul ([4% de la production de GES mondial](https://www.greenit.fr/etude-empreinte-environnementale-du-numerique-mondial/)) ;
+- Vous devez délivrer vite tout en gardant sous contrôle autant que possible les impacts environnementaux ;
+- Vous avez besoin des bonnes informations rapidement et qu'elles soient applicables sans vous écarter de votre devis ;
+- Vous voulez connaître tous les points à checker, de la conception à la livraison ;
+- Vous n'êtes pourtant pas un développeur, vous avez donc besoin d'informations adaptées et compréhensibles.
 
 ### Vous vous retrouvez dans ces affirmations :
 
@@ -30,7 +31,7 @@ Ne vous inquiétez pas, il y aura une solution pour chaque profil. Il y en a une
 
 **Consultez les autres profils :**
 
-* [No-code → Madame et Monsieur tout le monde](./no-code-madame-et-monsieur-tout-le-monde)
-* [Low-code → Freelance et développeur Front-End d'agences](./low-code-freelance-et-developpeur-front-end-d-agences)
-* [Designeu(se·r)](./designeuser)
-* [Code(use·ur) → Développeu·se·r](./codeuseur-developpeuser)
+- [No-code → Madame et Monsieur tout le monde](./no-code-madame-et-monsieur-tout-le-monde)
+- [Low-code → Freelance et développeur Front-End d'agences](./low-code-freelance-et-developpeur-front-end-d-agences)
+- [Designeu(se·r)](./designeuser)
+- [Code(use·ur) → Développeu·se·r](./codeuseur-developpeuser)

src/content/personas/fr/no-code-madame-et-monsieur-tout-le-monde.mdx

@@ -1,5 +1,6 @@
 ---
 title: No-code → Madame et Monsieur tout le monde
+shortName: Non DEV
 createdAt: 2024-01-21T15:39:39.157Z
 updatedAt: 2024-01-25T11:45:39.769Z
 language: fr
@@ -10,8 +11,8 @@ published: true
 
 ## Profil :
 
-* Vous devez réaliser un site web (ou un site e-commerce) vous avez conscience que l'impact du numérique n'est pas nul ([4% de la production de GES mondial](https://www.greenit.fr/etude-empreinte-environnementale-du-numerique-mondial/)) ;
-* Vous avez besoin d'informations, mais vous n'êtes développeur ou en tout cas pas un expert du développement web. Vous avez donc besoin d'informations adaptées et compréhensibles.
+- Vous devez réaliser un site web (ou un site e-commerce) vous avez conscience que l'impact du numérique n'est pas nul ([4% de la production de GES mondial](https://www.greenit.fr/etude-empreinte-environnementale-du-numerique-mondial/)) ;
+- Vous avez besoin d'informations, mais vous n'êtes développeur ou en tout cas pas un expert du développement web. Vous avez donc besoin d'informations adaptées et compréhensibles.
 
 ### Vous vous retrouvez dans ces affirmations :
 
@@ -28,7 +29,7 @@ Ne vous inquiétez pas, il y aura une solution pour chaque profil. Il y en a une
 
 **Consultez les autres profils :**
 
-* [No-code → Madame et Monsieur tout le monde](./no-code-madame-et-monsieur-tout-le-monde)
-* [Low-code → Freelance et développeur Front-End d'agences](./low-code-freelance-et-developpeur-front-end-d-agences)
-* [Designeu(se·r)](./designeuser)
-* [Code(use·ur) → Développeu·se·r](./codeuseur-developpeuser)
+- [No-code → Madame et Monsieur tout le monde](./no-code-madame-et-monsieur-tout-le-monde)
+- [Low-code → Freelance et développeur Front-End d'agences](./low-code-freelance-et-developpeur-front-end-d-agences)
+- [Designeu(se·r)](./designeuser)
+- [Code(use·ur) → Développeu·se·r](./codeuseur-developpeuser)

src/i18n/ui.ts

@@ -2,8 +2,6 @@ function getTranslatedTitle(lang: string, key: string = "short") {
   const SITE_TITLE: object = JSON.parse(
     import.meta.env.PUBLIC_SITE_TITLE || process.env.SITE_TITLE,
   );
-  console.log(SITE_TITLE);
-
   return `${SITE_TITLE[lang][key] || SITE_TITLE[defaultLang][key] || "TBD"}`;
 }
 
@@ -146,12 +144,6 @@ export const ui = {
     seo: "SEO",
     storage: "Stockage",
     "videos-sounds": "Vidéos/Audios",
-    // Responsible
-    responsible: "Responsable",
-    developer: "Code(use·ur) → Développeu·se·r",
-    designer: "Designeu(se·r)",
-    lowcode: "Low-code → Freelance et développeur Front-End d'agence",
-    nocode: "No-code → Madame et Monsieur tout le monde",
     // Lifecycle
     lifecycle: "Cycle de vie",
     "1-analyse-of-needs": "1. Analyse des besoins",
@@ -303,12 +295,6 @@ export const ui = {
     seo: "SEO",
     storage: "Stockage",
     "videos-sounds": "Vidéos/Audios",
-    // Responsible
-    responsible: "Responsable",
-    developer: "Code(use·ur) → Développeu·se·r",
-    designer: "Designeu(se·r)",
-    lowcode: "Low-code → Freelance et développeur Front-End d'agence",
-    nocode: "No-code → Madame et Monsieur tout le monde",
     // Lifecycle
     lifecycle: "Cycle de vie",
     "1-analyse-of-needs": "1. Analyse des besoins",
@@ -442,6 +428,7 @@ export const ui = {
 
     // src/components/FichesMetasDisplay.astro
     "Sommaire :": "Sommaire :",
+    responsible: "Responsable(s)",
 
     // src/components/LanguagePicker.astro
     "Language picker": "Sélecteur de langue",
@@ -461,12 +448,6 @@ export const ui = {
     seo: "SEO",
     storage: "Stockage",
     "videos-sounds": "Vidéos/Audios",
-    // Responsible
-    responsible: "Responsable",
-    developer: "Code(use·ur) → Développeu·se·r",
-    designer: "Designeu(se·r)",
-    lowcode: "Low-code → Freelance et développeur Front-End d'agence",
-    nocode: "No-code → Madame et Monsieur tout le monde",
     // Lifecycle
     lifecycle: "Cycle de vie",
     "1-analyse-of-needs": "1. Analyse des besoins",