import React from "react";
import { useState } from "react";
import { View, TextInput } from "react-native";
import Button from "../components/Buttons/Button";
import { login } from "../thunks/user.thunk";

export const LogIn = () => {

  const [username, setUsername] = useState()
  const [password, setPassword] = useState()
  const [error, setError] = useState()

  return (
    <View>
      <TextInput focus={true}
        style={{ marginTop: 20 }}
        placeholder='Username' />
      <TextInput focus={true}
        style={{ marginTop: 20 }}
        placeholder='Password'
        secureTextEntry />
      <Button onPress={() => dispatch(
        login(username, password, function (result) {
          if (!result.OK) {
            setUsername("");
            setPassword("");
            setError(result.data.Message ? result.data.Message : "Error occurred during Login,please try again!");
          }
        })
      )} title='Log In' style={{ backgroundColor: 'red' }} />
    </View>
  )
}