Update app.py

app.py

@@ -301,7 +301,61 @@ 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):
@@ -485,36 +539,75 @@ def create_reranking_interface(task_data):
             except Exception as e:
                 return f"Error saving results: {str(e)}"
         
-        # Define functions for the quick ranking buttons
+        # Define optimized functions for the quick ranking buttons
         def assign_sequential_ranks():
-            return [str(i+1) for i in range(len(samples[0]["candidates"]))]
+            """Assign sequential rankings (1,2,3...) to all documents."""
+            sequential_ranks = [str(i+1) for i in range(len(samples[0]["candidates"]))]
+            # Return ranks plus a success message
+            return sequential_ranks + ["✅ Applied sequential ranking"]
         
         def assign_reverse_ranks():
+            """Assign reverse rankings (n,n-1...) to all documents."""
             n = len(samples[0]["candidates"])
-            return [str(n-i) for i in range(n)]
+            reverse_ranks = [str(n-i) for i in range(n)]
+            # Return ranks plus a success message
+            return reverse_ranks + ["✅ Applied reverse ranking"]
         
         def clear_rankings():
-            return [""] * len(samples[0]["candidates"])
-        
-        # Connect quick ranking buttons
+            """Clear all rankings."""
+            empty_ranks = [""] * len(samples[0]["candidates"])
+            # Return empty ranks plus a success message
+            return empty_ranks + ["✅ Cleared all rankings"]
+            
+        # Connect quick ranking buttons - add status message output
         sequential_btn.click(
             fn=assign_sequential_ranks,
             inputs=None,
-            outputs=ranking_inputs
+            outputs=ranking_inputs + [status_box]
         )
         
         reverse_btn.click(
             fn=assign_reverse_ranks,
             inputs=None,
-            outputs=ranking_inputs
+            outputs=ranking_inputs + [status_box]
         )
         
         clear_btn.click(
             fn=clear_rankings,
             inputs=None,
-            outputs=ranking_inputs
+            outputs=ranking_inputs + [status_box]
+        )
+        
+        # Optimize validation - reduce redundant validations
+        # Instead of connecting validation to each ranking input change,
+        # add a "Validate Rankings" button that runs validation on demand
+        
+        with gr.Row():
+            validate_btn = gr.Button("Validate Rankings", variant="secondary")
+        
+        # Connect validate button to the right function
+        validate_btn.click(
+            fn=lambda *rankings: validate_rankings(*rankings)[:-1] + ["Validation complete"],
+            inputs=ranking_inputs,
+            outputs=validation_indicators + [status_box]
         )
         
+        # Add a simpler validation for individual inputs that doesn't cascade to all inputs
+        def validate_single_input(rank, index):
+            """Lightweight validation for a single input."""
+            if rank is None or rank == "":
+                return '<span style="color: #dc3545;">⚠️</span>'
+            else:
+                return f'<span style="color: #28a745;">✓ {rank}</span>'
+        
+        # Connect simpler validation to each input
+        for i, ranking in enumerate(ranking_inputs):
+            ranking.change(
+                fn=lambda r, idx=i: validate_single_input(r, idx),
+                inputs=[ranking],
+                outputs=[validation_indicators[i]]
+            )
+        
         # Wire up events (Gradio 3.x syntax)
         submit_btn.click(
             fn=submit_rankings,
@@ -573,14 +666,6 @@ 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."""