import { observer } from 'mobx-react';
import React, { useContext, useEffect, useState } from 'react';
import { BsCheckCircle, BsExclamationCircle, BsFillLightningFill, BsXCircle } from 'react-icons/all';
import { toast } from 'react-toastify';
import useSWR from 'swr';
import { CALCUL_TIMEOUT_DELAY, STATUTS_CALCUL } from '../../../../constantes/constantes';
import AppConfigStore, { AppConfigContext } from '../../../../stores/AppConfigStore';

/**
 * Composant "Zone de calcul" affiché en haut à droite de l'interface, permettant de (re)lancer un calcul et d'indiquer l'état du dernier calcul lancé.
 *
 * @component
 */
const CalculSelectif = observer(() => {
    /** @type {AppConfigStore} */
    const appConfig = useContext(AppConfigContext);

    const administreId = appConfig.selectedAdministresPerimetre.map((a) => a.id);
    const annee = appConfig.PAMSelectionne;
    const anneeA1 = appConfig.donneesReference.PAMByStatut.get('PAM A+1').pam_id;
    annee != anneeA1 && appConfig.setAdministreSelectifPamA(appConfig.selectedAdministresPerimetre.map((a) => a.id_pam));
    annee == anneeA1 && appConfig.setAdministreSelectifPamA1(appConfig.selectedAdministresPerimetre.map((a) => a.id_pam));

    const posteId = appConfig.selectedPostesPerimetreEtITD.map((p) => p.id);
    
    annee != anneeA1 && appConfig.setPosteSelectifPamA(appConfig.selectedPostesPerimetreEtITD.map((p) => p.id_pam));
    annee == anneeA1 && appConfig.setPosteSelectifPamA1(appConfig.selectedPostesPerimetreEtITD.map((p) => p.id_pam));

    const svId = appConfig.idsSousViviersSelectionnees[0];
    const pamId = appConfig.PAMSelectionne;

    const getKey = () => appConfig.managers.decisions.buildCalculSelectifStatusKey(svId, administreId, posteId, pamId);
    const { data, error, mutate } = useSWR(getKey, { refreshInterval: 500 });
    // clé permettant d'identifier un calcul unique => sa date de lancement
    const [calculKey, setCalculKey] = useState(new Date());

    // Effet permettant d'afficher un toast de fin de calcul (erreur/succès)

    const hasTimeout = () => {
        if (typeof data != 'undefined') {
            if (data.statut == STATUTS_CALCUL.EN_COURS) {
                let calculStartDate = calculKey;
                if (typeof data.date_debut != 'undefined') calculStartDate = new Date(data.date_debut);

                let timeoutDate = new Date(calculStartDate.getTime() + CALCUL_TIMEOUT_DELAY);
                // let timeoutDate = new Date(calculStartDate.getTime() + 20000);
                let now = new Date();
                return now > timeoutDate;
            }
        }
        return false;
    };
    /**
     * Lancer les calculs sur le sous-ensemble selectionné par le gestionnaire
     */
    const lancerCalculSelectif = async (e) => {
        e.preventDefault();
        const administreId = appConfig.selectedAdministresPerimetre.map((a) => a.id);
        const posteId = appConfig.selectedPostesPerimetreEtITD.map((p) => p.id);
        const svId = appConfig.idsSousViviersSelectionnees[0];
        const pamId = appConfig.PAMSelectionne;

        // statut = STATUTS_CALCUL.EN_COURS
        await mutate({ statut: STATUTS_CALCUL.EN_COURS },false);
        const ok = await appConfig.actionsMetierHelper.lanceCalculSelectif(svId, administreId, posteId, pamId);
        // On met immédiatement à jour le statut pour que l'affichage soit également immédiatement mis à jour
        appConfig.setStatutCalculAideDecision(ok ? STATUTS_CALCUL.EN_COURS : STATUTS_CALCUL.ERREUR);
    };
    /**
     * Arreter les calculs sur le sous_vivier selectionner du gestionnaire
     */
    const arreterCalculSelectif = async (e) => {
        e.preventDefault();
        const administreId = appConfig.selectedAdministresPerimetre.map((a) => a.id);
        const posteId = appConfig.selectedPostesPerimetreEtITD.map((p) => p.id);
        const svId= appConfig.idsSousViviersSelectionnees[0];
        const pamId = appConfig.PAMSelectionne;

        // statut = STATUTS_CALCUL.EN_COURS
        await mutate({ statut: STATUTS_CALCUL.EN_ATTENTE_ARRET },false);
        const ok = await appConfig.actionsMetierHelper.arretCalculSelectif(svId, administreId, posteId, pamId);
        // On met immédiatement à jour le statut pour que l'affichage soit également immédiatement mis à jour
        appConfig.setStatutCalculAideDecision(ok ? STATUTS_CALCUL.EN_ATTENTE_ARRET : STATUTS_CALCUL.ERREUR);
    };

    const isCalcul = true ? appConfig.idsSousViviersSelectionnees.length==1 : false;

    if (isCalcul){
    return (
        <div className="mr-4">
            {!data ? (
                error ? (
                    'Une erreur est survenue'
                ) : (
                    <div className="spinner-border" role="status" />
                )
            ) : data && data.statut && [STATUTS_CALCUL.AUCUN, STATUTS_CALCUL.TERMINE_DE_FORCE, STATUTS_CALCUL.TERMINE,STATUTS_CALCUL.EN_ATTENTE].includes(data.statut) ? (
                data.statut == STATUTS_CALCUL.TERMINE ? (
                    <span>
                        <span style={{ color: 'green' }}>
                            <BsCheckCircle /> Calcul terminé!
                        </span>{' '}
                        <a href="#" onClick={lancerCalculSelectif}>
                            <BsFillLightningFill size={22} />
                            Relancer les calculs sur ce sous-ensemble
                        </a>
                    </span>
                 ): data.statut == STATUTS_CALCUL.EN_ATTENTE ? (
                    <span className="calculsEnCours">
                    <div className="spinner-border" role="status" />
                    <span> Calculs en attente...</span>
                    <a href="#" onClick={arreterCalculSelectif}>
                            <BsFillLightningFill size={22} />
                            Arreter les calculs
                    </a>
                </span>
                ) : data.statut == STATUTS_CALCUL.TERMINE_DE_FORCE ? (
                    <span>
                        <span style={{ color: 'green' }}>
                            {/* <BsCheckCircle /> Calcul arrêté ! */}
                        </span>{' '}
                        <a href="#" onClick={lancerCalculSelectif}>
                            <BsFillLightningFill size={22} />
                            Relancer les calculs de nouveau sur ce sous-ensemble
                        </a>
                    </span>
                ) : (
                    <a href="#" onClick={lancerCalculSelectif}>
                        <BsFillLightningFill size={22} />
                        Lancer les calculs sur ce sous-ensemble
                    </a>
                )
            ) : data.statut == STATUTS_CALCUL.ERREUR ? (
                <span>
                    <span style={{ color: 'orange' }}>
                        <BsXCircle /> Pas de matching pour cette sélection
                    </span>{' '}
                    <a href="#" onClick={lancerCalculSelectif}>
                        <BsFillLightningFill size={22} />
                        Relancer les calculs sur ce sous-ensemble
                    </a>
                </span>

            ) : data.statut == STATUTS_CALCUL.EN_ATTENTE_ARRET ? (
                <span className="calculsEnCours">
                    <div className="spinner-border" role="status" />
                    <span> Calcul en arret ...</span>
                </span>
            ) : hasTimeout() ? (
                <span>
                    <span style={{ color: 'orange' }}>
                        <BsExclamationCircle /> Le calcul tourne depuis +1h
                    </span>{' '}
                    <a href="#" onClick={lancerCalculSelectif}>
                        <BsFillLightningFill size={22} />
                        Relancer les calculs sur le sous-ensemble
                    </a>
                </span>
            ) : (
                <span className="calculsEnCours">
                    <div className="spinner-border" role="status" />
                    <span> Calculs en cours    </span>
                    <span>     </span>
                    <progress value={data.statut_pourcentage} max ={100}/>
                    <span>{data.statut_pourcentage}%</span>
                    <a href="#" onClick={arreterCalculSelectif}>
                            <BsFillLightningFill size={22} />
                            Arreter les calculs
                    </a>
                </span>
            )}
        </div>
    );};
});

export default CalculSelectif;
