import type { SvgProps } from "react-native-svg";
import Svg, { G, Mask, Path, Rect } from "react-native-svg";

const SvgComponent = ({ height, width, color }: SvgProps) => (
  <Svg width={width} height={height} fill='none' viewBox='0 0 120 120'>
    <Mask
      id='mask0_5082_129886'
      style={{ maskType: "alpha" }}
      maskUnits='userSpaceOnUse'
      x='-20'
      y='-20'
      width='160'
      height='160'
    >
      <Rect x='-20' y='-20' width='160' height='160' fill='#D9D9D9' />
    </Mask>
    <G mask='url(#mask0_5082_129886)'>
      <Path
        d='M60 57.9479C53.5644 57.9479 48.0667 55.6679 43.5067 51.1079C38.9467 46.549 36.6667 41.0512 36.6667 34.6146C36.6667 28.179 38.9467 22.6825 43.5067 18.1235C48.0667 13.5644 53.5644 11.2844 60 11.2844C66.4356 11.2844 71.9333 13.5644 76.4933 18.1235C81.0533 22.6825 83.3333 28.179 83.3333 34.6146C83.3333 41.0512 81.0533 46.549 76.4933 51.1079C71.9333 55.6679 66.4356 57.9479 60 57.9479ZM19.3166 105.007C16.1811 105.007 13.4568 103.856 11.1437 101.555C8.8306 99.2539 7.67344 96.5196 7.67344 93.3513V91.0288C7.67344 86.7545 8.70044 82.9018 10.7544 79.4706C12.8084 76.0385 15.6466 73.4095 19.268 71.5826C24.3797 69.1016 29.6071 67.2153 34.95 65.9235C40.2929 64.6317 46.0113 63.9858 52.105 63.9858H67.8949C73.987 63.9858 79.7055 64.6317 85.0491 65.9235C90.3928 67.2153 95.6215 69.1016 100.735 71.5826C104.357 73.4095 107.195 76.0385 109.249 79.4706C111.303 82.9018 112.33 86.7545 112.33 91.0288V93.3513C112.33 96.5196 111.173 99.2539 108.86 101.555C106.547 103.856 103.823 105.007 100.687 105.007H19.3166Z'
        fill={color}
      />
    </G>
  </Svg>
);

export default SvgComponent;