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

export const Directions = {
  TOP: 'top',
  BOTTOM: 'bottom',
  LEFT: 'left',
  RIGHT: 'right'
} as const

export const Rotations = {
  [Directions.LEFT]: 0,
  [Directions.TOP]: -270,
  [Directions.BOTTOM]: 270,
  [Directions.RIGHT]: -180
}

export const NavIcon = ({
  direction,
  color = IconsGeneralColor
}: {
  direction: typeof Directions[keyof typeof Directions]
  color?: string
}) => {
  const rotationDegrees = Rotations.hasOwnProperty(direction)
    ? // hasOwnProperty explicitly checked here
      // eslint-disable-next-line security/detect-object-injection
      Rotations[direction]
    : Rotations[Directions.LEFT]
  return (
    <svg
      width="24px"
      height="24px"
      viewBox="0 0 24 24"
      version="1.1"
      style={{transform: `rotate(${rotationDegrees}deg)`, display: 'block'}}
    >
      <path
        fill={color}
        fillRule="evenodd"
        d="M23,11.5005846 C22.9914414,10.1422883 21.8623902,9.04117159 20.5,9.04117159 L8.53635362,9.04117159 L12.7479223,4.89797684 C13.7275168,3.93428588 14.9003143,2.1548151 13.4003143,0.679167296 C11.9003143,-0.796480512 10.1973818,0.45083931 9.21238839,1.41984158 L0.738998499,9.75566777 C0.248210307,10.2384881 0.000935939411,10.8692668 0,11.500182 C-4.85966393e-05,12.1275824 0.245511772,12.7600264 0.738998499,13.2455015 L9.21238839,21.5813277 C10.1919829,22.5450186 11.9003143,23.79765 13.4003143,22.3220022 C14.9003143,20.8463543 13.7329157,19.0721947 12.7479223,18.1031924 L8.53635362,13.9599976 L20.5,13.9599976 C21.8759851,13.9599976 22.9914414,12.8683507 23,11.5005846 L23,11.5005846 Z"
      />
    </svg>
  )
}

NavIcon.category = 'Navigation'

NavIcon.propTypes = {
  color: PropTypes.string,
  // Object.keys used here
  // eslint-disable-next-line security/detect-object-injection
  direction: PropTypes.oneOf(Object.keys(Directions).map(key => Directions[key])).isRequired
}

NavIcon.Directions = Directions