From 6a7adbe59ce469c776b6c8cd5d11db76d9af5213 Mon Sep 17 00:00:00 2001
From: Balaji K <balaji6292@gmail.com>
Date: Sat, 28 Oct 2023 13:05:58 +0530
Subject: [PATCH] [MM-55122] Replaced the usage of LocalizedIcon in
 'fa_warning_icon.tsx' with i/span tags (#25136)

---
 .../request_button.test.tsx.snap              | 100 ++++++++++++++----
 .../widgets/icons/fa_warning_icon.tsx         |  24 ++---
 2 files changed, 90 insertions(+), 34 deletions(-)

diff --git a/webapp/channels/src/components/admin_console/request_button/__snapshots__/request_button.test.tsx.snap b/webapp/channels/src/components/admin_console/request_button/__snapshots__/request_button.test.tsx.snap
index a868baec08..06cdca2002 100644
--- a/webapp/channels/src/components/admin_console/request_button/__snapshots__/request_button.test.tsx.snap
+++ b/webapp/channels/src/components/admin_console/request_button/__snapshots__/request_button.test.tsx.snap
@@ -115,15 +115,45 @@ exports[`components/admin_console/request_button/request_button.jsx should match
           <div
             className="alert alert-warning"
           >
-            <WarningIcon
-              additionalClassName={null}
-            >
-              <LocalizedIcon
-                className="fa fa-warning"
-                title={
+            <injectIntl(WarningIcon)>
+              <WarningIcon
+                intl={
                   Object {
-                    "defaultMessage": "Warning Icon",
-                    "id": "generic_icons.warning",
+                    "$t": [Function],
+                    "defaultFormats": Object {},
+                    "defaultLocale": "en",
+                    "defaultRichTextElements": undefined,
+                    "fallbackOnEmptyString": true,
+                    "formatDate": [Function],
+                    "formatDateTimeRange": [Function],
+                    "formatDateToParts": [Function],
+                    "formatDisplayName": [Function],
+                    "formatList": [Function],
+                    "formatListToParts": [Function],
+                    "formatMessage": [Function],
+                    "formatNumber": [Function],
+                    "formatNumberToParts": [Function],
+                    "formatPlural": [Function],
+                    "formatRelativeTime": [Function],
+                    "formatTime": [Function],
+                    "formatTimeToParts": [Function],
+                    "formats": Object {},
+                    "formatters": Object {
+                      "getDateTimeFormat": [Function],
+                      "getDisplayNames": [Function],
+                      "getListFormat": [Function],
+                      "getMessageFormat": [Function],
+                      "getNumberFormat": [Function],
+                      "getPluralRules": [Function],
+                      "getRelativeTimeFormat": [Function],
+                    },
+                    "locale": "en",
+                    "messages": Object {},
+                    "onError": [Function],
+                    "onWarn": [Function],
+                    "textComponent": "span",
+                    "timeZone": "Etc/UTC",
+                    "wrapRichTextChunksInFragment": undefined,
                   }
                 }
               >
@@ -131,8 +161,8 @@ exports[`components/admin_console/request_button/request_button.jsx should match
                   className="fa fa-warning"
                   title="Warning Icon"
                 />
-              </LocalizedIcon>
-            </WarningIcon>
+              </WarningIcon>
+            </injectIntl(WarningIcon)>
             <FormattedMessage
               defaultMessage="Error Message: {error}"
               id="error.message"
@@ -252,15 +282,45 @@ exports[`components/admin_console/request_button/request_button.jsx should match
           <div
             className="alert alert-warning"
           >
-            <WarningIcon
-              additionalClassName={null}
-            >
-              <LocalizedIcon
-                className="fa fa-warning"
-                title={
+            <injectIntl(WarningIcon)>
+              <WarningIcon
+                intl={
                   Object {
-                    "defaultMessage": "Warning Icon",
-                    "id": "generic_icons.warning",
+                    "$t": [Function],
+                    "defaultFormats": Object {},
+                    "defaultLocale": "en",
+                    "defaultRichTextElements": undefined,
+                    "fallbackOnEmptyString": true,
+                    "formatDate": [Function],
+                    "formatDateTimeRange": [Function],
+                    "formatDateToParts": [Function],
+                    "formatDisplayName": [Function],
+                    "formatList": [Function],
+                    "formatListToParts": [Function],
+                    "formatMessage": [Function],
+                    "formatNumber": [Function],
+                    "formatNumberToParts": [Function],
+                    "formatPlural": [Function],
+                    "formatRelativeTime": [Function],
+                    "formatTime": [Function],
+                    "formatTimeToParts": [Function],
+                    "formats": Object {},
+                    "formatters": Object {
+                      "getDateTimeFormat": [Function],
+                      "getDisplayNames": [Function],
+                      "getListFormat": [Function],
+                      "getMessageFormat": [Function],
+                      "getNumberFormat": [Function],
+                      "getPluralRules": [Function],
+                      "getRelativeTimeFormat": [Function],
+                    },
+                    "locale": "en",
+                    "messages": Object {},
+                    "onError": [Function],
+                    "onWarn": [Function],
+                    "textComponent": "span",
+                    "timeZone": "Etc/UTC",
+                    "wrapRichTextChunksInFragment": undefined,
                   }
                 }
               >
@@ -268,8 +328,8 @@ exports[`components/admin_console/request_button/request_button.jsx should match
                   className="fa fa-warning"
                   title="Warning Icon"
                 />
-              </LocalizedIcon>
-            </WarningIcon>
+              </WarningIcon>
+            </injectIntl(WarningIcon)>
             <FormattedMessage
               defaultMessage="Error Message: {error}"
               id="error.message"
diff --git a/webapp/channels/src/components/widgets/icons/fa_warning_icon.tsx b/webapp/channels/src/components/widgets/icons/fa_warning_icon.tsx
index 823b9df7db..0f827949ec 100644
--- a/webapp/channels/src/components/widgets/icons/fa_warning_icon.tsx
+++ b/webapp/channels/src/components/widgets/icons/fa_warning_icon.tsx
@@ -1,28 +1,24 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
+import classNames from 'classnames';
 import React from 'react';
-
-import LocalizedIcon from 'components/localized_icon';
-
-import {t} from 'utils/i18n';
+import {injectIntl, type IntlShape} from 'react-intl';
 
 type Props = {
-    additionalClassName: string | null;
+    additionalClassName?: string;
+    intl: IntlShape;
 }
 
-export default class WarningIcon extends React.PureComponent<Props> {
-    public static defaultProps: Props = {
-        additionalClassName: null,
-    };
-
+class WarningIcon extends React.PureComponent<Props> {
     public render(): JSX.Element {
-        const className = 'fa fa-warning' + (this.props.additionalClassName ? ' ' + this.props.additionalClassName : '');
         return (
-            <LocalizedIcon
-                className={className}
-                title={{id: t('generic_icons.warning'), defaultMessage: 'Warning Icon'}}
+            <i
+                className={classNames('fa fa-warning', this.props.additionalClassName)}
+                title={this.props.intl.formatMessage({id: 'generic_icons.warning', defaultMessage: 'Warning Icon'})}
             />
         );
     }
 }
+
+export default injectIntl(WarningIcon);