/*********************************************************************
 * © Copyright IBM Corp. 2024
 *********************************************************************/
import React from 'react'
import PropTypes from 'prop-types'
import {IconsGeneralColor, Impediment} from '@targetprocess/css-variables'

export const Types = {
  RELATION: 'relation',
  DEPENDENCY: 'dependency',
  DUPLICATE: 'duplicate',
  BLOCKER: 'blocker',
  LINK: 'link'
} as const

export const RelationIcon = ({
  color = IconsGeneralColor,
  type = Types.RELATION as typeof Types[keyof typeof Types]
}) => (
  <svg width="16px" height="16px" viewBox="0 0 16 16" version="1.1" style={{display: 'block'}}>
    {type === Types.RELATION && (
      <path
        fillRule="evenodd"
        d="M5.3667 11.8831C2.8728 11.3608 1 9.1491 1 6.5C1 3.46243 3.4624 1 6.5 1C9.14917 1 11.3606 2.87286 11.8831 5.36674C13.7112 6.11049 15 7.90473 15 10C15 12.7614 12.7615 15 10 15C7.90479 15 6.11035 13.7112 5.3667 11.8831ZM3 6.5C3 4.56701 4.56689 3 6.5 3C7.90063 3 9.10864 3.82252 9.66821 5.01083C7.1709 5.17436 5.17432 7.17116 5.01074 9.66833C3.82251 9.10883 3 7.90047 3 6.5ZM11.8774 7.66C12.5618 8.20984 13 9.05376 13 10C13 11.6569 11.6567 13 10 13C9.05371 13 8.20972 12.5619 7.65991 11.8775C9.76636 11.4252 11.4253 9.76655 11.8774 7.66ZM7.00024 9.96453C8.53296 9.74521 9.74536 8.5329 9.9646 7.00021C8.33594 7.01908 7.01904 8.33583 7.00024 9.96453Z"
        fill={color}
      />
    )}
    {type === Types.DEPENDENCY && (
      <path
        fillRule="evenodd"
        d="M6.82935 13H9.17065C9.58252 14.1652 10.6938 15 12 15C13.6567 15 15 13.6569 15 12C15 10.3431 13.6567 9 12 9C11.928 9 11.8564 9.00244 11.7859 9.00745C11.7219 9.01196 11.6584 9.01855 11.5957 9.02698L10.356 6.85742C10.7593 6.34656 11 5.70142 11 5C11 3.34314 9.65674 2 8 2C6.34326 2 5 3.34314 5 5C5 5.70142 5.24072 6.34656 5.64404 6.85742L4.4043 9.02698C4.27197 9.00916 4.13721 9 4 9C2.34326 9 1 10.3431 1 12C1 13.6569 2.34326 15 4 15C5.30615 15 6.41748 14.1652 6.82935 13ZM9 5C9 5.55225 8.55225 6 8 6C7.44775 6 7 5.55225 7 5C7 4.44775 7.44775 4 8 4C8.55225 4 9 4.44775 9 5ZM8.66333 7.92639C8.58179 7.94482 8.49902 7.95984 8.41528 7.97144C8.27954 7.99023 8.14087 8 8 8C7.77197 8 7.55005 7.97461 7.33667 7.92639L6.18408 9.94336C6.46704 10.2439 6.68896 10.6027 6.82935 11H9.17065C9.31104 10.6027 9.53296 10.2439 9.81592 9.94336L8.66333 7.92639ZM12 13C12.5522 13 13 12.5522 13 12C13 11.4478 12.5522 11 12 11C11.4478 11 11 11.4478 11 12C11 12.5522 11.4478 13 12 13ZM5 12C5 12.5522 4.55225 13 4 13C3.44775 13 3 12.5522 3 12C3 11.4478 3.44775 11 4 11C4.55225 11 5 11.4478 5 12Z"
        fill={color}
      />
    )}
    {type === Types.BLOCKER && (
      <path
        fillRule="evenodd"
        d="M15 8C15 11.866 11.866 15 8 15C4.13403 15 1 11.866 1 8C1 4.134 4.13403 1 8 1C11.866 1 15 4.134 15 8ZM13 8C13 10.7614 10.7615 13 8 13C6.98096 13 6.0332 12.6951 5.24268 12.1716L12.1716 5.24255C12.6951 6.03299 13 6.9809 13 8ZM10.7573 3.82841C9.9668 3.30489 9.01904 3 8 3C5.23853 3 3 5.23857 3 8C3 9.0191 3.30493 9.96701 3.82837 10.7574L10.7573 3.82841Z"
        fill={Impediment}
      />
    )}
    {type === Types.DUPLICATE && (
      <path
        fillRule="evenodd"
        d="M7 1C5.89453 1 5 1.89539 5 3V5H3C1.89453 5 1 5.89539 1 7V13C1 14.1046 1.89453 15 3 15H9C10.1055 15 11 14.1046 11 13V11H13C14.1055 11 15 10.1046 15 9V3C15 1.89539 14.1055 1 13 1H7ZM11 9H13V3H7V5H9C10.1055 5 11 5.89539 11 7V9ZM7 7H9V9H7V7ZM5 7V9C5 10.1046 5.89453 11 7 11H9V13H3V7H5Z"
        fill={color}
      />
    )}
    {type === Types.LINK && (
      <path
        fillRule="evenodd"
        d="M1.29297 1.29288C1.68335 0.902374 2.31665 0.902374 2.70703 1.29288L5.24268 3.8284C6.0332 3.30484 6.98096 3.00003 8 3.00003C9.01904 3.00003 9.9668 3.30484 10.7573 3.8284L13.293 1.29288C13.6833 0.902374 14.3167 0.902374 14.707 1.29288C15.0977 1.6835 15.0977 2.31656 14.707 2.70718L12.1716 5.24271C12.6951 6.03311 13 6.98099 13 8.00003C13 9.01907 12.6951 9.96695 12.1716 10.7574L14.707 13.2929C15.0977 13.6835 15.0977 14.3166 14.707 14.7072C14.3167 15.0977 13.6833 15.0977 13.293 14.7072L10.7573 12.1717C9.9668 12.6952 9.01904 13 8 13C6.98096 13 6.0332 12.6952 5.24268 12.1717L2.70703 14.7072C2.31665 15.0977 1.68335 15.0977 1.29297 14.7072C0.902344 14.3166 0.902344 13.6835 1.29297 13.2929L3.82837 10.7574C3.30493 9.96695 3 9.01907 3 8.00003C3 6.98099 3.30493 6.03311 3.82837 5.24271L1.29297 2.70718C0.902344 2.31656 0.902344 1.6835 1.29297 1.29288ZM11 8.00003C11 9.65689 9.65674 11 8 11C6.34326 11 5 9.65689 5 8.00003C5 6.34317 6.34326 5.00003 8 5.00003C9.65674 5.00003 11 6.34317 11 8.00003Z"
        fill={color}
      />
    )}
  </svg>
)

RelationIcon.category = 'Entity'

RelationIcon.propTypes = {
  // hasOwnProperty explicitly called here
  // eslint-disable-next-line security/detect-object-injection
  type: PropTypes.oneOf(Object.keys(Types).map(key => Types[key])),
  color: PropTypes.string
}

RelationIcon.Types = Types