import { useRouter } from 'expo-router'
import React from 'react'

import { useIsFirstTime } from '@/core/hooks'
import { Button, FocusAwareStatusBar, SafeAreaView, Text, View } from '@/ui'

export default function Landing() {
  const [_, setIsFirstTime] = useIsFirstTime()
  const router = useRouter()

  return (
    <View className="flex h-full items-center  justify-center">
      <FocusAwareStatusBar />
      <View className="justify-end ">
        <Text className="my-3 text-center text-5xl font-bold">BusyBar</Text>
        <Text className="mb-2 text-center text-lg text-gray-600">
          Get real time insights into the local nightlife
        </Text>
        <Text className="my-1 pt-6 text-left text-lg">
          🎉 See real-time wait times for local bars
        </Text>
        <Text className="my-1 text-left text-lg">🍻 Find the hottest spots in your area</Text>
        <Text className="my-1 text-left text-lg">⏰ Skip the lines and plan your night</Text>
        <Text className="my-1 text-left text-lg">👥 See where your friends are partying</Text>
      </View>
      <SafeAreaView className="mt-6">
        <Button
          label="Let's Get Started"
          onPress={() => {
            setIsFirstTime(false)
            router.replace('/login')
          }}
        />
      </SafeAreaView>
    </View>
  )
}