import { useEffect, useState } from 'react';
import { Activite, Session } from '../../classes';
import { dateToString, hoursToString } from '../edt';
import '../style/objectList.css';
import { Modal } from '../Modal';
import Loading from '../loading';
import {delay} from "../../requetes";
import CreateActivite from '../createActivite';
import DetailSession from './detailSession';


type Props = {
    session:Session;
}

function ObjectSession({session}:Props){

    const [open, setOpen] = useState<boolean>(false);

    function handleOpen(): void {
        setOpen(!open);
    }

    const sDate = session.creneau;


    return(
        <div>
            <div className="object" onClick={() => handleOpen()}>
                    <div className="object_header">
                        {session.isRecurrent ? 
                            <div className="object_small"> Recurrent</div> : 
                            <div className="object_small"> {dateToString(session.creneau)}</div>
                        }
                        <div className="object_small">{hoursToString(sDate)}</div>
                    </div>
                    <div>{session.name}</div>
                    <div>{session.groupe}</div>
                    <div>{session.coach ? session.coach.nom : "Pas de coach sur la séance"}</div>
                    {session.ligne ? session.ligne.map(ligne => ligne.nom).join(", ") : "Pas de ligne sur la séance"}
            </div>
            <DetailSession session={session} open={open} setOpen={setOpen}/>
        </div>
    )
}

export default ObjectSession
