Update app.py

app.py

@@ -7,21 +7,22 @@ import os
 from datetime import datetime
 from streamlit_flow import streamlit_flow
 from streamlit_flow.elements import StreamlitFlowNode, StreamlitFlowEdge
-from streamlit_flow.layouts import TreeLayout, RadialLayout
+from streamlit_flow.layouts import TreeLayout
 
-# Set page configuration to wide mode
+# 1. Configuration
 Site_Name = '🦁CatRider🐈'
-title = "🦁CatRider🐈by👤Aaron Wacker"
-helpURL = 'https://huggingface.co/awacke1'
-bugURL = 'https://huggingface.co/spaces/awacke1'
-icons = '🦁'
+title="🦁CatRider🐈by👤Aaron Wacker"
+helpURL='https://huggingface.co/awacke1'
+bugURL='https://huggingface.co/spaces/awacke1'
+icons='🦁'
 
-useConfig = True
-if useConfig:
+useConfig=True
+if useConfig: # Component code - useConfig=False should allow it to work if re-evaluating UI elements due to code modify
     st.set_page_config(
         page_title=title,
         page_icon=icons,
         layout="wide",
+        #initial_sidebar_state="expanded",
         initial_sidebar_state="auto",
         menu_items={
             'Get Help': helpURL,
@@ -30,6 +31,7 @@ if useConfig:
         }
     )
 
+
 # 🐱 Cat Rider and Gear Data
 CAT_RIDERS = [
     {"name": "Whiskers", "type": "Speed", "emoji": "🐾", "strength": 3, "skill": 7},
@@ -168,13 +170,14 @@ def update_character_stats(game_state, outcome):
     return game_state
 
 # 🌳 Journey Visualization
-def create_knowledge_graph(history_df):
+def create_heterogeneous_graph(history_df):
     nodes = []
     edges = []
     node_ids = {}
     for index, row in history_df.iterrows():
-        situation_node_id = f"situation_{row['situation_id']}"
-        action_node_id = f"action_{index}"
+        situation_node_id = f"situation_{row['situation_id']}_{row['attempt']}"
+        action_node_id = f"action_{row['action_id']}_{index}"
+        outcome_node_id = f"outcome_{index}"
 
         # Situation node
         if situation_node_id not in node_ids:
@@ -183,44 +186,66 @@ def create_knowledge_graph(history_df):
                 pos=(0, 0),
                 data={'content': f"{row['situation_emoji']} {row['situation_name']}"},
                 type='default',
+                sourcePosition='bottom',
+                targetPosition='top',
                 shape='ellipse'
             )
             nodes.append(situation_node)
             node_ids[situation_node_id] = situation_node_id
 
-        # Attempt node (action and outcome)
+        # Action node
+        action_node = StreamlitFlowNode(
+            action_node_id,
+            pos=(0, 0),
+            data={'content': f"{row['action_emoji']} {row['action_name']}"},
+            type='default',
+            sourcePosition='bottom',
+            targetPosition='top',
+            shape='ellipse'
+        )
+        nodes.append(action_node)
+
+        # Outcome node with success celebration
         outcome_content = '✅ Success' if row['outcome'] else '❌ Failure'
         stars = '⭐' * int(row['score'])
-        attempt_node = StreamlitFlowNode(
-            action_node_id,
+        outcome_node = StreamlitFlowNode(
+            outcome_node_id,
             pos=(0, 0),
-            data={'content': f"{row['action_emoji']} {row['action_name']} ({outcome_content})\n{row['conclusion']}\n{stars}"},
+            data={'content': f"{row['conclusion']}\n{outcome_content}\n{stars}"},
             type='default',
-            shape='rectangle'
+            sourcePosition='bottom',
+            targetPosition='top',
+            shape='ellipse'
         )
-        nodes.append(attempt_node)
+        nodes.append(outcome_node)
 
-        # Edge from situation to attempt
+        # Edges
         edges.append(StreamlitFlowEdge(
-            id=f"edge_{situation_node_id}_{action_node_id}",
+            id=f"edge_{situation_node_id}_{action_node_id}_{index}",
             source=situation_node_id,
             target=action_node_id,
             animated=True
         ))
+        edges.append(StreamlitFlowEdge(
+            id=f"edge_{action_node_id}_{outcome_node_id}_{index}",
+            source=action_node_id,
+            target=outcome_node_id,
+            animated=True
+        ))
 
     return nodes, edges
 
 # 📝 Markdown Preview with Subpoints for Each Action
 def create_markdown_preview(history_df):
     markdown = "## 🌳 Journey Preview\n\n"
-    grouped = history_df.groupby(['situation_name'], sort=False)
+    grouped = history_df.groupby(['situation_name', 'attempt'], sort=False)
 
-    for situation_name, group in grouped:
-        markdown += f"### {group.iloc[0]['situation_emoji']} **{situation_name}**\n"
+    for (situation_name, attempt), group in grouped:
+        markdown += f"### {group.iloc[0]['situation_emoji']} **{situation_name}** (Attempt {attempt})\n"
         for _, row in group.iterrows():
             outcome_str = '✅ Success' if row['outcome'] else '❌ Failure'
             stars = '⭐' * int(row['score'])
-            markdown += f"- Attempt {row['attempt']}: {row['action_emoji']} **{row['action_name']}**: {outcome_str} {stars}\n"
+            markdown += f"- {row['action_emoji']} **{row['action_name']}**: {outcome_str} {stars}\n"
             markdown += f"  - {row['conclusion']}\n"
         markdown += "\n"
     return markdown
@@ -429,9 +454,9 @@ def main():
             # 📝 Display Markdown Preview
             st.markdown(create_markdown_preview(game_state['history_df']))
 
-            # 🌳 Display Knowledge Journey Graph
-            st.markdown("## 🌳 Your Journey (Knowledge Graph)")
-            nodes, edges = create_knowledge_graph(game_state['history_df'])
+            # 🌳 Display Heterogeneous Journey Graph
+            st.markdown("## 🌳 Your Journey (Heterogeneous Graph)")
+            nodes, edges = create_heterogeneous_graph(game_state['history_df'])
             try:
                 streamlit_flow('cat_rider_flow',
                                nodes,
@@ -470,4 +495,3 @@ def main():
 
 if __name__ == "__main__":
     main()
-