import React from 'react';
import { View, Button, Alert } from 'react-native';
import { addCategory, addExpense, deleteExpenses, deleteCategories, DEV_populateDatabase } from './database';
import uuid from 'react-native-uuid';

const randomColors = ["red", "blue", "green", "purple", "yellow"];

const getRandomColor = () => {
    return randomColors[Math.floor(Math.random() * randomColors.length)];
};

const getRandomName = () => {
    return `RandomName-${Math.floor(Math.random() * 1000)}`;
};

const getRandomNumber = () => {
    return Math.floor(Math.random() * 1000);
};

const DebugMenu = () => {

    const handleNukeDatabase = () => {
        return deleteExpenses(), deleteCategories()
    };

    const handlePopulateDatabase = () => {
        return DEV_populateDatabase()
    };

    const handleDeleteExpenses = () => {
        return deleteExpenses();
    }
    const handleDeleteCategories = () => {
        return deleteCategories();
    }

//for some reason this function does not work
    const handleAddCategory = () => {
        const name = getRandomName();
        const color = getRandomColor();
        const allocated_amount = getRandomNumber();
        const type = "expense";

        addCategory(name, color, type, allocated_amount)
            .then(() => Alert.alert("Category Added", `Name: ${name}, Color: ${color}`))
            .catch((error: any) => console.error("Error adding category: ", error));
    };

//for some reason this function does not work
    const handleAddExpense = () => {
        const name = getRandomName();
        const categoryGuid = uuid.v4().toString();
        const datetime = new Date().toISOString();
        const amount = Math.floor(Math.random() * 1000);

        addExpense(name, categoryGuid, datetime, amount)
            .then(() => Alert.alert("Expense Added", `Name: ${name}, Amount: ${amount}`))
            .catch((error: any) => console.error("Error adding expense: ", error));
    };

    return (
        <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
            <Button title="Nuke Database" onPress={handleNukeDatabase} />
            <Button title="DEV_populateDatabase" onPress={handlePopulateDatabase} />
            <Button title="Delete All Expenses" onPress={handleDeleteExpenses} />
            <Button title="Delete All Categories" onPress={handleDeleteCategories} />
            <Button title="Add Random Category" onPress={handleAddCategory} />
            <Button title="Add Random Expense" onPress={handleAddExpense} />
        </View>
    );
};

export default DebugMenu;