import { observer } from 'mobx-react';
import React, { useContext } from 'react';
import { ADMINISTRES, POSTES } from '../../constantes/constantes';
import AppConfigStore, { AppConfigContext } from '../../stores/AppConfigStore';
import AGGridConfigurationAdministres from '../Commun/listes/configuration/AGGridConfigurationAdministres';
import AGGridConfigurationPostes from '../Commun/listes/configuration/AGGridConfigurationPostes';
import { createGridContext } from '../Commun/listes/gridContext';
import VoletsFractionnes from '../Commun/VoletsFractionnes';
import AffectationsPrevueEtSuggereesAdministre from './DecisionAdministres/AffectationsPrevueEtSuggereesAdministre';
import GestionDecisionListeAdministres from './DecisionAdministres/GestionDecisionListeAdministres';
import SyntheseDecisionAdministre from './DecisionAdministres/SyntheseDecisionAdministre';
import AffectationsPrevuesEtSuggereesPoste from './DecisionPostes/AffectationsPrevuesEtSuggereesPoste';
import GestionDecisionListePostes from './DecisionPostes/GestionDecisionListePostes';
import SyntheseDecisionPoste from './DecisionPostes/SyntheseDecisionPoste';
import './GestionDecision.scss';

/**
 * Composant de gestion de l'aide à la décision, correspondant à la vue "Aide à la décision"
 *
 * @component
 * @example
 * return (
 * <GestionDecision />
 * )
 */

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

    //TODO à instancier une fois pour toute au niveau de l'application
    const agGridConfigurationAdministres = new AGGridConfigurationAdministres(appConfig.donneesReference);
    const agGridConfigurationPostes = new AGGridConfigurationPostes(appConfig.donneesReference);

    let voletsPAM;
    switch (appConfig.vueDecision) {
        case ADMINISTRES:
            voletsPAM = appConfig.hasSelectedAdministreDecision
                ? [
                      <GestionDecisionListeAdministres
                          key="GestionDecisionListeAdministres"
                          agGridConfigurationAdministres={agGridConfigurationAdministres}
                      />,
                      <SyntheseDecisionAdministre
                          key="SyntheseDecisionAdministre"
                          agGridConfigurationAdministres={agGridConfigurationAdministres}
                          context={createGridContext(appConfig, ADMINISTRES)}
                      />,
                      <AffectationsPrevueEtSuggereesAdministre
                          key="AffectationsPrevueEtSuggereesAdministre"
                          context={createGridContext(appConfig, ADMINISTRES)}
                      />
                  ]
                : [
                      <GestionDecisionListeAdministres
                          key="GestionDecisionListeAdministres"
                          agGridConfigurationAdministres={agGridConfigurationAdministres}
                      />,
                      <div key="InfoSelectionVide" className="InfoSelectionVide">
                          <span>← Sélectionnez un administré dans la liste ci-contre</span>
                      </div>
                  ];

            break;

        case POSTES:
            voletsPAM = appConfig.hasSelectedPosteDecision
                ? [
                      <GestionDecisionListePostes key="GestionDecisionListePostes" agGridConfigurationPostes={agGridConfigurationPostes} />,
                      <SyntheseDecisionPoste
                          key="SyntheseDecisionPoste"
                          agGridConfigurationPostes={agGridConfigurationPostes}
                          context={createGridContext(appConfig, POSTES)}
                      />,
                      <AffectationsPrevuesEtSuggereesPoste key="AffectationsPrevuesEtSuggereesPoste" context={createGridContext(appConfig, POSTES)} />
                  ]
                : [
                      <GestionDecisionListePostes key="GestionDecisionListePostes" agGridConfigurationPostes={agGridConfigurationPostes} />,
                      <div key="InfoSelectionVide" className="InfoSelectionVide">
                          <span>← Sélectionnez un poste dans la liste ci-contre</span>
                      </div>
                  ];
            break;
    }

    const initialPaneSizes =
        appConfig.vueDecision === ADMINISTRES
            ? appConfig.hasSelectedAdministreDecision
                ? ['27%', '17%', '56%']
                : ['27%', '73%']
            : appConfig.hasSelectedPosteDecision
            ? ['34%', '17%', '49%']
            : ['34%', '66%'];

    return (
        <div className="GestionDecision d-flex flex-column align-items-stretch w-100">
            <VoletsFractionnes
                disposition="vertical"
                volets={voletsPAM}
                paneSizes={initialPaneSizes}
                persistenceId={appConfig.utilisateurConnecte?.id + '/GestionDecision/' + appConfig.vueDecision}
            />
        </div>
    );
});

export default GestionDecision;
