src/pages/Immersion.tsx

@@ -12,6 +12,7 @@ function Immersion() {
   const [instance, setInstance] = useState<Instance>();
   const [allInstances, setAllInstances] = useState<Instance[]>([]);
   const [instancesStatus, setInstancesStatus] = useState<Record<number, string>>({});
+  const [containerStatus, setContainerStatus] = useState<string>("");
   const username = localStorage.getItem("username");
   
   const copyText = (copy: string) => {
@@ -49,6 +50,24 @@ function Immersion() {
     });
   }, [id]);
 
+  // Mise à jour automatique des status toutes les 5 secondes
+  useEffect(() => {
+    const intervalId = setInterval(() => {
+      if (allInstances.length > 0) {
+        allInstances.forEach((inst: Instance) => {
+          axios.get(`/api/ji/${id}/container`).then((statusRes) => {
+            setInstancesStatus(prev => ({
+              ...prev,
+              [inst.id]: statusRes.data
+            }));
+          });
+        });
+      }
+    }, 5000);
+
+    return () => clearInterval(intervalId);
+  }, [id, allInstances]);
+
   useEffect(() => {
     axios.get("/api/user/me").then((res) => {
       localStorage.setItem("username", res.data.username);
@@ -57,9 +76,22 @@ function Immersion() {
   
   useEffect(() => {
     axios.get(`/api/ji/${id}/container`).then((res) => {
+      setContainerStatus(res.data);
       localStorage.setItem("container_status", res.data);
     });
-  }, []);
+  }, [id]);
+
+  // Mise à jour automatique du container status toutes les 5 secondes
+  useEffect(() => {
+    const intervalId = setInterval(() => {
+      axios.get(`/api/ji/${id}/container`).then((res) => {
+        setContainerStatus(res.data);
+        localStorage.setItem("container_status", res.data);
+      });
+    }, 5000);
+
+    return () => clearInterval(intervalId);
+  }, [id]);
 
   const container_status = localStorage.getItem("container_status");
 
@@ -189,7 +221,7 @@ function Immersion() {
                       <li className="flex justify-between align-middle items-center">
                         <span>Status:</span>
                         <div className="flex gap-2 items-center">
-                          <span className="font-normal">{container_status}</span>
+                          <span className="font-normal">{containerStatus}</span>
                         </div>
                       </li>
                     </ul>