From 2fbbd1a2849053245ca3c52694a438cbfd9c1681 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Stanislas=20Ormi=C3=A8res?= <stan@stormier.ninja>
Date: Sun, 15 Sep 2024 13:01:53 +0200
Subject: [PATCH] =?UTF-8?q?feat(DsfrFooter):=20=E2=9C=A8=20g=C3=A8re=20l?=
 =?UTF-8?q?=E2=80=99attribut=20title=20des=20liens?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fix #884
---
 src/components/DsfrFooter/DsfrFooter.types.ts |  7 +++---
 src/components/DsfrFooter/DsfrFooter.vue      | 24 ++++++++++++++-----
 2 files changed, 22 insertions(+), 9 deletions(-)

diff --git a/src/components/DsfrFooter/DsfrFooter.types.ts b/src/components/DsfrFooter/DsfrFooter.types.ts
index 730d1f7d..d3b2ac81 100644
--- a/src/components/DsfrFooter/DsfrFooter.types.ts
+++ b/src/components/DsfrFooter/DsfrFooter.types.ts
@@ -24,6 +24,7 @@ export type DsfrFooterLinkProps = {
   onClick?: ($event: MouseEvent) => void
   to?: RouteLocationRaw
   href?: string
+  title?: string
 }
 
 export type DsfrFooterLinkListProps = {
@@ -44,15 +45,15 @@ export type DsfrFooterProps = {
   descText?: string
   beforeMandatoryLinks?: DsfrFooterLinkProps[]
   afterMandatoryLinks?: DsfrFooterLinkProps[]
-  mandatoryLinks?: { label: string, to: RouteLocationRaw | undefined }[]
-  ecosystemLinks?: { label: string, href: string }[]
+  mandatoryLinks?: { label: string, to: RouteLocationRaw | undefined, title?: string }[]
+  ecosystemLinks?: { label: string, href: string, title: string, [key: string]: string }[]
   operatorLinkText?: string
   operatorTo?: RouteLocationRaw | undefined
   operatorImgStyle?: StyleValue
   operatorImgSrc?: string
   operatorImgAlt?: string
   licenceTo?: string
-  licenceLinkProps?: { href: string } | { to: RouteLocationRaw | undefined }
+  licenceLinkProps?: ({ href: string } | { to: RouteLocationRaw | undefined }) & Record<string, string>
   licenceText?: string
   licenceName?: string
 }
diff --git a/src/components/DsfrFooter/DsfrFooter.vue b/src/components/DsfrFooter/DsfrFooter.vue
index 60d8f54c..5abefd1b 100644
--- a/src/components/DsfrFooter/DsfrFooter.vue
+++ b/src/components/DsfrFooter/DsfrFooter.vue
@@ -53,18 +53,22 @@ const props = withDefaults(defineProps<DsfrFooterProps>(), {
     {
       label: 'info.gouv.fr',
       href: 'https://info.gouv.fr',
+      title: 'Informations gouvernementales, nouvelle fenêtre',
     },
     {
       label: 'service-public.fr',
       href: 'https://service-public.fr',
+      title: 'Informations et démarches administratives, nouvelle fenêtre',
     },
     {
       label: 'legifrance.gouv.fr',
       href: 'https://legifrance.gouv.fr',
+      title: 'Service public de diffusion du droit, nouvelle fenêtre',
     },
     {
       label: 'data.gouv.fr',
       href: 'https://data.gouv.fr',
+      title: 'Plateforme des données publiques, nouvelle fenêtre',
     },
   ],
   operatorLinkText: 'Revenir à l’accueil',
@@ -95,6 +99,12 @@ const isExternalLink = computed(() => {
   const to = props.licenceTo || (props.licenceLinkProps as { to: RouteLocationRaw }).to
   return to && typeof to === 'string' && to.startsWith('http')
 })
+
+const licenceLinkAttrs = computed(() => {
+  const { to, href, ...attrs } = props.licenceLinkProps ?? {}
+  return attrs
+})
+
 const routerLinkLicenceTo = computed(() => {
   return isExternalLink.value ? '' : props.licenceTo
 })
@@ -184,17 +194,19 @@ const externalOperatorLink = computed(() => {
           </p>
           <ul class="fr-footer__content-list">
             <li
-              v-for="(link, index) in ecosystemLinks"
+              v-for="({ href, label, title, ...attrs }, index) in ecosystemLinks"
               :key="index"
               class="fr-footer__content-item"
             >
               <a
                 class="fr-footer__content-link"
-                :href="link.href"
+                :href="href"
                 target="_blank"
                 rel="noopener noreferrer"
+                :title="title"
+                v-bind="attrs"
               >
-                {{ link.label }}
+                {{ label }}
               </a>
             </li>
           </ul>
@@ -225,11 +237,11 @@ const externalOperatorLink = computed(() => {
             <component
               :is="isExternalLink ? 'a' : 'RouterLink'"
               class="fr-link-licence  no-content-after"
-              :to="isExternalLink ? null : routerLinkLicenceTo"
-              :href="aLicenceHref"
+              :to="isExternalLink ? undefined : routerLinkLicenceTo"
+              :href="isExternalLink ? aLicenceHref : undefined"
               :target="isExternalLink ? '_blank' : undefined"
               rel="noopener noreferrer"
-              v-bind="licenceLinkProps"
+              v-bind="licenceLinkAttrs"
             >
               {{ licenceName }}
             </component>