2016-05-30 07:59:44 +03:00
|
|
|
import React, { PropTypes } from 'react';
|
2015-11-14 12:26:50 +03:00
|
|
|
|
2016-05-30 07:59:44 +03:00
|
|
|
const factory = (Checkbox) => {
|
|
|
|
const TableHead = ({model, onSelect, selectable, multiSelectable, selected, theme}) => {
|
|
|
|
let selectCell;
|
|
|
|
const contentCells = Object.keys(model).map((key) => {
|
|
|
|
const name = model[key].title || key;
|
|
|
|
return <th key={key}>{name}</th>;
|
|
|
|
});
|
2015-11-14 12:26:50 +03:00
|
|
|
|
2016-05-30 07:59:44 +03:00
|
|
|
if (selectable && multiSelectable) {
|
|
|
|
selectCell = (
|
|
|
|
<th key='select' className={theme.selectable}>
|
|
|
|
<Checkbox onChange={onSelect} checked={selected}/>
|
|
|
|
</th>
|
|
|
|
);
|
|
|
|
} else if (selectable) {
|
|
|
|
selectCell = (
|
2016-08-07 22:23:14 +03:00
|
|
|
<th key='select' className={theme.selectable}/>
|
2016-05-30 07:59:44 +03:00
|
|
|
);
|
|
|
|
}
|
|
|
|
return (
|
|
|
|
<thead>
|
|
|
|
<tr>{[selectCell, ...contentCells]}</tr>
|
|
|
|
</thead>
|
2015-11-14 12:26:50 +03:00
|
|
|
);
|
2016-05-30 07:59:44 +03:00
|
|
|
};
|
2015-11-14 12:26:50 +03:00
|
|
|
|
2016-05-30 07:59:44 +03:00
|
|
|
TableHead.propTypes = {
|
|
|
|
className: PropTypes.string,
|
|
|
|
model: PropTypes.object,
|
|
|
|
multiSelectable: PropTypes.bool,
|
|
|
|
onSelect: PropTypes.func,
|
|
|
|
selectable: PropTypes.bool,
|
|
|
|
selected: PropTypes.bool,
|
|
|
|
theme: PropTypes.shape({
|
|
|
|
selectable: PropTypes.string
|
|
|
|
})
|
|
|
|
};
|
|
|
|
|
|
|
|
TableHead.defaultProps = {
|
|
|
|
className: '',
|
|
|
|
model: {},
|
|
|
|
selected: false
|
|
|
|
};
|
2015-11-14 12:26:50 +03:00
|
|
|
|
2016-05-30 07:59:44 +03:00
|
|
|
return TableHead;
|
2015-11-14 12:26:50 +03:00
|
|
|
};
|
|
|
|
|
2016-05-30 07:59:44 +03:00
|
|
|
export default factory;
|