import { ThemedText } from "@/components/ThemedText";
import { ActivityIndicator, StyleSheet, TouchableOpacity, ViewStyle } from "react-native";

interface ButtonProps {
    isLoading?: boolean;
    handleLogin?: () => void;
    text: string;
    containerStyle?: ViewStyle;
}
const Button = ({ isLoading, handleLogin, text, containerStyle }: ButtonProps) => {
    return <TouchableOpacity
        style={[styles.loginButton, isLoading && { opacity: 0.7 }, containerStyle]}
        onPress={handleLogin}
        disabled={isLoading}
    >
        {isLoading ? (
            <ActivityIndicator color="#fff" />
        ) : (
            <ThemedText type="sfPro" size="lg" weight="bold" color="textWhite">
                {text}
            </ThemedText>
        )}
    </TouchableOpacity>
}

const styles = StyleSheet.create({
    loginButton: {
        width: '100%',
        backgroundColor: '#E2793F',
        borderRadius: 28,
        padding: 16,
        alignItems: 'center',
        marginBottom: 24,
    },
})

export default Button