From 65dda0b6ae253455d5fcd2967e0c175c5591df3c Mon Sep 17 00:00:00 2001
From: Alban Mouton <alban.mouton@gmail.com>
Date: Mon, 27 Jan 2025 18:03:29 +0100
Subject: [PATCH] chore: some tuning of aria hidden and alt on images

---
 public/components/layout/layout-personal-menu.vue     | 11 +----------
 .../components/layout/layout-personal-navigation.vue  | 10 ++++++++--
 public/components/notifications-queue.vue             |  7 ++-----
 public/components/owner/owner-department.vue          |  1 +
 public/components/owner/owner-facets.vue              |  4 ++++
 public/components/owner/owner-short.vue               |  1 +
 6 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/public/components/layout/layout-personal-menu.vue b/public/components/layout/layout-personal-menu.vue
index 83284a9..1e106d3 100644
--- a/public/components/layout/layout-personal-menu.vue
+++ b/public/components/layout/layout-personal-menu.vue
@@ -11,10 +11,9 @@
         <v-icon
           large
           :color="backgroundDark ? 'white' : 'primary'"
-          aria-label="symbole de connexion"
           aria-hidden="false"
         >
-          {{ mdiAccountCircle }}
+          mdi-account-circle
         </v-icon>
       </v-btn>
       <v-btn
@@ -44,7 +43,6 @@
           <v-avatar :size="36">
             <img
               :src="`${directoryUrl}/api/avatars/user/${user.id}/avatar.png`"
-              aria-hidden
               :alt="'Avatar de ' + user.name"
             >
           </v-avatar>
@@ -92,16 +90,9 @@
 
 <script>
 import { mapState, mapGetters, mapActions } from 'vuex'
-// better to load svg for semantic icons important for accessbility
-import { mdiAccountCircle } from '@mdi/js'
 
 export default {
   props: ['loginHref', 'backgroundDark'],
-  data () {
-    return {
-      mdiAccountCircle
-    }
-  },
   computed: {
     ...mapState(['config', 'textDark', 'userPartners']),
     ...mapState('session', ['user']),
diff --git a/public/components/layout/layout-personal-navigation.vue b/public/components/layout/layout-personal-navigation.vue
index 62e3106..a4da5d9 100644
--- a/public/components/layout/layout-personal-navigation.vue
+++ b/public/components/layout/layout-personal-navigation.vue
@@ -16,7 +16,10 @@
         :to="`/`"
       >
         <v-list-item-avatar>
-          <img :src="`${directoryUrl}/api/avatars/${config.owner.type}/${config.owner.id}/avatar.png`">
+          <img
+            aria-hidden="true"
+            :src="`${directoryUrl}/api/avatars/${config.owner.type}/${config.owner.id}/avatar.png`"
+          >
         </v-list-item-avatar>
         <v-list-item-content>
           <v-list-item-title>{{ config.title }}</v-list-item-title>
@@ -68,7 +71,10 @@
           >
             <v-list-item-action class=" my-0">
               <v-avatar :size="28">
-                <img :src="item.avatar">
+                <img
+                  aria-hidden="true"
+                  :src="item.avatar"
+                >
               </v-avatar>
             </v-list-item-action>
             <v-list-item-title>
diff --git a/public/components/notifications-queue.vue b/public/components/notifications-queue.vue
index 8739a91..2d3c1ae 100644
--- a/public/components/notifications-queue.vue
+++ b/public/components/notifications-queue.vue
@@ -23,10 +23,9 @@
         >
           <v-icon
             :color="backgroundDark ? 'white' : textDark"
-            aria-label="symbole de notification"
             aria-hidden="false"
           >
-            {{ mdiBell }}
+            mdi-bell
           </v-icon>
         </v-badge>
       </v-btn>
@@ -86,7 +85,6 @@
 <script>
 import { mapState } from 'vuex'
 import eventBus from '~/event-bus'
-import { mdiBell } from '@mdi/js'
 
 /* let sound
 if (!process.server) {
@@ -100,8 +98,7 @@ export default {
     countNew: null,
     notifications: null,
     loading: false,
-    size: 10,
-    mdiBell
+    size: 10
   }),
   computed: {
     ...mapState(['textDark', 'config']),
diff --git a/public/components/owner/owner-department.vue b/public/components/owner/owner-department.vue
index 4969947..c77ace1 100644
--- a/public/components/owner/owner-department.vue
+++ b/public/components/owner/owner-department.vue
@@ -7,6 +7,7 @@
     <v-avatar :size="28">
       <img
         aria-hidden="true"
+        alt=""
         :src="`${directoryUrl}/api/avatars/${owner.type}/${owner.id}/${owner.department}/avatar.png`"
       >
     </v-avatar>
diff --git a/public/components/owner/owner-facets.vue b/public/components/owner/owner-facets.vue
index 47d4aaa..990a853 100644
--- a/public/components/owner/owner-facets.vue
+++ b/public/components/owner/owner-facets.vue
@@ -43,11 +43,13 @@
           <img
             v-if="item.value.department"
             aria-hidden="true"
+            alt=""
             :src="`${directoryUrl}/api/avatars/${item.value.type}/${item.value.id}/${item.value.department}/avatar.png`"
           >
           <img
             v-else
             aria-hidden="true"
+            alt=""
             :src="`${directoryUrl}/api/avatars/${item.value.type}/${item.value.id}/avatar.png`"
           >
         </v-list-item-avatar>
@@ -62,11 +64,13 @@
           <img
             v-if="item.value.department"
             aria-hidden="true"
+            alt=""
             :src="`${directoryUrl}/api/avatars/${item.value.type}/${item.value.id}/${item.value.department}/avatar.png`"
           >
           <img
             v-else
             aria-hidden="true"
+            alt=""
             :src="`${directoryUrl}/api/avatars/${item.value.type}/${item.value.id}/avatar.png`"
           >
         </v-avatar>
diff --git a/public/components/owner/owner-short.vue b/public/components/owner/owner-short.vue
index b9b7d8c..37e167c 100644
--- a/public/components/owner/owner-short.vue
+++ b/public/components/owner/owner-short.vue
@@ -6,6 +6,7 @@
     <v-avatar :size="28">
       <img
         aria-hidden="true"
+        alt=""
         :src="`${directoryUrl}/api/avatars/${owner.type}/${owner.id}/avatar.png`"
       >
     </v-avatar>