import { observer } from 'mobx-react';
import React, { useContext, useEffect, useState } from 'react';
import useSWR from 'swr';
import { POSTES } from '../../../constantes/constantes';
import { commonColTypes } from '../../Commun/listes/commonAGGridColumnTypes';
import AppConfigStore, { AppConfigContext } from '../../../stores/AppConfigStore';
import { Chargement } from '../../Commun/Chargement';
import { Erreur } from '../../Commun/Erreur';
import { createGridContext } from '../../Commun/listes/gridContext';
import ListeGestionDecision from '../Commun/ListeGestionDecision';

/**
 * Composant permettant d'afficher une liste de postes à traiter pour la vue d'aide à la décision (volet de gauche).
 *
 * @component
 * @param {object} agGridConfigurationPostes - Instance de la classe AGGridConfigurationPostes à utiliser
 * @example
 * return (
 * <GestionDecisionListePostes />
 * )
 */

const GestionDecisionListePostes = observer((props) => {
    /** @type {AppConfigStore} */
    const appConfig = useContext(AppConfigContext);

    const [postesAdaptes, setPostesAdaptes] = useState(undefined);
    const annee = appConfig.PAMSelectionne;
    const anneeA1 = appConfig.donneesReference.PAMByStatut.get('PAM A+1').pam_id;

    // Chargement des données du sous-vivier sélectionné
    const params = { pageSize: 10000000, page: 1 };
    annee && (params.pam__in = annee);

    const posteSelectif = annee == anneeA1 ? appConfig.selectPosteSelectifPamA1 
                                           : appConfig.selectPosteSelectifPamA;

    posteSelectif && (params.poste__in=posteSelectif.join(','));

    const getKey = () => appConfig.managers.decisions.buildCallKey(appConfig.idsSousViviersSelectionnees[0], appConfig.vueDecision, params);
    const { data, error } = useSWR(getKey);

    useEffect(() => {
        // Mise à jour des données
        if (typeof data !== 'undefined') {
            setPostesAdaptes(props.agGridConfigurationPostes.adaptePostes(data.results || []));
        } else {
            //TODO: error handling ici
            if (typeof error == 'undefined') {
                console.info('Chargement des données des postes...');
            } else {
                console.error(error);
            }
        }
    }, [data, error]);

    useEffect(() => {
        // Lorsque les données ont été mises à jour, il faut mettre à jour aussi la sélection éventuelle
        if (postesAdaptes !== undefined && appConfig.hasSelectedPosteDecision) {
            // On reconstruit la sélection
            const selectedId = appConfig.selectedPosteDecision.id;
            const newSelection = postesAdaptes.find((p) => selectedId == p.id);
            appConfig.setSelectedPosteDecision(newSelection);
        }
    }, [postesAdaptes]);

    /* Génération du paramétrage des groupes de colonnes et colonnes pour AG Grid */
    const postesFields = props.agGridConfigurationPostes.buildPostesColumnDefs([
        {
            groupId: 'organisme',
            columns: [
                {
                    colId: 'organisme_departement',
                    override: { width: 60 }
                },
                {
                    colId: 'organisme_FE'
                },
                {
                    colId: 'organisme_libelle',
                    override: { width: 120 }
                },
                {
                    colId: 'organisme_lieu',
                    override: { width: 120, columnGroupShow: 'open' }
                },
                {
                    colId: 'organisme_infoReo',
                    override: { width: 120, columnGroupShow: 'open' }
                }
            ]
        },
        {
            groupId: 'poste_NonEditable',
            columns: [
                {
                    colId: 'poste_id',
                },
                {
                    colId: 'poste_domaine',
                },
                {
                    colId: 'poste_filiere',
                },
                {
                    colId: 'poste_NF',
                },
                {
                    colId: 'poste_ETR',
                    override: { width: 100 }
                },
                {
                    colId: 'poste_CIAT',
                    override: { width: 120 }
                },
                {
                    colId: 'poste_specifique',
                    override: { width: 120 }
                },
                {
                    colId: 'poste_competences',
                    override: {
                        headerName: 'Compétence',
                        width: 120
                    }
                },
            ]
        },
        'avis_NonEditable',
        {
            groupId: 'decisions_NonEditable',
            columns: [
                {
                    colId: 'decisions',
                },
                {
                    colId: 'direct_commissionne',
                },
                {
                    colId: 'decisions_militairesAffectes',
                }
            ]
        }
    ]);

    return (
        <div className="d-flex flex-column h-100">
            {!data ? (
                error ? (
                    <Erreur />
                ) : (
                    <Chargement />
                )
            ) : (
                <ListeGestionDecision
                    columnDefs={postesFields}
                    data={postesAdaptes ?? []}
                    nbItems={data.count}
                    title="Postes à traiter"
                    itemLabel="poste"
                    itemsLabel="postes"
                    context={createGridContext(appConfig, POSTES)}
                />
            )}
        </div>
    );
});

export default GestionDecisionListePostes;
