import { StyleProp, TouchableOpacity, ViewStyle } from 'react-native'

import Info from '../icons/Info'
import { InfoModal } from './InfoModal'

export const InfoModalButton: React.FC<{
  title: string
  text: string
  style?: StyleProp<ViewStyle>
}> = ({ title, text, style }) => (
  <InfoModal title={title} body={{ type: 'string', text }}>
    {(open) => (
      <TouchableOpacity onPress={open} style={[{ padding: 12 }, style]}>
        <Info />
      </TouchableOpacity>
    )}
  </InfoModal>
)