You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
46 lines
1.3 KiB
React
46 lines
1.3 KiB
React
4 years ago
|
import React from 'react';
|
||
|
import { connect } from 'react-redux';
|
||
|
import classNames from 'classnames';
|
||
|
import i18n from 'vj/utils/i18n';
|
||
|
import Icon from 'vj/components/react/IconComponent';
|
||
|
import Panel from './PanelComponent';
|
||
|
import ScratchpadRecordsRow from './ScratchpadRecordsRowContainer';
|
||
|
|
||
|
const mapStateToProps = (state) => ({
|
||
|
rows: state.records.rows,
|
||
|
isLoading: state.ui.records.isLoading,
|
||
|
});
|
||
|
|
||
|
export default connect(mapStateToProps)(class ScratchpadRecordsContainer extends React.PureComponent {
|
||
|
render() {
|
||
|
const cn = classNames('data-table is--full-row scratchpad__records__table', {
|
||
|
loading: this.props.isLoading,
|
||
|
});
|
||
|
return (
|
||
|
<Panel
|
||
|
title={(
|
||
|
<span>
|
||
|
<Icon name="flag" />
|
||
|
{' '}
|
||
|
{i18n('Records')}
|
||
|
</span>
|
||
|
)}
|
||
|
>
|
||
|
<table className={cn}>
|
||
|
<colgroup>
|
||
|
<col className="col--detail" />
|
||
|
<col className="col--memory" />
|
||
|
<col className="col--time" />
|
||
|
<col className="col--at" />
|
||
|
</colgroup>
|
||
|
<tbody>
|
||
|
{this.props.rows.map((rowId) => (
|
||
|
<ScratchpadRecordsRow key={rowId} id={rowId} />
|
||
|
))}
|
||
|
</tbody>
|
||
|
</table>
|
||
|
</Panel>
|
||
|
);
|
||
|
}
|
||
|
});
|