From f29fbddef19baf397b4baf18dc3619490f379a9f Mon Sep 17 00:00:00 2001
From: Akbar Abdrakhmanov <kz.akbar@gmail.com>
Date: Wed, 8 Nov 2023 03:16:30 +0200
Subject: [PATCH] [MM-55107] Replace usage of LocalizedIcon in
 'update_user_group_modal.tsx' with i/span tags (#25299)

---
 .../update_user_group_modal.test.tsx.snap           | 10 ++--------
 .../update_user_group_modal.tsx                     | 13 +++++--------
 2 files changed, 7 insertions(+), 16 deletions(-)

diff --git a/webapp/channels/src/components/update_user_group_modal/__snapshots__/update_user_group_modal.test.tsx.snap b/webapp/channels/src/components/update_user_group_modal/__snapshots__/update_user_group_modal.test.tsx.snap
index 4bc9b7fc0e..b1576b73e3 100644
--- a/webapp/channels/src/components/update_user_group_modal/__snapshots__/update_user_group_modal.test.tsx.snap
+++ b/webapp/channels/src/components/update_user_group_modal/__snapshots__/update_user_group_modal.test.tsx.snap
@@ -37,18 +37,12 @@ exports[`component/update_user_group_modal should match snapshot 1`] = `
     closeLabel="Close"
   >
     <button
-      aria-label="Close"
+      aria-label="Back"
       className="modal-header-back-button btn btn-icon"
       onClick={[Function]}
       type="button"
     >
-      <LocalizedIcon
-        ariaLabel={
-          Object {
-            "defaultMessage": "Back",
-            "id": "user_groups_modal.goBackLabel",
-          }
-        }
+      <i
         className="icon icon-arrow-left"
       />
     </button>
diff --git a/webapp/channels/src/components/update_user_group_modal/update_user_group_modal.tsx b/webapp/channels/src/components/update_user_group_modal/update_user_group_modal.tsx
index d5997e1c9b..f1bf4bc806 100644
--- a/webapp/channels/src/components/update_user_group_modal/update_user_group_modal.tsx
+++ b/webapp/channels/src/components/update_user_group_modal/update_user_group_modal.tsx
@@ -3,18 +3,16 @@
 
 import React, {useCallback, useEffect, useState} from 'react';
 import {Modal} from 'react-bootstrap';
-import {FormattedMessage} from 'react-intl';
+import {FormattedMessage, useIntl} from 'react-intl';
 
 import type {CustomGroupPatch, Group} from '@mattermost/types/groups';
 
 import type {ActionResult} from 'mattermost-redux/types/actions';
 
-import LocalizedIcon from 'components/localized_icon';
 import SaveButton from 'components/save_button';
 import Input from 'components/widgets/inputs/input/input';
 
 import Constants, {ItemStatus} from 'utils/constants';
-import {t} from 'utils/i18n';
 import * as Keyboard from 'utils/keyboard';
 import * as Utils from 'utils/utils';
 
@@ -45,6 +43,8 @@ const UpdateUserGroupModal = (props: Props) => {
     const [showUnknownError, setShowUnknownError] = useState(false);
     const [mentionUpdatedManually, setMentionUpdatedManually] = useState(false);
 
+    const {formatMessage} = useIntl();
+
     const doHide = useCallback(() => {
         setShow(false);
     }, []);
@@ -159,13 +159,10 @@ const UpdateUserGroupModal = (props: Props) => {
                 <button
                     type='button'
                     className='modal-header-back-button btn btn-icon'
-                    aria-label='Close'
+                    aria-label={formatMessage({id: 'user_groups_modal.goBackLabel', defaultMessage: 'Back'})}
                     onClick={goBack}
                 >
-                    <LocalizedIcon
-                        className='icon icon-arrow-left'
-                        ariaLabel={{id: t('user_groups_modal.goBackLabel'), defaultMessage: 'Back'}}
-                    />
+                    <i className='icon icon-arrow-left'/>
                 </button>
                 <Modal.Title
                     componentClass='h1'