import { TextInput, View, StyleSheet, Button } from 'react-native'
import { useState } from 'react'
import axios from 'axios'

export default function LoginView() {
	const [username, setUsername] = useState('')
	const [password, setPassword] = useState('')

	async function login() {
		console.log(username, password)
		try {
			const res = await axios.get("https://api.feedbin.com/v2/authentication.json", {
				auth: {
					username,
					password
				}
			})
			console.log(res.status)
		} catch(e) {
			console.log("error on verifing your credentials")
			console.log(e)
		}
	}

	const styles = StyleSheet.create({
		container: {
			padding: 16,
			gap: 8
		},
		textfield: {
			borderColor: 'transparent',
    	borderBottomColor: '#ccc',
    	borderWidth: 1,
			paddingVertical: 4
		}
	})
	return <View style={styles.container}>
		<TextInput placeholder="Feedbin Email" style={styles.textfield} autoCapitalize="none" autoCorrect={false} textContentType="none" keyboardType="email-address" onChangeText={setUsername} />
		<TextInput placeholder="Password" style={styles.textfield} secureTextEntry={true} onChangeText={setPassword} />
		<Button title="Enter" onPress={login} />
	</View>
}