import React from "react";
import useTranslation from "../../../../hooks/useTranslation.jsx";
import wordStore from "../../../../mc/wordStore.json";

export const CheckCircleIcon = ({ width, height, fill, onClick }) => {
  const { findText } = useTranslation(wordStore);
  return (
    <svg
      width="14"
      height="13"
      viewBox="0 0 14 13"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
      xmlns:xlink="http://www.w3.org/1999/xlink"
      onClick={onClick}
      style={{ cursor: onClick ? 'pointer' : 'default' }}
    >
      <rect
        x="0.0820312"
        width="13"
        height="13"
        rx="6.5"
        fill="url(#pattern0_42524_426925)"
      />
      <rect x="0.0820312" width="13" height="13" rx="6.5" fill="#F5F7F7" />
      <defs>
        <pattern
          id="pattern0_42524_426925"
          patternContentUnits="objectBoundingBox"
          width="1"
          height="1"
        >
          <use xlink:href="#image0_42524_426925" transform="scale(0.00025)" />
        </pattern>
        <image
          id="image0_42524_426925"
          width="4000"
          height="4000"
          xlink:href="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNDAwMCIgaGVpZ2h0PSI0MDAwIiB2aWV3Qm94PSIwIDAgNDAwMCA0MDAwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxjaXJjbGUgY3g9IjIwMDAiIGN5PSIyMDAwIiByPSIxOTUwIiBmaWxsPSIjNENBRjUwIiBzdHJva2U9IiNGNUY3RjciIHN0cm9rZS13aWR0aD0iMTAwIi8+CiAgPHBhdGggZD0iTTEyMDAgMjAwMEwxNzAwIDI1MDBMMjgwMCAxNDAwIiBzdHJva2U9IiNGNUY3RjciIHN0cm9rZS13aWR0aD0iMjAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+"
        />
      </defs>
    </svg>
  );
};