mirror of https://github.com/portainer/portainer
34 lines
843 B
TypeScript
34 lines
843 B
TypeScript
import clsx from 'clsx';
|
|
|
|
import SortDownIcon from './sort-arrow-down.svg?c';
|
|
import SortUpIcon from './sort-arrow-up.svg?c';
|
|
import styles from './TableHeaderSortIcons.module.css';
|
|
|
|
interface Props {
|
|
sorted: boolean;
|
|
descending: boolean;
|
|
}
|
|
|
|
export function TableHeaderSortIcons({ sorted, descending }: Props) {
|
|
return (
|
|
<div className="flex flex-row no-wrap w-min-max">
|
|
<SortDownIcon
|
|
className={clsx(
|
|
'space-left',
|
|
sorted && !descending && styles.activeSortIcon,
|
|
styles.sortIcon
|
|
)}
|
|
aria-hidden="true"
|
|
/>
|
|
<SortUpIcon
|
|
className={clsx(
|
|
'-ml-1', // shift closer to SortDownIcon to match the mockup
|
|
sorted && descending && styles.activeSortIcon,
|
|
styles.sortIcon
|
|
)}
|
|
aria-hidden="true"
|
|
/>
|
|
</div>
|
|
);
|
|
}
|