[MM-56846] Convert ./components/analytics/table_chart.tsx from Class Component to Function Component (#26237)

Co-authored-by: Mattermost Build <build@mattermost.com>

webapp/channels/src/components/analytics/table_chart.tsx

@@ -1,7 +1,7 @@
 // Copyright (c) 2015-present Mattermost, Inc. All Rights Reserved.
 // See LICENSE.txt for license information.
 
-import React from 'react';
+import React, {memo} from 'react';
 
 import OverlayTrigger from 'components/overlay_trigger';
 import Tooltip from 'components/tooltip';
@@ -18,32 +18,30 @@ type Props = {
     data: TableItem[];
 }
 
-export default class TableChart extends React.PureComponent<Props> {
+const TableChart = ({
-    public render() {
+    title,
-        return (
+    data,
+}: Props) => (
     <div className='col-sm-6'>
         <div className='total-count recent-active-users'>
             <div className='title'>
-                        {this.props.title}
+                {title}
             </div>
             <div className='content'>
                 <table>
                     <tbody>
                         {
-                                    this.props.data.map((item) => {
+                            data.map((item) => (
-                                        const tooltip = (
-                                            <Tooltip id={'tip-table-entry-' + item.name}>
-                                                {item.tip}
-                                            </Tooltip>
-                                        );
-
-                                        return (
                                 <tr key={'table-entry-' + item.name}>
                                     <td>
                                         <OverlayTrigger
                                             delayShow={Constants.OVERLAY_TIME_DELAY}
                                             placement='top'
-                                                        overlay={tooltip}
+                                            overlay={(
+                                                <Tooltip id={'tip-table-entry-' + item.name}>
+                                                    {item.tip}
+                                                </Tooltip>
+                                            )}
                                         >
                                             <time>
                                                 {item.name}
@@ -54,8 +52,7 @@ export default class TableChart extends React.PureComponent<Props> {
                                         {item.value}
                                     </td>
                                 </tr>
-                                        );
+                            ))
-                                    })
                         }
                     </tbody>
                 </table>
@@ -63,5 +60,5 @@ export default class TableChart extends React.PureComponent<Props> {
         </div>
     </div>
 );
-    }
+
-}
+export default memo(TableChart);