IntenseWebs/mattermost
3
0
Fork 0
mirror of https://github.com/mattermost/mattermost.git synced 2025-02-25 18:55:24 -06:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source 
Co-authored-by: Mattermost Build <build@mattermost.com>
This commit is contained in:
Syed Ali Abbas Zaidi 2024-02-16 11:25:08 +05:00 committed by GitHub
parent 54507bb115
commit 5fcab87934
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 44 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
webapp/channels/src/components/analytics/table_chart.tsx
View File

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