@cnamts/synapse 1.0.7 → 1.0.9

package/src/stories/EcoConception/Introduction.mdx

@@ -1,24 +1,201 @@
-import { Meta, Story } from '@storybook/addon-docs';
-import * as EcoStories from './econception.stories.ts';
+import { Meta } from '@storybook/blocks';
+import '../styles/shared.css';
 
-<Meta of={EcoStories} />
+<Meta title="Éco-conception/Introduction"/>
 
-# Éco-conception
+<style>
+{
+  /* Styles globaux pour améliorer l'apparence */
+  `
+    .eco-header {
+      color: white;
+      padding: 2rem;
+      border-radius: 8px;
+      margin-bottom: 2rem;
+    }
+    
+    .eco-header h1 {
+      margin-top: 0;
+      font-size: 2.5rem;
+      font-weight: 700;
+    }
+    
+    .eco-header p {
+      font-size: 1.1rem;
+      margin-bottom: 0;
+      opacity: 0.9;
+    }
+    
+    .key-element {
+      border-left: 4px solid  #0C419A
+      padding: 1.5rem;
+      margin-bottom: 1.5rem;
+      border-radius: 4px;
+    }
+    
+    .key-element h3 {
+      color: #0C419A;
+      margin-top: 0.25em;
+    }
+    
+    .info-section {
+      background-color: #fff;
+      border-radius: 8px;
+      border: none;
+    }
+    
+    .info-section h2 {
+      padding-bottom: 0.5rem;
+      margin-top: 0;
+    }
 
-<br></br>
+    .eco-header-title {
+      color: #0C419A;
+      position: relative;
+      padding-bottom: 0.75rem;
+      display: inline-block;
+      margin-bottom: 1.5rem;
+    }
+    
+    .eco-header-title::after {
+      content: '';
+      position: absolute;
+      bottom: -2px;
+      left: 0;
+      width: 80px;
+      height: 4px;
+      background-color: #0C419A;
+      border-radius: 3px;
+    }
+    
+    .alert {
+      background-color: #E3E8F2;
+      border-left: 4px solid #0C419A;
+      padding: 1rem 1.5rem;
+      margin: 1.5rem 0;
+      border-radius: 4px;
+    }
+    
+    .alert-title {
+      color: #0C419A;
+      font-weight: 600;
+      margin: 0 0 0.5rem 0;
+      margin-bottom: 0.5rem;
+    }
+    
+    .resources-grid {
+      display: grid;
+      grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+      gap: 1.5rem;
+      margin: 2rem 0;
+    }
+    
+    .resource-card {
+      background-color: #fff;
+      border-radius: 8px;
+      padding: 1.5rem;
+      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
+      transition: transform 0.2s ease, box-shadow 0.2s ease;
+      display: flex;
+      flex-direction: column;
+    }
+    
+    .resource-card:hover {
+      transform: translateY(-2px);
+    }
+    
+    .resource-card h3 {
+      margin-top: 0;
+      color: #0C419A;
+    }
+    
+    .reference-list {
+      list-style-type: none;
+      padding-left: 0;
+      margin-top: 1rem;
+    }
+    
+    .reference-list li {
+      padding: 0.5rem 0;
+      border-bottom: 1px solid #e0e0e0;
+      display: flex;
+      align-items: center;
+    }
+    
+    .reference-list li::before {
+      content: '📋';
+      margin-right: 0.75rem;
+      font-size: 1.2rem;
+    }
 
-### L’éco-conception est une approche méthodique qui prend en considération les aspects environnementaux du processus de conception et de développement dans le but de réduire les impacts environnementaux négatifs.
+    a {
+        color: #0C419A !important; 
+    }
+  `
+}
+</style>
 
-<br></br>
+<div className="header">
+  <h1>Éco-conception</h1>
+  <p>Concevoir des services numériques plus sobres et respectueux de l'environnement</p>
+</div>
 
-##### La liste suivante énumère les points auxquels vous devez faire attention pendant la conception ainsi que le développement de votre application.
+<h2 className="eco-header-title">Qu'est-ce que l'éco-conception ?</h2>
 
-<br></br>
+<div className="info-section">
+  <p>
+    L'éco-conception consiste à intégrer des pratiques respectueuses de l'environnement dès la phase de conception d'un produit ou d'un service, puis tout au long de son cycle de vie.
+  </p>
+  
+  <div className="alert">
+    <h4 className="alert-title">Objectif principal</h4>
+    <p>Réduire la consommation de ressources informatiques et énergétiques ainsi que la contribution à l'obsolescence des équipements, qu'il s'agisse des équipements utilisateurs ou des équipements réseau ou serveur.</p>
+  </div>
+</div>
 
-<Story of={EcoStories.EcoPanel} />
+<h2 className="eco-header-title">Notre démarche</h2>
 
-<br></br>
+<div className="key-element">
+  <h3 className="eco-header-subtitle">🌱 Bonnes pratiques</h3>
+  <p>Une liste complète de bonnes pratiques par métier et en fonction de la phase du projet a été élaborée pour guider les équipes.</p>
+</div>
 
-### Évaluer son projet
+<div className="key-element">
+  <h3 className="eco-header-subtitle">📊 Critères mesurables</h3>
+  <p>Ces pratiques ont été organisées au sein de critères répondant à des finalités spécifiques et mesurables.</p>
+</div>
 
-Pour évaluer l’éco-conception de votre projet, vous pouvez utiliser [Ecoindex](http://www.ecoindex.fr/) ou [Ecometer](http://www.ecometer.org/).
+<div className="key-element">
+  <h3 className="eco-header-subtitle">🔄 Intégration aux processus</h3>
+  <p>L'organisation par phase projet respecte la réalité de l'organisation à la CNAM pour faciliter l'adoption.</p>
+</div>
+
+<h2 className="eco-header-title">Référentiels utilisés</h2>
+
+<div className="info-section">
+  <p>Cette approche s'appuie sur 7 référentiels reconnus dans le domaine de l'éco-conception numérique :</p>
+  
+  <ul className="reference-list">
+    <li><a href="https://ecoresponsable.numerique.gouv.fr/publications/referentiel-general-ecoconception/" target="_blank" rel="noopener noreferrer">RGESN (versions 2022 et 2024) </a></li>
+    <li><a href="https://gr491.isit-europe.org/" target="_blank" rel="noopener noreferrer">GR491</a></li>
+    <li><a href="https://collectif.greenit.fr/ecoconception-web/115-bonnes-pratiques-eco-conception_web.html" target="_blank" rel="noopener noreferrer">Les 115 bonnes pratiques de l'écoconception</a></li>
+    <li><a href="https://ecoresponsable.numerique.gouv.fr/publications/bonnes-pratiques/" target="_blank" rel="noopener noreferrer">Bonnes pratiques numérique responsable pour les organisations</a></li>
+    <li><a href="https://club.greenit.fr/doc/2022-06-GREENIT-Referentiel_maturite-v3.pdf" target="_blank" rel="noopener noreferrer">74 bonnes pratiques clés pour un numérique plus responsable</a></li>
+    <li><a href="https://designersethiques.org/fr/thematiques/ecoconception/guide-d-ecoconception" target="_blank" rel="noopener noreferrer">Le guide d'écoconception de services numériques</a></li>
+  </ul>
+  
+  <div className="alert" style={{ marginTop: '2rem' }}>
+    <h4 className="alert-title">À noter</h4>
+    <p>Ces bonnes pratiques sont une réponse concrète aux Principes Directeurs SI « Sobriété » et s'inscrivent dans la stratégie de responsabilité numérique de la CNAM.</p>
+  </div>
+</div>
+
+<h2 className="eco-header-title">Ressources disponibles</h2>
+
+<div className="resources-grid">
+  <div className="resource-card">
+    <h3>Référentiel</h3>
+    <p>Consultez notre référentiel complet de bonnes pratiques d'éco-conception classées par thématique.</p>
+    <a href="/?path=/docs/éco-conception-référentiel--docs" style={{ marginTop: 'auto', color: '#0C419A', textDecoration: 'none', fontWeight: '500' }}>Découvrir →</a>
+  </div>
+</div>

package/src/stories/EcoConception/Referentiel.mdx

@@ -0,0 +1,13 @@
+import { Meta, Story } from '@storybook/addon-docs';
+import * as EcoStories from './ecoconception.stories.ts';
+import '../styles/shared.css';
+
+
+<Meta title="Éco-conception/Référentiel"/>
+
+<div className="header">
+  <h1>Référentiel</h1>
+  <p>Consultez notre référentiel complet de bonnes pratiques d'éco-conception classées par thématique.</p>
+</div>
+
+<Story of={EcoStories.Referentiel} />

package/src/stories/EcoConception/datas/back_rules.json

@@ -0,0 +1,184 @@
+[
+    {
+      "numero": 19,
+      "theme": "4.4.2 Conception des algorithmes",
+      "finalite3mots": "Méthodologie facilitant l'écoconception",
+      "criteres": "Appliquer des méthodes d’écoconception dans la méthodologie projet",
+      "actions": "Concevoir le service avec une revue de conception et une revue de code pour réduire les impacts environnementaux de chaque fonctionnalité.",
+      "principes_directeurs": "Permettre de réduire l’empreinte carbone du logiciel en optimisant les ressources nécessaires à son exécution (infrastructure, mémoire, CPU, espace de stockage, réseau) et sa maintenance.",
+      "statuts": null,
+      "principe_finalite": "Piloter l'empreinte environnementale des projets : Appliquer des méthodes facilitant la prise en compte de l'eco-conception dans les projets",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 38,
+      "theme": "4.4.2 Conception des algorithmes",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Optimiser les traitements \"lourds\" coté serveur",
+      "actions": "Optimiser les requêtes aux bases de données",
+      "principes_directeurs": "Permettre de réduire l’empreinte carbone du logiciel en optimisant les ressources nécessaires à son exécution (infrastructure, mémoire, CPU, espace de stockage, réseau) et sa maintenance.",
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 75,
+      "theme": "4.4.4 Réduction de la consommation des ressources matérielles",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Favoriser les traitements asynchrones",
+      "actions": "Proposer un traitement asynchrone lorsque c'est possible.",
+      "principes_directeurs": "Permettre d’optimiser le parcours utilisateur et de fabriquer l’IHM au « stricte » niveau de fonctionnalités attendues par les utilisateurs finaux avec une conception,  fabrication et ergonomie intégrant les recommandations du « Guide d’Ecoconception ».",
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 78,
+      "theme": "4.4.7 Réduction des requêtes et interactions réseau",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Mettre en place un « Circuit breaker ».   ",
+      "actions": "Mettre en place un « Circuit breaker ».   ",
+      "principes_directeurs": "Diminution de la consommation énergétique et de notre empreinte carbone\n",
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  terminal utilisateur, réseau et  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 90,
+      "theme": "4.4.2 Conception des algorithmes",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Optimiser les traitements \"lourds\" coté serveur",
+      "actions": "Mettre en cache les données calculées souvent utilisées.",
+      "principes_directeurs": null,
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 91,
+      "theme": "4.4.7 Réduction des requêtes et interactions réseau",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Optimiser le poids des échanges \"client/serveur\"",
+      "actions": "Configurer le service pour transmettre depuis le serveur des contenus compressés au client qui les accepte.",
+      "principes_directeurs": "Permettre de réduire l’empreinte carbone du logiciel en optimisant les ressources nécessaires à son exécution (infrastructure, mémoire, CPU, espace de stockage, réseau) et sa maintenance.",
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  terminal utilisateur, réseau et  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 93,
+      "theme": "4.4.9 Simplicité et efficacité du stockage des données",
+      "finalite3mots": "Moins d'infrastructure IT nécessaire",
+      "criteres": "Minimiser le besoin en terme de stockage de données",
+      "actions": "Archiver ou supprimer les données et documents après expiration de leur durée de conservation.",
+      "principes_directeurs": null,
+      "statuts": null,
+      "principe_finalite": null,
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 96,
+      "theme": "4.4.2 Conception des algorithmes",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Optimiser les traitements \"lourds\" coté serveur",
+      "actions": "Éviter d'effectuer des requêtes SQL à l’intérieur d’une boucle.",
+      "principes_directeurs": null,
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 97,
+      "theme": "4.4.2 Conception des algorithmes",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Optimiser les traitements \"lourds\" coté serveur",
+      "actions": "Ne se connecter à une base de données que si nécessaire.",
+      "principes_directeurs": null,
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 114,
+      "theme": "4.4.8 Suivi des performances environnementales",
+      "finalite3mots": "Méthodologie facilitant l'écoconception",
+      "criteres": "Suivre les impacts du service numérique",
+      "actions": "Mettre en place des mesures comparatives d’impact de Back de l'application lors d’une montée de version ou un remplacement d’application",
+      "principes_directeurs": "Permettre de réduire l’empreinte carbone du logiciel en optimisant les ressources nécessaires à son exécution (infrastructure, mémoire, CPU, espace de stockage, réseau) et sa maintenance.",
+      "statuts": null,
+      "principe_finalite": "Piloter l'empreinte environnementale des projets : Appliquer des méthodes facilitant la prise en compte de l'eco-conception dans les projets",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 115,
+      "theme": "4.4.2 Conception des algorithmes",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Paramétrer de manière optimal coté serveur",
+      "actions": "Définir le bon niveau d'index en lien avec les fonctionnalités développées",
+      "principes_directeurs": "Permettre de réduire l’empreinte carbone du logiciel en optimisant les ressources nécessaires à son exécution (infrastructure, mémoire, CPU, espace de stockage, réseau) et sa maintenance.",
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 127,
+      "theme": "4.4.6 Réduction des dépendances logicielles",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Optimiser les traitements \"lourds\" coté serveur",
+      "actions": "Gestion de la dette technique",
+      "principes_directeurs": null,
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 128,
+      "theme": "4.4.4 Réduction de la consommation des ressources matérielles",
+      "finalite3mots": "Réduire la consommation de ressources : La solution intègre des pratiques d'écoconception",
+      "criteres": "Optimiser les traitements \"lourds\" coté serveur",
+      "actions": "Compilation native",
+      "principes_directeurs": null,
+      "statuts": null,
+      "principe_finalite": "La solution intègre des pratiques d'écoconception : Minimiser la consommation de ressources  serveur pour ce service numérique",
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    },
+    {
+      "numero": 129,
+      "theme": "4.4.4 Réduction de la consommation des ressources matérielles",
+      "finalite3mots": null,
+      "criteres": null,
+      "actions": "Disposer d'une offre d'hébergement des batchs permettant une adaptabilité en fonction du besoin en ressources (mise à l'échelle, augmentation et diminution)",
+      "principes_directeurs": null,
+      "statuts": null,
+      "principe_finalite": null,
+      "evaluation_type": null,
+      "evaluation_description": null,
+      "precisions": null
+    }
+  ]