/*********************************************************************
 * © Copyright IBM Corp. 2024
 *********************************************************************/
import React from 'react'
import PropTypes from 'prop-types'

export const Sizes = {
  DEFAULT: 'default',
  BIG: 'big'
} as const

export const TestRailIcon = ({size = Sizes.DEFAULT as typeof Sizes[keyof typeof Sizes]}) => {
  const numericSize = size === Sizes.BIG ? 24 : 16
  return (
    <svg
      width={`${numericSize}px`}
      height={`${numericSize}px`}
      viewBox={`0 0 ${numericSize} ${numericSize}`}
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <g style={size === Sizes.BIG ? {} : {transform: 'scale(0.725)', transformOrigin: '0 0'}}>
        <rect x="2" y="2" width="5" height="5" fill="#74BB53" />
        <rect x="2" y="9" width="5" height="5" fill="#74BB53" />
        <rect x="9" y="9" width="5" height="5" fill="#F4EC65" />
        <rect x="2" y="16" width="5" height="5" fill="#74BB53" />
        <rect x="9" y="16" width="5" height="5" fill="#74BB53" />
        <rect x="16" y="16" width="5" height="5" fill="#CD455D" />
      </g>
    </svg>
  )
}

TestRailIcon.category = 'Tool'

TestRailIcon.propTypes = {
  // Object.keys used here
  // eslint-disable-next-line security/detect-object-injection
  size: PropTypes.oneOf(Object.keys(Sizes).map(key => Sizes[key]))
}

TestRailIcon.Sizes = Sizes