63 lines
1.2 KiB
TypeScript
63 lines
1.2 KiB
TypeScript
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} />;
|
|
}
|