import React from 'react'
import PropTypes from 'prop-types'
import securityTypes from 'common-fe/constants/security-types'
import bondTypes from 'common-fe/constants/bond-types'

import styles from './styles.scss'
import BEMModule from 'utils/bem'
const bem = new BEMModule(styles)

const getSecurityTemplate = (securityType, bondType) => {
    switch (securityType) {
        case securityTypes.EQUITY.value: {
            return 'S'
        }
        case securityTypes.FUND.value: {
            return 'E'
        }
        case securityTypes.OPTION.value: {
            return 'O'
        }
        case securityTypes.CASH.value: {
            return 'FX'
        }
        case securityTypes.BOND.value: {
            if (bondTypes[bondType].value === bondTypes.CORP.value) {
                return 'CB'
            }
            if (bondTypes[bondType].value === bondTypes.SOVR.value) {
                return 'GB'
            }
            return 'B'
        }
        default: {
            return '•'
        }
    }
}

const SecurityType = ({securityType, bondType, className}) => {
    const rootClassNames = bem.classNames('c-security-type', className)
    const securityIcon = getSecurityTemplate(securityType, bondType)
    return <span className={rootClassNames}>{securityIcon}</span>
}

SecurityType.propTypes = {
    bondType: PropTypes.string,
    className: PropTypes.string,
    securityType: PropTypes.string,
}

export default React.memo(SecurityType)