import { View, Text, Button, TextField } from "react-native-ui-lib";
import React, { useState } from "react";
import { useSignIn } from "@/hooks/firebase/useSignIn";

const SignInPage = (props: { setRegister: () => any }) => {
    const [email, setEmail] = useState<string>("");
    const [password, setPassword] = useState<string>("");

    const { mutateAsync: signIn, error, isError } = useSignIn();

    const handleSignIn = async () => {
        await signIn({ email, password });
    };

    return (
        <View padding-10>
            <TextField
                placeholder="Email"
                value={email}
                onChangeText={setEmail}
                style={{ marginBottom: 10 }}
                floatingPlaceholder
            />
            <TextField
                placeholder="Password"
                value={password}
                onChangeText={setPassword}
                secureTextEntry
                style={{ marginBottom: 10 }}
                floatingPlaceholder
            />
            <Button label="Login" onPress={handleSignIn} style={{ marginBottom: 20 }} />
            {isError && (
                <Text center style={{ marginBottom: 20 }}>{`${error}`}</Text>
            )}
            <Text center style={{ marginBottom: 5 }}>Don't have an account?</Text>
            <Button
                onPress={props.setRegister}
                label="Sign Up"
                link
                padding-0
                margin-0
                left
            />
        </View>
    );
};

export default SignInPage;