From dad396273c95c015e4268604dde319ffb6ea9f81 Mon Sep 17 00:00:00 2001
From: lebaudantoine <lebaud.antoine131@gmail.com>
Date: Thu, 13 Nov 2025 18:18:48 +0100
Subject: [PATCH] =?UTF-8?q?=E2=99=BF=EF=B8=8F(frontend)=20hide=20decorativ?=
 =?UTF-8?q?e=20icons=20from=20screen=20readers=20per=20issue=20#730?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Mark unnecessary decorative icons as aria-hidden following feedback
from @cyberbaloo to eliminate redundant screen reader announcements
that create noisy and annoying experience for users relying on
assistive technologies.
---
 .../home/components/LaterMeetingDialog.tsx    | 21 ++++++++++++++++---
 .../rooms/components/InviteDialog.tsx         | 13 ++++++++++--
 .../rooms/livekit/components/Info.tsx         | 12 +++++++++--
 3 files changed, 39 insertions(+), 7 deletions(-)

diff --git a/src/frontend/src/features/home/components/LaterMeetingDialog.tsx b/src/frontend/src/features/home/components/LaterMeetingDialog.tsx
index 526c61ef..24cddea8 100644
--- a/src/frontend/src/features/home/components/LaterMeetingDialog.tsx
+++ b/src/frontend/src/features/home/components/LaterMeetingDialog.tsx
@@ -71,7 +71,11 @@ export const LaterMeetingDialog = ({
                     aria-label={t('copyUrl')}
                     tooltip={t('copyUrl')}
                   >
-                    {isRoomUrlCopied ? <RiCheckLine /> : <RiFileCopyLine />}
+                    {isRoomUrlCopied ? (
+                      <RiCheckLine aria-hidden="true" />
+                    ) : (
+                      <RiFileCopyLine aria-hidden="true" />
+                    )}
                   </Button>
                 )}
               </div>
@@ -103,13 +107,18 @@ export const LaterMeetingDialog = ({
               >
                 {isCopied ? (
                   <>
-                    <RiCheckLine size={18} style={{ marginRight: '8px' }} />
+                    <RiCheckLine
+                      size={18}
+                      style={{ marginRight: '8px' }}
+                      aria-hidden="true"
+                    />
                     {t('copied')}
                   </>
                 ) : (
                   <>
                     <RiFileCopyLine
                       style={{ marginRight: '6px', minWidth: '18px' }}
+                      aria-hidden="true"
                     />
                     {t('copy')}
                   </>
@@ -131,7 +140,11 @@ export const LaterMeetingDialog = ({
             >
               {isCopied ? (
                 <>
-                  <RiCheckLine size={18} style={{ marginRight: '8px' }} />
+                  <RiCheckLine
+                    size={18}
+                    style={{ marginRight: '8px' }}
+                    aria-hidden="true"
+                  />
                   {t('copied')}
                 </>
               ) : (
@@ -139,6 +152,7 @@ export const LaterMeetingDialog = ({
                   <RiFileCopyLine
                     size={18}
                     style={{ marginRight: '8px', minWidth: '18px' }}
+                    aria-hidden="true"
                   />
                   {isHovered ? (
                     t('copy')
@@ -173,6 +187,7 @@ export const LaterMeetingDialog = ({
                   className={css({
                     fill: 'primary.500',
                   })}
+                  aria-hidden="true"
                 />
               </div>
               <Text variant="sm" style={{ marginTop: '1rem' }}>
diff --git a/src/frontend/src/features/rooms/components/InviteDialog.tsx b/src/frontend/src/features/rooms/components/InviteDialog.tsx
index 63338280..8bc1d1a5 100644
--- a/src/frontend/src/features/rooms/components/InviteDialog.tsx
+++ b/src/frontend/src/features/rooms/components/InviteDialog.tsx
@@ -115,7 +115,11 @@ export const InviteDialog = (props: Omit<DialogProps, 'title'>) => {
                     aria-label={t('copyUrl')}
                     tooltip={t('copyUrl')}
                   >
-                    {isRoomUrlCopied ? <RiCheckLine /> : <RiFileCopyLine />}
+                    {isRoomUrlCopied ? (
+                      <RiCheckLine aria-hidden="true" />
+                    ) : (
+                      <RiFileCopyLine aria-hidden="true" />
+                    )}
                   </Button>
                 )}
               </div>
@@ -147,13 +151,18 @@ export const InviteDialog = (props: Omit<DialogProps, 'title'>) => {
               >
                 {isCopied ? (
                   <>
-                    <RiCheckLine size={18} style={{ marginRight: '8px' }} />
+                    <RiCheckLine
+                      size={18}
+                      style={{ marginRight: '8px' }}
+                      aria-hidden="true"
+                    />
                     {t('copied')}
                   </>
                 ) : (
                   <>
                     <RiFileCopyLine
                       style={{ marginRight: '6px', minWidth: '18px' }}
+                      aria-hidden="true"
                     />
                     {t('copy')}
                   </>
diff --git a/src/frontend/src/features/rooms/livekit/components/Info.tsx b/src/frontend/src/features/rooms/livekit/components/Info.tsx
index c416ebea..afab80e0 100644
--- a/src/frontend/src/features/rooms/livekit/components/Info.tsx
+++ b/src/frontend/src/features/rooms/livekit/components/Info.tsx
@@ -78,12 +78,20 @@ export const Info = () => {
         >
           {isCopied ? (
             <>
-              <RiCheckLine size={24} style={{ marginRight: '6px' }} />
+              <RiCheckLine
+                size={24}
+                style={{ marginRight: '6px' }}
+                aria-hidden="true"
+              />
               {t('roomInformation.button.copied')}
             </>
           ) : (
             <>
-              <RiFileCopyLine size={24} style={{ marginRight: '6px' }} />
+              <RiFileCopyLine
+                size={24}
+                style={{ marginRight: '6px' }}
+                aria-hidden="true"
+              />
               {t('roomInformation.button.copy')}
             </>
           )}