From 76673606c75a45c4437d08d8a5af53edcfe6e6b8 Mon Sep 17 00:00:00 2001
From: Bishal Pal <75329045+bishalpal@users.noreply.github.com>
Date: Sat, 28 Oct 2023 13:48:30 +0530
Subject: [PATCH] [MM-55098] Replace usage of LocalizedIcon in
 'channel_info_rhs/header.tsx' with i/span tags (#25179)

* Replaced LocalizedIcon with i tag

* Replaced aria-label in parent button tag and removed it from i tag

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
---
 .../src/components/channel_info_rhs/header.test.tsx    |  2 +-
 .../src/components/channel_info_rhs/header.tsx         | 10 ++++------
 2 files changed, 5 insertions(+), 7 deletions(-)

diff --git a/webapp/channels/src/components/channel_info_rhs/header.test.tsx b/webapp/channels/src/components/channel_info_rhs/header.test.tsx
index 4708c844fa..ade9e73124 100644
--- a/webapp/channels/src/components/channel_info_rhs/header.test.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/header.test.tsx
@@ -34,7 +34,7 @@ describe('channel_info_rhs/header', () => {
             />,
         );
 
-        fireEvent.click(screen.getByLabelText('Close'));
+        fireEvent.click(screen.getByLabelText('Close Sidebar Icon'));
 
         expect(onClose).toHaveBeenCalled();
     });
diff --git a/webapp/channels/src/components/channel_info_rhs/header.tsx b/webapp/channels/src/components/channel_info_rhs/header.tsx
index 40165b7282..414a47b7fd 100644
--- a/webapp/channels/src/components/channel_info_rhs/header.tsx
+++ b/webapp/channels/src/components/channel_info_rhs/header.tsx
@@ -2,17 +2,15 @@
 // See LICENSE.txt for license information.
 
 import React from 'react';
-import {FormattedMessage} from 'react-intl';
+import {FormattedMessage, useIntl} from 'react-intl';
 import styled from 'styled-components';
 
 import type {Channel} from '@mattermost/types/channels';
 
-import LocalizedIcon from 'components/localized_icon';
 import OverlayTrigger from 'components/overlay_trigger';
 import Tooltip from 'components/tooltip';
 
 import Constants from 'utils/constants';
-import {t} from 'utils/i18n';
 
 interface Props {
     channel: Channel;
@@ -35,6 +33,7 @@ const HeaderTitle = styled.span`
 `;
 
 const Header = ({channel, isArchived, isMobile, onClose}: Props) => {
+    const {formatMessage} = useIntl();
     const closeSidebarTooltip = (
         <Tooltip id='closeSidebarTooltip'>
             <FormattedMessage
@@ -86,12 +85,11 @@ const Header = ({channel, isArchived, isMobile, onClose}: Props) => {
                     id='rhsCloseButton'
                     type='button'
                     className='sidebar--right__close btn btn-icon btn-sm'
-                    aria-label='Close'
+                    aria-label={formatMessage({id: 'rhs_header.closeTooltip.icon', defaultMessage: 'Close Sidebar Icon'})}
                     onClick={onClose}
                 >
-                    <LocalizedIcon
+                    <i
                         className='icon icon-close'
-                        ariaLabel={{id: t('rhs_header.closeTooltip.icon'), defaultMessage: 'Close Sidebar Icon'}}
                     />
                 </button>
             </OverlayTrigger>