import React from 'react';
import Svg, { Path } from 'react-native-svg';

const NotificationIcon = ({size, color}: {size: number, color: string}) => (
  <Svg
    viewBox="0 0 1024 1024"
    width={size}
    height={size}
  >
    {/* Background circle */}
    <Path
      d="M777.3 1024H246.7C111 1024 0 913 0 777.3V246.8C0 111 111 0 246.7 0h530.5C913 0 1024 111 1024 246.7v530.5C1024 913 913 1024 777.3 1024z"
      fill="#FFF6EB"
    />
    
    {/* Bell icon */}
    <Path
      d="M639.5 212.5l-5.4 6.7c-0.1 0.1-0.2 0.3-0.3 0.4l-45.3 56.6H435.6l-45.2-56.5c-0.3-0.3-0.5-0.7-0.8-1.1l-4.9-6.1 0.8-1.7c-0.4-1.6-0.9-3.1-0.9-4.8 0-8.1 5.1-15 12.2-17.8l0.6-1.2s62.7-12.5 114.7-12.8c54.4-0.2 114.7 12.8 114.7 12.8l0.6 1.2c7.1 2.8 12.2 9.7 12.2 17.7 0 1.7-0.5 3.2-0.9 4.7l0.8 1.9zM771 670.3l-37.7-189.8C713.7 381.7 621.3 301 528.1 301h-32c-93.3 0-185.6 80.8-205.3 179.5L253 670.3c-19.7 98.8 40.5 179.5 133.8 179.5h250.4c93.2 0 153.5-80.8 133.8-179.5z m-174.6-31.6c11.7 0 21.1 9.5 21.1 21.1 0 11.7-9.5 21.1-21.1 21.1h-63.3V744.2c0 11.7-9.5 21.1-21.1 21.1-11.7 0-21.1-9.5-21.1-21.1V680.9h-63.3c-11.7 0-21.1-9.5-21.1-21.1 0-11.7 9.5-21.1 21.1-21.1h63.3v-42.2h-63.3c-11.7 0-21.1-9.5-21.1-21.1s9.5-21.1 21.1-21.1h63.3v-14.7c-2.7-1-5.2-2.5-7.3-4.7l-59.7-59.7c-8.2-8.2-8.2-21.6 0-29.8s21.6-8.2 29.8 0l57.9 57.9 57.9-57.9c8.2-8.2 21.6-8.2 29.8 0s8.2 21.6 0 29.8l-59.7 59.7c-1.9 1.9-4.2 3.3-6.5 4.3v15.1h63.3c11.7 0 21.1 9.5 21.1 21.1s-9.5 21.1-21.1 21.1h-63.3v42.2h63.3z"
      fill="#FF9401"
    />
  </Svg>
);

export default NotificationIcon;