import React from 'react';
import { Path, Svg } from 'react-native-svg';
import { useTheme } from '../../../../branding';

export interface Props {
    size: number;
}

export const SpotifyIcon = ({ size }: Props) => {
    const { colors } = useTheme();
    return (
        <Svg width={size} height={size} viewBox="0 0 110 110" fill="none">
            <Path
                fillRule="evenodd"
                clipRule="evenodd"
                d="M82.474 59.874C60.738 47.09 24.888 45.915 4.138 52.152c-3.332 1.002-6.855-.862-7.865-4.161-1.01-3.302.87-6.79 4.204-7.792 23.818-7.16 63.412-5.777 88.434 8.932 2.998 1.762 3.981 5.596 2.204 8.558-1.778 2.968-5.65 3.947-8.641 2.185zm-.249 19.287c-1.52 2.554-4.746 3.355-7.21 1.787-18.069-11.499-45.62-14.83-66.998-8.112-2.772.868-5.7-.75-6.542-3.615-.836-2.87.729-5.896 3.496-6.769 24.42-7.671 54.777-3.956 75.53 9.248 2.464 1.571 3.239 4.912 1.724 7.461zm-8.097 17.784a4.2 4.2 0 01-5.818 1.426c-15.94-9.866-36.007-12.093-59.637-6.628-2.276.528-4.546-.917-5.065-3.222-.522-2.305.9-4.604 3.182-5.13 25.86-5.985 48.041-3.41 65.934 7.662 1.995 1.233 2.623 3.873 1.404 5.892zM42.5 0C5.221 0-25 30.22-25 67.499-25 104.782 5.221 135 42.5 135c37.28 0 67.5-30.218 67.5-67.501C110 30.22 79.78 0 42.5 0z"
                fill={colors.gray0}
                fillOpacity={0.15}
            />
        </Svg>
    );
};

export default SpotifyIcon;