import { StatusBar } from 'expo-status-bar';
import React from 'react';
import { 
  StyleSheet, 
  Text, 
  View, 
  FlatList, 
  Button
} from 'react-native';
import { useState, useEffect } from 'react';


export default function App() {

  const url1 = 'http://192.168.5.5:8000/cars';
  const url2 = '';
  
  const [cars, setCars] = useState([]);
  
  function handleFetchButton() {
    fetch(url1)
    .then(resp => resp.json())
    .then(data => {            
      setCars(data);      
    })
    .catch( error => {
      alert('Hiba: ' + error);
    })
  }
  
  return (
    <View style={styles.container}>
    <Text>Járművek</Text>
    <Button 
      title="Lekér"
      onPress={handleFetchButton}
    />

      <FlatList 
        data = {cars}
        renderItem={ ({item}) => (
          <Text>{item.plate}</Text>
        )}
      />
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});