import { useIcon } from 'hooks';
import React, { useMemo } from 'react';
import Svg, { Path } from 'react-native-svg';
import { IconProps } from '../types';

export const VideoCamera: React.FC<IconProps> = ({ colorVariant = 'white', ...props }) => {
  const { getIconColor } = useIcon();
  const color = useMemo(() => getIconColor(colorVariant), [getIconColor, colorVariant]);

  return (
    <Svg width="10" height="10" viewBox="0 0 10 10" fill="none" {...props}>
      <Path
        d="M8.52714 2.38048L7.48962 3.15863V6.84092L8.52712 7.61905C9.1333 8.07364 10.0001 7.64121 10.0001 6.88258V3.11695C10.0001 2.35939 9.13416 1.92521 8.52714 2.38048Z"
        fill={color}
      />
      <Path
        d="M5.98307 1.56885H0.920566C0.407324 1.56885 0 1.98537 0 2.48943V7.51025C0 8.02349 0.416504 8.43081 0.920566 8.43081H5.98307C6.49631 8.43081 6.90363 8.01431 6.90363 7.51025V2.48943C6.90365 1.97619 6.48715 1.56885 5.98307 1.56885Z"
        fill={color}
      />
    </Svg>
  );
};
