Merge branch 'develop' into abort-fix

src/api/storage.ts

@@ -205,20 +205,24 @@ export const interpretStoredRecording = async (id: string): Promise<boolean> =>
   }
 }
 
-export const notifyAboutAbort = async (id: string): Promise<boolean> => {
+export const notifyAboutAbort = async (id: string): Promise<{ success: boolean; isQueued?: boolean }> => {
   try {
-    const response = await axios.post(`${apiUrl}/storage/runs/abort/${id}`);
+    const response = await axios.post(`${apiUrl}/storage/runs/abort/${id}`, { withCredentials: true });
     if (response.status === 200) {
-      return response.data;
+      return {
+        success: response.data.success,
+        isQueued: response.data.isQueued
+      };
     } else {
       throw new Error(`Couldn't abort a running recording with id ${id}`);
     }
   } catch (error: any) {
     console.log(error);
-    return false;
+    return { success: false };
   }
 }
 
+
 export const scheduleStoredRecording = async (id: string, settings: ScheduleSettings): Promise<ScheduleRunResponse> => {
   try {
     const response = await axios.put(

src/pages/MainPage.tsx

@@ -52,16 +52,51 @@ export const MainPage = ({ handleEditRecording, initialContent }: MainPageProps)
   const navigate  = useNavigate();
 
   const abortRunHandler = (runId: string, robotName: string, browserId: string) => {
+    notify('info', t('main_page.notifications.abort_initiated', { name: robotName }));
+
     aborted = true;
+    
     notifyAboutAbort(runId).then(async (response) => {
-      if (response) {
-        notify('success', t('main_page.notifications.abort_success', { name: robotName }));
-        await stopRecording(ids.browserId);
-      } else {
+      if (!response.success) {
         notify('error', t('main_page.notifications.abort_failed', { name: robotName }));
+        setRerenderRuns(true);
+        return;
       }
-      setRerenderRuns(true);
-    })
+      
+      if (response.isQueued) {
+        setRerenderRuns(true);
+        
+        notify('success', t('main_page.notifications.abort_success', { name: robotName }));
+        
+        setQueuedRuns(prev => {
+          const newSet = new Set(prev);
+          newSet.delete(runId);
+          return newSet;
+        });
+        
+        return;
+      }
+      
+      const abortSocket = io(`${apiUrl}/${browserId}`, {
+        transports: ["websocket"],
+        rejectUnauthorized: false
+      });
+      
+      abortSocket.on('run-aborted', (abortData) => {
+        if (abortData.runId === runId) {
+          notify('success', t('main_page.notifications.abort_success', { name: abortData.robotName || robotName }));
+          setRerenderRuns(true);
+          abortSocket.disconnect();
+        }
+      });
+      
+      abortSocket.on('connect_error', (error) => {
+        console.log('Abort socket connection error:', error);
+        notify('error', t('main_page.notifications.abort_failed', { name: robotName }));
+        setRerenderRuns(true);
+        abortSocket.disconnect();
+      });
+    });
   }
 
   const setRecordingInfo = (id: string, name: string) => {