[prod:ecologie:minor] Release prod 20250221-1 #672

Release ecologie prod 20250221

configs/defis/config.yaml

@@ -228,6 +228,8 @@ website:
     display: false
     content: Notice avec un [lien beta](/beta) et du _style_
     closeable: false
+  # debounce high enough for accessibility (screen readers will announce results)
+  default_debounce_wait: 600
   # display settings
   pagination_sizes:
     organizations_list: 9

configs/ecospheres/config.yaml

@@ -67,7 +67,7 @@ website:
     display: false
     name:
     link:
-  footer_phrase: "Ce site est une déclinaison thématique de data.gouv.fr sur les données relatives à la transition écologique et énergétique, réalisé par le Ministère en charge de l'environnement"
+  footer_phrase: "Ce site est une déclinaison thématique de data.gouv.fr sur les données relatives à la transition écologique et énergétique, réalisé par le ministère en charge de l'environnement"
   footer_external_links:
     - label: 'data.gouv.fr'
       href: 'https://www.data.gouv.fr'
@@ -132,6 +132,8 @@ website:
   list_search_topics:
   url_search_topics:
   oauth_option: true
+  # debounce high enough for accessibility (screen readers will announce results)
+  default_debounce_wait: 600
   pagination_sizes:
     organizations_list: 9
     topics_list: 100

configs/hackathon/config.yaml

@@ -111,6 +111,8 @@ website:
     display: false
     content: Notice avec un [lien beta](/beta) et du _style_
     closeable: false
+  # debounce high enough for accessibility (screen readers will announce results)
+  default_debounce_wait: 600
   # display settings
   pagination_sizes:
     organizations_list: 9

configs/logistique/config.yaml

@@ -120,6 +120,8 @@ website:
     display: false
     content: Notice avec un [lien beta](/beta) et du _style_
     closeable: false
+  # debounce high enough for accessibility (screen readers will announce results)
+  default_debounce_wait: 600
   # display settings
   pagination_sizes:
     organizations_list: 9
@@ -160,9 +162,7 @@ website:
     activate_read_more: false
     dataset_editorialization: true
     can_add_topics:
-      everyone: false
-      authorized_users:
-        - 57d0546ec751df5cda97bae5
+      everyone: yes
 themes:
   - name: Immobilier logistique
     color: '#043574'

configs/meteo-france/config.yaml

@@ -38,6 +38,7 @@ website:
         sub_section_datasets:
         sub_section_cards:
         sub_section_tiles:
+          class: fr-col-md-6
           title:
           tiles:
             - id: '6571f26dc009674feb726be9'
@@ -145,6 +146,8 @@ website:
     display: false
     content: Notice avec un [lien beta](/beta) et du _style_
     closeable: false
+  # debounce high enough for accessibility (screen readers will announce results)
+  default_debounce_wait: 600
   # display settings
   pagination_sizes:
     organizations_list: 9

configs/simplification/config.yaml

@@ -233,6 +233,8 @@ website:
     display: false
     content: Notice avec un [lien beta](/beta) et du _style_
     closeable: false
+  # debounce high enough for accessibility (screen readers will announce results)
+  default_debounce_wait: 600
   # display settings
   pagination_sizes:
     organizations_list: 9

package.json

@@ -26,7 +26,7 @@
     "@json2csv/plainjs": "^7.0.6",
     "@unhead/vue": "^1.11.18",
     "@vee-validate/rules": "^4.15.0",
-    "@vueform/multiselect": "^2.6.10",
+    "@vueform/multiselect": "^2.6.11",
     "@vueuse/core": "^12.4.0",
     "@vueuse/integrations": "^12.4.0",
     "axios": "^1.7.9",
@@ -39,7 +39,6 @@
     "vue": "^3.5.13",
     "vue-loading-overlay": "^6.0.6",
     "vue-matomo": "^4.2.0",
-    "vue-multiselect": "^3.1.0",
     "vue-router": "^4.5.0",
     "vue3-text-clamp": "^0.1.2",
     "vue3-toastify": "^0.2.8"
@@ -71,7 +70,7 @@
     "unplugin-auto-import": "^19.0.0",
     "unplugin-vue-components": "^28.0.0",
     "unplugin-yaml": "^1.3.0",
-    "vite": "^6.0.7",
+    "vite": "^6.0.11",
     "vite-plugin-dynamic-import": "^1.6.0",
     "vite-plugin-vue-devtools": "^7.7.0",
     "vitest": "^2.1.8",

public/ecospheres/pages/about.md

@@ -6,7 +6,7 @@ _ecologie_.**data.gouv**._fr_ est un catalogue permettant la centralisation des
 
 ## À qui s'adresse cette plateforme ?
 
-_ecologie_.**data.gouv**._fr_ s'adresse aux agents publics des administrations centrales, services déconcentrés et des collectivités territoriales oeuvrant à déployer les politiques publiques portées par le [Ministère en charge de l’environnement](https://www.ecologie.gouv.fr/). L'accès aux données brutes permet également à la société civile, au secteur privé ou encore à l'administration de s'en emparer dans un but de réutilisation.
+_ecologie_.**data.gouv**._fr_ s'adresse aux agents publics des administrations centrales, services déconcentrés et des collectivités territoriales oeuvrant à déployer les politiques publiques portées par le [ministère en charge de l’environnement](https://www.ecologie.gouv.fr/). L'accès aux données brutes permet également à la société civile, au secteur privé ou encore à l'administration de s'en emparer dans un but de réutilisation.
 
 ## Les données ouvertes : qu'est-ce que c'est ?
 

public/ecospheres/pages/accessibility.md

@@ -1,6 +1,6 @@
 # Déclaration d’accessibilité
 
-Le Ministère en charge de l’environnement s’engage à rendre son service accessible, conformément à l’article 47 de la loi n° 2005-102 du 11 février 2005.
+Le ministère en charge de l’environnement s’engage à rendre son service accessible, conformément à l’article 47 de la loi n° 2005-102 du 11 février 2005.
 
 Cette déclaration d’accessibilité s’applique à **ecologie.data.gouv.fr** (https://ecologie.data.gouv.fr).
 

src/App.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { useFocus, useTitle } from '@vueuse/core'
+import { useTitle } from '@vueuse/core'
 
 import config from '@/config'
 
@@ -38,6 +38,14 @@ const userName = computed(() => userStore.userName)
 const quickLinks = computed(() => {
   const button = config.website.header_button
 
+  const userProfile = {
+    button: true,
+    disabled: true,
+    label: isLoggedIn.value ? userName.value : undefined,
+    icon: 'fr-icon-account-circle-line',
+    iconRight: true
+  }
+
   const headerButton = {
     label: button.label,
     icon: 'fr-icon-lightbulb-line',
@@ -58,27 +66,29 @@ const quickLinks = computed(() => {
     return button.display ? [headerButton] : []
   }
 
+  if (isLoggedIn.value) {
+    return button.display ? [userProfile, headerButton, logLink] : [logLink]
+  }
+
   return button.display ? [headerButton, logLink] : [logLink]
 })
 
 onMounted(() => {
   userStore.init()
 })
 
-const logotext = config.website.rf_title
-const servicetitle = config.website.title
-const logoOperator = config.website.logo_operator?.src
-const showLogoOperatorInHeader = config.website.logo_operator?.show_in_header
 const logoService = config.website.service_logo
-const showBadge = config.website.badge.display
-const badgeText = config.website.badge.text
-const badgeStyle = config.website.badge.style
+const logoText = config.website.rf_title
+const logoOperator = config.website.logo_operator?.src
+const logoOperatorHeight = config.website.logo_operator?.header?.height
+const logoOperatorWidth = config.website.logo_operator?.header?.width
 const footerPhrase = config.website.footer_phrase
 const footerExternalLinks = config.website.footer_external_links
 const footerMandatoryLinks = config.website.footer_mandatory_links
 
 const route = useRoute()
-const skipLinksComp = ref<InstanceType<typeof SkipLinks> | null>(null)
+const skipLinksComp =
+  useTemplateRef<InstanceType<typeof SkipLinks>>('skipLinksComp')
 
 const setAccessibilityProperties: AccessibilityPropertiesType = (
   title,
@@ -93,10 +103,9 @@ const setAccessibilityProperties: AccessibilityPropertiesType = (
       ...messages
     ]
   }
-  // focus skip link
-  if (focus && skipLinksComp.value?.firstSkipLink) {
-    const { focused } = useFocus(skipLinksComp.value?.firstSkipLink[0])
-    focused.value = true
+  // focus skip link container
+  if (focus && skipLinksComp.value?.skipLinkList) {
+    skipLinksComp.value.skipLinkList.focus()
   }
 }
 
@@ -127,40 +136,24 @@ watch(
     <div v-html="noticeContent"></div>
   </DsfrNotice>
   <HeaderComponent
-    :service-title="servicetitle"
-    service-description=""
-    home-to="/"
     :user-name="userName"
     :quick-links="quickLinks"
-    :show-search="config.website.header_search.display"
-    :logo-text="logotext"
-    :operator-img-src="logoOperator"
-    :show-operator-logo="showLogoOperatorInHeader"
-    :operator-img-style="{
-      height: config.website.logo_operator?.header?.width,
-      width: config.website.logo_operator?.header?.height
-    }"
-    :service-logo-src="logoService"
-    :show-badge="showBadge"
-    :badge-text="badgeText"
-    :badge-style="badgeStyle"
-  >
-    <template #mainnav="{ hidemodal }">
-      <Navigation :on-click="hidemodal" />
-    </template>
-  </HeaderComponent>
+    :logo-operator-height
+    :logo-operator-width
+    :custom-search="true"
+  />
 
   <main id="main-content" role="main">
     <RouterView />
   </main>
 
   <DsfrFooter
     class="fr-mt-16w"
-    :logo-text="logotext"
+    :logo-text="logoText"
     :operator-img-src="logoOperator"
     :operator-img-style="{
-      height: config.website.logo_operator?.footer?.width,
-      width: config.website.logo_operator?.footer?.height
+      height: logoOperatorHeight,
+      width: logoOperatorWidth
     }"
     :service-logo-src="logoService"
     :desc-text="footerPhrase"

src/assets/main.css

@@ -5,6 +5,7 @@
   --blue-france-950-100: var(--blue-cumulus-950-100);
   --blue-france-950-100-hover: var(--blue-cumulus-950-100-hover);
   --blue-france-950-100-active: var(--blue-cumulus-950-100-active);
+  --blue-france-sun-113: #000091;
   --blue-france-sun-113-625: var(--blue-cumulus-sun-368-moon-732);
   --blue-france-sun-113-625-hover: var(--blue-cumulus-sun-368-moon-732-hover);
   --blue-france-sun-113-625-active: var(--blue-cumulus-sun-368-moon-732-active);
@@ -99,7 +100,7 @@ body {
 }
 
 .actionTile {
-  background: #000092;
+  background: var(--blue-france-sun-113);
   .fr-tile__link {
     color: white;
   }
@@ -185,6 +186,10 @@ body {
   margin-bottom: 1.5rem;
 }
 
+.datagouv-components :where(.fr-link, a:not(.fr-btn)) {
+  color: var(--blue-france-sun-113);
+}
+
 /* Button color contrast fix */
 .fr-btn:not(
     .fr-btn--close,
@@ -199,7 +204,6 @@ body {
 }
 
 /* DSFR search bar fix */
-
 .datagouv-components .fr-search-bar .fr-btn {
   border-radius: 0 0.25rem 0 0;
 }
@@ -210,3 +214,22 @@ body {
     margin-bottom: 0;
   }
 }
+
+/* DSFR org name in card fix */
+/* remove default margins */
+.org--fix div.fr-mx-1v {
+  margin: 0 !important;
+}
+/* gap to add margins when needed */
+.org--fix .inline-flex {
+  gap: 0.25rem;
+}
+/* sometimes the first span is empty, hide it */
+.org--fix .inline-flex span:first-of-type:empty {
+  display: none;
+}
+
+/* Flex gap utility (missing from DSFR) */
+.flex-gap {
+  gap: var(--gap, 0.5rem);
+}