Merge pull request #1854 from BaseAdresseNationale/vsagniez/page-csv

[refonte]Ajout page format .csv

public/markdown/format-csv.md

@@ -0,0 +1,23 @@
+---
+title: Format CSV
+
+---
+
+## Format .csv pour un usage classique
+
+Emprise : nationale et départementale
+Schéma des données “Adresses” au format CSV
+Le séparateur point-virgule et l'encodage UTF-8 sont utilisés. 
+
+[Schéma de données](https://github.com/BaseAdresseNationale/adresse.data.gouv.fr/blob/master/public/schemas/adresses-csv.md)
+
+Le contenu de ce fichier est optimisé pour satisfaire la majorité des usages. 
+Cependant, il ne met pas à disposition l'intégralité des informations présentes dans la BAN. 
+En particulier : 
+- une seule position par adresse est servie
+- la dénomination est présentée en une seule langue
+- Les évolutions sur les nouveaux Idban ne peuvent être intégrées dans ce fichier sans briser la rétrocompatibilité. 
+
+Deux versions temporaires des fichiers sont donc également mis à disposition pour récupérer ces éléments : 
+- Un fichier csv intégrant les nouveaux id BAN : csv-with-ids
+- Un fichier csv département au format BAL intégrant les noms en langues régionales : csv-bal-with-lang

src/app/outils/telechargements/format-csv/page.styled.tsx

@@ -0,0 +1,24 @@
+'use client'
+import styled from 'styled-components'
+
+export const TextWrapper = styled.div`
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items: flex-start;
+    gap: 1rem;
+
+    article {
+      flex: 65;
+      min-width: 600px;
+
+      img {
+        max-width: 100%;
+      }
+    }
+
+    aside {
+      flex: 35;
+      min-width: 300px;
+    }
+`

src/app/outils/telechargements/format-csv/page.tsx

@@ -0,0 +1,41 @@
+import { Suspense } from 'react'
+import { CallOut } from '@codegouvfr/react-dsfr/CallOut'
+
+import Section from '@/components/Section'
+import HtmlViewer from '@/components/HtmlViewer'
+import { getMarkdown } from '@/lib/markdown'
+import type { DataType } from '@/lib/markdown'
+import Breadcrumb from '@/layouts/Breadcrumb'
+
+import { TextWrapper } from './page.styled'
+
+export default async function formatCSV() {
+  const { contentHtml, data }: { contentHtml?: string, data?: DataType } = await getMarkdown('format-csv') || {}
+
+  return (
+    <>
+      <Section>
+        <TextWrapper>
+          <Suspense fallback={<p>Chargement...</p>}>
+            <article>
+              {contentHtml && <HtmlViewer html={contentHtml} />}
+            </article>
+            {
+              data?.aside && (
+                <aside>{data?.aside?.map(
+                  ({ data }) =>
+                    data?.contentHtml && (
+                      <CallOut key={`${data?.data?.title}`}>
+                        <HtmlViewer html={data?.contentHtml} />
+                      </CallOut>
+                    )
+                )}
+                </aside>
+              )
+            }
+          </Suspense>
+        </TextWrapper>
+      </Section>
+    </>
+  )
+}

src/app/outils/telechargements/page.tsx

@@ -66,6 +66,7 @@ export default async function PageDownloadBan() {
                     <li>Fichier d’usage général recommandé dans la majorité des cas</li>
                     <li>Couverture nationale</li>
                     <li>Une position par adresse</li>
+                    <li><a href="telechargements/format-csv">En savoir plus</a></li>
                   </ul>
                 </>
               )}