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

interface RevisionProps {
    color?: string;
    size?: number;
}

export const Revision = ({ color, size = 16 }: RevisionProps) => {
    const { colors } = useTheme();
    const fill = color ?? colors.revision350;

    return (
        <Svg
            width={size}
            height={size}
            viewBox="0 0 16 16"
            fill="none"
            testID="revisionIcon"
        >
            <G transform="translate(1 1.5)">
                <Path
                    d="M6.84989 2.00246C6.89972 2.00082 6.94977 2 7 2C7.06204 2 7.12378 2.00125 7.18521 2.00374C8.66864 2.06379 9.96706 2.84197 10.7422 4H9C8.44772 4 8 4.44772 8 5C8 5.55228 8.44772 6 9 6H13C13.5523 6 14 5.55228 14 5V1C14 0.447715 13.5523 0 13 0C12.4477 0 12 0.447715 12 1V2.34643C10.817 0.923939 9.0385 0.0142999 7.0471 0.000167211L7 0C4.69879 0 2.67689 1.19584 1.52182 3H1.5503C1.38724 3.42025 1.52537 3.91277 1.91171 4.18175C2.36495 4.49732 2.9882 4.3857 3.30377 3.93245C3.54787 3.58185 3.84021 3.26785 4.17111 3C4.90775 2.40392 5.83655 2.03567 6.84989 2.00246Z"
                    fill={fill}
                />
                <Path
                    d="M1 13C1.55228 13 2 12.5523 2 12V10.6536C3.1923 12.0873 4.98956 13 7 13C8.84336 13 10.5075 12.2327 11.6904 11C11.9262 10.7544 12.1426 10.4903 12.3376 10.2103C12.6532 9.75707 12.5415 9.13382 12.0883 8.81825C11.635 8.50268 11.0118 8.6143 10.6962 9.06755C10.0646 9.97475 9.11004 10.6369 8 10.8886C7.74549 10.9463 7.48278 10.9824 7.21391 10.995C7.14302 10.9983 7.07171 11 7 11C5.70966 11 4.54617 10.4569 3.72563 9.58684C3.55412 9.40494 3.39751 9.20868 3.25777 9H5C5.55228 9 6 8.55228 6 8C6 7.44772 5.55228 7 5 7H1C0.447716 7 0 7.44772 0 8V12C0 12.5523 0.447716 13 1 13Z"
                    fill={fill}
                />
            </G>
        </Svg>
    );
};

export default Revision;