Update app.py

app.py

@@ -1,4 +1,4 @@
-# app.py - Complete fixed version with version consistency
+# app.py - Complete fixed version with Plotly compatibility
 # 🚀 ARF Ultimate Investor Demo v3.3.9 - ENTERPRISE EDITION
 # Enhanced with clear OSS vs Enterprise boundaries
 
@@ -301,21 +301,24 @@ def get_installation_status():
     return _installation_status
 
 # ===========================================
-# FIXED VISUALIZATION FUNCTIONS - MINIMAL FIXES ONLY
+# PLOTLY CONFIGURATION FOR GRADIO COMPATIBILITY
 # ===========================================
-
 import plotly.graph_objects as go
 import plotly.express as px
+import plotly.io as pio
 import pandas as pd
 import numpy as np
 
+# Configure Plotly for Gradio compatibility
+pio.templates.default = "plotly_white"
+logger.info("✅ Plotly configured for Gradio compatibility")
+
 # ===========================================
-# SURGICAL FIX 1: create_simple_telemetry_plot()
+# ENHANCED VISUALIZATION FUNCTIONS WITH GRADIO COMPATIBILITY
 # ===========================================
 def create_simple_telemetry_plot(scenario_name: str, is_real_arf: bool = True) -> go.Figure:
     """
-    MINIMAL FIX: Returns Plotly figure instead of HTML string
-    FIXED: Removed font weight properties, returns valid Plotly figure
+    FIXED: Enhanced for Gradio compatibility with better error handling
     """
     try:
         # Generate sample telemetry data
@@ -362,7 +365,9 @@ def create_simple_telemetry_plot(scenario_name: str, is_real_arf: bool = True) -
             y=data[:30],
             mode='lines',
             name='Normal',
-            line=dict(color='#10b981', width=3)
+            line=dict(color='#10b981', width=3),
+            fill='tozeroy',
+            fillcolor='rgba(16, 185, 129, 0.1)'
         ))
         
         # Add anomaly region
@@ -374,45 +379,47 @@ def create_simple_telemetry_plot(scenario_name: str, is_real_arf: bool = True) -
             line=dict(color='#ef4444', width=3)
         ))
         
-        # Add threshold line - FIXED: Simplified without problematic properties
+        # Add threshold line
         fig.add_hline(y=threshold, line_dash="dash", 
-                     line_color="#f59e0b")
+                     line_color="#f59e0b",
+                     annotation_text="Alert Threshold",
+                     annotation_position="top right")
         
-        # Update layout - FIXED: Using only 'size' not 'weight' in font
+        # Update layout - FIXED: Simplified for Gradio compatibility
         fig.update_layout(
             title={
                 'text': title,
-                'font': {'size': 18, 'color': '#1e293b'},
+                'font': dict(size=18, color='#1e293b', family="Arial, sans-serif"),
                 'x': 0.5
             },
             xaxis_title="Time",
             yaxis_title=y_label,
             height=300,
-            margin=dict(l=20, r=20, t=40, b=20),
+            margin=dict(l=40, r=20, t=50, b=40),
             plot_bgcolor='white',
-            showlegend=True
+            paper_bgcolor='white',
+            showlegend=True,
+            hovermode='x unified'
         )
         
+        logger.info(f"✅ Created telemetry plot for {scenario_name}")
         return fig
         
     except Exception as e:
         logger.error(f"Error creating telemetry plot: {e}")
-        # Return empty figure as fallback
+        # Return a simple valid Plotly figure as fallback
         fig = go.Figure()
+        fig.add_trace(go.Scatter(x=[0, 1], y=[0, 1], mode='lines', name='Fallback'))
         fig.update_layout(
-            title="Error loading telemetry",
+            title=f"Telemetry: {scenario_name}",
             height=300,
             plot_bgcolor='white'
         )
         return fig
 
-# ===========================================
-# SURGICAL FIX 2: create_simple_impact_plot()
-# ===========================================
 def create_simple_impact_plot(scenario_name: str, is_real_arf: bool = True) -> go.Figure:
     """
-    MINIMAL FIX: Returns Plotly figure (gauge chart) instead of HTML string
-    FIXED: Removed problematic font properties, simplified gauge
+    FIXED: Enhanced for Gradio compatibility
     """
     try:
         # Impact values based on scenario
@@ -427,15 +434,22 @@ def create_simple_impact_plot(scenario_name: str, is_real_arf: bool = True) -> g
         
         impact = impact_values.get(scenario_name, 5000)
         
-        # Create gauge chart - FIXED: Simplified without problematic properties
+        # Create gauge chart - FIXED: Enhanced for Gradio
         fig = go.Figure(go.Indicator(
             mode="gauge+number",
             value=impact,
             domain={'x': [0, 1], 'y': [0, 1]},
-            title={'text': f"Revenue Impact: ${impact:,}/hour"},
-            number={'prefix': "$", 'suffix': "/hour"},
+            title={
+                'text': f"Revenue Impact: ${impact:,}/hour",
+                'font': dict(size=16, family="Arial, sans-serif")
+            },
+            number={
+                'prefix': "$", 
+                'suffix': "/hour",
+                'font': dict(size=28, family="Arial, sans-serif")
+            },
             gauge={
-                'axis': {'range': [None, impact * 1.2]},
+                'axis': {'range': [None, impact * 1.2], 'tickwidth': 1},
                 'bar': {'color': "#ef4444"},
                 'bgcolor': "white",
                 'borderwidth': 2,
@@ -444,63 +458,90 @@ def create_simple_impact_plot(scenario_name: str, is_real_arf: bool = True) -> g
                     {'range': [0, impact * 0.3], 'color': '#10b981'},
                     {'range': [impact * 0.3, impact * 0.7], 'color': '#f59e0b'},
                     {'range': [impact * 0.7, impact], 'color': '#ef4444'}
-                ]
+                ],
+                'threshold': {
+                    'line': {'color': "black", 'width': 4},
+                    'thickness': 0.75,
+                    'value': impact
+                }
             }
         ))
         
-        # Update layout - FIXED: Simplified layout
+        # Update layout - FIXED: Enhanced for Gradio
         fig.update_layout(
             height=400,
-            margin=dict(l=20, r=20, t=60, b=20),
-            paper_bgcolor='white'
+            margin=dict(l=30, r=30, t=70, b=30),
+            paper_bgcolor='white',
+            font=dict(family="Arial, sans-serif")
         )
         
+        logger.info(f"✅ Created impact plot for {scenario_name}")
         return fig
         
     except Exception as e:
         logger.error(f"Error creating impact plot: {e}")
-        # Return empty gauge as fallback
+        # Return a simple valid gauge as fallback
         fig = go.Figure(go.Indicator(
             mode="gauge",
             value=0,
-            title="Error loading impact data"
+            title={'text': "Impact (fallback)"}
         ))
         fig.update_layout(height=400)
         return fig
 
-# ===========================================
-# SURGICAL FIX 3: create_empty_plot()
-# ===========================================
 def create_empty_plot(title: str, is_real_arf: bool = True) -> go.Figure:
     """
-    MINIMAL FIX: Returns Plotly figure (placeholder) instead of HTML string
-    FIXED: Simplified font properties
+    FIXED: Enhanced for Gradio compatibility
     """
-    fig = go.Figure()
-    
-    # Add text annotation - FIXED: Simplified font
-    fig.add_annotation(
-        x=0.5, y=0.5,
-        text=title,
-        showarrow=False,
-        font={'size': 16, 'color': "#64748b"},
-        xref="paper",
-        yref="paper"
-    )
-    
-    fig.update_layout(
-        title={
-            'text': "Visualization Placeholder",
-            'font': {'size': 14, 'color': "#94a3b8"}
-        },
-        height=300,
-        plot_bgcolor='white',
-        xaxis={'visible': False},
-        yaxis={'visible': False},
-        margin=dict(l=20, r=20, t=40, b=20)
-    )
-    
-    return fig
+    try:
+        fig = go.Figure()
+        
+        # Add text annotation - FIXED: Enhanced
+        fig.add_annotation(
+            x=0.5, y=0.5,
+            text=title,
+            showarrow=False,
+            font=dict(size=18, color="#64748b", family="Arial, sans-serif"),
+            xref="paper",
+            yref="paper"
+        )
+        
+        # Add boundary indicator if needed
+        if is_real_arf:
+            fig.add_annotation(
+                x=0.02, y=0.98,
+                text="✅ REAL ARF",
+                showarrow=False,
+                font=dict(size=12, color="#10b981", family="Arial, sans-serif"),
+                xref="paper",
+                yref="paper",
+                bgcolor="white",
+                bordercolor="#10b981",
+                borderwidth=1,
+                borderpad=4
+            )
+        
+        fig.update_layout(
+            title={
+                'text': "Visualization Placeholder",
+                'font': dict(size=14, color="#94a3b8", family="Arial, sans-serif")
+            },
+            height=300,
+            plot_bgcolor='white',
+            paper_bgcolor='white',
+            xaxis={'visible': False},
+            yaxis={'visible': False},
+            margin=dict(l=20, r=20, t=50, b=20)
+        )
+        
+        return fig
+        
+    except Exception as e:
+        logger.error(f"Error creating empty plot: {e}")
+        # Ultra-simple fallback
+        fig = go.Figure()
+        fig.update_layout(height=300)
+        return fig
 
 # Keep the HTML fallback functions for other uses
 def create_html_telemetry_fallback(scenario_name: str, is_real_arf: bool) -> str:
@@ -1485,11 +1526,11 @@ def extract_roi_multiplier(roi_result: Dict) -> float:
         return 5.2
 
 # ===========================================
-# SURGICAL FIX 4: update_scenario_display()
+# SURGICAL FIX: update_scenario_display() - ENHANCED
 # ===========================================
 def update_scenario_display(scenario_name: str) -> tuple:
     """
-    FIXED: Returns exactly 4 values as expected by UI:
+    ENHANCED: Returns Plotly figures with better Gradio compatibility
     1. scenario_card_html (HTML string)
     2. telemetry_fig (Plotly figure from create_simple_telemetry_plot())
     3. impact_fig (Plotly figure from create_simple_impact_plot())
@@ -1574,15 +1615,16 @@ def update_scenario_display(scenario_name: str) -> tuple:
     </div>
     """
     
-    # Get visualizations as Plotly figures (FIXED)
+    # Get visualizations as Plotly figures (ENHANCED)
     telemetry_fig = create_simple_telemetry_plot(scenario_name, settings.use_true_arf)
     impact_fig = create_simple_impact_plot(scenario_name, settings.use_true_arf)
     timeline_fig = create_empty_plot(f"Timeline: {scenario_name}", settings.use_true_arf)
     
+    logger.info(f"✅ Updated scenario display for {scenario_name} with Plotly figures")
     return scenario_card_html, telemetry_fig, impact_fig, timeline_fig
 
 # ===========================================
-# SURGICAL FIX 5: run_true_arf_analysis() - FIXED to return DataFrames
+# SURGICAL FIX: run_true_arf_analysis() - FIXED to return DataFrames
 # ===========================================
 @AsyncRunner.async_to_sync
 async def run_true_arf_analysis(scenario_name: str) -> tuple:
@@ -1905,11 +1947,11 @@ def execute_enterprise_healing(scenario_name, approval_required, mcp_mode_value)
     return approval_display, enterprise_results, execution_df
 
 # ===========================================
-# FIXED ROI FUNCTION
+# FIXED ROI FUNCTION - Enhanced for Gradio
 # ===========================================
 def calculate_roi(scenario_name, monthly_incidents, team_size):
     """
-    MINIMAL FIX: Returns (JSON/dict, Plotly figure) for ROI calculation
+    ENHANCED: Returns (JSON/dict, Plotly figure) for ROI calculation with Gradio compatibility
     """
     components = get_components()
     
@@ -1945,7 +1987,7 @@ def calculate_roi(scenario_name, monthly_incidents, team_size):
             "boundary_note": "ROI calculation includes OSS advisory value and simulated Enterprise execution benefits"
         }
     
-    # Create ROI chart as Plotly figure (FIXED)
+    # Create ROI chart as Plotly figure (ENHANCED for Gradio)
     categories = ['Without ARF', 'With ARF', 'Net Savings']
     annual_impact_val = impact_per_incident * monthly_incidents * 12 if 'impact_per_incident' in locals() else 1000000
     potential_savings_val = potential_savings if 'potential_savings' in locals() else 820000
@@ -1963,11 +2005,19 @@ def calculate_roi(scenario_name, monthly_incidents, team_size):
     ])
     
     fig.update_layout(
-        title=f"ROI Analysis: {scenario_name}",
+        title={
+            'text': f"ROI Analysis: {scenario_name}",
+            'font': dict(size=18, color='#1e293b', family="Arial, sans-serif")
+        },
         height=400,
-        showlegend=False
+        plot_bgcolor='white',
+        paper_bgcolor='white',
+        showlegend=False,
+        margin=dict(l=40, r=20, t=60, b=40)
     )
     
+    logger.info(f"✅ Created ROI plot for {scenario_name}")
+    
     # Return both the dict and the Plotly figure
     return roi_result, fig