import React from 'react'
import { TouchableOpacity } from 'react-native'

import { Strings } from '../i18n'
import { CountryIcon } from './CountryIconAndName'

export const MarketSelectorButton: React.FC<{
  countryCode: string
  onPress: () => void
}> = ({ countryCode, onPress }) => (
  <TouchableOpacity
    onPress={onPress}
    accessibilityLabel={Strings.Shared.ChooseMarket}
    accessibilityRole="menu"
    accessibilityValue={{ text: countryCode }}
    style={{ padding: 8 }}
  >
    <CountryIcon countryCode={countryCode} size={32} />
  </TouchableOpacity>
)