Update app.py

app.py

@@ -515,6 +515,42 @@ def submit_story():
         # Clear input
         st.session_state.text_input = ""
 
+('is_starter'):
+                        # แสดงประโยคเริ่มต้นพิเศษ
+                        st.markdown(f"""
+                            <div style="background-color: #f0f7ff; 
+                                      padding: 15px; 
+                                      border-radius: 8px; 
+                                      margin: 5px 0;
+                                      border-left: 4px solid #1e88e5;">
+                                <p style="color: #1e88e5; margin-bottom: 5px;">🎬 เริ่มเรื่อง:</p>
+                                <p style="color: #666;">{entry.get('thai_content', '')}</p>
+                                <p>{entry['content']}</p>
+                            </div>
+                        """, unsafe_allow_html=True)
+                    else:
+                        st.markdown(f"""
+                            <div style="padding: 10px; margin: 5px 0;">
+                                <p>🤖 AI: {entry['content']}</p>
+                            </div>
+                        """, unsafe_allow_html=True)
+                elif entry['role'] == 'You':
+                    status_icon = "✅ " if entry.get('is_correct') else "✍️ "
+                    if entry.get('is_corrected'):
+                        # แสดงข้อความที่ถูกแก้ไขแล้ว
+                        st.markdown(f"""
+                            <div style="padding: 10px; margin: 5px 0; background-color: #f0f9ff; border-radius: 5px;">
+                                <p>👤 You: {status_icon}{entry['content']}</p>
+                            </div>
+                        """, unsafe_allow_html=True)
+                    else:
+                        # แสดงข้อความปกติ
+                        st.markdown(f"""
+                            <div style="padding: 10px; margin: 5px 0;">
+                                <p>👤 You: {status_icon}{entry['content']}</p>
+                            </div>
+                        """, unsafe_allow_html=True)
+
 # Theme Helper Functions
 def get_available_themes(level: str) -> List[Dict]:
     """Get list of themes available for the current level."""
@@ -1338,29 +1374,43 @@ def apply_correction(story_index: int, corrected_text: str):
     if 0 <= story_index < len(st.session_state.story):
         original_text = st.session_state.story[story_index]['content']
         
-        # เก็บประวัติการแก้ไข
-        if 'corrections' not in st.session_state:
-            st.session_state.corrections = {}
-            
-        st.session_state.corrections[story_index] = {
-            'original': original_text,
-            'corrected': corrected_text,
-            'timestamp': datetime.now().isoformat()  # แก้จาก datetime.datetime.now()
-        }
-        
-        # แก้ไขประโยคในเรื่อง
-        st.session_state.story[story_index]['content'] = corrected_text
-        st.session_state.story[story_index]['is_corrected'] = True
+        # อัพเดทข้อความเดิมแทนที่จะเพิ่มใหม่
+        st.session_state.story[story_index].update({
+            'content': corrected_text,
+            'is_corrected': True,
+            'is_correct': True,
+            'original_text': original_text,
+            'correction_timestamp': datetime.now().isoformat()
+        })
         
         # แสดงข้อความยืนยันการแก้ไข
         st.success("✅ แก้ไขประโยคเรียบร้อยแล้ว!")
         
-        # อัพเดทสถิติ (ถ้ามี)
+        # อัพเดทสถิติ
         if 'stats' in st.session_state:
-            # อาจเพิ่มการนับจำนวนครั้งที่แก้ไข
             st.session_state.stats['corrections_made'] = \
                 st.session_state.stats.get('corrections_made', 0) + 1
 
+# เพิ่ม CSS สำหรับการแสดงผล
+st.markdown("""
+    <style>
+    .story-message {
+        padding: 10px;
+        margin: 5px 0;
+        border-radius: 5px;
+    }
+    .story-message.ai {
+        background-color: #f0f7ff;
+    }
+    .story-message.user {
+        background-color: #fff;
+    }
+    .story-message.corrected {
+        background-color: #f0f9ff;
+    }
+    </style>
+""", unsafe_allow_html=True)
+
 def get_vocabulary_suggestions() -> List[str]:
     """Get contextual vocabulary suggestions with Thai translations."""
     try:
@@ -1529,6 +1579,61 @@ def update_points(is_correct_first_try: bool):
         st.session_state.stats['total_sentences'] * 100
     )
 
+def show_story():
+    story_display = st.container()
+    
+    with story_display:
+        if not st.session_state.story:
+            st.info("เลือกธีมเรื่องราวที่ต้องการเพื่อเริ่มต้นการผจญภัย!")
+        else:
+            # เก็บข้อความล่าสุดของแต่ละ index
+            latest_messages = {}
+            for idx, entry in enumerate(st.session_state.story):
+                if entry['role'] == 'You':
+                    latest_messages[idx] = entry
+                else:
+                    # สำหรับข้อความของ AI ให้แสดงทุกข้อความ
+                    latest_messages[idx] = entry
+            
+            # แสดงข้อความที่ไม่ซ้ำ
+            for idx, entry in latest_messages.items():
+                if entry['role'] == 'AI':
+                    if entry.get('is_starter'):
+                        # แสดงประโยคเริ่มต้นพิเศษ
+                        st.markdown(f"""
+                            <div style="background-color: #f0f7ff; 
+                                      padding: 15px; 
+                                      border-radius: 8px; 
+                                      margin: 5px 0;
+                                      border-left: 4px solid #1e88e5;">
+                                <p style="color: #1e88e5; margin-bottom: 5px;">🎬 เริ่มเรื่อง:</p>
+                                <p style="color: #666;">{entry.get('thai_content', '')}</p>
+                                <p>{entry['content']}</p>
+                            </div>
+                        """, unsafe_allow_html=True)
+                    else:
+                        st.markdown(f"""
+                            <div style="padding: 10px; margin: 5px 0;">
+                                <p>🤖 AI: {entry['content']}</p>
+                            </div>
+                        """, unsafe_allow_html=True)
+                elif entry['role'] == 'You':
+                    status_icon = "✅ " if entry.get('is_correct') else "✍️ "
+                    if entry.get('is_corrected'):
+                        # แสดงข้อความที่ถูกแก้ไขแล้ว
+                        st.markdown(f"""
+                            <div style="padding: 10px; margin: 5px 0; background-color: #f0f9ff; border-radius: 5px;">
+                                <p>👤 You: {status_icon}{entry['content']}</p>
+                            </div>
+                        """, unsafe_allow_html=True)
+                    else:
+                        # แสดงข้อความปกติ
+                        st.markdown(f"""
+                            <div style="padding: 10px; margin: 5px 0;">
+                                <p>👤 You: {status_icon}{entry['content']}</p>
+                            </div>
+                        """, unsafe_allow_html=True)
+
 # แสดงผลคะแนนและความสำเร็จ
 def show_achievements():
     """แสดงความสำเร็จและสถิติ"""