hide previous analysis js

templates/index.html

@@ -23,8 +23,17 @@
             
             // Show loading indicator
             document.getElementById('loadingIndicator').style.display = 'block';
-            // Hide results if they were previously shown
-            document.getElementById('resultsContainer').style.display = 'none';
+            
+            // Collapse all existing query sections
+            const existingAccordions = document.querySelectorAll('.accordion-section');
+            existingAccordions.forEach(accordion => {
+                const header = accordion.querySelector('.accordion-header');
+                const body = accordion.querySelector('.accordion-body');
+                if (header && body && !header.classList.contains('collapsed')) {
+                    header.classList.add('collapsed');
+                    body.classList.add('collapsed');
+                }
+            });
             
             // Send message to Flask backend
             fetch('/chat', {
@@ -49,15 +58,19 @@
                         jsonData = JSON.parse(jsonString);
                     }
                     
-                    // Clear existing queries
-                    const queriesContainer = document.getElementById('queriesContainer');
-                    queriesContainer.innerHTML = '';
+                    // Create a new accordion section for these search results
+                    const timestamp = new Date().toLocaleString();
+                    const accordionSection = createAccordionSection(timestamp);
                     
-                    // Add each query from the response
+                    // Add each query from the response to this accordion
                     Object.keys(jsonData).forEach(key => {
-                        addQueryField(jsonData[key]);
+                        addQueryField(jsonData[key], accordionSection.querySelector('.accordion-content'));
                     });
                     
+                    // Add the accordion to the container
+                    const queriesContainer = document.getElementById('queriesContainer');
+                    queriesContainer.insertBefore(accordionSection, queriesContainer.firstChild);
+                    
                     // Show results container
                     document.getElementById('resultsContainer').style.display = 'block';
                 } catch (error) {
@@ -73,9 +86,15 @@
         }
         
         // Add a new query field with the given text (or empty if not provided)
-        function addQueryField(queryText = '') {
-            const queriesContainer = document.getElementById('queriesContainer');
-            const queryIndex = queriesContainer.children.length + 1;
+        function addQueryField(queryText = '', container = null) {
+            const queriesContainer = container || document.getElementById('queriesContainer');
+            
+            // Count existing query items in this container for indexing
+            const queryItems = container ? 
+                container.querySelectorAll('.query-item') : 
+                document.getElementById('queriesContainer').querySelectorAll('.query-item');
+            
+            const queryIndex = queryItems.length + 1;
             
             // Create main container for this query item
             const queryItem = document.createElement('div');
@@ -98,10 +117,17 @@
             deleteButton.className = 'action-button delete-button';
             deleteButton.textContent = 'Delete';
             deleteButton.onclick = function() {
-                queriesContainer.removeChild(queryItem);
-                // Update the placeholder numbers for remaining queries
-                updateQueryIndices();
+                queryItem.parentNode.removeChild(queryItem);
+                
+                // Update the placeholder numbers for remaining queries within this container
+                const parent = container || document.getElementById('queriesContainer');
+                const items = parent.querySelectorAll('.query-item');
+                items.forEach((item, idx) => {
+                    const field = item.querySelector('.query-field');
+                    if (field) field.placeholder = `Search Query ${idx + 1}`;
+                });
             };
+            
             // Search button
             const searchButton = document.createElement('button');
             searchButton.type = 'button';
@@ -293,12 +319,12 @@
             }
             
             const documentType = row.cells[0].textContent.toLowerCase();
+            
             // Check if there's already an insights row for this document
             let insightsRow = row.nextElementSibling;
             if (insightsRow && insightsRow.className === 'insights-row') {
                 // Insights row already exists, get the container
                 insightsContainer = insightsRow.querySelector('.insights-container');
-
                 insightsContainer.innerHTML = '<div class="loading-spinner"></div><div>Extracting insights...</div>';
             } else {
                 // Create insights row that spans across all columns
@@ -907,6 +933,7 @@
                                             scoreCell.style.fontWeight = 'bold';
                                             scoreCell.style.textAlign = 'center';
                                         }
+                                        
                                         // Add "Extract Insights" button to the justify cell - for Analyze All function
                                         const insightsButton = document.createElement('button');
                                         insightsButton.textContent = 'Extract Insights';
@@ -1137,6 +1164,44 @@
             container.innerHTML = '';
             container.appendChild(textarea);
         }
+
+        // Create a new accordion section for search results
+        function createAccordionSection(timestamp) {
+            const accordionSection = document.createElement('div');
+            accordionSection.className = 'accordion-section';
+            
+            const accordionHeader = document.createElement('div');
+            accordionHeader.className = 'accordion-header';
+            accordionHeader.innerHTML = `
+                <span>Search Results <span class="query-timestamp">${timestamp}</span></span>
+                <span class="toggle-icon">▼</span>
+            `;
+            accordionHeader.onclick = function() {
+                this.classList.toggle('collapsed');
+                const body = this.nextElementSibling;
+                body.classList.toggle('collapsed');
+                
+                // Update the toggle icon
+                const toggleIcon = this.querySelector('.toggle-icon');
+                if (body.classList.contains('collapsed')) {
+                    toggleIcon.textContent = '►';
+                } else {
+                    toggleIcon.textContent = '▼';
+                }
+            };
+            
+            const accordionBody = document.createElement('div');
+            accordionBody.className = 'accordion-body';
+            
+            const accordionContent = document.createElement('div');
+            accordionContent.className = 'accordion-content';
+            accordionBody.appendChild(accordionContent);
+            
+            accordionSection.appendChild(accordionHeader);
+            accordionSection.appendChild(accordionBody);
+            
+            return accordionSection;
+        }
     </script>
 </head>
 <body>