fix: VideoConf message not considers display avatar pref

.changeset/yellow-cars-change.md

@@ -0,0 +1,8 @@
+---
+'@rocket.chat/fuselage-ui-kit': patch
+'@rocket.chat/ui-video-conf': patch
+'@rocket.chat/i18n': patch
+'@rocket.chat/meteor': patch
+---
+
+Fixes an issue where video conf message block wasn't considering display avatars preference

apps/meteor/client/views/room/contextualBar/VideoConference/VideoConfList/VideoConfListItem.tsx

@@ -106,7 +106,7 @@ const VideoConfListItem = ({
 								</Avatar.Stack>
 								<Box mis={4}>
 									{joinedUsers.length > VIDEOCONF_STACK_MAX_USERS
-										? t('__usersCount__member_joined', { count: joinedUsers.length - VIDEOCONF_STACK_MAX_USERS })
+										? t('__usersCount__joined', { count: joinedUsers.length - VIDEOCONF_STACK_MAX_USERS })
 										: t('joined')}
 								</Box>
 							</Box>

apps/meteor/tests/e2e/page-objects/fragments/home-content.ts

@@ -365,6 +365,10 @@ export class HomeContent {
 		return this.page.locator('.rcx-videoconf-message-block');
 	}
 
+	get videoConfMessageBlockAvatars(): Locator {
+		return this.videoConfMessageBlock.getByLabel('figure');
+	}
+
 	get btnAnonymousSignIn(): Locator {
 		return this.page.locator('footer >> role=button[name="Sign in to start talking"]');
 	}

apps/meteor/tests/e2e/utils/index.ts

@@ -1,3 +1,4 @@
 export * from './create-target-channel';
 export * from './setSettingValueById';
 export * from './getSettingValueById';
+export * from './setUserPreferences';

apps/meteor/tests/e2e/video-conference.spec.ts

@@ -1,7 +1,7 @@
 import { IS_EE } from './config/constants';
 import { Users } from './fixtures/userStates';
 import { HomeChannel } from './page-objects';
-import { createTargetChannel, createTargetTeam, createDirectMessage } from './utils';
+import { createTargetChannel, setUserPreferences, createTargetTeam, createDirectMessage } from './utils';
 import { expect, test } from './utils/test';
 
 test.use({ storageState: Users.user1.state });
@@ -35,6 +35,24 @@ test.describe('video conference', () => {
 		await expect(poHomeChannel.content.videoConfMessageBlock.last()).toBeVisible();
 	});
 
+	test.describe('test video conference message block', async () => {
+		test.use({ storageState: Users.admin.state });
+
+		test.beforeAll(async ({ api }) => {
+			await setUserPreferences(api, { displayAvatars: false });
+		});
+
+		test.afterAll(async ({ api }) => {
+			await setUserPreferences(api, { displayAvatars: true });
+		});
+
+		test('should not render avatars in video conference message block', async () => {
+			await poHomeChannel.sidenav.openChat(targetChannel);
+
+			await expect(poHomeChannel.content.videoConfMessageBlock.last().getByRole('figure')).toHaveCount(0);
+		});
+	});
+
 	test.describe('test received in a "target channel"', async () => {
 		test.use({ storageState: Users.user2.state });
 		test('verify if user received a invite call from "targetChannel"', async () => {

packages/fuselage-ui-kit/src/blocks/VideoConferenceBlock/VideoConferenceBlock.tsx

@@ -1,8 +1,10 @@
 import { VideoConferenceStatus } from '@rocket.chat/core-typings';
 import {
   useGoToRoom,
+  useSetting,
   useTranslation,
   useUserId,
+  useUserPreference,
 } from '@rocket.chat/ui-contexts';
 import type * as UiKit from '@rocket.chat/ui-kit';
 import {
@@ -20,7 +22,7 @@ import {
   VideoConfMessageAction,
 } from '@rocket.chat/ui-video-conf';
 import type { MouseEventHandler, ReactElement } from 'react';
-import { useContext, memo } from 'react';
+import { useContext, memo, useCallback } from 'react';
 
 import { UiKitContext } from '../..';
 import { useVideoConfDataStream } from './hooks/useVideoConfDataStream';
@@ -39,6 +41,8 @@ const VideoConferenceBlock = ({
   const surfaceType = useSurfaceType();
   const userId = useUserId();
   const goToRoom = useGoToRoom();
+  const displayAvatars = useUserPreference<boolean>('displayAvatars');
+  const showRealName = useSetting('UI_Use_Real_Name');
 
   const { action, viewId = undefined, rid } = useContext(UiKitContext);
 
@@ -97,6 +101,23 @@ const VideoConferenceBlock = ({
     }
   };
 
+  const getMessageFooterText = useCallback(
+    (usersCount: number): string => {
+      if (!displayAvatars) {
+        return t('__usersCount__joined', {
+          count: usersCount,
+        });
+      }
+
+      return usersCount > MAX_USERS
+        ? t('plus__usersCount__joined', {
+            count: usersCount - MAX_USERS,
+          })
+        : t('joined');
+    },
+    [displayAvatars, t],
+  );
+
   if (result.isPending || result.isError) {
     // TODO: error handling
     return <VideoConfMessageSkeleton />;
@@ -105,6 +126,21 @@ const VideoConferenceBlock = ({
   const { data } = result;
   const isUserCaller = data.createdBy._id === userId;
 
+  const messageFooterText = getMessageFooterText(data.users.length);
+
+  const joinedUsernames = [...data.users]
+    .splice(0, MAX_USERS)
+    .map(({ name, username }) => (showRealName ? name : username))
+    .join(', ');
+
+  const iconTitle =
+    data.users.length > MAX_USERS
+      ? t('__usernames__and__count__more_joined', {
+          usernames: joinedUsernames,
+          count: data.users.length - MAX_USERS,
+        })
+      : t('__usernames__joined', { usernames: joinedUsernames });
+
   const actions = (
     <VideoConfMessageActions>
       {data.discussionRid && (
@@ -147,13 +183,14 @@ const VideoConferenceBlock = ({
           {data.type !== 'direct' &&
             (data.users.length ? (
               <>
-                <VideoConfMessageUserStack users={data.users} />
+                <VideoConfMessageUserStack
+                  displayAvatars={displayAvatars}
+                  showRealName={showRealName}
+                  iconTitle={iconTitle}
+                  users={data.users}
+                />
                 <VideoConfMessageFooterText>
-                  {data.users.length > MAX_USERS
-                    ? t('__usersCount__member_joined', {
-                        usersCount: data.users.length - MAX_USERS,
-                      })
-                    : t('joined')}
+                  {messageFooterText}
                 </VideoConfMessageFooterText>
               </>
             ) : (
@@ -205,13 +242,14 @@ const VideoConferenceBlock = ({
         </VideoConfMessageButton>
         {Boolean(data.users.length) && (
           <>
-            <VideoConfMessageUserStack users={data.users} />
+            <VideoConfMessageUserStack
+              displayAvatars={displayAvatars}
+              showRealName={showRealName}
+              users={data.users}
+              iconTitle={iconTitle}
+            />
             <VideoConfMessageFooterText>
-              {data.users.length > MAX_USERS
-                ? t('__usersCount__member_joined', {
-                    count: data.users.length - MAX_USERS,
-                  })
-                : t('joined')}
+              {messageFooterText}
             </VideoConfMessageFooterText>
           </>
         )}

packages/i18n/src/locales/af.i18n.json

@@ -1408,7 +1408,6 @@
   "Join_video_call": "Sluit aan by 'n video-oproep",
   "join-without-join-code": "Sluit aan by geen Kode",
   "join-without-join-code_description": "Toestemming om die aansluit kode in kanale te omseil met die bykomende kode geaktiveer",
-  "Joined": "Aangesluit",
   "Jump": "Spring",
   "Jump_to_first_unread": "Spring na eerste ongelees",
   "Jump_to_message": "Spring na boodskap",

packages/i18n/src/locales/ar.i18n.json

@@ -2330,7 +2330,6 @@
   "Join_my_room_to_start_the_video_call": "انضمام إلى غرفتي لبدء مكالمة الفيديو",
   "join-without-join-code": "الانضمام من دون رمز الانضمام",
   "join-without-join-code_description": "إذن لتجاوز رمز الانضمام في القنوات مع تمكين رمز الانضمام",
-  "Joined": "تم الانضمام",
   "Joined_at": "تم الانضمام في",
   "Jump": "الانتقال السريع",
   "Jump_to_first_unread": "الذهاب السريع إلى أول رسالة غير مقروءة",
@@ -4875,4 +4874,4 @@
   "Enterprise": "مؤسسة",
   "UpgradeToGetMore_engagement-dashboard_Title": "التحليلات",
   "UpgradeToGetMore_auditing_Title": "تدقيق الرسائل"
-}
+}

packages/i18n/src/locales/az.i18n.json

@@ -1408,7 +1408,6 @@
   "Join_video_call": "Video zənginə qoşulun",
   "join-without-join-code": "Qoşulma Kodunu Olmadan Qeyd Olun",
   "join-without-join-code_description": "Birləşmə kodunu aktivləşdirən kanallarda qoşulma kodunu atmaq üçün icazə",
-  "Joined": "Qoşulmuşdur",
   "Jump": "Tullanmaq",
   "Jump_to_first_unread": "İlk okunmamışa keç",
   "Jump_to_message": "Mesaja atlayın",

packages/i18n/src/locales/be-BY.i18n.json

@@ -1424,7 +1424,6 @@
   "Join_video_call": "рэгістрацыя гутарку",
   "join-without-join-code": "Рэгістрацыя без рэгістрацыі коды",
   "join-without-join-code_description": "Дазвол на абыход далучыцца код у каналах з падтрымкай далучыцца код",
-  "Joined": "рэгістрацыя",
   "Jump": "перайсці",
   "Jump_to_first_unread": "Перайсці да першага непрачытанага",
   "Jump_to_message": "Перайсці да паведамлення",

packages/i18n/src/locales/bg.i18n.json

@@ -1406,7 +1406,6 @@
   "Join_video_call": "Включете видеообаждането",
   "join-without-join-code": "Присъединете се без кода за присъединяване",
   "join-without-join-code_description": "Разрешено е да заобиколите кода за присъединяване в канали с включен код за включване",
-  "Joined": "Присъединиха",
   "Jump": "Направо",
   "Jump_to_first_unread": "Премини към първите непрочетени",
   "Jump_to_message": "Отидете на съобщението",

packages/i18n/src/locales/bs.i18n.json

@@ -1404,7 +1404,6 @@
   "Join_video_call": "Pridružite se videopozivu",
   "join-without-join-code": "Pridružite se bez pridruživanja kodu",
   "join-without-join-code_description": "Dozvola za zaobilaženje pridruženog koda u kanalima s omogućenim pridruženim kodom",
-  "Joined": "Član od",
   "Jump": "Skok",
   "Jump_to_first_unread": "Skoči na prvu nepročitanu",
   "Jump_to_message": "Skoči na poruku",

packages/i18n/src/locales/ca.i18n.json

@@ -2298,7 +2298,6 @@
   "Join_my_room_to_start_the_video_call": "Uneix-te a la meva  sala per iniciar la videotrucada",
   "join-without-join-code": "Unir-se sense el codi",
   "join-without-join-code_description": "Permís per unir-se a canals amb codi d'unió actiu sense tenir-lo",
-  "Joined": "Unit",
   "Joined_at": "Inscrit a",
   "Jump": "Saltar",
   "Jump_to_first_unread": "Anar al primer no llegit",
@@ -4677,4 +4676,4 @@
   "Enterprise": "Empresa",
   "UpgradeToGetMore_engagement-dashboard_Title": "Analítiques",
   "UpgradeToGetMore_auditing_Title": "Auditoria de missatges"
-}
+}

packages/i18n/src/locales/cs.i18n.json

@@ -1987,7 +1987,6 @@
   "Join_video_call": "Připojit k videohovoru",
   "join-without-join-code": "Připojit se i do místností bez kódu",
   "join-without-join-code_description": "Právo přeskočit připojit bez zadávání kódu do místností, které jej vyžadují",
-  "Joined": "Připojil",
   "Joined_at": "Připojen/a",
   "Jump": "Přejít",
   "Jump_to_first_unread": "Přejít na první nepřečtenou",
@@ -3963,4 +3962,4 @@
   "Enterprise": "Korporace",
   "UpgradeToGetMore_engagement-dashboard_Title": "Analytika",
   "UpgradeToGetMore_auditing_Title": "Audit zpráv"
-}
+}

packages/i18n/src/locales/cy.i18n.json

@@ -1404,7 +1404,6 @@
   "Join_video_call": "Ymunwch â ffōn fideo",
   "join-without-join-code": "Ymunwch Heb Ymuno â Chod",
   "join-without-join-code_description": "Caniatâd i osgoi'r cod ymuno mewn sianelau a chodir cod ymuno",
-  "Joined": "Ymunodd",
   "Jump": "Neidio",
   "Jump_to_first_unread": "Neidio i ddarllen heb ei ddarllen gyntaf",
   "Jump_to_message": "Neidio i neges",

packages/i18n/src/locales/da.i18n.json

@@ -2076,7 +2076,6 @@
   "Join_video_call": "Deltag i videoopkald",
   "join-without-join-code": "Join uden join-kode",
   "join-without-join-code_description": "Tilladelse til at omgå join-kode i kanaler med join-kode aktiveret",
-  "Joined": "Tilsluttede",
   "Joined_at": "Tilsluttet ved ",
   "Jump": "Gå",
   "Jump_to_first_unread": "Gå til første ulæste",
@@ -4075,4 +4074,4 @@
   "Enterprise": "Firma",
   "UpgradeToGetMore_engagement-dashboard_Title": "Analyse",
   "UpgradeToGetMore_auditing_Title": "Meddelelsesovervågning"
-}
+}

packages/i18n/src/locales/de-AT.i18n.json

@@ -1410,7 +1410,6 @@
   "Join_video_call": "Videoanruf beitreten",
   "join-without-join-code": "Join ohne Join-Code",
   "join-without-join-code_description": "Berechtigung zum Umgehen des Join-Codes in Kanälen mit aktiviertem Join-Code",
-  "Joined": "Beigetreten",
   "Jump": "Springen",
   "Jump_to_first_unread": "Erste ungelesene Nachricht anzeigen",
   "Jump_to_message": "Diese Nachricht im Chat anzeigen",

packages/i18n/src/locales/de-IN.i18n.json

@@ -1605,7 +1605,6 @@
   "Join_video_call": "Videoanruf beitreten",
   "join-without-join-code": "Ohne Code beitreten",
   "join-without-join-code_description": "Berechtigung, Kanäle mit Zutrittscode auch ohne Code zu betreten",
-  "Joined": "Beigetreten",
   "Jump": "Springen",
   "Jump_to_first_unread": "Erste ungelesene Nachricht anzeigen",
   "Jump_to_message": "Diese Nachricht im Chat anzeigen",
@@ -3073,4 +3072,4 @@
   "Your_question": "Deine Frage",
   "Your_server_link": "Dein Server-Link",
   "Your_workspace_is_ready": "Dein Arbeitsbereich ist einsatzbereit 🎉"
-}
+}

packages/i18n/src/locales/de.i18n.json

@@ -4,8 +4,6 @@
   "__count__empty_rooms_will_be_removed_automatically__rooms__": "{{count}} leere Räume werden automatisch entfernt:<br/> {{rooms}}.",
   "__count__message_pruned_one": "{{count}} Nachricht gelöscht",
   "__count__message_pruned_other": "{{count}} Nachrichten gelöscht",
-  "__usersCount__member_joined_one": "+ {{count}} Mitglied(er) beigetreten",
-  "__usersCount__member_joined_other": "+ {{count}} Mitglieder beigetreten",
   "__usersCount__people_will_be_invited": "{{usersCount}} Mitglieder werden eingeladen",
   "__username__is_no_longer__role__defined_by__user_by_": "{{username}} ist nicht länger {{role}}, geändert durch {{user_by}}",
   "__username__was_set__role__by__user_by_": "{{username}} ist jetzt {{role}}, geändert durch {{user_by}}",
@@ -2587,7 +2585,6 @@
   "Join_my_room_to_start_the_video_call": "Meinen Raum betreten, um den Videoanruf zu starten",
   "join-without-join-code": "Ohne Code beitreten",
   "join-without-join-code_description": "Berechtigung, Channels mit Zutrittscode auch ohne Code zu betreten",
-  "Joined": "Beigetreten",
   "joined": "beigetreten",
   "Joined_at": "Beigetreten am",
   "JSON": "JSON",

packages/i18n/src/locales/el.i18n.json

@@ -1415,7 +1415,6 @@
   "Join_video_call": "Συμμετοχή στην κλήση βίντεο",
   "join-without-join-code": "Συμμετοχή χωρίς κωδικό σύνδεσης",
   "join-without-join-code_description": "Επιτρέπεται η παράκαμψη του κωδικού σύνδεσης σε κανάλια με ενεργοποιημένο τον κωδικό πρόσβασης",
-  "Joined": "Εντάχθηκαν",
   "Jump": "Άλμα",
   "Jump_to_first_unread": "Μετάβαση σε πρώτη αδιάβαστη",
   "Jump_to_message": "Μετάβαση σε μήνυμα",

packages/i18n/src/locales/en.i18n.json

@@ -12,8 +12,10 @@
   "__count__follower_other": "+{{count}} followers",
   "__count__tags__and__count__conversations__period__": "{{count}} tags and {{conversations}} conversations, {{period}}",
   "__departments__departments_and__count__conversations__period__": "{{departments}} departments and {{count}} conversations, {{period}}",
-  "__usersCount__member_joined_one": "+ {{count}} member joined",
-  "__usersCount__member_joined_other": "+ {{count}} members joined",
+  "__usersCount__joined": "{{count}} joined",
+  "plus__usersCount__joined": "+ {{count}} joined",
+  "__usernames__joined": "{{usernames}} joined",
+  "__usernames__and__count__more_joined": "{{usernames}} and {{count}} more joined",
   "__usersCount__people_will_be_invited": "{{usersCount}} people will be invited",
   "__username__is_no_longer__role__defined_by__user_by_": "{{username}} is no longer {{role}} by {{user_by}}",
   "__username__was_set__role__by__user_by_": "{{username}} was set {{role}} by {{user_by}}",
@@ -2983,7 +2985,6 @@
   "Join_my_room_to_start_the_video_call": "Join my room to start the video call",
   "join-without-join-code": "Join Without Join Code",
   "join-without-join-code_description": "Permission to bypass the join code in channels with join code enabled",
-  "Joined": "Joined",
   "joined": "joined",
   "Joined_at": "Joined at",
   "JSON": "JSON",

packages/i18n/src/locales/eo.i18n.json

@@ -1408,7 +1408,6 @@
   "Join_video_call": "Aliĝi al videolvoko",
   "join-without-join-code": "Aliĝu Sen Aliĝilo",
   "join-without-join-code_description": "Permeso por preterlasi la unuigitan kodon en kanaloj kun unuiga kodo ebligita",
-  "Joined": "Kunvenita",
   "Jump": "Saltu",
   "Jump_to_first_unread": "Saltu al unua nelegebla",
   "Jump_to_message": "Saltu mesaĝon",