Fix real-time job updates on /jobs page with better DOM manipulation

pdf_renamer.py

@@ -1260,22 +1260,31 @@ def jobs():
                             }, 500); // Small delay to show completion briefly
                             return; // Stop processing to avoid UI updates during redirect
                         }
-                        const jobsContainer = document.querySelector('h1').parentNode;
-                        const existingJobs = jobsContainer.querySelectorAll('.job');
-                        const existingNoJobsMsg = jobsContainer.querySelectorAll('p');
+                        
+                        // Find the container where jobs are rendered
+                        const body = document.body;
+                        const existingJobs = body.querySelectorAll('.job');
+                        console.log(`Found ${existingJobs.length} existing job elements`);
                         
                         // Remove existing job elements
                         existingJobs.forEach(job => job.remove());
                         
                         // Remove existing "No jobs yet" messages
-                        existingNoJobsMsg.forEach(p => {
+                        const noJobsMsgs = body.querySelectorAll('p');
+                        noJobsMsgs.forEach(p => {
                             if (p.textContent.includes('No jobs yet')) {
                                 p.remove();
                             }
                         });
                         
+                        // Find where to insert new jobs (after nav-links div)
+                        const navLinks = body.querySelector('.nav-links');
+                        const scriptTag = body.querySelector('script');
+                        
                         // Add updated job elements
                         const jobEntries = Object.entries(data);
+                        console.log(`Rendering ${jobEntries.length} jobs`);
+                        
                         if (jobEntries.length > 0) {
                             jobEntries.forEach(([jobId, job]) => {
                                 const jobDiv = document.createElement('div');
@@ -1324,12 +1333,21 @@ def jobs():
                                         </div>
                                     ` : ''}
                                 `;
-                                jobsContainer.insertBefore(jobDiv, jobsContainer.querySelector('script') || jobsContainer.lastElementChild);
+                                // Insert job before the script tag
+                                if (scriptTag) {
+                                    body.insertBefore(jobDiv, scriptTag);
+                                } else {
+                                    body.appendChild(jobDiv);
+                                }
                             });
                         } else {
                             const noJobsMsg = document.createElement('p');
                             noJobsMsg.innerHTML = 'No jobs yet. <a href="/">Upload some files</a> to get started.';
-                            jobsContainer.insertBefore(noJobsMsg, jobsContainer.querySelector('script') || jobsContainer.lastElementChild);
+                            if (scriptTag) {
+                                body.insertBefore(noJobsMsg, scriptTag);
+                            } else {
+                                body.appendChild(noJobsMsg);
+                            }
                         }
                     })
                     .catch(error => console.error('Error updating jobs:', error));