components/Social/Social.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45

import styles from "./Social.module.css";

export type SocialType = "telegram" | "linkedin" | "github";

interface Props {
    type: SocialType;
}

interface TypeItem {
    alt: string;
    src: string;
    href: string;
}

const typeMap: Record<SocialType, TypeItem> = {
    telegram: {
        alt: "Telegram",
        src: "/social/telegram.svg",
        href: "https://t.me/kal_jan",
    },
    linkedin: {
        alt: "LinkedIn",
        src: "/social/linkedin.svg",
        href: "https://www.linkedin.com/in/jantuomi/",
    },
    github: {
        alt: "GitHub",
        src: "/social/github.svg",
        href: "http://github.com/jantuomi"
    },
};

const Social = ({ type }: Props): JSX.Element => {
    const typeItem = typeMap[type];

    return (
        <a className={styles.social} target="blank" rel="noopener noreferrer" href={typeItem.href}>
            <img src={typeItem.src} alt={typeItem.alt} />
        </a>
    );
};


export default Social;