From cf9f853526dc1cad8bd90c44617adf65efebeff0 Mon Sep 17 00:00:00 2001
From: Firmansyah Yanuar <fyfirman@gmail.com>
Date: Wed, 11 Oct 2023 00:21:43 +0700
Subject: [PATCH] [MM-54795] Convert
 `./components/widgets/icons/fa_previous_icon.tsx` to function component
 (#24786)

* chore(channels): convert previous icon to functional components

* chore(channels): change to arrow function, remove `t`, and use `classNames`

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
---
 .../__snapshots__/group_users.test.tsx.snap   | 24 ++++---------
 .../__snapshots__/groups_list.test.tsx.snap   | 32 +++++------------
 .../__snapshots__/abstract_list.test.tsx.snap | 12 ++-----
 .../__snapshots__/abstract_list.test.tsx.snap |  4 +--
 .../product_notices.test.tsx.snap             |  4 +--
 .../widgets/icons/fa_previous_icon.tsx        | 35 ++++++++++---------
 6 files changed, 37 insertions(+), 74 deletions(-)

diff --git a/webapp/channels/src/components/admin_console/group_settings/group_details/__snapshots__/group_users.test.tsx.snap b/webapp/channels/src/components/admin_console/group_settings/group_details/__snapshots__/group_users.test.tsx.snap
index 852ae49188..87bea19cf9 100644
--- a/webapp/channels/src/components/admin_console/group_settings/group_details/__snapshots__/group_users.test.tsx.snap
+++ b/webapp/channels/src/components/admin_console/group_settings/group_details/__snapshots__/group_users.test.tsx.snap
@@ -212,9 +212,7 @@ exports[`components/admin_console/group_settings/group_details/GroupUsers should
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -442,9 +440,7 @@ exports[`components/admin_console/group_settings/group_details/GroupUsers should
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next "
@@ -672,9 +668,7 @@ exports[`components/admin_console/group_settings/group_details/GroupUsers should
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next "
@@ -862,9 +856,7 @@ exports[`components/admin_console/group_settings/group_details/GroupUsers should
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -1092,9 +1084,7 @@ exports[`components/admin_console/group_settings/group_details/GroupUsers should
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -1364,9 +1354,7 @@ exports[`components/admin_console/group_settings/group_details/GroupUsers should
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
diff --git a/webapp/channels/src/components/admin_console/group_settings/groups_list/__snapshots__/groups_list.test.tsx.snap b/webapp/channels/src/components/admin_console/group_settings/groups_list/__snapshots__/groups_list.test.tsx.snap
index ae6e2a7cb2..7bcee44def 100644
--- a/webapp/channels/src/components/admin_console/group_settings/groups_list/__snapshots__/groups_list.test.tsx.snap
+++ b/webapp/channels/src/components/admin_console/group_settings/groups_list/__snapshots__/groups_list.test.tsx.snap
@@ -310,9 +310,7 @@ exports[`components/admin_console/group_settings/GroupsList.tsx should match sna
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -439,9 +437,7 @@ exports[`components/admin_console/group_settings/GroupsList.tsx should match sna
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -568,9 +564,7 @@ exports[`components/admin_console/group_settings/GroupsList.tsx should match sna
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -732,9 +726,7 @@ exports[`components/admin_console/group_settings/GroupsList.tsx should match sna
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -987,9 +979,7 @@ exports[`components/admin_console/group_settings/GroupsList.tsx should match sna
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -1242,9 +1232,7 @@ exports[`components/admin_console/group_settings/GroupsList.tsx should match sna
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -1406,9 +1394,7 @@ exports[`components/admin_console/group_settings/GroupsList.tsx should match sna
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
@@ -1597,9 +1583,7 @@ exports[`components/admin_console/group_settings/GroupsList.tsx should match sna
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
diff --git a/webapp/channels/src/components/admin_console/system_user_detail/team_list/__snapshots__/abstract_list.test.tsx.snap b/webapp/channels/src/components/admin_console/system_user_detail/team_list/__snapshots__/abstract_list.test.tsx.snap
index 971de41fb8..30e9393f36 100644
--- a/webapp/channels/src/components/admin_console/system_user_detail/team_list/__snapshots__/abstract_list.test.tsx.snap
+++ b/webapp/channels/src/components/admin_console/system_user_detail/team_list/__snapshots__/abstract_list.test.tsx.snap
@@ -248,9 +248,7 @@ exports[`admin_console/system_user_detail/team_list/AbstractList should match sn
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next "
@@ -477,9 +475,7 @@ exports[`admin_console/system_user_detail/team_list/AbstractList should match sn
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next "
@@ -594,9 +590,7 @@ exports[`admin_console/system_user_detail/team_list/AbstractList should match sn
       onClick={[Function]}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
diff --git a/webapp/channels/src/components/admin_console/team_channel_settings/__snapshots__/abstract_list.test.tsx.snap b/webapp/channels/src/components/admin_console/team_channel_settings/__snapshots__/abstract_list.test.tsx.snap
index f20fb5c82e..80788946f3 100644
--- a/webapp/channels/src/components/admin_console/team_channel_settings/__snapshots__/abstract_list.test.tsx.snap
+++ b/webapp/channels/src/components/admin_console/team_channel_settings/__snapshots__/abstract_list.test.tsx.snap
@@ -112,9 +112,7 @@ exports[`admin_console/team_channel_settings/AbstractList should match snapshot,
       disabled={true}
       type="button"
     >
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
     </button>
     <button
       className="btn btn-tertiary next disabled"
diff --git a/webapp/channels/src/components/product_notices_modal/__snapshots__/product_notices.test.tsx.snap b/webapp/channels/src/components/product_notices_modal/__snapshots__/product_notices.test.tsx.snap
index 5252df431b..17fbf9d3d7 100644
--- a/webapp/channels/src/components/product_notices_modal/__snapshots__/product_notices.test.tsx.snap
+++ b/webapp/channels/src/components/product_notices_modal/__snapshots__/product_notices.test.tsx.snap
@@ -48,9 +48,7 @@ exports[`ProductNoticesModal Match snapshot for user notice 1`] = `
   bodyPadding={true}
   cancelButtonText={
     <React.Fragment>
-      <PreviousIcon
-        additionalClassName={null}
-      />
+      <Memo(PreviousIcon) />
       <Memo(MemoizedFormattedMessage)
         defaultMessage="Previous"
         id="generic.previous"
diff --git a/webapp/channels/src/components/widgets/icons/fa_previous_icon.tsx b/webapp/channels/src/components/widgets/icons/fa_previous_icon.tsx
index 8f60bbe600..ae4c56ad12 100644
--- a/webapp/channels/src/components/widgets/icons/fa_previous_icon.tsx
+++ b/webapp/channels/src/components/widgets/icons/fa_previous_icon.tsx
@@ -1,28 +1,29 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
+import classNames from 'classnames';
 import React from 'react';
+import {defineMessage} from 'react-intl';
 
 import LocalizedIcon from 'components/localized_icon';
 
-import {t} from 'utils/i18n';
-
 type Props = {
-    additionalClassName: string | null;
+    additionalClassName?: string;
 }
 
-export default class PreviousIcon extends React.PureComponent<Props> {
-    public static defaultProps: Props = {
-        additionalClassName: null,
-    };
+const iconTitle = defineMessage({
+    id: 'generic_icons.previous',
+    defaultMessage: 'Previous Icon',
+});
+
+const PreviousIcon = ({additionalClassName}: Props) => {
+    return (
+        <LocalizedIcon
+            className={classNames('icon icon-chevron-left', additionalClassName)}
+            title={iconTitle}
+        />
+    );
+};
+
+export default React.memo(PreviousIcon);
 
-    public render(): JSX.Element {
-        const className = 'icon icon-chevron-left' + (this.props.additionalClassName ? ' ' + this.props.additionalClassName : '');
-        return (
-            <LocalizedIcon
-                className={className}
-                title={{id: t('generic_icons.previous'), defaultMessage: 'Previous Icon'}}
-            />
-        );
-    }
-}