You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Prowlarr/frontend/src/Components/Table/VirtualTableHeaderCell.js

110 lines
2.2 KiB

import PropTypes from 'prop-types';
import React, { Component } from 'react';
import Icon from 'Components/Icon';
import Link from 'Components/Link/Link';
import { icons, sortDirections } from 'Helpers/Props';
import styles from './VirtualTableHeaderCell.css';
export function headerRenderer(headerProps) {
const {
columnData = {},
dataKey,
label
} = headerProps;
return (
// eslint-disable-next-line no-use-before-define
<VirtualTableHeaderCell
name={dataKey}
{...columnData}
>
{label}
</VirtualTableHeaderCell>
);
}
class VirtualTableHeaderCell extends Component {
//
// Listeners
onPress = () => {
const {
name,
fixedSortDirection
} = this.props;
if (fixedSortDirection) {
this.props.onSortPress(name, fixedSortDirection);
} else {
this.props.onSortPress(name);
}
};
//
// Render
render() {
const {
className,
name,
isSortable,
sortKey,
sortDirection,
fixedSortDirection,
children,
onSortPress,
...otherProps
} = this.props;
const isSorting = isSortable && sortKey === name;
const sortIcon = sortDirection === sortDirections.ASCENDING ?
icons.SORT_ASCENDING :
icons.SORT_DESCENDING;
return (
isSortable ?
<Link
component="div"
className={className}
onPress={this.onPress}
{...otherProps}
>
{children}
{
isSorting &&
<Icon
name={sortIcon}
className={styles.sortIcon}
/>
}
</Link> :
<div className={className}>
{children}
</div>
);
}
}
VirtualTableHeaderCell.propTypes = {
className: PropTypes.string,
name: PropTypes.string.isRequired,
label: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
isSortable: PropTypes.bool,
sortKey: PropTypes.string,
fixedSortDirection: PropTypes.string,
sortDirection: PropTypes.string,
children: PropTypes.node,
onSortPress: PropTypes.func
};
VirtualTableHeaderCell.defaultProps = {
className: styles.headerCell,
isSortable: false
};
export default VirtualTableHeaderCell;