/*********************************************************************
 * © 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',
  SKIPPED: 'skipped',
  BLOCKED: 'blocked',
  NOTRUN: 'notrun',
  ONHOLD: 'onhold'
} as const

export const QAStatusIcon = ({
  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
        d="M8 14C11.3137 14 14 11.3137 14 8C14 6.96404 13.7375 5.98938 13.2753 5.13896L8 10.4142L5.29289 7.70711C4.90237 7.31659 4.90237 6.68341 5.29289 6.29289C5.68341 5.90237 6.31659 5.90237 6.70711 6.29289L8 7.58578L12.0305 3.55528C10.9654 2.58887 9.55147 2 8 2C4.68629 2 2 4.68629 2 8C2 11.3137 4.68629 14 8 14Z"
        fill={FontColorSuccess}
      />
    )}
    {status === Statuses.FAILED && (
      <path
        fillRule="evenodd"
        d="M8 14C11.3137 14 14 11.3137 14 8C14 4.68629 11.3137 2 8 2C4.68629 2 2 4.68629 2 8C2 11.3137 4.68629 14 8 14ZM10.7071 5.29289C11.0976 5.68341 11.0976 6.31659 10.7071 6.70711L9.41422 8L10.7071 9.29289C11.0976 9.68341 11.0976 10.3166 10.7071 10.7071C10.3166 11.0976 9.68341 11.0976 9.29289 10.7071L8 9.41422L6.70711 10.7071C6.31659 11.0976 5.68341 11.0976 5.29289 10.7071C4.90237 10.3166 4.90237 9.68341 5.29289 9.29289L6.58578 8L5.29289 6.70711C4.90237 6.31659 4.90237 5.68341 5.29289 5.29289C5.68341 4.90237 6.31659 4.90237 6.70711 5.29289L8 6.58578L9.29289 5.29289C9.68341 4.90237 10.3166 4.90237 10.7071 5.29289Z"
        fill={FontColorError}
      />
    )}
    {status === Statuses.SKIPPED && (
      <path
        fillRule="evenodd"
        d="M8 9C8.55228 9 9 8.55228 9 8C9 7.44772 8.55228 7 8 7C7.44772 7 7 7.44772 7 8C7 8.55228 7.44772 9 8 9ZM8 11C9.65685 11 11 9.65685 11 8C11 6.34315 9.65685 5 8 5C6.34315 5 5 6.34315 5 8C5 9.65685 6.34315 11 8 11Z"
        fill={color}
      />
    )}
    {status === Statuses.ONHOLD && (
      <path
        fillRule="evenodd"
        d="M8 9C8.55228 9 9 8.55228 9 8C9 7.44772 8.55228 7 8 7C7.44772 7 7 7.44772 7 8C7 8.55228 7.44772 9 8 9ZM8 11C9.65685 11 11 9.65685 11 8C11 6.34315 9.65685 5 8 5C6.34315 5 5 6.34315 5 8C5 9.65685 6.34315 11 8 11Z"
        fill={Third300}
      />
    )}
    {status === Statuses.BLOCKED && (
      <path
        fillRule="evenodd"
        d="M8 2C6.36507 2 4.88118 2.65524 3.79996 3.71518C2.69032 4.80297 2 6.32177 2 8C2 11.3137 4.68629 14 8 14C9.67823 14 11.197 13.3097 12.2848 12.2C13.3448 11.1188 14 9.63493 14 8C14 4.68629 11.3137 2 8 2ZM11.4724 9.98743L6.01257 4.52764C6.59807 4.19165 7.27621 4 8 4C10.2091 4 12 5.79086 12 8C12 8.72379 11.8083 9.40193 11.4724 9.98743ZM4.58019 5.92368L10.0763 11.4198C9.47098 11.7883 8.76063 12 8 12C5.79086 12 4 10.2091 4 8C4 7.23937 4.2117 6.52903 4.58019 5.92368Z"
        fill={FontColorError}
      />
    )}
    {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>
)

QAStatusIcon.category = 'QA'

QAStatusIcon.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
}

QAStatusIcon.Statuses = Statuses