import React from 'react'
import { Text } from 'react-native'
import { DspColors } from '../Colors'
import { Dsp } from '../Consts'
import { Strings } from '../i18n'
import { TextStylesV2 } from '../Styles'

/**
 * Colorized dsp name
 */
export const TinyDspLabel: React.FC<{
  dsp: Dsp | 'all'
  dspAdditionalText?: string
}> = ({ dsp, dspAdditionalText }) => (
  <Text
    style={[
      TextStylesV2.tinyBold,
      { color: DspColors[dsp], textTransform: 'uppercase' },
    ]}
  >
    {dsp ?? Strings.Shared.AllDSPs} {dspAdditionalText}
  </Text>
)