[MM-54800] Convert "close_channel.tsx" from Class Component to Function Component (#25079)

* ISSUE#24764 | Convert close_channel/close_channel.tsx from Class Component to Function Component

* add type to tests

* remove unecasarry type assertion

* Convert localizeMessage to intl

* remove unnecassary function

* revert back from interface to type

* lint fix

* lint fix

* lint fix

* Fix failing tests

webapp/channels/src/components/channel_header_dropdown/__snapshots__/channel_header_dropdown.test.tsx.snap

@@ -774,7 +774,7 @@ exports[`components/ChannelHeaderDropdown should match snapshot with no plugin i
       }
       id="channelCloseMessage"
     />
-    <Connect(CloseChannel)
+    <Connect(Component)
       isArchived={false}
     />
   </MenuGroup>
@@ -1603,7 +1603,7 @@ exports[`components/ChannelHeaderDropdown should match snapshot with plugins 1`]
       }
       id="channelCloseMessage"
     />
-    <Connect(CloseChannel)
+    <Connect(Component)
       isArchived={false}
     />
   </MenuGroup>

webapp/channels/src/components/channel_header_dropdown/menu_items/close_channel/__snapshots__/close_channel.test.tsx.snap

@@ -2,7 +2,7 @@
 
 exports[`components/ChannelHeaderDropdown/MenuItem.CloseChannel shoud be hidden if the channel is not archived 1`] = `
 <MenuItemAction
-  onClick={[Function]}
+  onClick={[MockFunction]}
   show={false}
   text="Close Channel"
 />
@@ -10,7 +10,7 @@ exports[`components/ChannelHeaderDropdown/MenuItem.CloseChannel shoud be hidden
 
 exports[`components/ChannelHeaderDropdown/MenuItem.CloseChannel should match snapshot 1`] = `
 <MenuItemAction
-  onClick={[Function]}
+  onClick={[MockFunction]}
   show={true}
   text="Close Channel"
 />

webapp/channels/src/components/channel_header_dropdown/menu_items/close_channel/close_channel.test.tsx

@@ -17,7 +17,7 @@ describe('components/ChannelHeaderDropdown/MenuItem.CloseChannel', () => {
     };
 
     it('should match snapshot', () => {
-        const wrapper = shallow<CloseChannel>(<CloseChannel {...baseProps}/>);
+        const wrapper = shallow(<CloseChannel {...baseProps}/>);
         expect(wrapper).toMatchSnapshot();
     });
 
@@ -26,7 +26,7 @@ describe('components/ChannelHeaderDropdown/MenuItem.CloseChannel', () => {
             ...baseProps,
             isArchived: false,
         };
-        const wrapper = shallow<CloseChannel>(<CloseChannel {...props}/>);
+        const wrapper = shallow(<CloseChannel {...props}/>);
         expect(wrapper).toMatchSnapshot();
     });
 
@@ -38,7 +38,7 @@ describe('components/ChannelHeaderDropdown/MenuItem.CloseChannel', () => {
                 goToLastViewedChannel: jest.fn(),
             },
         };
-        const wrapper = shallow<CloseChannel>(<CloseChannel {...props}/>);
+        const wrapper = shallow(<CloseChannel {...props}/>);
         wrapper.find(Menu.ItemAction).simulate('click');
         expect(props.actions.goToLastViewedChannel).toHaveBeenCalled();
     });

webapp/channels/src/components/channel_header_dropdown/menu_items/close_channel/close_channel.tsx

@@ -2,11 +2,10 @@
 // See LICENSE.txt for license information.
 
 import React from 'react';
+import {useIntl} from 'react-intl';
 
 import Menu from 'components/widgets/menu/menu';
 
-import {localizeMessage} from 'utils/utils';
-
 type Props = {
     isArchived: boolean;
     actions: {
@@ -14,18 +13,22 @@ type Props = {
     };
 }
 
-export default class CloseChannel extends React.PureComponent<Props> {
+const CloseChannel = ({
-    private handleClose = () => {
+    isArchived,
-        this.props.actions.goToLastViewedChannel();
+    actions,
-    };
+}: Props): JSX.Element => {
+    const intl = useIntl();
 
-    render() {
+    return (
-        return (
+        <Menu.ItemAction
-            <Menu.ItemAction
+            show={isArchived}
-                show={this.props.isArchived}
+            onClick={actions.goToLastViewedChannel}
-                onClick={this.handleClose}
+            text={intl.formatMessage({
-                text={localizeMessage('center_panel.archived.closeChannel', 'Close Channel')}
+                id: 'center_panel.archived.closeChannel',
-            />
+                defaultMessage: 'Close Channel',
-        );
+            })}
-    }
+        />
-}
+    );
+};
+
+export default React.memo(CloseChannel);