import styles from "./eventTask.module.css";
import { formatDateLetter } from "../../../../utils/date/formatDateLetter.js";
import Button from "../../../../components/ui/button/button.tsx";
import assign from "../../../../utils/tasks/assign.js";
import unAssign from "../../../../utils/tasks/unAssign.js";
import { useContext, useEffect, useState } from "react";
import isAssigned from "../../../../utils/tasks/isAssigned.js";
import Modal from "../../../../components/ui/modal/modal.tsx";
import { AuthContext } from "../../../../contexts/auth/AuthContext.js";
import DeleteTaskBtn from "../deleteTaskBtn/deleteTaskBtn.jsx";

export default function EventTask({ task, index, eventId }) {

    const { user } = useContext(AuthContext)

    const [assigned, setAssigned] = useState(false);
    const [open, setOpen] = useState(false);
    const [title, setTitle] = useState("");
    const [message, setMessage] = useState("");

    async function checkAssign() {
        const data = await isAssigned(task.id);
        setAssigned(data?.data.assigned);
    }

    useEffect(() => {
        checkAssign();
    }, [])


    const handleRegisterBtn = async () => {
        const res = await assign(task.id);

        switch (res.status) {
            case 200:
                setTitle("Inscription réussie")
                setMessage(`Vous êtes maintenant inscrit à la tâche ${task.name}`);
                setOpen(true);
                setAssigned(true);
                break;

            case 409:
                setTitle("Erreur lors de l'inscription")
                setMessage("Vous êtes déjà inscrit à cette tâche")
                setOpen(true);
                break;

            case 403:
                setTitle("Erreur lors de l'inscription")
                setMessage("Le nombre maximum d'inscription pour cette tâche à été atteint")
                setOpen(true);
                break;
        }
    };

    const handleUnassign = async () => {
        const res = await unAssign(task.id);

        switch (res.status) {
            case 200:
                setTitle("Désinscription réussie")
                setMessage(`Vous n'êtes plus inscrit à la tâche ${task.name}`);
                setOpen(true);
                setAssigned(false);
                break;

            case 409:
                setTitle("Erreur lors de la désinscription")
                setMessage(`Vous n'êtes pas inscrit à cette tâche`);
                setOpen(true);
                break;
        }
    };

    return <div style={{"--i": index}} key={index} className={styles.content}>
        <div className={styles.task}>
            <div>
                <span><strong>{task.name}</strong></span>
                <p className={styles.taskDate}> {formatDateLetter(task.start)} - {formatDateLetter(task.end)} </p>
                <p>{task.description}</p>
            </div>
            <div className={styles.manageTaskBtn}>
                {assigned ?
                    <Button variant={"danger"} onClick={() => handleUnassign()}> Se désinscrire </Button>
                    :
                    <Button onClick={() => handleRegisterBtn()}> S’inscrire </Button>
                }
                <DeleteTaskBtn eventId={eventId} taskId={task.id} taskName={task.name} />
            </div>
        </div>

        <Modal open={open} onClose={setOpen} title={title}>
            <p className={styles.modalContent}>{message}</p>
        </Modal>
    </div>
}