Annonce vocalement le nombre de résultats lors du filtrage des erreurs du rapport (#254)

* fix: announce results count when filtering errors on report

* docs: update changelog

Author: bellangerq

CHANGELOG.md

@@ -2,7 +2,13 @@
 
 Tous les changements notables de Ara sont documentés ici avec leur date, leur catégorie (nouvelle fonctionnalité, correction de bug ou autre changement) et leur pull request (PR) associée.
 
-## 09/01/2023
+## 13/01/2023
+
+### Corrections 🐛
+
+- Vocalise le nombre de résultats dans le rapport ([#254](https://github.com/DISIC/Ara/pull/254))
+
+## 11/01/2023
 
 ### Nouvelles fonctionnalités 🚀
 

confiture-web-app/src/components/ReportErrors.vue

@@ -80,28 +80,45 @@ const disabledResetFilters = computed(
 const minorUserImpactErrorCount = computed(
   () =>
     report.data?.results.filter(
-      (r) => r.userImpact === CriterionResultUserImpact.MINOR
+      (r) =>
+        r.status === CriteriumResultStatus.NOT_COMPLIANT &&
+        r.userImpact === CriterionResultUserImpact.MINOR
     ).length
 );
 
 const majorUserImpactErrorCount = computed(
   () =>
     report.data?.results.filter(
-      (r) => r.userImpact === CriterionResultUserImpact.MAJOR
+      (r) =>
+        r.status === CriteriumResultStatus.NOT_COMPLIANT &&
+        r.userImpact === CriterionResultUserImpact.MAJOR
     ).length
 );
 
 const blockingUserImpactErrorCount = computed(
   () =>
     report.data?.results.filter(
-      (r) => r.userImpact === CriterionResultUserImpact.BLOCKING
+      (r) =>
+        r.status === CriteriumResultStatus.NOT_COMPLIANT &&
+        r.userImpact === CriterionResultUserImpact.BLOCKING
     ).length
 );
 
 const unknownUserImpactErrorCount = computed(
-  () => report.data?.results.filter((r) => r.userImpact === null).length
+  () =>
+    report.data?.results.filter(
+      (r) =>
+        r.status === CriteriumResultStatus.NOT_COMPLIANT &&
+        r.userImpact === null
+    ).length
 );
 
+const displayedErrorCount = computed(() => {
+  return errors.value
+    .map((page) => page.topics.map((topic) => topic.errors))
+    .flat(2).length;
+});
+
 function expandAll() {
   const collapses = Array.from(
     document.querySelectorAll("[data-accordion] > [data-fr-js-collapse]")
@@ -343,9 +360,11 @@ function updateActiveAnchorLink(id: string, event: MouseEvent) {
 
       <div>
         <div class="fr-mb-6w header">
-          <span class="fr-mb-0 fr-text--xl fr-text--bold"
-            >{{ report.data.errorCount }} résultats</span
-          >
+          <div role="alert" aria-live="polite">
+            <p class="fr-mb-0 fr-text--xl fr-text--bold">
+              {{ displayedErrorCount }} résultats
+            </p>
+          </div>
           <!-- FIXME: make this work -->
           <!-- <button class="fr-btn fr-btn--tertiary-no-outline" @click="expandAll">
             Tout déplier