import { ThemeColor } from '../types'

export function MessageIcon({
  color
}: {
  color: ThemeColor
}) {
  return (
    <svg
      style={iconStyle} width="20" height="17" viewBox="0 0 20 17"
      xmlns="http://www.w3.org/2000/svg">
      <path fill={color} d="M4.6 12.2857V12.1857H4.5H3C2.50294 12.1857 2.1 11.7828 2.1 11.2857V3C2.1 2.50294 2.50294 2.1 3 2.1H17C17.4971 2.1 17.9 2.50294 17.9 3V11.2857C17.9 11.7828 17.4971 12.1857 17 12.1857H7.50001H7.45463L7.42475 12.2199L5.26072 14.693C5.13147 14.8408 5.03879 14.9465 4.96473 15.0179C4.88752 15.0923 4.84815 15.1111 4.82736 15.114C4.76038 15.1232 4.69326 15.098 4.64894 15.0469C4.63519 15.0311 4.61792 14.991 4.60882 14.8842C4.60009 14.7817 4.6 14.6411 4.6 14.4448V12.2857ZM7.99915 13.3857H17C18.1598 13.3857 19.1 12.4455 19.1 11.2857V3C19.1 1.8402 18.1598 0.9 17 0.9H3C1.8402 0.9 0.9 1.84021 0.9 3V11.2857C0.9 12.4455 1.8402 13.3857 3 13.3857H3.4V14.4448L3.39999 14.4749L3.39999 14.4776C3.39995 14.6431 3.39989 14.8304 3.41314 14.986L3.4134 14.989L3.41354 14.9906C3.42406 15.1145 3.45721 15.5045 3.74261 15.8334C4.05283 16.1909 4.52268 16.3675 4.99155 16.3027C5.42292 16.2431 5.70471 15.9714 5.7942 15.8851L5.79534 15.884L5.79751 15.8819L5.79752 15.8819L5.72812 15.8099C5.83748 15.7045 5.95855 15.5661 6.06873 15.4401L6.08856 15.4174L7.99915 13.3857Z" stroke="#464646" strokeWidth="0.2"/>
    </svg>
  )
} 

const iconStyle = {
  height: 16
}