2021-11-22 07:00:14 +01:00
|
|
|
import React from 'react';
|
|
|
|
import classNames from 'classnames';
|
2022-08-29 05:20:54 +02:00
|
|
|
import { safeDecodeURI } from 'next-basics';
|
2021-11-22 07:00:14 +01:00
|
|
|
import Button from 'components/common/Button';
|
|
|
|
import Times from 'assets/times.svg';
|
|
|
|
import styles from './FilterTags.module.css';
|
|
|
|
|
|
|
|
export default function FilterTags({ params, onClick }) {
|
|
|
|
if (Object.keys(params).filter(key => params[key]).length === 0) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
return (
|
|
|
|
<div className={classNames(styles.filters, 'col-12')}>
|
|
|
|
{Object.keys(params).map(key => {
|
|
|
|
if (!params[key]) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
return (
|
2021-11-22 23:53:36 +01:00
|
|
|
<div key={key} className={styles.tag}>
|
2021-11-22 07:00:14 +01:00
|
|
|
<Button icon={<Times />} onClick={() => onClick(key)} variant="action" iconRight>
|
2022-07-21 10:35:14 +02:00
|
|
|
{`${key}: ${safeDecodeURI(params[key])}`}
|
2021-11-22 07:00:14 +01:00
|
|
|
</Button>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
})}
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|