import React from 'react';
import { Link } from 'gatsby';
import styled from 'styled-components';

import Emoji from '../components/Emoji';

const StlyedTag = styled(Link)`
  margin-left: 10px;
`;

const Tag = ({ tag }) => (
  <StlyedTag key={tag} to={`/tags/${tag}`}><Emoji e="🏷️" n="Tag emoji"/> #{tag}</StlyedTag>
);

export default Tag;
