2023-03-09 21:42:12 +01:00
|
|
|
import { Button, Icon, Icons, Text } from 'react-basics';
|
|
|
|
import styles from './WebsiteTags.module.css';
|
|
|
|
|
2023-04-21 17:00:42 +02:00
|
|
|
export function WebsiteTags({ items = [], websites = [], onClick }) {
|
2023-03-09 21:42:12 +01:00
|
|
|
if (websites.length === 0) {
|
|
|
|
return null;
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div className={styles.filters}>
|
|
|
|
{websites.map(websiteId => {
|
|
|
|
const website = items.find(a => a.id === websiteId);
|
|
|
|
|
|
|
|
return (
|
|
|
|
<div key={websiteId} className={styles.tag}>
|
|
|
|
<Button onClick={() => onClick(websiteId)} variant="primary" size="sm">
|
|
|
|
<Text>
|
|
|
|
<b>{`${website.name}`}</b>
|
|
|
|
</Text>
|
|
|
|
<Icon>
|
|
|
|
<Icons.Close />
|
|
|
|
</Icon>
|
|
|
|
</Button>
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
})}
|
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
2023-04-21 17:00:42 +02:00
|
|
|
|
|
|
|
export default WebsiteTags;
|