added prediction second increase dynamically

frontend/src/components/Layout/AIModels/AIModelEditor/Trainings.js

@@ -70,6 +70,13 @@ const AIModelsList = (props) => {
       field: "description",
       headerName: "Description",
       flex: 1,
+      renderCell: (params) => {
+        return (
+          <Tooltip title={params.value} placement="right">
+            <span>{params.value}</span>
+          </Tooltip>
+        );
+      },
     },
     {
       field: "epochs",

frontend/src/components/Layout/Start/Prediction/Prediction.js

@@ -17,6 +17,8 @@ import { GeoJSON } from "react-leaflet";
 const Prediction = () => {
   const { id } = useParams();
   const [error, setError] = useState(false);
+  const [apiCallInProgress, setApiCallInProgress] = useState(false);
+
   const [map, setMap] = useState(null);
   const [zoom, setZoom] = useState(0);
   const [responseTime, setResponseTime] = useState(0);
@@ -28,6 +30,20 @@ const Prediction = () => {
   ]);
   const [josmEnabled, setJosmEnabled] = useState(false);
 
+  useEffect(() => {
+    if (!apiCallInProgress) {
+      return;
+    }
+
+    const timer = setInterval(() => {
+      setResponseTime((prevResponseTime) => prevResponseTime + 1);
+    }, 1000);
+
+    return () => {
+      clearInterval(timer);
+    };
+  }, [apiCallInProgress]);
+
   useEffect(() => {
     getModel();
   }, []);
@@ -80,6 +96,7 @@ const Prediction = () => {
     data: predictions,
     isLoading: predictionLoading,
   } = useMutation(async () => {
+    setApiCallInProgress(true);
     const headers = {
       "access-token": accessToken,
     };
@@ -98,6 +115,7 @@ const Prediction = () => {
     const res = await axios.post(`/prediction/`, body, { headers });
     const endTime = new Date().getTime(); // measure end time
     setResponseTime((endTime - startTime) / 1000); // calculate and store response time in seconds
+    setApiCallInProgress(false);
     if (res.error) {
       setError(
         `${res.error.response.statusText}, ${JSON.stringify(