import {Platform, View} from 'react-native'

import {H2, Text} from '@/components/ui/typography'
import {atoms as a, useTheme} from '@/sprinkles'

export const UnsupportedPlatform = () => {
  const t = useTheme()
  const text = [a.text_center, {color: t.palette.white}]
  return (
    <View
      style={[
        a.flex_1,
        a.align_center,
        a.justify_center,
        a.p_2xl,
        a.gap_lg,
        {backgroundColor: t.palette.negative_500},
      ]}
    >
      <H2 style={text}>iOS only</H2>
      <Text style={text}>
        Crumbs is not supported on {Platform.OS}.
      </Text>
    </View>
  )
}
