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.
62 lines
1.2 KiB
62 lines
1.2 KiB
import React from 'react'; |
|
import s from './CategoryIcon.module.scss'; |
|
|
|
import GAME from './icons/games.svg'; |
|
import CHAT from './icons/chat.svg'; |
|
import CONFERENCE from './icons/conference.svg'; |
|
import GOVERNMENT from './icons/gov.svg'; |
|
import RELIGION from './icons/religion.svg'; |
|
import TECH from './icons/tech.svg'; |
|
import MUSIC from './icons/music.svg'; |
|
|
|
interface Props { |
|
tags: string[]; |
|
} |
|
|
|
const ICON_MAPPING = { |
|
game: GAME, |
|
gamer: GAME, |
|
games: GAME, |
|
playing: GAME, |
|
|
|
chat: CHAT, |
|
chatting: CHAT, |
|
|
|
conference: CONFERENCE, |
|
event: CONFERENCE, |
|
convention: CONFERENCE, |
|
|
|
government: GOVERNMENT, |
|
|
|
religion: RELIGION, |
|
god: RELIGION, |
|
church: RELIGION, |
|
bible: RELIGION, |
|
|
|
tech: TECH, |
|
technology: TECH, |
|
code: TECH, |
|
software: TECH, |
|
linux: TECH, |
|
development: TECH, |
|
|
|
music: MUSIC, |
|
listening: MUSIC, |
|
}; |
|
|
|
function getCategoryIconFromTags(tags: string[]): any { |
|
const categories = tags.map(tag => ICON_MAPPING[tag]).filter(Boolean); |
|
if (categories.length > 0) { |
|
return categories[0]; |
|
} |
|
return null; |
|
} |
|
|
|
export default function CategoryIcon({ tags }: Props) { |
|
const Icon = getCategoryIconFromTags(tags); |
|
if (!Icon) { |
|
return null; |
|
} |
|
|
|
return <Icon className={s.icon} />; |
|
}
|
|
|