import { View, Text, StyleSheet, ImageBackground } from "react-native"
import { FlatList } from "react-native-gesture-handler"
import { CITIES_DATA, City, FAVORITE_CITY_DATA } from "../data/stub"
import { useSafeAreaInsets } from 'react-native-safe-area-context';
import { VilleCompopo } from "../components/VilleCompopo";
import { TopBar } from "../components/TopBar";
import CityDetails from "./CityDetails";
import { useSelector } from "react-redux";


export default function Home(navigation){

    
    const insets = useSafeAreaInsets();
    const statusBarHeight = insets.top;
    const favoriteCity: City | null = FAVORITE_CITY_DATA;

    return (
        <View style={{alignItems: "center"}}>
            <TopBar/>
            {(() => {
              if (favoriteCity != null){
                return (
                    <Text>{favoriteCity.name}</Text>
                )
              }
              else{
                return(
                    <Text>Pas de city</Text>
                  )
              }
            })()}
        </View>
    )
}


const leStyle = StyleSheet.create({
    container: {
        alignItems: 'center',
    },
});