diff --git a/src/components/AddClassManual.js b/src/components/AddClassManual.js
index fbc1b95..a36142c 100644
--- a/src/components/AddClassManual.js
+++ b/src/components/AddClassManual.js
@@ -2495,7 +2495,7 @@ const AddClassManual = (props) => {
 
 
 
-  const [title_limite, settitle_limite] = useState(120);
+  const [title_limite, settitle_limite] = useState(200);
 
   const editorRef_description = useRef(null);
   const [editorRef_description_limite, seteditorRef_description_limite] = useState(5000);
@@ -9723,7 +9723,7 @@ const AddClassManual = (props) => {
                             }
                           }}
 
-                          renderInput={(params) => <TextField {...params} label="Inscription directe" />
+                          renderInput={(params) => <TextField {...params} label="Inscription directe ?" />
                           }
                         />}
 
diff --git a/src/components/DisplayPartnerPromotion.js b/src/components/DisplayPartnerPromotion.js
index 246f36d..6beefe0 100644
--- a/src/components/DisplayPartnerPromotion.js
+++ b/src/components/DisplayPartnerPromotion.js
@@ -9644,7 +9644,7 @@ const DisplayPartnerPromotion = (props) => {
 
         {
             value: '2',
-            label: 'Clôturer',
+            label: 'Clôturé',
         },
 
         {
@@ -30645,4 +30645,35 @@ width: 100%;
 margin-bottom: 10px;
   border: none;
 }
+
+.sequence-status {
+  position: absolute;
+  right: 2px;
+  bottom: 5px;
+  width: 16px;
+  height: 16px;
+  border: 3px solid white;
+  border-radius: 50%;
+}
+
+.status-inscrit,
+.sequence-status.status-inscrit {
+  background: var(--success);
+}
+
+.status-preinscrit,
+.sequence-status.status-preinscrit {
+  background: var(--warning);
+}
+
+.status-suspendu,
+.sequence-status.status-suspendu {
+  background: var(--danger);
+}
+
+.status-inactif,
+.sequence-status.status-inactif {
+  background: var(--inactive);
+}
+
 `;
diff --git a/src/components/DisplayPartnerSession.js b/src/components/DisplayPartnerSession.js
index 524946b..cc5a71d 100644
--- a/src/components/DisplayPartnerSession.js
+++ b/src/components/DisplayPartnerSession.js
@@ -10001,14 +10001,20 @@ const DisplayPartnerSession = (props) => {
             label: 'Actif',
         },
 
+        {
+            value: '0',
+            label: 'Inactif',
+        },
+
+        {
+            value: '2',
+            label: 'Clôturé',
+        },
+
         {
             value: '-1',
             label: 'Annulé',
         },
-        {
-            value: '',
-            label: '',
-        },
     ];
 
 
diff --git a/src/components/DisplayPartnerStagiaires.js b/src/components/DisplayPartnerStagiaires.js
index 005517a..83dcd67 100644
--- a/src/components/DisplayPartnerStagiaires.js
+++ b/src/components/DisplayPartnerStagiaires.js
@@ -7623,10 +7623,13 @@ const DisplayPartnerStagiaires = (props) => {
             //console.log(rowss[myid]['external_code']);
         }
         setselectedtraining(tab_tmp);
+
         return tab_tmp;
 
     }
 
+
+
     function GetSelectedRowsSession_filtered_on_alert() {
         //alert(" les lignes slected sont :  " + selectionModel + " nb item = " + selectionModel.length);
         //const selectedRowsData = selectionModel.map((id) => rowss.find((row) => row.id === id));
@@ -9171,6 +9174,15 @@ const DisplayPartnerStagiaires = (props) => {
             return;
         }
 
+
+        var tab_tmp_session_id = []
+        for (var i = 0; i < selectionModel.length; i++) {
+            var myid = parseInt(String(selectionModel[i]));
+            var line = JSON.parse(rowss[myid]);
+            tab_tmp_session_id.push(line.session_id);
+        }
+
+
         var form = new FormData();
 
         const stored_cookie = getCookie('tokenmysypart');
@@ -9208,21 +9220,21 @@ const DisplayPartnerStagiaires = (props) => {
 
 
         // Important, on ne peut pousser des documents que pour une et unique session, pas de melance de session_id
-        // console.log(" ### selected_list_session_id = ", selected_list_session_id);
+        console.log(" ### selected_list_session_id = ", selected_list_session_id);
         var local_session_id = "";
         var nb_different_session = 0;
-        const tab_session_id = selected_list_session_id.split(',');
-        for (let i = 0; i < tab_session_id.length; i++) {
-            if (local_session_id != tab_session_id[i])
+        const tab_session_id = [];
+        for (let i = 0; i < tab_tmp_session_id.length; i++) {
+            if (local_session_id != tab_tmp_session_id[i])
                 nb_different_session = nb_different_session + 1
 
-            local_session_id = tab_session_id[i]
+            local_session_id = tab_tmp_session_id[i]
         }
 
 
 
-
-        // console.log(" ### nb_different_session = ", nb_different_session);
+        console.log(" ### local_session_id = ", local_session_id);
+        console.log(" ### nb_different_session = ", nb_different_session);
 
         if (nb_different_session > 1) {
             setdisplay_alert_mysy("1");
@@ -9243,9 +9255,25 @@ const DisplayPartnerStagiaires = (props) => {
 
 
         var myurl = process.env.REACT_APP_API_URL + "myclass/api/Push_Document_To_ENT_For_Inscrit/";
-        form.append("list_inscription_id", selected_list_inscription_id);
 
-        //console.log(" ##  form =", form)
+        var tab_tmp = []
+        for (var i = 0; i < selectionModel.length; i++) {
+            var myid = parseInt(String(selectionModel[i]));
+            var line = JSON.parse(rowss[myid]);
+            tab_tmp.push(line._id);
+        }
+
+        if (tab_tmp.length <= 0) {
+            setdisplay_alert_mysy("1");
+            setalert_message(" Impossible de selectionner les inscrits concernés ");
+            setalert_type("error");
+            return;
+        }
+
+
+        form.append("list_inscription_id", tab_tmp);
+
+        // console.log(" ##  form =", form)
 
         //   return;
 
diff --git a/src/components/Display_Partner_Catalog_DetailClass_new_vp.js b/src/components/Display_Partner_Catalog_DetailClass_new_vp.js
index 96f8c78..b74b3c1 100644
--- a/src/components/Display_Partner_Catalog_DetailClass_new_vp.js
+++ b/src/components/Display_Partner_Catalog_DetailClass_new_vp.js
@@ -2341,13 +2341,16 @@ const Display_Partner_Catalog_DetailClass_new_v2 = (props) => {
                 <div className="block_sous_header_rate_title">
 
                   <div className="rating">
-                    {ratingvalue && String(ratingvalue).length > 0 &&
-                      parseInt(String(ratingvalue)) <= 5 &&
+                    {String(ratingvalue).length > 0 &&
+                      parseInt(String(ratingvalue)) <= 5 && parseInt(String(ratingvalue)) > 0 &&
                       <Rating name="half-rating-reade"
                         readOnly={true}
                         precision={0.5}
                         value={ratingvalue}
                       />}
+
+                      {String(ratingvalue).length > 0 &&  parseInt(String(ratingvalue)) <= 0 &&
+                      <nav> &nbsp; </nav>}
                   </div>
 
                   <div className="sous_header_title">
diff --git a/src/components/Inscription_Information.js b/src/components/Inscription_Information.js
index 93c415e..809336c 100644
--- a/src/components/Inscription_Information.js
+++ b/src/components/Inscription_Information.js
@@ -1352,7 +1352,7 @@ function Inscription_Information(props) {
                                 <TextField
                                     name="employeur"
                                     id="employeur"
-                                    label="Employeur"
+                                    label="Qui vous a orienté ?"
                                     className="texte_area"
                                     sx={{ m: 1, width: '100%' }}
                                     InputProps={{
diff --git a/src/components/Jmj_Theme/Jmjformation_Catalogue_Public.js b/src/components/Jmj_Theme/Jmjformation_Catalogue_Public.js
index c0dfe78..fccbc7f 100644
--- a/src/components/Jmj_Theme/Jmjformation_Catalogue_Public.js
+++ b/src/components/Jmj_Theme/Jmjformation_Catalogue_Public.js
@@ -32,12 +32,12 @@ import img_header_jmg from "../../mysy_img2/img_jmj_modif.jpg"
 import jmj_banniere_for_mobile from "../../mysy_img/jmj_bannier_mobile.png";
 
 import { TbArrowsDownUp } from "react-icons/tb";
-
+import img_loading_spin from "./../../mysy_img/mysy_spin_loading.gif";
 
 
 let PageSize = 10;
 const Jmjformation_Catalogue_Public = (props) => {
-
+    const [isLoading, setLoading] = useState();
 
     const { type, categorie } = useParams();
     const { NewSearchText } = useParams();
@@ -1252,6 +1252,7 @@ const Jmjformation_Catalogue_Public = (props) => {
 
         }
 
+        setLoading(true);
         // alert("myurl = " + myurl);
         axios.post(myurl, form).then(res => {
             if (String(res.data.status) != String("false")) {
@@ -1278,12 +1279,15 @@ const Jmjformation_Catalogue_Public = (props) => {
                     myelement.scrollIntoView({ behavior: 'smooth' });
                 }
 
+                setLoading(false);
+
             }
 
             else {
                 //console.log(" In test  res.data.status = " + res.data.status);
                 //console.log(" In test  res.data.message = " + res.data.message);
                 setmyApiResponse("False");
+                setLoading(false);
                 //setmyApimyApiMessage("")
                 //textInput.current.focus();
             }
@@ -1293,6 +1297,7 @@ const Jmjformation_Catalogue_Public = (props) => {
             // console.warn('Not good man :( mysearchtext = ');
             setmyApiResponse("False");
             //setmyApimyApiMessage("")
+            setLoading(false);
         })
 
         // window.scrollTo(0, 600);
@@ -1403,7 +1408,7 @@ const Jmjformation_Catalogue_Public = (props) => {
             // alert(" rrtt ");
         }
 
-
+ setLoading(true);
         //alert("myurl = " + myurl);
         axios.post(myurl, form).then(res => {
             if (String(res.data.status) != String("false")) {
@@ -1414,18 +1419,21 @@ const Jmjformation_Catalogue_Public = (props) => {
                 setResult(res.data.message)
                 // textInput.current.focus();
                 setbesoinaiderecherche("");
+                 setLoading(false);
 
             }
             else {
                 //console.log(" In test  res.data.status = " + res.data.status);
                 //console.log(" In test  res.data.message = " + res.data.message);
                 setmyApiResponse("False");
+                 setLoading(false);
                 //setmyApimyApiMessage("")
                 //textInput.current.focus();
             }
 
 
         }).catch((error) => {
+             setLoading(false);
             // console.warn('Not good man :( mysearchtext = ');
             setmyApiResponse("False");
             //setmyApimyApiMessage("")
@@ -2809,6 +2817,10 @@ const Jmjformation_Catalogue_Public = (props) => {
     return (
 
         <div className="mon_catalogue_public jmj_formation" >
+            {isLoading && <div className="loader-container">
+                <div className="mysy_spinner">  <img src={img_loading_spin} />  </div>
+            </div>}
+
 
 
             <Helmet>
@@ -3227,13 +3239,13 @@ const Jmjformation_Catalogue_Public = (props) => {
                                                 <div style={{ "width": "100%", "float": "left" }}>
 
                                                     <div style={{ "width": "65%", "float": "left", "paddingTop": '10px' }}>
-                                                        <Pagination
+                                                        {/*<Pagination
                                                             className="pagination-bar"
                                                             currentPage={currentPage2}
                                                             totalCount={result.length}
                                                             pageSize={PageSize}
                                                             onPageChange={page => setCurrentPage2(page)}
-                                                        />
+                                                        />*/}
                                                     </div>
 
 
@@ -3964,13 +3976,13 @@ const Jmjformation_Catalogue_Public = (props) => {
                                     <div className="okUpdateData">
                                         <div style={{ "width": "100%" }}>
                                             <div style={{ "width": "50%", "float": "left" }}>
-                                                <Pagination
+                                                {/*<Pagination
                                                     className="pagination-bar"
                                                     currentPage={currentPage2}
                                                     totalCount={result.length}
                                                     pageSize={PageSize}
                                                     onPageChange={page => setCurrentPage2(page)}
-                                                />
+                                                />*/}
                                             </div>
                                             <div style={{ "width": "40%", "float": "right" }}>
                                                 <div className="input-group input-group-sm mb-3 ">
@@ -4255,7 +4267,7 @@ const Jmjformation_Catalogue_Public = (props) => {
                     </div>
                     <div style={{ width: '100%', background: '#f3f4fb', paddingTop: "2rem" }}>
                         <div className="jmj_block_milieu">
-                            <div className="jmj_block_milieu_gauche"> 
+                            <div className="jmj_block_milieu_gauche">
                                 {showelement === "true" && <div className="rech_leftbox"  >
                                     <div className="sous_filter">
 
@@ -4288,7 +4300,7 @@ const Jmjformation_Catalogue_Public = (props) => {
                                                     </div>}
 
                                                 </div>
-                                            </div> 
+                                            </div>
 
 
                                             <div className="filter_valeur" onChange={TrainingCertifHandle}>
@@ -4421,13 +4433,13 @@ const Jmjformation_Catalogue_Public = (props) => {
                                                 <div className="okUpdateData">
                                                     <div style={{ "width": "100%" }}>
                                                         <div style={{ "width": "40%", "float": "left" }}>
-                                                            <Pagination
+                                                            {/* <Pagination
                                                                 className="pagination-bar"
                                                                 currentPage={currentPage2}
                                                                 totalCount={result.length}
                                                                 pageSize={PageSize}
                                                                 onPageChange={page => setCurrentPage2(page)}
-                                                            />
+                                                            />*/}
                                                         </div>
                                                         <div style={{ "width": "60%", "float": "right" }}>
                                                             <div className="input-group input-group-sm mb-3 ">
diff --git a/src/components/Jmj_Theme/jmj_formation.css b/src/components/Jmj_Theme/jmj_formation.css
index 7759034..26091b7 100644
--- a/src/components/Jmj_Theme/jmj_formation.css
+++ b/src/components/Jmj_Theme/jmj_formation.css
@@ -10,6 +10,24 @@
         background: transparent !important;
     }
 
+    .loader-container {
+        width: 100%;
+        height: 100vh;
+        display: flex;
+        align-items: center;
+        left: -5%;
+        position: fixed;
+        z-index: 1;
+        top: 0px;
+        background: white;
+        background-color: transparent;
+    }
+
+    .mysy_spinner {
+        border-radius: 5px;
+        opacity: 100%;
+    }
+
 
     .h1_transparent {
         color: transparent;
diff --git a/src/components/Module_Agenda.js b/src/components/Module_Agenda.js
index b11c373..78243a5 100644
--- a/src/components/Module_Agenda.js
+++ b/src/components/Module_Agenda.js
@@ -1409,19 +1409,19 @@ const Module_Agenda = (props) => {
                                     }}
 
                                     renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
-                                                        sx={{
-                                                            "& .MuiOutlinedInput-root": {
-                                                                "& fieldset": {
-                                                                    border: "solid #e8eef6 1px;",
-                                                                },
-                                                                "&:hover fieldset": {
-                                                                    border: "solid #e8eef6 1px;",
-                                                                },
-                                                                "&.Mui-focused fieldset": {
-                                                                    border: "solid #e8eef6 1px;",
-                                                                },
-                                                            },
-                                                        }}
+                                        sx={{
+                                            "& .MuiOutlinedInput-root": {
+                                                "& fieldset": {
+                                                    border: "solid #e8eef6 1px;",
+                                                },
+                                                "&:hover fieldset": {
+                                                    border: "solid #e8eef6 1px;",
+                                                },
+                                                "&.Mui-focused fieldset": {
+                                                    border: "solid #e8eef6 1px;",
+                                                },
+                                            },
+                                        }}
                                         inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
 
                                     />
@@ -1573,7 +1573,7 @@ const Module_Agenda = (props) => {
                     {/*** Si l'agenda d'une autre personne, je dois etre autorisé à ecrire */}
                     {String(agenda_owner_name) !== "Mon Planning" && String(p_filtre1) === "ressource_humaine" && String(props.check_user_acces_right("agenda_employes", "write")) === "1" &&
                         <div className="div_row_gauche">
-                            {p_detail_event_id && String(p_detail_event_id) !== "" && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ width: '40%', float: 'left', marginLeft:'-1rem' }}>M.A.J</Button>}
+                            {p_detail_event_id && String(p_detail_event_id) !== "" && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ width: '40%', float: 'left', marginLeft: '-1rem' }}>M.A.J</Button>}
                             {(!p_detail_event_id || String(p_detail_event_id) === "") && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ float: 'left' }}>Ajouter</Button>}
 
                         </div>}
@@ -1582,7 +1582,7 @@ const Module_Agenda = (props) => {
                     {/*** Si l'agenda d'un materiel, je dois etre autorisé à ecrire */}
                     {String(agenda_owner_name) !== "Mon Planning" && String(p_filtre1) === "ressource_materielle" && String(props.check_user_acces_right("agenda_materiel_salle", "write")) === "1" &&
                         <div className="div_row_gauche">
-                            {p_detail_event_id && String(p_detail_event_id) !== "" && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ width: '40%', float: 'left', marginLeft:'-1rem' }}>M.A.J</Button>}
+                            {p_detail_event_id && String(p_detail_event_id) !== "" && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ width: '40%', float: 'left', marginLeft: '-1rem' }}>M.A.J</Button>}
                             {(!p_detail_event_id || String(p_detail_event_id) === "") && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ float: 'left' }}>Ajouter</Button>}
 
                         </div>}
@@ -1590,7 +1590,7 @@ const Module_Agenda = (props) => {
                     {/*** Si c'est mon agenda, j'ai tous les droit */}
                     {String(agenda_owner_name) === "Mon Planning" &&
                         <div className="div_row_gauche">
-                            {p_detail_event_id && String(p_detail_event_id) !== "" && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ width: '40%', float: 'left', marginLeft:'-1rem' }}>M.A.J</Button>}
+                            {p_detail_event_id && String(p_detail_event_id) !== "" && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ width: '40%', float: 'left', marginLeft: '-1rem' }}>M.A.J</Button>}
                             {(!p_detail_event_id || String(p_detail_event_id) === "") && <Button onClick={Update_One_Agenda_Event} className="bton_enreg_dialog" style={{ float: 'left' }}>Ajouter</Button>}
 
                         </div>}
@@ -1719,19 +1719,19 @@ const Module_Agenda = (props) => {
                         }}
 
                         renderInput={(params) => <TextField {...params} label="" placeholder="Choisir une option"
-                                                        sx={{
-                                                            "& .MuiOutlinedInput-root": {
-                                                                "& fieldset": {
-                                                                    border: "solid #e8eef6 1px;",
-                                                                },
-                                                                "&:hover fieldset": {
-                                                                    border: "solid #e8eef6 1px;",
-                                                                },
-                                                                "&.Mui-focused fieldset": {
-                                                                    border: "solid #e8eef6 1px;",
-                                                                },
-                                                            },
-                                                        }}
+                            sx={{
+                                "& .MuiOutlinedInput-root": {
+                                    "& fieldset": {
+                                        border: "solid #e8eef6 1px;",
+                                    },
+                                    "&:hover fieldset": {
+                                        border: "solid #e8eef6 1px;",
+                                    },
+                                    "&.Mui-focused fieldset": {
+                                        border: "solid #e8eef6 1px;",
+                                    },
+                                },
+                            }}
                             inputProps={{ ...params.inputProps, style: { fontSize: 12, height: "1.4rem" } }}
 
                         />
@@ -1833,8 +1833,8 @@ const Module_Agenda = (props) => {
                 {agenda_owner_name && String(agenda_owner_name) !== "Mon Planning" && tab_selected_users.length === 1 && <h5> Vous êtes sur le planning de  <i> {agenda_owner_name}  - ({agenda_owner_type}) </i> </h5>}
             </div>}
 
-            <div className="session_data" id='mysy_calendar' name="mysy_calendar" style={{height:'850', background:'#FFF'}}>
-                {tab_selected_users.length <= 1 && <div style={{ "width": "98%", "marginLeft": "5px", minHeight:'1100px' }}>
+            <div className="session_data" id='mysy_calendar' name="mysy_calendar" style={{ height: '850', background: '#FFF' }}>
+                {tab_selected_users.length <= 1 && <div style={{ "width": "98%", "marginLeft": "5px", minHeight: '1100px' }}>
                     &nbsp;
 
                     <FullCalendar
@@ -1867,7 +1867,7 @@ const Module_Agenda = (props) => {
                     />
                 </div>}
 
-                {tab_selected_users.length > 1 && <div style={{ "width": "98%", "marginLeft": "5px", minHeight:'1100px' }}>
+                {tab_selected_users.length > 1 && <div style={{ "width": "98%", "marginLeft": "5px", minHeight: '1100px' }}>
                     <Box
                         sx={{
                             height: 800,
diff --git a/src/components/Module_Atelier_Catalogue.js b/src/components/Module_Atelier_Catalogue.js
index 4afd025..86ebf1b 100644
--- a/src/components/Module_Atelier_Catalogue.js
+++ b/src/components/Module_Atelier_Catalogue.js
@@ -1138,7 +1138,7 @@ export default function Module_Atelier_Catalogue(props) {
 
 
           <div className="div_row">
-            <div className="div_row_gauche">
+            <div className="div_row_gauche"> selected_class_inscription_direct = {selected_class_inscription_direct} --
               {String(selected_class_inscription_direct) === "1" && <Button onClick={RecordData} className="bton_enreg_dialog"> S'inscrire</Button>}
               {String(selected_class_inscription_direct) !== "1" && <Button onClick={RecordData} className="bton_enreg_dialog"> Se préinscrire</Button>}
             </div>
diff --git a/src/components/Module_Session_Planification.js b/src/components/Module_Session_Planification.js
index e5eee25..3eac1d5 100644
--- a/src/components/Module_Session_Planification.js
+++ b/src/components/Module_Session_Planification.js
@@ -683,7 +683,7 @@ const Module_Session_Planification = (props) => {
     }
 
 
-    const renderEventContent = (eventInfo) => {
+    const renderEventContent_Orig = (eventInfo) => {
         // console.log(" TOTOTOTOTO ", eventInfo.event.extendedProps);
         var local_grp = []
         if (eventInfo.event.extendedProps.tab_grp_apprenant_ids) {
@@ -713,6 +713,175 @@ const Module_Session_Planification = (props) => {
         )
     };
 
+    const renderEventContent = (eventInfo) => {
+
+       // console.log(" TOTOTOTOTO ", eventInfo.event.extendedProps);
+
+        const event = eventInfo?.event;
+        const extendedProps = event?.extendedProps || {};
+
+        const {
+            local_mode_animation,
+            tab_grp_apprenant_ids = [],
+            local_tab_ressource_materiel,
+            local_tab_ressource_humaine,
+            local_ue_titre,
+            local_confirmed,
+     
+        } = extendedProps;
+
+        /*
+         * Récupération des codes des groupes
+         * Exemple : ["GROUPE A", "GROUPE B"]
+         */
+        const groupes = Array.isArray(tab_grp_apprenant_ids)
+            ? tab_grp_apprenant_ids
+                .map((groupe) => groupe?.code)
+                .filter(Boolean)
+            : [];
+
+        /*
+         * Détermination du mode d’animation
+         * 1 = distanciel
+         */
+        const isDistanciel = String(local_mode_animation) === "1";
+
+        /*
+         * Détermination du statut de confirmation.
+         *
+         * Cette condition accepte :
+         * "1", 1, true et "true"
+         */
+        const isConfirmee =
+            local_confirmed === true ||
+            local_confirmed === 1 ||
+            String(local_confirmed).toLowerCase() === "true" ||
+            String(local_confirmed) === "1";
+
+        /*
+         * Nettoyage des ressources
+         */
+        const ressourceMaterielle = String(
+            local_tab_ressource_materiel || ""
+        )
+            .trim()
+            .substring(0, 50)
+            .toUpperCase();
+
+        const ressourceHumaine = String(
+            local_tab_ressource_humaine || ""
+        )
+            .trim()
+            .substring(0, 50)
+            .toUpperCase();
+
+        /*
+         * On évite d’afficher des séparateurs inutiles
+         * lorsque l’une des ressources est vide.
+         */
+        const ressources = [
+            ressourceMaterielle,
+            ressourceHumaine,
+        ]
+            .filter(Boolean)
+            .join(" | ");
+
+        const titre = String(event?.title || "")
+            .trim()
+            .substring(0, 50);
+
+        const ueTitre = String(local_ue_titre || "")
+            .trim()
+            .substring(0, 40);
+
+        const heure = eventInfo?.timeText || "";
+
+        return (
+            <div
+                className={"mysy-calendar-event"}
+            >
+                {/* En-tête de l’événement */}
+                <div className="mysy-calendar-event__header">
+
+                    {/* Pastille de confirmation */}
+                    <span
+                        className={`mysy-calendar-event__status-dot ${isConfirmee
+                                ? "mysy-calendar-event__status-dot--confirmed"
+                                : "mysy-calendar-event__status-dot--pending"
+                            }`}
+                        title={
+                            isConfirmee
+                                ? "Séquence confirmée"
+                                : "Séquence non confirmée"
+                        }
+                        aria-label={
+                            isConfirmee
+                                ? "Séquence confirmée"
+                                : "Séquence non confirmée"
+                        }
+                    />
+
+                    {/* Heure */}
+                    {heure && (
+                        <span className="mysy-calendar-event__time">
+                            {heure}
+                        </span>
+                    )}
+
+                    {/* Badge distanciel */}
+                    {isDistanciel && (
+                        <span
+                            className="mysy-calendar-event__mode"
+                            title="Séquence en distanciel"
+                        >
+                            Dist.
+                        </span>
+                    )}
+                </div>
+
+                {/* Ressources matérielles et humaines */}
+                {ressources && (
+                    <div
+                        className="mysy-calendar-event__resources"
+                        title={ressources}
+                    >
+                        {ressources}
+                    </div>
+                )}
+
+                {/* Titre de la séquence */}
+                {titre && (
+                    <div
+                        className="mysy-calendar-event__title"
+                        title={event?.title || ""}
+                    >
+                        {titre}
+                    </div>
+                )}
+
+                {/* UE optionnelle */}
+                {ueTitre && (
+                    <div
+                        className="mysy-calendar-event__ue"
+                        title={String(local_ue_titre || "")}
+                    >
+                        {ueTitre}
+                    </div>
+                )}
+
+                {/* Groupes */}
+                {groupes.length > 0 && (
+                    <div
+                        className="mysy-calendar-event__groups"
+                        title={groupes.join(", ")}
+                    >
+                        {groupes.join(", ")}
+                    </div>
+                )}
+            </div>
+        );
+    };
+
     const [actionmass_sequence_val, setactionmass_sequence_val] = useState();
     const actionmass_sequence = (event) => {
         const value = event.target.value;
@@ -7705,7 +7874,7 @@ const Module_Session_Planification = (props) => {
 
                         {display_view && String(display_view) === "list" && <div style={{ "border": "None", minHeight: '800px', background: '#FFF' }}>
 
-                            <div style={{ height: 8550, width: '100%', paddingRight: '1px', background: '#FFF', marginBottom: '1rem' }}>
+                            <div style={{ height: 850, width: '100%', paddingRight: '1px', background: '#FFF', marginBottom: '1rem' }}>
                                 &nbsp;
                                 <Box
 
@@ -7783,7 +7952,7 @@ const Module_Session_Planification = (props) => {
                                         ))}
 
                                         columns={columns_sequence}
-                                        pageSize={10}
+                                        pageSize={15}
                                         className="datagridclass"
 
                                         onRowDoubleClick={(newSelectionModel) => {
@@ -7816,7 +7985,7 @@ const Module_Session_Planification = (props) => {
 
 
 
-                                        rowsPerPageOptions={[10]}
+                                        rowsPerPageOptions={[15]}
                                         //disableSelectionOnClick
                                         components={{
                                             Toolbar: GridToolbar,
@@ -8619,5 +8788,159 @@ width: 100%;
   font-size: 13px;
   color: #64748b;
 }
-  
+.mysy-calendar-event {
+    width: 100%;
+    min-width: 0;
+    height: 100%;
+    padding: 4px 6px;
+
+    overflow: hidden;
+
+    font-family: "DM Sans", sans-serif;
+    font-size: 11px;
+    line-height: 1.35;
+
+    border-left: 4px solid transparent;
+    border-radius: 6px;
+}
+
+/* Séquence confirmée */
+
+.mysy-calendar-event--confirmed {
+    border-left-color: #23a455;
+}
+
+/* Séquence non confirmée */
+
+.mysy-calendar-event--pending {
+    border-left-color: #f59e0b;
+}
+
+/* En-tête */
+
+.mysy-calendar-event__header {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+
+    min-width: 0;
+    padding-bottom: 3px;
+    margin-bottom: 3px;
+
+    border-bottom: 1px solid rgba(255, 255, 255, 0.35);
+}
+
+/* Pastille de statut */
+
+.mysy-calendar-event__status-dot {
+    display: inline-block;
+    width: 9px;
+    height: 9px;
+
+    flex: 0 0 9px;
+
+    border: 2px solid rgba(255, 255, 255, 0.9);
+    border-radius: 50%;
+
+    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
+}
+
+.mysy-calendar-event__status-dot--confirmed {
+    background-color: #23a455;
+}
+
+.mysy-calendar-event__status-dot--pending {
+    background-color: #f59e0b;
+}
+
+/* Heure */
+
+.mysy-calendar-event__time {
+    flex-shrink: 0;
+
+    overflow: hidden;
+
+    font-size: 11px;
+    font-weight: 700;
+
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+/* Mode distanciel */
+
+.mysy-calendar-event__mode {
+    flex-shrink: 0;
+
+    padding: 1px 5px;
+
+    color: #104277;
+    background-color: rgba(255, 255, 255, 0.95);
+
+    border-radius: 20px;
+
+    font-size: 9px;
+    font-weight: 700;
+    line-height: 1.4;
+}
+
+/* Ressources */
+
+.mysy-calendar-event__resources {
+    margin-bottom: 3px;
+
+    overflow: hidden;
+
+    font-size: 9px;
+    font-weight: 600;
+
+    opacity: 0.9;
+
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+/* Titre */
+
+.mysy-calendar-event__title {
+    display: -webkit-box;
+
+    overflow: hidden;
+
+    font-size: 11px;
+    font-weight: 700;
+
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+}
+
+/* UE */
+
+.mysy-calendar-event__ue {
+    margin-top: 2px;
+
+    overflow: hidden;
+
+    font-size: 10px;
+    font-style: italic;
+
+    opacity: 0.9;
+
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+/* Groupes */
+
+.mysy-calendar-event__groups {
+    margin-top: 3px;
+
+    overflow: hidden;
+
+    font-size: 10px;
+    font-weight: 700;
+
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
 `;
diff --git a/src/components/Mon_Catalogue_Public.js b/src/components/Mon_Catalogue_Public.js
index 421b244..c7912d7 100644
--- a/src/components/Mon_Catalogue_Public.js
+++ b/src/components/Mon_Catalogue_Public.js
@@ -3,7 +3,7 @@ import { useForm } from "react-hook-form";
 import axios from "axios";
 import Formation_Partner_Catalog from "./Formation_Partner_Catalog";
 import { FaSearch, FaRegArrowAltCircleDown, FaRegArrowAltCircleUp } from 'react-icons/fa';
-
+import img_loading_spin from "./../mysy_img/mysy_spin_loading.gif";
 import { IoAppsSharp, IoListSharp } from "react-icons/io5";
 import Formation_Grid_2Col from "./Formation_Grid_2Col";
 import Pagination from "./TestPagination";
@@ -954,7 +954,7 @@ const Mon_Catalogue_Public = (props) => {
                 }
             }
 
-         
+
 
             DisplayXfirstClas(result.data);
             DisplayXfirstClas_for_atelier();
@@ -1336,6 +1336,8 @@ const Mon_Catalogue_Public = (props) => {
 
         }
 
+         setLoading(true);
+
         // alert("myurl = " + myurl);
         axios.post(myurl, form).then(res => {
             if (String(res.data.status) != String("false")) {
@@ -1361,6 +1363,7 @@ const Mon_Catalogue_Public = (props) => {
                 if (myelement) {
                     myelement.scrollIntoView({ behavior: 'smooth' });
                 }
+                 setLoading(false);
 
             }
 
@@ -1368,6 +1371,7 @@ const Mon_Catalogue_Public = (props) => {
                 //console.log(" In test  res.data.status = " + res.data.status);
                 //console.log(" In test  res.data.message = " + res.data.message);
                 setmyApiResponse("False");
+                 setLoading(false);
                 //setmyApimyApiMessage("")
                 //textInput.current.focus();
             }
@@ -1376,6 +1380,7 @@ const Mon_Catalogue_Public = (props) => {
         }).catch((error) => {
             // console.warn('Not good man :( mysearchtext = ');
             setmyApiResponse("False");
+             setLoading(false);
             //setmyApimyApiMessage("")
         })
 
@@ -1650,22 +1655,25 @@ const Mon_Catalogue_Public = (props) => {
         }
 
 
+         setLoading(true);
         //alert("myurl  zzz = " + myurl);
         axios.post(myurl, form).then(res => {
             if (String(res.data.status) != String("false")) {
                 //console.log(" In test  res.data.status = " + res.data.status);
-            //    console.log(" In DisplayXfirstClas  res.data.message = " + res.data.message);
+                //    console.log(" In DisplayXfirstClas  res.data.message = " + res.data.message);
 
                 setmyApiResponse("True");
                 setResult(res.data.message)
                 // textInput.current.focus();
                 setbesoinaiderecherche("");
+                 setLoading(false);
 
             }
             else {
                 //console.log(" In test  res.data.status = " + res.data.status);
                 //console.log(" In test  res.data.message = " + res.data.message);
                 setmyApiResponse("False");
+                 setLoading(false);
                 //setmyApimyApiMessage("")
                 //textInput.current.focus();
             }
@@ -1674,6 +1682,7 @@ const Mon_Catalogue_Public = (props) => {
         }).catch((error) => {
             // console.warn('Not good man :( mysearchtext = ');
             setmyApiResponse("False");
+             setLoading(false);
             //setmyApimyApiMessage("")
         })
 
@@ -3139,13 +3148,16 @@ const Mon_Catalogue_Public = (props) => {
 
 
     const [display_formation_session, setdisplay_formation_session] = useState("formation");
-
+ const [isLoading, setLoading] = useState();
     const [activeTab, setActiveTab] = useState("formations");
     return (
 
 
         <div className="mon_catalogue_public" >
 
+            {isLoading && <div className="loader-container">
+                <div className="mysy_spinner">  <img src={img_loading_spin} />  </div>
+            </div>}
 
             <Helmet>
                 <title>Formation & Tutoriel Gratuit ou payant Excellente qualité</title>
@@ -3563,13 +3575,13 @@ const Mon_Catalogue_Public = (props) => {
                                                 <div style={{ "width": "100%", "float": "left" }}>
 
                                                     <div style={{ "width": "65%", "float": "left", "paddingTop": '10px' }}>
-                                                        <Pagination
+                                                       {/* <Pagination
                                                             className="pagination-bar"
                                                             currentPage={currentPage2}
                                                             totalCount={result.length}
                                                             pageSize={PageSize}
                                                             onPageChange={page => setCurrentPage2(page)}
-                                                        />
+                                                        />*/}
                                                     </div>
 
 
@@ -4700,13 +4712,13 @@ const Mon_Catalogue_Public = (props) => {
                                     <div className="okUpdateData">
                                         <div style={{ "width": "100%" }}>
                                             <div className="pave_trier_par_gauche">
-                                                <Pagination
+                                                {/*  <Pagination
                                                     className="pagination-bar"
                                                     currentPage={currentPage2}
                                                     totalCount={result.length}
                                                     pageSize={PageSize}
                                                     onPageChange={page => setCurrentPage2(page)}
-                                                />
+                                                />*/}
                                             </div>
                                             <div className="pave_trier_par_droite">
                                                 <div>
@@ -4740,7 +4752,7 @@ const Mon_Catalogue_Public = (props) => {
 
                                     </div>}
 
-                                {result && myApiResponse === "True" && newresult &&
+                                {/*result && myApiResponse === "True" && newresult &&
                                     <div className="okUpdateData">
                                         <Pagination
                                             className="pagination-bar2" style="padding: 0;"
@@ -4751,7 +4763,7 @@ const Mon_Catalogue_Public = (props) => {
                                         />
 
 
-                                    </div>}
+                                    </div>*/}
 
 
                                 {newresult && (newresult.length <= PageSize) && <div className="okUpdateData">
@@ -4764,7 +4776,6 @@ const Mon_Catalogue_Public = (props) => {
                                 {result && myApiResponse == "True" && fin == 0 && !newresult &&
                                     result.slice(0, PageSize).map((formation) => (
                                         <div className="rech_list_formation2" ref={inputEl} id="inputEl_element">
-
                                             <Formation_Partner_Catalog formation={JSON.parse(formation)} key={JSON.parse(formation).title} coeur={JSON.parse(formation).title} />
                                         </div>
 
@@ -4773,7 +4784,6 @@ const Mon_Catalogue_Public = (props) => {
                                 {result && myApiResponse == "True" && fin == 0 && newresult &&
                                     newresult.slice(0, PageSize).map((formation) => (
                                         <div className="rech_list_formation2">
-
                                             <Formation_Partner_Catalog formation={JSON.parse(formation)} key={JSON.parse(formation).title} />
                                         </div>
 
@@ -4785,7 +4795,6 @@ const Mon_Catalogue_Public = (props) => {
                                     && currentTableData2
                                     && currentTableData2.map((formation) => (
                                         <div className="rech_list_formation2">
-
                                             <Formation_Partner_Catalog formation={JSON.parse(formation)} key={JSON.parse(formation).title} />
                                         </div>
 
@@ -4795,14 +4804,13 @@ const Mon_Catalogue_Public = (props) => {
                                     && currentTableData2
                                     && currentTableData2.map((formation) => (
                                         <div className="rech_list_formation2">
-
                                             <Formation_Partner_Catalog formation={JSON.parse(formation)} key={JSON.parse(formation).title} />
                                         </div>
 
                                     ))}
 
 
-                                {result && !newresult && <div>
+                                {/*result && !newresult && <div>
 
                                     {String(userconnected) === String("1") && <label className="default_font">
                                         <i>Afficher toutes les formations :</i>  &nbsp;&nbsp;
@@ -4815,10 +4823,10 @@ const Mon_Catalogue_Public = (props) => {
                                         pageSize={PageSize}
                                         onPageChange={page => setCurrentPage2(page)}
                                     />
-                                </div>
+                                </div>*/
                                 }
 
-                                {result && newresult && <div>
+                                {/*result && newresult && <div>
 
                                     {String(userconnected) === String("1") && <label className="default_font">
                                         <i>Afficher toutes les formations :</i>  &nbsp;&nbsp;
@@ -4831,7 +4839,7 @@ const Mon_Catalogue_Public = (props) => {
                                         pageSize={PageSize}
                                         onPageChange={page => setCurrentPage2(page)}
                                     />
-                                </div>
+                                </div>*/
                                 }
                             </div>
 
@@ -4977,7 +4985,7 @@ const Mon_Catalogue_Public = (props) => {
                             </div>
                         </div>
                         <div style={{ width: '100%', background: '#f3f4fb', paddingTop: "2rem" }}>
-                            <div className="jmj_block_milieu"> 
+                            <div className="jmj_block_milieu">
                                 {/*<div className="jmj_block_milieu_gauche">
                                     {showelement === "true" && <div className="rech_leftbox"  > gggggggggggggggg
                                         <div className="sous_filter">
@@ -5127,7 +5135,7 @@ const Mon_Catalogue_Public = (props) => {
                                     }
                                 </div>*/}
 
-                                <div className="jmj_block_milieu_droite" style={{width:'90%', maxWidth:'1400px'}}>
+                                <div className="jmj_block_milieu_droite" style={{ width: '90%', maxWidth: '1400px' }}>
                                     <div className="rech_middlebox" id="rech_middlebox" style={{ width: '100%' }}>
                                         {/* <div style={{ "width": "50%", float: 'left' }}>  <h3 style={{ fontFamily: 'DM Sans', color: '#0A043C' }}>  Nos Formations  </h3></div> */}
 
@@ -5190,13 +5198,13 @@ const Mon_Catalogue_Public = (props) => {
                                                     <div className="okUpdateData">
                                                         <div style={{ "width": "100%" }}>
                                                             <div style={{ "width": "40%", "float": "left" }}>
-                                                                <Pagination
+                                                               {/*} <Pagination
                                                                     className="pagination-bar"
                                                                     currentPage={currentPage2}
                                                                     totalCount={result.length}
                                                                     pageSize={PageSize}
                                                                     onPageChange={page => setCurrentPage2(page)}
-                                                                />
+                                                                />*/}
                                                             </div>
                                                             {display_formation_session !== "session" && <div style={{ "width": "60%", "float": "right" }}>
                                                                 <div className="input-group input-group-sm mb-3 ">
@@ -5234,7 +5242,7 @@ const Mon_Catalogue_Public = (props) => {
 
                                             {display_formation_session !== "session" && <div style={{ width: '100%', marginBottom: "1rem" }}>
 
-                                             
+
                                                 <div className="block_display_flex_formation" style={{ width: '100%' }}>
                                                     {result && result.length > 0 &&
                                                         result.map((formation) => (
@@ -5247,7 +5255,7 @@ const Mon_Catalogue_Public = (props) => {
                                                         ))}
                                                 </div>
 
-                                              
+
 
                                             </div>}
 
diff --git a/src/styles/components/_mon_catalogue_public.scss b/src/styles/components/_mon_catalogue_public.scss
index 5fe1c56..c3e88ea 100644
--- a/src/styles/components/_mon_catalogue_public.scss
+++ b/src/styles/components/_mon_catalogue_public.scss
@@ -19,6 +19,24 @@
   }
 
 
+  .loader-container {
+    width: 100%;
+    height: 100vh;
+    display: flex;
+    align-items: center;
+    left: -5%;
+    position: fixed;
+    z-index: 1;
+    top: 0px;
+    background: white;
+    background-color: transparent;
+  }
+
+  .mysy_spinner {
+    border-radius: 5px;
+    opacity: 100%;
+  }
+
 
   @media only screen and (max-width: 600px) {
     .calage {