From 5c2a893b0382b4151e1353558200de06ed16d4a9 Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Wed, 4 Feb 2026 11:03:21 +0100
Subject: [PATCH 1/9] fix fullname if user was deleted

---
 .../specific/files/visas-table/VisasTable.vue      | 14 ++++++++++----
 src/utils/visas.js                                 |  9 +++++++--
 2 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/src/components/specific/files/visas-table/VisasTable.vue b/src/components/specific/files/visas-table/VisasTable.vue
index 8aa45ea9f..d0baff9cd 100644
--- a/src/components/specific/files/visas-table/VisasTable.vue
+++ b/src/components/specific/files/visas-table/VisasTable.vue
@@ -60,7 +60,7 @@
     </template>
     <template #cell-buttons="{ row: visa }">
       <BIMDataButton
-        v-if="fullName(user) === fullName(visa.creator)"
+        v-if="isCreator(visa)"
         color="default"
         outline
         radius
@@ -85,7 +85,7 @@
     </template>
     <template #cell-actions="{ row: visa }">
       <VisaActionsCell
-        v-if="fullName(user) === fullName(visa.creator)"
+        v-if="isCreator(visa)"
         :visa="visa"
         @delete="$emit('delete', visa)"
         @edit-visa="$emit('reach-visa', visa)"
@@ -121,6 +121,7 @@ export default {
     },
     visas: {
       type: Array,
+      default: () => [],
       required: true,
     },
     selection: {
@@ -156,11 +157,15 @@ export default {
       }));
     });
 
+
+    const isCreator = (visa) =>
+      user.value && visa.creator && fullName(user.value) === fullName(visa.creator);
+
     const validationClasses = (visa) => {
       if (visa.status === VISA_STATUS.CLOSE) {
         return "closed-visa";
       }
-      if (fullName(user.value) === fullName(visa.creator)) {
+      if (isCreator(visa)) {
         return "ask-visa";
       } else {
         return "waiting-visa";
@@ -170,7 +175,7 @@ export default {
       if (visa.status === VISA_STATUS.CLOSE) {
         return "visa";
       }
-      if (fullName(user.value) === fullName(visa.creator)) {
+      if (isCreator(visa)) {
         return "unknownFile";
       } else {
         return "visa";
@@ -206,6 +211,7 @@ export default {
       user,
       fullName,
       enhancedVisas,
+      isCreator,
       isDelay,
       statusClasses,
       statusIcon,
diff --git a/src/utils/visas.js b/src/utils/visas.js
index a1f1d68ad..ecded69f5 100644
--- a/src/utils/visas.js
+++ b/src/utils/visas.js
@@ -1,12 +1,14 @@
 import { fullName } from "./users.js";
 import { VISA_STATUS, VALIDATION_STATUS } from "../config/visa.js";
 
+const safeFullName = (user) => (user ? fullName(user) : "");
+
 export const enhanceVisa = (visa, user, t, handler) => {
   const validationType = () => {
     if (visa.status === VISA_STATUS.CLOSE) {
       return t("Visa.view.visaClosed");
     }
-    if (fullName(user) === fullName(visa.creator)) {
+    if (user && visa.creator && safeFullName(user) === safeFullName(visa.creator)) {
       return t("Visa.view.myRequests");
     } else {
       return t("Visa.view.visaPending");
@@ -37,7 +39,10 @@ export const enhanceVisa = (visa, user, t, handler) => {
     return emailValidators;
   };
 
-  const document = handler.get({ id: visa.document.head_id ?? visa.document.id, nature: "Document" });
+  const document = handler.get({
+    id: visa.document.head_id ?? visa.document.id,
+    nature: "Document",
+  });
 
   return {
     ...visa,

From 322a9347badda2b53a39713b7a184ccbbe286116 Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Wed, 4 Feb 2026 11:19:01 +0100
Subject: [PATCH 2/9] add delay statut & delay validator

---
 .../files/visas-table/VisasTable.scss         | 14 +++++
 .../specific/files/visas-table/VisasTable.vue | 30 +++++++++--
 .../user-avatar-list/UserAvatarList.scss      |  2 +-
 .../users/user-avatar-list/UserAvatarList.vue | 32 +++++++----
 .../visa/visa-summary/VisaSummary.vue         | 23 ++++----
 .../VisaSummaryValidator.scss                 |  5 +-
 .../VisaSummaryValidator.vue                  | 53 +++++++++++--------
 src/i18n/lang/de.json                         |  3 +-
 src/i18n/lang/en.json                         |  1 +
 src/i18n/lang/es.json                         |  3 +-
 src/i18n/lang/fr.json                         |  1 +
 src/i18n/lang/it.json                         |  1 +
 src/i18n/lang/nl.json                         |  1 +
 src/i18n/lang/no.json                         |  1 +
 14 files changed, 115 insertions(+), 55 deletions(-)

diff --git a/src/components/specific/files/visas-table/VisasTable.scss b/src/components/specific/files/visas-table/VisasTable.scss
index ac466d1ea..d83c7853e 100644
--- a/src/components/specific/files/visas-table/VisasTable.scss
+++ b/src/components/specific/files/visas-table/VisasTable.scss
@@ -68,6 +68,20 @@
       }
     }
   }
+  &:deep(.user-avatar-list) {
+    .avatar--deny {
+      border-color: var(--color-high);
+    }
+    .avatar--accept {
+      border-color: var(--color-success);
+    }
+    .avatar--delay {
+      border-color: var(--color-warning);
+    }
+    .avatar--pending {
+      border-color: var(--color-white);
+    }
+  }
   .bimdata-btn {
     margin: auto;
   }
diff --git a/src/components/specific/files/visas-table/VisasTable.vue b/src/components/specific/files/visas-table/VisasTable.vue
index d0baff9cd..4c217d930 100644
--- a/src/components/specific/files/visas-table/VisasTable.vue
+++ b/src/components/specific/files/visas-table/VisasTable.vue
@@ -34,9 +34,10 @@
     <template #cell-validators="{ row: visa }">
       <UserAvatarList
         class="group-card__avatars"
-        :users="visa.validations.map((validation) => validation.validator).filter(Boolean)"
+        :users="validatorsForVisa(visa)"
         itemSize="28"
         itemGap="18"
+        :itemClass="(validator) => avatarStatusClass(visa, validator)"
       />
     </template>
     <template #cell-due_date="{ row: visa }">
@@ -134,12 +135,10 @@ export default {
     const { user } = useUser();
     const { isLG, isXL, isXXL } = useStandardBreakpoints();
 
-    const {
-      fileStructureHandler: handler,
-    } = useFiles();
+    const { fileStructureHandler: handler } = useFiles();
 
     const enhancedVisas = computed(() =>
-      props.visas.map((visa) => enhanceVisa(visa, user.value, t, handler))
+      props.visas.map((visa) => enhanceVisa(visa, user.value, t, handler)),
     );
 
     const columns = computed(() => {
@@ -157,6 +156,13 @@ export default {
       }));
     });
 
+    const validatorsForVisa = (visa) =>
+      visa.validations
+        .filter((v) => v.validator)
+        .map((v) => ({
+          ...v.validator,
+          validationStatus: v.status,
+        }));
 
     const isCreator = (visa) =>
       user.value && visa.creator && fullName(user.value) === fullName(visa.creator);
@@ -205,6 +211,18 @@ export default {
         return statusIcon(visa);
       }
     };
+    const avatarStatusClass = (visa, validator) => {
+      switch (validator?.validationStatus) {
+        case VALIDATION_STATUS.DENY:
+          return "avatar--deny";
+        case VALIDATION_STATUS.ACCEPT:
+          return "avatar--accept";
+        case VALIDATION_STATUS.PENDING:
+          return isDelay(visa) ? "avatar--delay" : "avatar--pending";
+        default:
+          return "avatar--pending";
+      }
+    };
 
     return {
       columns,
@@ -214,8 +232,10 @@ export default {
       isCreator,
       isDelay,
       statusClasses,
+      avatarStatusClass,
       statusIcon,
       validationClasses,
+      validatorsForVisa,
       validationIcon,
     };
   },
diff --git a/src/components/specific/users/user-avatar-list/UserAvatarList.scss b/src/components/specific/users/user-avatar-list/UserAvatarList.scss
index b35ead4da..54a256beb 100644
--- a/src/components/specific/users/user-avatar-list/UserAvatarList.scss
+++ b/src/components/specific/users/user-avatar-list/UserAvatarList.scss
@@ -2,7 +2,7 @@
   display: grid;
 
   &__item {
-    border: 1px solid var(--color-white);
+    border: 2px solid;
   }
 
   &__tail-item {
diff --git a/src/components/specific/users/user-avatar-list/UserAvatarList.vue b/src/components/specific/users/user-avatar-list/UserAvatarList.vue
index 5cfc867cc..b5bc8583d 100644
--- a/src/components/specific/users/user-avatar-list/UserAvatarList.vue
+++ b/src/components/specific/users/user-avatar-list/UserAvatarList.vue
@@ -3,15 +3,17 @@
     class="user-avatar-list"
     :style="{
       width: `${listWidth}px`,
-      gridTemplateColumns: `repeat(${listLength}, ${itemGap}px)`
+      gridTemplateColumns: `repeat(${listLength}, ${itemGap}px)`,
     }"
   >
     <UserAvatar
-      class="user-avatar-list__item"
       v-for="user of displayedUsers"
       :key="user.id"
+      class="user-avatar-list__item"
       :user="user"
       :size="itemSize"
+      :class="itemClass ? itemClass(user) : null"
+      :style="{ 'border-color': borderColor }"
     />
     <template v-if="users.length > length">
       <div
@@ -31,31 +33,39 @@ import UserAvatar from "../user-avatar/UserAvatar.vue";
 
 export default {
   components: {
-    UserAvatar
+    UserAvatar,
   },
   props: {
     users: {
       type: Array,
-      required: true
+      required: true,
     },
     length: {
       type: Number,
-      default: 4
+      default: 4,
     },
     itemSize: {
       type: [Number, String],
       default: 32,
-      validate: value => value >= 32
+      validate: (value) => value >= 32,
     },
     itemGap: {
       type: [Number, String],
       default: 24,
-      validate: value => value > 0
+      validate: (value) => value > 0,
+    },
+    itemClass: {
+      type: Function,
+      default: null,
+    },
+    borderColor: {
+      type: String,
+      default: null,
     },
     fixedWidth: {
       type: Boolean,
-      default: false
-    }
+      default: false,
+    },
   },
   setup(props) {
     const displayedUsers = computed(() => {
@@ -81,9 +91,9 @@ export default {
       // References
       displayedUsers,
       listLength,
-      listWidth
+      listWidth,
     };
-  }
+  },
 };
 </script>
 
diff --git a/src/components/specific/visa/visa-summary/VisaSummary.vue b/src/components/specific/visa/visa-summary/VisaSummary.vue
index b43e9ff30..4224359f5 100644
--- a/src/components/specific/visa/visa-summary/VisaSummary.vue
+++ b/src/components/specific/visa/visa-summary/VisaSummary.vue
@@ -201,6 +201,7 @@
               :isAuthor="isAuthor"
               :userList="formatedVisa.validations"
               :isClosed="isClosed"
+              :visaDeadline="formatedVisa.deadline"
               @reset-validation="onResetValidation"
               @delete-validation="onDeleteValidation"
             />
@@ -270,9 +271,7 @@ export default {
       updateVisa,
     } = useVisa();
 
-    const {
-      fileStructureHandler: handler,
-    } = useFiles();
+    const { fileStructureHandler: handler } = useFiles();
 
     const isClosed = ref(false);
     const isEditing = ref(false);
@@ -311,7 +310,7 @@ export default {
           isSelf: isSelf(validation.validator),
           hasAccess: visa.validations_in_error.length
             ? !visa.validations_in_error.some(
-                (validationInErrorId) => validationInErrorId === validation.id
+                (validationInErrorId) => validationInErrorId === validation.id,
               )
             : true,
         }))
@@ -330,10 +329,10 @@ export default {
         return {
           ...user,
           isSelected: visa.validations.some(
-            ({ validator }) => validator && validator.id === user.id
+            ({ validator }) => validator && validator.id === user.id,
           ),
           validation: visa.validations.find(
-            ({ validator }) => validator && validator.id === user.id
+            ({ validator }) => validator && validator.id === user.id,
           ),
         };
       });
@@ -345,7 +344,7 @@ export default {
       }
       if (!isAuthor.value) {
         validationUserId.value = props.visa.validations.find(({ validator }) =>
-          isSelf(validator)
+          isSelf(validator),
         ).id;
       }
       isClosed.value = props.visa.status === VISA_STATUS.CLOSE;
@@ -371,7 +370,7 @@ export default {
     const userValidationStatus = computed(() => {
       if (!isAuthor.value) {
         const status = formatedVisa.value.validations.find(
-          ({ id: validationId }) => validationId === validationUserId.value
+          ({ id: validationId }) => validationId === validationUserId.value,
         ).status;
 
         return {
@@ -390,7 +389,7 @@ export default {
           props.project,
           props.visa.document,
           props.visa,
-          validationUserId.value
+          validationUserId.value,
         );
         await reloadVisa();
       }
@@ -404,7 +403,7 @@ export default {
           props.project,
           props.visa.document,
           props.visa,
-          validationUserId.value
+          validationUserId.value,
         );
         await reloadVisa();
       }
@@ -415,7 +414,7 @@ export default {
         props.project,
         props.visa.document,
         props.visa,
-        (validationId = validationId || validationUserId.value)
+        (validationId = validationId || validationUserId.value),
       );
       await reloadVisa();
     };
@@ -491,7 +490,7 @@ export default {
             } else if (isToDel) {
               await onDeleteValidation(validationId);
             }
-          })
+          }),
       );
       await reloadVisa();
     });
diff --git a/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.scss b/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.scss
index d66fb0148..68eeff8f0 100644
--- a/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.scss
+++ b/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.scss
@@ -35,12 +35,15 @@
     align-items: center;
 
     span {
-      margin: auto var(--spacing-unit) auto 0;
+      margin: auto calc(var(--spacing-unit) / 2) auto 0;
     }
 
     &__P {
       display: flex;
       color: var(--color-primary);
+      &.delayed {
+        color: var(--color-warning);
+      }
     }
     &__A {
       display: flex;
diff --git a/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.vue b/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.vue
index 9d5bee1b6..31d3ab266 100644
--- a/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.vue
+++ b/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.vue
@@ -24,11 +24,7 @@
       </div>
     </div>
     <div class="visa-summary-validator__right-side">
-      <template
-        v-if="
-          !isClosed && user.isSelf && user.status != VALIDATION_STATUS.PENDING
-        "
-      >
+      <template v-if="!isClosed && user.isSelf && user.status != VALIDATION_STATUS.PENDING">
         <BIMDataButton
           data-test-id="btn-refresh-validation"
           radius
@@ -40,15 +36,16 @@
         </BIMDataButton>
       </template>
       <template v-if="user.hasAccess">
-        <div :class="`visa-summary-validator__right-side__${user.status}`">
+        <div
+          :class="{
+            [`visa-summary-validator__right-side__${user.status}`]: true,
+            delayed: validationStatus(user) === 'delayed',
+          }"
+        >
           <span>
             {{ $t(`Visa.summary.validatorList.${validationStatus(user)}`) }}
           </span>
-          <BIMDataIcon
-            :name="iconStatus(user)"
-            size="xs"
-            style="margin-top: 2px"
-          />
+          <BIMDataIcon :name="iconStatus(user)" size="xs" style="margin-top: 2px" />
         </div>
       </template>
       <template v-else>
@@ -92,34 +89,44 @@ import VisaSummaryValidatorActions from "./visa-summary-validator-actions/VisaSu
 export default {
   components: {
     UserAvatar,
-    VisaSummaryValidatorActions
+    VisaSummaryValidatorActions,
   },
   props: {
     userList: {
       type: Object,
-      required: true
+      required: true,
     },
     isAuthor: {
       type: Boolean,
-      required: true
+      required: true,
     },
     isClosed: {
       type: Boolean,
-      required: true
-    }
+      required: true,
+    },
+    visaDeadline: {
+      type: Date,
+      required: false,
+    },
   },
   emits: ["reset-validation", "delete-validation"],
-  setup() {
+  setup(props) {
     const currentPeopleId = ref(null);
     const isWarningHover = ref(false);
 
-    const hasVoted = user => user.status !== VALIDATION_STATUS.PENDING;
+    const hasVoted = (user) => user.status !== VALIDATION_STATUS.PENDING;
 
-    const validationStatus = user => {
+    const validationStatus = (user) => {
       const { hasCommented, status } = user;
 
       if (hasCommented && status === VALIDATION_STATUS.PENDING) {
         return "commented";
+      } else if (
+        props.visaDeadline &&
+        new Date() > new Date(props.visaDeadline) &&
+        status === VALIDATION_STATUS.PENDING
+      ) {
+        return "delayed";
       } else if (user.status === VALIDATION_STATUS.PENDING) {
         return "pending";
       } else if (user.status === VALIDATION_STATUS.ACCEPT) {
@@ -129,7 +136,7 @@ export default {
       }
     };
 
-    const iconStatus = user => {
+    const iconStatus = (user) => {
       const { hasCommented, status } = user;
 
       if (hasCommented && status === VALIDATION_STATUS.PENDING) {
@@ -143,7 +150,7 @@ export default {
       }
     };
 
-    const hoveringValidator = peopleId => {
+    const hoveringValidator = (peopleId) => {
       if (peopleId) {
         isWarningHover.value = true;
         currentPeopleId.value = peopleId;
@@ -162,9 +169,9 @@ export default {
       hoveringValidator,
       validationStatus,
       iconStatus,
-      hasVoted
+      hasVoted,
     };
-  }
+  },
 };
 </script>
 
diff --git a/src/i18n/lang/de.json b/src/i18n/lang/de.json
index 617a3d07e..84543980e 100644
--- a/src/i18n/lang/de.json
+++ b/src/i18n/lang/de.json
@@ -673,6 +673,7 @@
       "deletedUser": "Gelöschter Nutzer",
       "validatorList": {
         "accept": "Bestätigt",
+        "delayed": "Verzögert",
         "deny": "Abgelehnt",
         "commented": "Kommentiert",
         "pending": "Ausstehend",
@@ -971,4 +972,4 @@
     "title": "Löschen der {visasCount} Freigaben",
     "message": "Sie sind dabei, die Freigaben für die folgenden Dateien zu löschen:"
   }
-}
\ No newline at end of file
+}
diff --git a/src/i18n/lang/en.json b/src/i18n/lang/en.json
index 80030c740..bae3ed3a4 100644
--- a/src/i18n/lang/en.json
+++ b/src/i18n/lang/en.json
@@ -673,6 +673,7 @@
       "deletedUser": "User removed",
       "validatorList": {
         "accept": "Validated",
+        "delayed": "Delayed",
         "deny": "Refused",
         "commented": "Commented",
         "pending": "Awaiting",
diff --git a/src/i18n/lang/es.json b/src/i18n/lang/es.json
index 5cde8624f..901f8a72b 100644
--- a/src/i18n/lang/es.json
+++ b/src/i18n/lang/es.json
@@ -673,6 +673,7 @@
       "deletedUser": "Usuario eliminado",
       "validatorList": {
         "accept": "Confirmado",
+        "delayed": "Retrasado",
         "deny": "Rechazado",
         "commented": "Comentado",
         "pending": "En espera",
@@ -971,4 +972,4 @@
     "title": "Eliminación de {visasCount} visas",
     "message": "Está a punto de eliminar las visas de los siguientes archivos:"
   }
-}
\ No newline at end of file
+}
diff --git a/src/i18n/lang/fr.json b/src/i18n/lang/fr.json
index 716f09af2..57d898361 100644
--- a/src/i18n/lang/fr.json
+++ b/src/i18n/lang/fr.json
@@ -790,6 +790,7 @@
       "deletedUser": " Utilisateur supprimé",
       "validatorList": {
         "accept": "Validé",
+        "delayed": "En retard",
         "deny": "Refusé",
         "commented": "Commenté",
         "pending": "En attente",
diff --git a/src/i18n/lang/it.json b/src/i18n/lang/it.json
index ed4a4bf2f..75f8dd244 100644
--- a/src/i18n/lang/it.json
+++ b/src/i18n/lang/it.json
@@ -594,6 +594,7 @@
       "deletedUser": "Utente eliminato",
       "validatorList": {
         "accept": "Convalidato",
+        "delegate": "Delegato",
         "deny": "Respinto",
         "commented": "Commentato",
         "pending": "In attesa",
diff --git a/src/i18n/lang/nl.json b/src/i18n/lang/nl.json
index 12d2addbf..51e86322c 100644
--- a/src/i18n/lang/nl.json
+++ b/src/i18n/lang/nl.json
@@ -591,6 +591,7 @@
       "deletedUser": "Gebruiker verwijderd",
       "validatorList": {
         "accept": "Gevalideerd",
+        "delayed": "Uitgesteld",
         "deny": "Geweigerd",
         "commented": "Becommentarieerd",
         "pending": "In afwachting van",
diff --git a/src/i18n/lang/no.json b/src/i18n/lang/no.json
index cb02a2161..d7e4b21d8 100644
--- a/src/i18n/lang/no.json
+++ b/src/i18n/lang/no.json
@@ -591,6 +591,7 @@
       "deletedUser": "Brukeren er fjernet",
       "validatorList": {
         "accept": "Verifisert",
+        "delayed": "Forsinket",
         "deny": "Avslått",
         "commented": "Kommentert",
         "pending": "Avventer",

From 64a5b4fc76d00d10ac5ae3ea3e49ed6ea80fb513 Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Thu, 5 Feb 2026 16:52:41 +0100
Subject: [PATCH 3/9] create VisaValidatorCell

---
 .../specific/files/visas-table/VisasTable.vue |  38 +---
 .../VisaValidatorCell.scss                    |  81 +++++++
 .../visa-validator-cell/VisaValidatorCell.vue | 202 ++++++++++++++++++
 .../specific/users/user-avatar/UserAvatar.vue |  27 ++-
 4 files changed, 304 insertions(+), 44 deletions(-)
 create mode 100644 src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
 create mode 100644 src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue

diff --git a/src/components/specific/files/visas-table/VisasTable.vue b/src/components/specific/files/visas-table/VisasTable.vue
index 4c217d930..e54fde255 100644
--- a/src/components/specific/files/visas-table/VisasTable.vue
+++ b/src/components/specific/files/visas-table/VisasTable.vue
@@ -32,13 +32,7 @@
       </span>
     </template>
     <template #cell-validators="{ row: visa }">
-      <UserAvatarList
-        class="group-card__avatars"
-        :users="validatorsForVisa(visa)"
-        itemSize="28"
-        itemGap="18"
-        :itemClass="(validator) => avatarStatusClass(visa, validator)"
-      />
+      <VisaValidatorCell :visa="visa" />
     </template>
     <template #cell-due_date="{ row: visa }">
       {{ $d(visa.deadline, "short") }}
@@ -102,6 +96,7 @@ import { useStandardBreakpoints } from "../../../../composables/responsive.js";
 import { VISA_STATUS, VALIDATION_STATUS } from "../../../../config/visa.js";
 import { enhanceVisa } from "../../../../utils/visas.js";
 import { useFiles } from "../../../../state/files.js";
+
 import { useUser } from "../../../../state/user.js";
 import { fullName } from "../../../../utils/users.js";
 import columnsDef, { columnsLG, columnsXL, columnsXXL } from "./columns.js";
@@ -109,12 +104,13 @@ import columnsDef, { columnsLG, columnsXL, columnsXXL } from "./columns.js";
 import UserAvatarList from "../../users/user-avatar-list/UserAvatarList.vue";
 import VisaActionsCell from "./visa-actions-cell/VisaActionsCell.vue";
 import FilePathCell from "../files-table/file-path-cell/FilePathCell.vue";
-
+import VisaValidatorCell from "./visa-validator-cell/VisaValidatorCell.vue";
 export default {
   components: {
     UserAvatarList,
     VisaActionsCell,
     FilePathCell,
+    VisaValidatorCell,
   },
   props: {
     allFolders: {
@@ -156,14 +152,6 @@ export default {
       }));
     });
 
-    const validatorsForVisa = (visa) =>
-      visa.validations
-        .filter((v) => v.validator)
-        .map((v) => ({
-          ...v.validator,
-          validationStatus: v.status,
-        }));
-
     const isCreator = (visa) =>
       user.value && visa.creator && fullName(user.value) === fullName(visa.creator);
 
@@ -211,31 +199,21 @@ export default {
         return statusIcon(visa);
       }
     };
-    const avatarStatusClass = (visa, validator) => {
-      switch (validator?.validationStatus) {
-        case VALIDATION_STATUS.DENY:
-          return "avatar--deny";
-        case VALIDATION_STATUS.ACCEPT:
-          return "avatar--accept";
-        case VALIDATION_STATUS.PENDING:
-          return isDelay(visa) ? "avatar--delay" : "avatar--pending";
-        default:
-          return "avatar--pending";
-      }
-    };
 
     return {
       columns,
       user,
       fullName,
       enhancedVisas,
+      //groupsForVisa,
+      // groupDisplayForVisa,
       isCreator,
       isDelay,
       statusClasses,
-      avatarStatusClass,
+      // avatarStatusClass,
       statusIcon,
       validationClasses,
-      validatorsForVisa,
+      // validatorsForVisa,
       validationIcon,
     };
   },
diff --git a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
new file mode 100644
index 000000000..01069abd5
--- /dev/null
+++ b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
@@ -0,0 +1,81 @@
+.visa-validator-cell {
+  position: relative;
+
+  &__details {
+    width: max-content;
+    max-width: 500px;
+    padding: var(--spacing-unit);
+    position: absolute;
+    background-color: var(--color-white);
+    z-index: 10;
+    top: -6px;
+    left: -12px;
+    border-radius: 8px;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+
+    .validator-title {
+      color: var(--color-primary);
+      font-size: 16px;
+      display: block;
+      border-bottom: 1px solid var(--color-silver);
+      line-height: 1.5;
+    }
+    .validator-details {
+      gap: var(--spacing-unit);
+      display: grid;
+      grid-template-columns: 3fr 2fr 1fr;
+      .user-avatar {
+        border: 2px solid transparent;
+        &.avatar--deny {
+          border-color: var(--color-high);
+        }
+        &.avatar--accept {
+          border-color: var(--color-success);
+        }
+        &.avatar--delay {
+          border-color: var(--color-warning);
+        }
+        &.avatar--pending {
+          border-color: var(--color-white);
+        }
+      }
+      .validator-name,
+      .validator-email {
+        color: var(--color-primary);
+        font-size: 14px;
+        font-weight: bold;
+      }
+      .validator-groups {
+        font-size: 14px;
+      }
+      .validator-info {
+        gap: calc(var(--spacing-unit) / 2);
+      }
+      .validator-status {
+        padding: 0 var(--spacing-unit);
+        height: 26px;
+        width: max-content;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        border-radius: 50px;
+        &.success {
+          background-color: #e5f7ed;
+          color: var(--color-success);
+        }
+        &.failed {
+          background-color: var(--color-high-lighter);
+          color: var(--color-high);
+        }
+        &.delay {
+          background-color: #fff4e5;
+          color: var(--color-warning);
+        }
+        &.pending {
+          background-color: rgba(47, 55, 75, 0.05);
+          color: var(--color-primary);
+        }
+      }
+    }
+  }
+}
diff --git a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue
new file mode 100644
index 000000000..90e2978a8
--- /dev/null
+++ b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue
@@ -0,0 +1,202 @@
+<template>
+  <div class="visa-validator-cell" @mouseenter="hovering = true" @mouseleave="hovering = false">
+    <UserAvatarList
+      class="group-card__avatars"
+      :users="validatorsForVisa(visa)"
+      itemSize="28"
+      itemGap="18"
+      :itemClass="(validator) => avatarStatusClass(visa, validator)"
+    />
+
+    <transition name="fade">
+      <div v-show="hovering || showFullValidator" class="visa-validator-cell__details">
+        <span class="validator-title m-b-6">Détails des validants</span>
+
+        <div
+          v-for="validator in validatorsForVisa(visa)"
+          :key="validator.id"
+          class="validator-details flex items-center justify-between m-t-6"
+        >
+          <div class="flex items-center">
+            <UserAvatar :user="validator" size="28" :class="avatarStatusClass(visa, validator)" />
+            <span v-if="validator.firstname && validator.lastname" class="validator-name m-l-6">
+              {{ validator.firstname }} {{ validator.lastname }}
+            </span>
+            <span v-else class="validator-email m-l-6">{{ validator.email }} </span>
+          </div>
+
+          <div class="validator-groups">
+            <span v-if="groupLabelForValidator(validator)" class="validator-group-label">
+              {{ groupLabelForValidator(validator) }}
+            </span>
+
+            <span v-if="!validator.groups.length" class="validator-group validator-group--none">
+              Sans groupe
+            </span>
+          </div>
+
+          <div class="validator-status" :class="statusClasses(validator)">
+            <BIMDataIcon
+              :name="statusIcon(validator)"
+              size="xs"
+              fill
+              color="default"
+              margin="0 6px 0 0"
+            />
+            <span>{{ statusLabel(validator) }}</span>
+          </div>
+        </div>
+      </div>
+    </transition>
+  </div>
+</template>
+
+<script>
+import { computed, ref } from "vue";
+import UserAvatarList from "../../../users/user-avatar-list/UserAvatarList.vue";
+import UserAvatar from "../../../users/user-avatar/UserAvatar.vue";
+import { VALIDATION_STATUS } from "../../../../../config/visa.js";
+import { useGroups } from "../../../../../state/groups.js";
+
+export default {
+  name: "VisaValidatorCell",
+
+  components: {
+    UserAvatarList,
+    UserAvatar,
+  },
+
+  props: {
+    visa: {
+      type: Object,
+      required: true,
+    },
+  },
+
+  setup(props) {
+    const { projectGroups } = useGroups();
+
+    const hovering = ref(false);
+    const showFullValidator = ref(false);
+
+    /**
+     * Map userId -> [groups]
+     */
+    const userIdToGroupsMap = computed(() => {
+      const map = new Map();
+
+      projectGroups.value.forEach((group) => {
+        group.members?.forEach((member) => {
+          if (!map.has(member.id)) {
+            map.set(member.id, []);
+          }
+          map.get(member.id).push(group);
+        });
+      });
+
+      return map;
+    });
+
+    const findGroupsForUser = (validator) => {
+      if (!validator) return [];
+      return userIdToGroupsMap.value.get(validator.id) ?? [];
+    };
+
+    const validatorsForVisa = (visa) =>
+      visa.validations
+        .filter((v) => v.validator)
+        .map((v) => {
+          const groups = findGroupsForUser(v.validator);
+
+          return {
+            ...v.validator,
+            validationStatus: v.status,
+            groups,
+          };
+        });
+
+    const isDelay = (visa) => {
+      const todayDate = new Date();
+      return visa.deadline < todayDate.setDate(todayDate.getDate() - 1);
+    };
+
+    const avatarStatusClass = (visa, validator) => {
+      switch (validator?.validationStatus) {
+        case VALIDATION_STATUS.DENY:
+          return "avatar--deny";
+        case VALIDATION_STATUS.ACCEPT:
+          return "avatar--accept";
+        case VALIDATION_STATUS.PENDING:
+          return isDelay(visa) ? "avatar--delay" : "avatar--pending";
+        default:
+          return "avatar--pending";
+      }
+    };
+
+    const groupLabelForValidator = (validator) => {
+      const groups = validator.groups || [];
+
+      if (!groups.length) {
+        return null;
+      }
+
+      if (groups.length === 1) {
+        return groups[0].name;
+      }
+
+      return `${groups.length} groupes`;
+    };
+
+    const statusIcon = (validator) => {
+      switch (validator?.validationStatus) {
+        case VALIDATION_STATUS.DENY:
+          return "failed";
+        case VALIDATION_STATUS.ACCEPT:
+          return "success";
+        case VALIDATION_STATUS.PENDING:
+          return "sandglass";
+        default:
+          return "sandglass";
+      }
+    };
+    const statusClasses = (validator) => {
+      switch (validator?.validationStatus) {
+        case VALIDATION_STATUS.DENY:
+          return "failed";
+        case VALIDATION_STATUS.ACCEPT:
+          return "success";
+        case VALIDATION_STATUS.PENDING:
+          return isDelay(props.visa) ? "delay" : "pending";
+        default:
+          return "pending";
+      }
+    };
+
+    const statusLabel = (validator) => {
+      switch (validator?.validationStatus) {
+        case VALIDATION_STATUS.DENY:
+          return "Refusé";
+        case VALIDATION_STATUS.ACCEPT:
+          return "Accepté";
+        case VALIDATION_STATUS.PENDING:
+          return isDelay(props.visa) ? "En  retard" : "En attente";
+        default:
+          return "En attente";
+      }
+    };
+
+    return {
+      hovering,
+      showFullValidator,
+      avatarStatusClass,
+      groupLabelForValidator,
+      validatorsForVisa,
+      statusClasses,
+      statusIcon,
+      statusLabel,
+    };
+  },
+};
+</script>
+
+<style scoped src="./VisaValidatorCell.scss" lang="scss"></style>
diff --git a/src/components/specific/users/user-avatar/UserAvatar.vue b/src/components/specific/users/user-avatar/UserAvatar.vue
index 4af0881e1..bdc8ad92b 100644
--- a/src/components/specific/users/user-avatar/UserAvatar.vue
+++ b/src/components/specific/users/user-avatar/UserAvatar.vue
@@ -5,7 +5,7 @@
     :style="{
       width: `${size}px`,
       height: `${size}px`,
-      fontSize: `${initialsSize ? initialsSize : +size * 0.382}px`
+      fontSize: `${initialsSize ? initialsSize : +size * 0.382}px`,
     }"
   >
     <template v-if="user.profile_picture">
@@ -27,37 +27,36 @@ export default {
   props: {
     user: {
       type: Object,
-      required: true
+      required: true,
     },
     size: {
       type: [Number, String],
       default: 32,
-      validate: value => value >= 32
+      validate: (value) => value >= 32,
     },
     initialsSize: {
-      type: [Number, String]
+      type: [Number, String],
     },
     color: {
       type: String,
       default: "primary",
-      validate: value =>
-        ["primary", "secondary", "silver-light"].includes(value)
-    }
+      validate: (value) => ["primary", "secondary", "silver-light"].includes(value),
+    },
   },
   setup(props) {
     /* eslint-disable */
-    const initials = computed(
-      () => (
-        `${props.user.firstname && props.user.firstname[0] || ""}`
-        + `${props.user.lastname && props.user.lastname[0] || ""}`
-      ).toUpperCase()
+    const initials = computed(() =>
+      (
+        `${(props.user.firstname && props.user.firstname[0]) || ""}` +
+        `${(props.user.lastname && props.user.lastname[0]) || ""}`
+      ).toUpperCase(),
     );
     /* eslint-enable */
 
     return {
-      initials
+      initials,
     };
-  }
+  },
 };
 </script>
 

From 64763ef9314ceee5e4645b02660b43bf7bbb2be6 Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Fri, 6 Feb 2026 16:14:30 +0100
Subject: [PATCH 4/9] fix display visa

---
 .../specific/visa/visa-main/VisaMain.vue      | 20 +++++++++----------
 .../visa/visa-summary/VisaSummary.vue         |  3 ++-
 .../VisaSummaryValidator.vue                  |  1 -
 3 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/components/specific/visa/visa-main/VisaMain.vue b/src/components/specific/visa/visa-main/VisaMain.vue
index 35caaca93..9f44b5fbc 100644
--- a/src/components/specific/visa/visa-main/VisaMain.vue
+++ b/src/components/specific/visa/visa-main/VisaMain.vue
@@ -32,20 +32,20 @@ import VisaSummary from "../visa-summary/VisaSummary.vue";
 export default {
   components: {
     VisaAdd,
-    VisaSummary
+    VisaSummary,
   },
   props: {
     project: {
       type: Object,
-      required: true
+      required: true,
     },
     document: {
       type: Object,
-      required: true
+      required: true,
     },
     visa: {
       type: Object,
-      required: false
+      required: false,
     },
   },
   emits: ["create-visa", "fetch-visas", "close", "preview-visa", "reach-file"],
@@ -56,14 +56,14 @@ export default {
 
     const currentView = ref(currentVisa.value.document ? "visaSummary" : "visaAdd");
 
-    const createVisa = async visa => {
+    const createVisa = async (visa) => {
       currentVisa.value = await fetchVisa(props.project, visa);
       currentView.value = "visaSummary";
-      emit('fetch-visas');
-      emit('create-visa');
+      emit("fetch-visas");
+      emit("create-visa");
     };
 
-    const reachVisa = visa => {
+    const reachVisa = (visa) => {
       currentVisa.value = visa;
       currentView.value = "visaSummary";
     };
@@ -80,9 +80,9 @@ export default {
       // methods
       createVisa,
       reachVisa,
-      closeVisa
+      closeVisa,
     };
-  }
+  },
 };
 </script>
 
diff --git a/src/components/specific/visa/visa-summary/VisaSummary.vue b/src/components/specific/visa/visa-summary/VisaSummary.vue
index 4224359f5..668c75fd0 100644
--- a/src/components/specific/visa/visa-summary/VisaSummary.vue
+++ b/src/components/specific/visa/visa-summary/VisaSummary.vue
@@ -349,7 +349,8 @@ export default {
       }
       isClosed.value = props.visa.status === VISA_STATUS.CLOSE;
       userProjectList.value = await fetchDocumentUsers(props.visa);
-      formatedVisa.value = formatVisa(props.visa);
+      const visa = await fetchVisa(props.project, props.visa);
+      formatedVisa.value = formatVisa(visa);
     });
 
     const reloadVisa = async () => {
diff --git a/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.vue b/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.vue
index 31d3ab266..782692e5d 100644
--- a/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.vue
+++ b/src/components/specific/visa/visa-summary/visa-summary-validator/VisaSummaryValidator.vue
@@ -118,7 +118,6 @@ export default {
 
     const validationStatus = (user) => {
       const { hasCommented, status } = user;
-
       if (hasCommented && status === VALIDATION_STATUS.PENDING) {
         return "commented";
       } else if (

From 466b2fa78a4fa65ad32eab8f1ddc7ed17d6eef1c Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Fri, 6 Feb 2026 16:35:23 +0100
Subject: [PATCH 5/9] fix validator-details display

---
 .../visas-table/visa-validator-cell/VisaValidatorCell.scss      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
index 01069abd5..3c02fe349 100644
--- a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
+++ b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
@@ -23,7 +23,7 @@
     .validator-details {
       gap: var(--spacing-unit);
       display: grid;
-      grid-template-columns: 3fr 2fr 1fr;
+      grid-template-columns: minmax(200px, 1fr) minmax(150px, 1fr) minmax(100px, 1fr);
       .user-avatar {
         border: 2px solid transparent;
         &.avatar--deny {

From 8f5aa3a329bb38587c6c4901f55dd9477d406a71 Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Mon, 9 Feb 2026 16:36:11 +0100
Subject: [PATCH 6/9] fix open-top or open-bottom for VisaValidatorCell
 component

---
 .../specific/files/visas-table/VisasTable.vue |  4 --
 .../VisaValidatorCell.scss                    | 11 ++++-
 .../visa-validator-cell/VisaValidatorCell.vue | 42 ++++++++++++++++---
 3 files changed, 46 insertions(+), 11 deletions(-)

diff --git a/src/components/specific/files/visas-table/VisasTable.vue b/src/components/specific/files/visas-table/VisasTable.vue
index e54fde255..3d2f9e73e 100644
--- a/src/components/specific/files/visas-table/VisasTable.vue
+++ b/src/components/specific/files/visas-table/VisasTable.vue
@@ -205,15 +205,11 @@ export default {
       user,
       fullName,
       enhancedVisas,
-      //groupsForVisa,
-      // groupDisplayForVisa,
       isCreator,
       isDelay,
       statusClasses,
-      // avatarStatusClass,
       statusIcon,
       validationClasses,
-      // validatorsForVisa,
       validationIcon,
     };
   },
diff --git a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
index 3c02fe349..69a82c0cc 100644
--- a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
+++ b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.scss
@@ -8,11 +8,20 @@
     position: absolute;
     background-color: var(--color-white);
     z-index: 10;
-    top: -6px;
     left: -12px;
     border-radius: 8px;
     box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
 
+    &.open-top {
+      top: auto;
+      bottom: -6px;
+    }
+
+    &.open-bottom {
+      top: -6px;
+      bottom: auto;
+    }
+
     .validator-title {
       color: var(--color-primary);
       font-size: 16px;
diff --git a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue
index 90e2978a8..176aba384 100644
--- a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue
+++ b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue
@@ -1,5 +1,10 @@
 <template>
-  <div class="visa-validator-cell" @mouseenter="hovering = true" @mouseleave="hovering = false">
+  <div
+    class="visa-validator-cell"
+    ref="cellRef"
+    @mouseenter="hovering = true"
+    @mouseleave="hovering = false"
+  >
     <UserAvatarList
       class="group-card__avatars"
       :users="validatorsForVisa(visa)"
@@ -9,7 +14,12 @@
     />
 
     <transition name="fade">
-      <div v-show="hovering || showFullValidator" class="visa-validator-cell__details">
+      <div
+        v-if="hovering || showFullValidator"
+        ref="detailsRef"
+        class="visa-validator-cell__details"
+        :class="openDirection"
+      >
         <span class="validator-title m-b-6">Détails des validants</span>
 
         <div
@@ -52,7 +62,7 @@
 </template>
 
 <script>
-import { computed, ref } from "vue";
+import { computed, ref, nextTick, watch } from "vue";
 import UserAvatarList from "../../../users/user-avatar-list/UserAvatarList.vue";
 import UserAvatar from "../../../users/user-avatar/UserAvatar.vue";
 import { VALIDATION_STATUS } from "../../../../../config/visa.js";
@@ -76,12 +86,13 @@ export default {
   setup(props) {
     const { projectGroups } = useGroups();
 
+    const openDirection = ref("open-bottom");
     const hovering = ref(false);
     const showFullValidator = ref(false);
 
-    /**
-     * Map userId -> [groups]
-     */
+    const cellRef = ref(null);
+    const detailsRef = ref(null);
+
     const userIdToGroupsMap = computed(() => {
       const map = new Map();
 
@@ -185,9 +196,28 @@ export default {
       }
     };
 
+    watch(hovering, async (isHovering) => {
+      if (!isHovering) return;
+
+      await nextTick();
+
+      if (!cellRef.value || !detailsRef.value) return;
+
+      const cellRect = cellRef.value.getBoundingClientRect();
+      const detailsHeight = detailsRef.value.offsetHeight;
+      const viewportHeight = window.innerHeight;
+
+      const spaceBelow = viewportHeight - cellRect.bottom;
+
+      openDirection.value = spaceBelow >= detailsHeight ? "open-bottom" : "open-top";
+    });
+
     return {
       hovering,
+      openDirection,
       showFullValidator,
+      cellRef,
+      detailsRef,
       avatarStatusClass,
       groupLabelForValidator,
       validatorsForVisa,

From ae3bcc53a8d13bd01e5985afae622e596a18dc57 Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Mon, 9 Feb 2026 17:30:12 +0100
Subject: [PATCH 7/9] add translations for VisaValidatorCell component

---
 .../visa-validator-cell/VisaValidatorCell.vue | 38 ++++++++++---------
 src/i18n/lang/en.json                         |  9 +++++
 src/i18n/lang/fr.json                         |  9 +++++
 3 files changed, 38 insertions(+), 18 deletions(-)

diff --git a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue
index 176aba384..301272b0e 100644
--- a/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue
+++ b/src/components/specific/files/visas-table/visa-validator-cell/VisaValidatorCell.vue
@@ -20,7 +20,7 @@
         class="visa-validator-cell__details"
         :class="openDirection"
       >
-        <span class="validator-title m-b-6">Détails des validants</span>
+        <span class="validator-title m-b-6">{{ $t("Visa.VisaValidatorCell.title") }}</span>
 
         <div
           v-for="validator in validatorsForVisa(visa)"
@@ -36,12 +36,20 @@
           </div>
 
           <div class="validator-groups">
-            <span v-if="groupLabelForValidator(validator)" class="validator-group-label">
-              {{ groupLabelForValidator(validator) }}
+            <span
+              v-if="validator.groups.length > 1"
+              class="validator-group validator-group--multiple"
+            >
+              {{ $t("Visa.VisaValidatorCell.multipleGroups", { count: validator.groups.length }) }}
             </span>
-
-            <span v-if="!validator.groups.length" class="validator-group validator-group--none">
-              Sans groupe
+            <span
+              v-else-if="!validator.groups.length"
+              class="validator-group validator-group--none"
+            >
+              {{ $t("Visa.VisaValidatorCell.noGroup") }}
+            </span>
+            <span v-else class="validator-group-label">
+              {{ groupLabelForValidator(validator) }}
             </span>
           </div>
 
@@ -53,7 +61,7 @@
               color="default"
               margin="0 6px 0 0"
             />
-            <span>{{ statusLabel(validator) }}</span>
+            <span>{{ $t(`Visa.VisaValidatorCell.${statusLabel(validator)}`) }}</span>
           </div>
         </div>
       </div>
@@ -145,17 +153,11 @@ export default {
     };
 
     const groupLabelForValidator = (validator) => {
-      const groups = validator.groups || [];
-
-      if (!groups.length) {
-        return null;
-      }
+      const groups = validator.groups;
 
       if (groups.length === 1) {
         return groups[0].name;
       }
-
-      return `${groups.length} groupes`;
     };
 
     const statusIcon = (validator) => {
@@ -186,13 +188,13 @@ export default {
     const statusLabel = (validator) => {
       switch (validator?.validationStatus) {
         case VALIDATION_STATUS.DENY:
-          return "Refusé";
+          return "deny";
         case VALIDATION_STATUS.ACCEPT:
-          return "Accepté";
+          return "accept";
         case VALIDATION_STATUS.PENDING:
-          return isDelay(props.visa) ? "En  retard" : "En attente";
+          return isDelay(props.visa) ? "delayed" : "pending";
         default:
-          return "En attente";
+          return "pending";
       }
     };
 
diff --git a/src/i18n/lang/en.json b/src/i18n/lang/en.json
index bae3ed3a4..c0009c4be 100644
--- a/src/i18n/lang/en.json
+++ b/src/i18n/lang/en.json
@@ -690,6 +690,15 @@
     "selectionValidator": {
       "warning": "This user cannot access the file."
     },
+    "VisaValidatorCell": {
+      "title": "Visa details",
+      "noGroup": "No group",
+      "accept": "Accepted",
+      "delayed": "Delayed",
+      "deny": "Denied",
+      "pending": "Pending",
+      "multipleGroups": "{count} groups"
+    },
     "noVisa": "A VISA has not yet been created",
     "accept": "Accept",
     "close": "Close",
diff --git a/src/i18n/lang/fr.json b/src/i18n/lang/fr.json
index 57d898361..42dc966f4 100644
--- a/src/i18n/lang/fr.json
+++ b/src/i18n/lang/fr.json
@@ -798,6 +798,15 @@
         "refresh": "Réinitialiser la validation"
       }
     },
+    "VisaValidatorCell": {
+      "title": "Détails des validants",
+      "noGroup": "Sans groupe",
+      "accept": "Validé",
+      "delayed": "En retard",
+      "deny": "Refusé",
+      "pending": "En attente",
+      "multipleGroups": "{count} groupes"
+    },
     "comments": {
       "commentary": "Commentaire",
       "commentInputPlaceholder": "Poster un commentaire",

From c00fe94277a3c086dc793a168c53c8de5f60ed84 Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Tue, 10 Feb 2026 07:45:13 +0100
Subject: [PATCH 8/9] add missing translations

---
 src/i18n/lang/en.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/i18n/lang/en.json b/src/i18n/lang/en.json
index c0009c4be..63d5ac73e 100644
--- a/src/i18n/lang/en.json
+++ b/src/i18n/lang/en.json
@@ -981,4 +981,4 @@
     "title": "Delete {visasCount} visas",
     "message": "You are about to delete the visas on the following files:"
   }
-}
\ No newline at end of file
+}

From 0484fee6d400ede2d98ca6e78222b57fc16ebd00 Mon Sep 17 00:00:00 2001
From: Gaelle <gaelle@bimdata.io>
Date: Tue, 10 Feb 2026 07:49:43 +0100
Subject: [PATCH 9/9] delete unused props

---
 .../specific/users/user-avatar-list/UserAvatarList.vue       | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/src/components/specific/users/user-avatar-list/UserAvatarList.vue b/src/components/specific/users/user-avatar-list/UserAvatarList.vue
index b5bc8583d..3ae1dddff 100644
--- a/src/components/specific/users/user-avatar-list/UserAvatarList.vue
+++ b/src/components/specific/users/user-avatar-list/UserAvatarList.vue
@@ -13,7 +13,6 @@
       :user="user"
       :size="itemSize"
       :class="itemClass ? itemClass(user) : null"
-      :style="{ 'border-color': borderColor }"
     />
     <template v-if="users.length > length">
       <div
@@ -58,10 +57,6 @@ export default {
       type: Function,
       default: null,
     },
-    borderColor: {
-      type: String,
-      default: null,
-    },
     fixedWidth: {
       type: Boolean,
       default: false,