Update app.py

app.py

@@ -301,61 +301,7 @@ def create_reranking_interface(task_data):
                 margin: 0 auto;
                 font-size: 12px !important;
             }
-            
-            /* Add styling for validation button */
-            .validate-btn {
-                margin-top: 10px !important;
-                width: 100% !important;
-            }
-            
-            /* Add loading animation for dropdowns */
-            .rank-dropdown.loading select {
-                background-color: #f0f0f0 !important;
-                cursor: wait !important;
-            }
-            
-            /* Quick tools improvements */
-            .tools-container button {
-                transition: all 0.3s ease !important;
-            }
-            
-            .tools-container button:active {
-                transform: scale(0.98) !important;
-            }
-            
-            /* Add this to make dropdown updates more responsive */
-            .rank-dropdown select {
-                transition: background-color 0.2s ease !important;
-            }
         </style>
-        
-        <script>
-            // Add simple loading state indication for quick rank buttons
-            function addLoadingBehavior() {
-                const quickButtons = document.querySelectorAll('.tools-container button');
-                if (quickButtons) {
-                    quickButtons.forEach(btn => {
-                        btn.addEventListener('click', function() {
-                            // Show loading state in the button
-                            const originalText = this.textContent;
-                            this.textContent = "Applying...";
-                            
-                            // Reset after a short delay
-                            setTimeout(() => {
-                                this.textContent = originalText;
-                            }, 1000);
-                        });
-                    });
-                }
-            }
-            
-            // Run when DOM is loaded
-            if (document.readyState === 'loading') {
-                document.addEventListener('DOMContentLoaded', addLoadingBehavior);
-            } else {
-                addLoadingBehavior();
-            }
-        </script>
         """)
         
         def validate_rankings(*rankings):
@@ -440,6 +386,46 @@ def create_reranking_interface(task_data):
             
             return status, progress
         
+        def load_sample(sample_id):
+            """Load a specific sample into the interface."""
+            sample = next((s for s in samples if s["id"] == sample_id), None)
+            if not sample:
+                return [query_text.value] + [d.value for d in doc_containers] + [""] * len(ranking_inputs) + [""] * len(validation_indicators) + [sample_id, progress_text.value, status_box.value]
+            
+            # Update query
+            new_query = sample["query"]
+            
+            # Update documents
+            new_docs = []
+            for i, doc in enumerate(sample["candidates"]):
+                if i < len(doc_containers):
+                    new_docs.append(doc)
+                    
+            # Initialize rankings
+            new_rankings = [""] * len(ranking_inputs)
+            
+            # Check if this sample has already been annotated
+            existing_annotation = next((a for a in results["annotations"] if a["sample_id"] == sample_id), None)
+            if existing_annotation:
+                # Restore previous rankings
+                for i, rank in enumerate(existing_annotation["rankings"]):
+                    if i < len(new_rankings) and rank is not None:
+                        new_rankings[i] = str(rank)
+            
+            # Update progress
+            current_idx = samples.index(sample)
+            new_progress = f"Progress: {sum(completed_samples.values())}/{len(samples)}"
+            
+            new_status = f"Viewing query {current_idx + 1} of {len(samples)}"
+            if completed_samples[sample_id]:
+                new_status += " (already completed)"
+            
+            # Initialize validation indicators
+            validation_results = validate_rankings(*new_rankings)
+            validation_indicators_values = validation_results[:-1]  # Remove validity flag
+            
+            return [new_query] + new_docs + new_rankings + validation_indicators_values + [sample_id, new_progress, new_status]
+        
         def auto_save_and_navigate(direction, current_id, auto_save, *rankings):
             """Save rankings if auto-save is enabled, then navigate."""
             # Extract rankings (remove validation indicators)
@@ -499,143 +485,74 @@ def create_reranking_interface(task_data):
             except Exception as e:
                 return f"Error saving results: {str(e)}"
         
-        # Optimize the navigation functions to reduce unnecessary updates
-        def handle_next(current_id, auto_save, *rankings):
-            """Optimized handler for next query navigation."""
-            # First, handle auto-save (only if needed)
-            new_id, status, progress = auto_save_and_navigate("next", current_id, auto_save, *rankings)
-            
-            # Return the new sample ID for a more efficient update
-            # The load_sample function will handle all UI updates in one batch
-            return new_id
-        
-        def handle_prev(current_id, auto_save, *rankings):
-            """Optimized handler for previous query navigation."""
-            # First, handle auto-save (only if needed)
-            new_id, status, progress = auto_save_and_navigate("prev", current_id, auto_save, *rankings)
-            
-            # Return the new sample ID for a more efficient update
-            # The load_sample function will handle all UI updates in one batch
-            return new_id
-        
-        # Optimize the load_sample function to handle all UI updates efficiently
-        def load_sample(sample_id):
-            """Load a specific sample into the interface."""
-            # Clear all validation indicators first for a cleaner transition
-            blank_validations = [""] * len(validation_indicators)
-            
-            # Find the sample data
-            sample = next((s for s in samples if s["id"] == sample_id), None)
-            if not sample:
-                return [query_text.value] + [d.value for d in doc_containers] + [""] * len(ranking_inputs) + blank_validations + [sample_id, progress_text.value, status_box.value]
-            
-            # Update query
-            new_query = sample["query"]
-            
-            # Update documents
-            new_docs = []
-            for i, doc in enumerate(sample["candidates"]):
-                if i < len(doc_containers):
-                    new_docs.append(doc)
-                    
-            # Initialize rankings
-            new_rankings = [""] * len(ranking_inputs)
-            
-            # Check if this sample has already been annotated
-            existing_annotation = next((a for a in results["annotations"] if a["sample_id"] == sample_id), None)
-            if existing_annotation:
-                # Restore previous rankings
-                for i, rank in enumerate(existing_annotation["rankings"]):
-                    if i < len(new_rankings) and rank is not None:
-                        new_rankings[i] = str(rank)
-            
-            # Update progress
-            current_idx = samples.index(sample)
-            new_progress = f"Progress: {sum(completed_samples.values())}/{len(samples)}"
-            
-            new_status = f"Viewing query {current_idx + 1} of {len(samples)}"
-            if completed_samples[sample_id]:
-                new_status += " (already completed)"
-            
-            # Initialize validation indicators (but don't run validation until needed)
-            # This improves load time
-            
-            return [new_query] + new_docs + new_rankings + blank_validations + [sample_id, new_progress, new_status]
-            
-        # Optimize the quick ranking functions for better performance
+        # Define functions for the quick ranking buttons
         def assign_sequential_ranks():
-            """Assign sequential rankings (1,2,3...) to all documents."""
-            sequential_ranks = [str(i+1) for i in range(len(samples[0]["candidates"]))]
-            # Return ranks only - validation will be done separately for better performance
-            return sequential_ranks
+            return [str(i+1) for i in range(len(samples[0]["candidates"]))]
         
         def assign_reverse_ranks():
-            """Assign reverse rankings (n,n-1...) to all documents."""
             n = len(samples[0]["candidates"])
-            reverse_ranks = [str(n-i) for i in range(n)]
-            # Return ranks only - validation will be done separately for better performance
-            return reverse_ranks
+            return [str(n-i) for i in range(n)]
         
         def clear_rankings():
-            """Clear all rankings."""
-            empty_ranks = [""] * len(samples[0]["candidates"])
-            # Return empty ranks only - validation will be done separately for better performance
-            return empty_ranks
+            return [""] * len(samples[0]["candidates"])
         
-        # Add a function to update status after quick ranking operations
-        def update_status_after_ranking(operation_name):
-            """Update status box after a ranking operation."""
-            return f"✅ {operation_name} applied successfully"
-        
-        # Connect quick ranking buttons with more efficient handling
+        # Connect quick ranking buttons
         sequential_btn.click(
             fn=assign_sequential_ranks,
             inputs=None,
             outputs=ranking_inputs
-        ).then(
-            fn=lambda: update_status_after_ranking("Sequential ranking"),
-            inputs=None,
-            outputs=[status_box]
         )
         
         reverse_btn.click(
             fn=assign_reverse_ranks,
             inputs=None,
             outputs=ranking_inputs
-        ).then(
-            fn=lambda: update_status_after_ranking("Reverse ranking"),
-            inputs=None,
-            outputs=[status_box]
         )
         
         clear_btn.click(
             fn=clear_rankings,
             inputs=None,
             outputs=ranking_inputs
-        ).then(
-            fn=lambda: update_status_after_ranking("Rankings cleared"),
-            inputs=None,
-            outputs=[status_box]
         )
         
-        # Connect navigation with more efficient data handling
+        # Wire up events (Gradio 3.x syntax)
+        submit_btn.click(
+            fn=submit_rankings,
+            inputs=ranking_inputs + [current_sample_id],
+            outputs=[status_box, progress_text]
+        )
+        
+        # Auto-save and navigate events
+        def handle_next(current_id, auto_save, *rankings):
+            # First, handle auto-save
+            new_id, status, progress = auto_save_and_navigate("next", current_id, auto_save, *rankings)
+            # Then, load the new sample
+            outputs = load_sample(new_id)
+            # Add the status and progress
+            outputs[-2] = progress if status else outputs[-2]
+            outputs[-1] = status if status else outputs[-1]
+            return outputs
+        
+        def handle_prev(current_id, auto_save, *rankings):
+            # First, handle auto-save
+            new_id, status, progress = auto_save_and_navigate("prev", current_id, auto_save, *rankings)
+            # Then, load the new sample
+            outputs = load_sample(new_id)
+            # Add the status and progress
+            outputs[-2] = progress if status else outputs[-2]
+            outputs[-1] = status if status else outputs[-1]
+            return outputs
+        
+        # Connect navigation with Gradio 3.x syntax
         next_btn.click(
             fn=handle_next,
             inputs=[current_sample_id, auto_save_toggle] + ranking_inputs,
-            outputs=[current_sample_id]  # Only update the sample ID
-        ).then(
-            fn=load_sample,  # Then load the sample with all UI updates in one batch
-            inputs=[current_sample_id],
             outputs=[query_text] + doc_containers + ranking_inputs + validation_indicators + [current_sample_id, progress_text, status_box]
         )
         
         prev_btn.click(
             fn=handle_prev,
             inputs=[current_sample_id, auto_save_toggle] + ranking_inputs,
-            outputs=[current_sample_id]  # Only update the sample ID
-        ).then(
-            fn=load_sample,  # Then load the sample with all UI updates in one batch
-            inputs=[current_sample_id],
             outputs=[query_text] + doc_containers + ranking_inputs + validation_indicators + [current_sample_id, progress_text, status_box]
         )
         
@@ -656,6 +573,14 @@ def create_reranking_interface(task_data):
             outputs=[auto_save_enabled]
         )
         
+        # Connect validation to ranking inputs for real-time feedback
+        for ranking in ranking_inputs:
+            ranking.change(
+                fn=on_ranking_change,
+                inputs=ranking_inputs,
+                outputs=validation_indicators
+            )
+        
         # Add a real-time validation for the entire set to check for duplicates
         def validate_all_inputs(*rankings):
             """Check all inputs for duplicate ranks and provide feedback."""