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

export const Statuses = {
  PASSED: 'passed',
  FAILED: 'failed',
  BLOCKED: 'blocked',
  ONHOLD: 'onhold',
  NOTRUN: 'notrun'
} as const

export const QAIcon = ({
  color = IconsGeneralColor,
  status = Statuses.PASSED as typeof Statuses[keyof typeof Statuses]
}) => (
  <svg
    width="16px"
    height="16px"
    fill="none"
    viewBox="0 0 16 16"
    version="1.1"
    style={{display: 'block'}}
  >
    {status === Statuses.PASSED && (
      <path
        fillRule="evenodd"
        d="M14.7071 3.29289C15.0976 3.68342 15.0976 4.31658 14.7071 4.70711L6.70711 12.7071C6.31658 13.0976 5.68342 13.0976 5.29289 12.7071L1.29289 8.70711C0.902369 8.31658 0.902369 7.68342 1.29289 7.29289C1.68342 6.90237 2.31658 6.90237 2.70711 7.29289L6 10.5858L13.2929 3.29289C13.6834 2.90237 14.3166 2.90237 14.7071 3.29289Z"
        fill={FontColorSuccess}
      />
    )}
    {status === Statuses.FAILED && (
      <path
        d="M11.2929 3.29289C11.6834 2.90237 12.3166 2.90237 12.7071 3.29289C13.0976 3.68342 13.0976 4.31658 12.7071 4.70711L9.41421 8L12.7071 11.2929C13.0976 11.6834 13.0976 12.3166 12.7071 12.7071C12.3166 13.0976 11.6834 13.0976 11.2929 12.7071L8 9.41421L4.70711 12.7071C4.31658 13.0976 3.68342 13.0976 3.29289 12.7071C2.90237 12.3166 2.90237 11.6834 3.29289 11.2929L6.58579 8L3.29289 4.70711C2.90237 4.31658 2.90237 3.68342 3.29289 3.29289C3.68342 2.90237 4.31658 2.90237 4.70711 3.29289L8 6.58579L11.2929 3.29289Z"
        fill={FontColorError}
      />
    )}
    {status === Statuses.BLOCKED && (
      <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={FontColorError}
      />
    )}
    {status === Statuses.ONHOLD && (
      <path
        fillRule="evenodd"
        d="M4 8C4 5.79086 5.79086 4 8 4V2C4.68629 2 2 4.68629 2 8C2 11.3137 4.68629 14 8 14C11.3137 14 14 11.3137 14 8C14 6.34315 13.3284 4.84315 12.2426 3.75736L10.8284 5.17157C11.5523 5.89543 12 6.89543 12 8C12 10.2091 10.2091 12 8 12C5.79086 12 4 10.2091 4 8Z"
        fill={Third300}
      />
    )}
    {status === Statuses.NOTRUN && (
      <path
        fillRule="evenodd"
        d="M8 4C5.79086 4 4 5.79086 4 8C4 10.2091 5.79086 12 8 12C10.2091 12 12 10.2091 12 8C12 5.79086 10.2091 4 8 4ZM2 8C2 4.68629 4.68629 2 8 2C11.3137 2 14 4.68629 14 8C14 11.3137 11.3137 14 8 14C4.68629 14 2 11.3137 2 8Z"
        fill={color}
      />
    )}
  </svg>
)

QAIcon.category = 'QA'

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

QAIcon.Statuses = Statuses