import React, { useRef, useState, useEffect } from "react";
import Popup from 'reactjs-popup';
import 'reactjs-popup/dist/index.css';
import ReactBootstrap from 'react-bootstrap'
import { Modal } from 'react-bootstrap';
import axios from "axios";



const DisplayClass = (props) => {

  const [result, setResult] = useState("");
  const [myApiResponse, setmyApiResponse] = useState("false");
  const [myApiMessage, setmyApimyApiMessage] = useState("");
  const [trainingRef, settrainingRef] = useState("");

  function MyDisplayClass(e) {

    var trainingind = e.target.value;
    //console.log(" #################" + trainingind);

    //alert(" la formation a traiter est : " + trainingind);
  }

  return (

    <div>
      <h2> Affichage detaillé d'une formation </h2>
      <li className="displayclass">

        <ul>
          <li>  Titre  : {props.formation.title} </li>
          <li>  Description : {props.formation.description} </li>
          <li>  domain : {props.formation.domain} </li>
          <li>  Langue : {props.formation.lang} </li>
          <li>  Certification : {props.formation.certif} </li>
          <li>  Type : {props.formation.type} </li>
          <li>  Support : {props.formation.support} </li>
          <li>  Prix : {props.formation.price} </li>

        </ul>

      </li>
    </div>
  )
}


export default DisplayClass;