Update app.py

app.py

@@ -1026,121 +1026,89 @@ def display_evaluation(evaluation: Dict[str, Any]):
             if "summary" in recommendations:
                 st.markdown("""
                     <div class="summary-card">
-                        <h4>📊 Overall Summary</h4>
+                        <h4>📊 Overall Assessment</h4>
                         <div class="summary-content">
-                """, unsafe_allow_html=True)
-                st.markdown(recommendations["summary"])
-                st.markdown("</div></div>", unsafe_allow_html=True)
+                            {}
+                        </div>
+                    </div>
+                """.format(recommendations["summary"]), unsafe_allow_html=True)
             
-            # Display improvements using categories from content analysis
+            # Display improvements in categorized columns
             st.markdown("<h4>💡 Areas for Improvement</h4>", unsafe_allow_html=True)
             improvements = recommendations.get("improvements", [])
             
-            if isinstance(improvements, list):
-                # Use predefined categories
-                categories = {
-                    "🗣️ Communication": [],
-                    "📚 Teaching": [],
-                    "💻 Technical": []
-                }
-                
-                # Each improvement should now come with a category from the content analysis
-                for improvement in improvements:
-                    if isinstance(improvement, dict):
-                        category = improvement.get("category", "💻 Technical")  # Default to Technical if no category
-                        message = improvement.get("message", str(improvement))
-                        if "COMMUNICATION" in category.upper():
-                            categories["🗣️ Communication"].append(message)
-                        elif "TEACHING" in category.upper():
-                            categories["📚 Teaching"].append(message)
-                        elif "TECHNICAL" in category.upper():
-                            categories["💻 Technical"].append(message)
-                    else:
-                        # Handle legacy format or plain strings
-                        categories["💻 Technical"].append(improvement)
-                
-                # Display categorized improvements in columns
-                cols = st.columns(len(categories))
-                for col, (category, items) in zip(cols, categories.items()):
-                    with col:
-                        st.markdown(f"""
-                            <div class="improvement-card">
-                                <h5>{category}</h5>
-                                <div class="improvement-list">
+            # Initialize category buckets
+            categorized_improvements = {
+                "Communication": [],
+                "Teaching": [],
+                "Technical": []
+            }
+            
+            # Sort improvements into categories
+            for improvement in improvements:
+                if isinstance(improvement, dict):
+                    category = improvement.get("category", "").upper()
+                    message = improvement.get("message", "")
+                    
+                    if "COMMUNICATION" in category:
+                        categorized_improvements["Communication"].append(message)
+                    elif "TEACHING" in category:
+                        categorized_improvements["Teaching"].append(message)
+                    elif "TECHNICAL" in category:
+                        categorized_improvements["Technical"].append(message)
+                else:
+                    # Handle string improvements (legacy format)
+                    categorized_improvements["Technical"].append(str(improvement))
+            
+            # Create columns for each category
+            cols = st.columns(3)
+            
+            # Display improvements in columns with icons
+            for col, (category, items) in zip(cols, categorized_improvements.items()):
+                with col:
+                    icon = "🗣️" if category == "Communication" else "📚" if category == "Teaching" else "💻"
+                    st.markdown(f"""
+                        <div class="improvement-card">
+                            <h5>{icon} {category}</h5>
+                            <div class="improvement-list">
                         """, unsafe_allow_html=True)
-                        
+                    
+                    if items:
                         for item in items:
                             st.markdown(f"""
                                 <div class="improvement-item">
                                     • {item}
                                 </div>
                             """, unsafe_allow_html=True)
-                        
-                        st.markdown("</div></div>", unsafe_allow_html=True)
+                    else:
+                        st.markdown("""
+                            <div class="improvement-item no-improvements">
+                                No specific improvements needed in this category.
+                            </div>
+                        """, unsafe_allow_html=True)
+                    
+                    st.markdown("</div></div>", unsafe_allow_html=True)
             
-            # Add additional CSS for new components
+            # Add additional CSS for recommendations styling
             st.markdown("""
                 <style>
-                .teaching-card {
-                    background: white;
+                .summary-card {
+                    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
                     border-radius: 8px;
                     padding: 20px;
-                    margin: 10px 0;
+                    margin: 15px 0;
+                    border-left: 4px solid #1f77b4;
                     box-shadow: 0 2px 4px rgba(0,0,0,0.1);
                 }
                 
-                .teaching-header {
-                    display: flex;
-                    justify-content: space-between;
-                    align-items: center;
-                    margin-bottom: 15px;
-                }
-                
-                .category-name {
-                    font-size: 1.2em;
-                    font-weight: bold;
+                .summary-card h4 {
                     color: #1f77b4;
+                    margin-bottom: 15px;
                 }
                 
-                .score-badge {
-                    padding: 5px 15px;
-                    border-radius: 15px;
-                    font-weight: bold;
-                }
-                
-                .score-pass {
-                    background-color: #28a745;
-                    color: white;
-                }
-                
-                .score-fail {
-                    background-color: #dc3545;
-                    color: white;
-                }
-                
-                .citations-container {
-                    margin-top: 10px;
-                }
-                
-                .citation-box {
-                    background: #f8f9fa;
-                    border-left: 3px solid #6c757d;
-                    padding: 10px;
-                    margin: 5px 0;
-                    border-radius: 0 4px 4px 0;
-                }
-                
-                .citation-text {
+                .summary-content {
                     color: #495057;
-                }
-                
-                .summary-card {
-                    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
-                    border-radius: 8px;
-                    padding: 20px;
-                    margin: 15px 0;
-                    border-left: 4px solid #1f77b4;
-                    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+                    line-height: 1.6;
                 }
                 
                 .improvement-card {
@@ -1150,13 +1118,14 @@ def display_evaluation(evaluation: Dict[str, Any]):
                     margin: 10px 0;
                     height: 100%;
                     box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+                    border-left: 4px solid #28a745;
                 }
                 
                 .improvement-card h5 {
                     color: #1f77b4;
-                    margin-bottom: 10px;
+                    margin-bottom: 15px;
+                    padding-bottom: 10px;
                     border-bottom: 2px solid #f0f0f0;
-                    padding-bottom: 5px;
                 }
                 
                 .improvement-list {
@@ -1164,12 +1133,22 @@ def display_evaluation(evaluation: Dict[str, Any]):
                 }
                 
                 .improvement-item {
-                    padding: 5px 0;
-                    border-bottom: 1px solid #f0f0f0;
+                    padding: 8px;
+                    margin: 5px 0;
+                    background: #f8f9fa;
+                    border-radius: 4px;
+                    color: #495057;
+                    transition: transform 0.2s ease;
+                }
+                
+                .improvement-item:hover {
+                    transform: translateX(5px);
+                    background: #f0f0f0;
                 }
                 
-                .improvement-item:last-child {
-                    border-bottom: none;
+                .no-improvements {
+                    color: #6c757d;
+                    font-style: italic;
                 }
                 </style>
             """, unsafe_allow_html=True)