feat: transform custom UI into an intelligent Agent Learning dashboard with progress metrics and reasoning

server/app.py

@@ -38,36 +38,103 @@ if ENABLE_WEB_INTERFACE:
         def build_progress_dashboard(web_manager, action_fields, metadata, is_chat_env, title, quick_start_md):
             import gradio as gr
             with gr.Blocks() as blocks:
-                gr.Markdown("## 📈 Live Reward Tracking Dashboard")
+                gr.Markdown("## 🤖 Agent Learning Dashboard")
                 gr.Markdown(
-                    "This dashboard visualizes the learning progress over the current episode. "
-                    "Because this is an RLHF environment, you want to see the agent's reward signal maximize towards 1.0! "
-                    "Rewards are computed via gold-standard dataset grounding."
+                    "This dashboard transforms the basic interface into an intelligent view of the RLHF agent's decision-making process. "
+                    "You can observe reward signals, evaluation rationale, and training progression."
                 )
 
-                reward_plot = gr.LinePlot(
-                    x="Step", 
-                    y="Reward",
-                    title="Reward Curve (Current Episode)",
-                    tooltip=["Step", "Reward"],
-                    y_lim=[0.0, 1.0]
-                )
-
-                def get_chart_data():
+                with gr.Row():
+                    with gr.Column(scale=2):
+                        reward_plot = gr.LinePlot(
+                            x="Step", 
+                            y="Reward",
+                            title="Learning Progress (Agent Improving Over Time)",
+                            tooltip=["Step", "Reward"],
+                            x_title="Episode Step",
+                            y_title="Reward",
+                            y_lim=[0.0, 1.0]
+                        )
+                        
+                        with gr.Row():
+                            reward_explanation = gr.Textbox(label="Reward Explanation", lines=2)
+                            improvement_tip = gr.Textbox(label="Agent Suggestion", lines=2)
+                            
+                    with gr.Column(scale=1):
+                        refresh_btn = gr.Button("🔄 Sync Agent State", variant="primary")
+                        
+                        agent_thinking = gr.Markdown(
+                            "### Agent Process:\n"
+                            "- 🔍 Understanding input\n"
+                            "- ⚖️ Comparing responses\n"
+                            "- 🎯 Evaluating alignment\n"
+                            "- 🏅 Assigning reward\n"
+                        )
+                        
+                        dataset_vis = gr.HTML("Dataset: <b>...</b>")
+                        session_summary = gr.Markdown("### Session Summary\n_Episode ongoing..._")
+
+                def update_dashboard():
                     import pandas as pd
                     logs = getattr(web_manager.episode_state, "action_logs", [])
-                    if not logs:
-                        return pd.DataFrame({"Step": [], "Reward": []})
                     
                     data = []
                     for log in logs:
                         if getattr(log, "reward", None) is not None:
                             data.append({"Step": getattr(log, "step_count", 0), "Reward": float(log.reward)})
-                    return pd.DataFrame(data)
+                            
+                    # Always ensure graph shows at least one point
+                    if not data:
+                        df = pd.DataFrame({"Step": [0], "Reward": [0.0]})
+                        return df, "Awaiting first agent action...", "Waiting...", "Dataset: <b>Pending</b>", "### Episode Summary\n_No steps yet._"
+                        
+                    df = pd.DataFrame(data)
+                    latest_reward = data[-1]["Reward"]
+                    latest_step = data[-1]["Step"]
+                    
+                    # Explain reward
+                    if latest_reward > 0.8:
+                        exp = "High quality response, well aligned with user intent"
+                        tip = "Try making the response more concise"
+                    elif latest_reward > 0.5:
+                        exp = "Decent response but can be improved in clarity"
+                        tip = "Improve structure and clarity"
+                    else:
+                        exp = "Poor response, lacks relevance or correctness"
+                        tip = "Focus on relevance and correctness"
+
+                    # Extract dataset name
+                    last_log = logs[-1]
+                    info = {}
+                    if hasattr(last_log, "observation") and last_log.observation is not None:
+                        if hasattr(last_log.observation, "info"):
+                            info = last_log.observation.info
+                        elif hasattr(last_log.observation, "model_extra") and last_log.observation.model_extra:
+                            info = last_log.observation.model_extra.get("info", {})
+                            
+                    dataset_str = info.get("dataset", "Synthetic / Unknown") if isinstance(info, dict) else "Unknown"
+
+                    # Session summary metrics
+                    initial_reward = data[0]["Reward"]
+                    improvement = 0.0
+                    if initial_reward > 0:
+                        improvement = ((latest_reward - initial_reward) / initial_reward) * 100
+                    
+                    summary = (
+                        f"### Episode Summary\n"
+                        f"- **Final Reward:** {latest_reward:.2f}\n"
+                        f"- **Improvement:** {improvement:+.1f}%\n"
+                        f"- **Steps:** {latest_step}"
+                    )
+                    
+                    return df, exp, tip, f"Dataset: <b>{dataset_str.upper()}</b>", summary
 
-                # Polling every 1 second to update the UI using Gradio 4.x gr.Timer
-                timer = gr.Timer(1)
-                timer.tick(get_chart_data, inputs=None, outputs=reward_plot)
+                # Manual safe refresh mapping
+                refresh_btn.click(
+                    fn=update_dashboard,
+                    inputs=None,
+                    outputs=[reward_plot, reward_explanation, improvement_tip, dataset_vis, session_summary]
+                )
             return blocks
 
         # Mounts the Gradio playground at /web and redirects / → /web/