Update app.py

app.py

@@ -57,120 +57,153 @@ class SAPARPredictor:
     
     def train_model(self, progress=gr.Progress()):
         """Train the ML model with progress tracking"""
-        progress(0, desc="Generating synthetic data...")
-        
-        # Generate training data
-        df = self.generate_synthetic_data(1000)
-        time.sleep(1)  # Simulate data generation time
-        
-        progress(0.1, desc="Preparing features and labels...")
-        
-        # Prepare features and labels
-        feature_columns = ['invoice_amount', 'days_overdue', 'previous_delays', 
-                          'credit_score', 'industry_risk', 'seasonality']
-        X = df[feature_columns].values
-        y = df['paid_on_time'].values
-        
-        # Split data
-        X_train, X_test, y_train, y_test = train_test_split(X, y, test_size=0.2, random_state=42)
-        
-        progress(0.2, desc="Building neural network...")
-        
-        # Create model
-        self.model = tf.keras.Sequential([
-            tf.keras.layers.Dense(32, activation='relu', input_shape=(6,)),
-            tf.keras.layers.Dropout(0.2),
-            tf.keras.layers.Dense(16, activation='relu'),
-            tf.keras.layers.Dropout(0.2),
-            tf.keras.layers.Dense(1, activation='sigmoid')
-        ])
-        
-        self.model.compile(
-            optimizer=tf.keras.optimizers.Adam(0.001),
-            loss='binary_crossentropy',
-            metrics=['accuracy']
-        )
-        
-        progress(0.3, desc="Training model...")
-        
-        # Train model
-        history = self.model.fit(
-            X_train, y_train,
-            epochs=50,
-            batch_size=32,
-            validation_split=0.2,
-            verbose=0
-        )
-        
-        progress(0.8, desc="Evaluating model...")
-        
-        # Make predictions on test set
-        y_pred_proba = self.model.predict(X_test)
-        y_pred = (y_pred_proba > 0.5).astype(int)
-        
-        # Calculate metrics
-        accuracy = accuracy_score(y_test, y_pred)
-        precision = precision_score(y_test, y_pred)
-        recall = recall_score(y_test, y_pred)
-        f1 = f1_score(y_test, y_pred)
-        
-        self.training_history = history.history
-        self.is_trained = True
-        
-        progress(1.0, desc="Training completed!")
-        
-        # Create training visualization
-        fig = go.Figure()
-        
-        epochs = list(range(1, len(history.history['accuracy']) + 1))
-        
-        fig.add_trace(go.Scatter(
-            x=epochs,
-            y=history.history['accuracy'],
-            mode='lines+markers',
-            name='Training Accuracy',
-            line=dict(color='#007bff', width=3),
-            marker=dict(size=6)
-        ))
-        
-        fig.add_trace(go.Scatter(
-            x=epochs,
-            y=history.history['val_accuracy'],
-            mode='lines+markers',
-            name='Validation Accuracy',
-            line=dict(color='#28a745', width=3),
-            marker=dict(size=6)
-        ))
-        
-        fig.update_layout(
-            title='Model Training Progress',
-            xaxis_title='Epoch',
-            yaxis_title='Accuracy',
-            template='plotly_white',
-            height=400,
-            hovermode='x unified'
-        )
-        
-        # Create metrics summary
-        metrics_text = f"""
-        ## 🎯 Model Performance Metrics
-        
-        - **Accuracy**: {accuracy:.1%}
-        - **Precision**: {precision:.1%}
-        - **Recall**: {recall:.1%}
-        - **F1 Score**: {f1:.1%}
-        
-        ✅ Model trained successfully on 1,000 synthetic SAP AR records!
-        """
-        
-        return fig, metrics_text, gr.update(interactive=True)
+        try:
+            progress(0, desc="🔄 Generating synthetic data...")
+            
+            # Generate training data
+            df = self.generate_synthetic_data(1000)
+            time.sleep(0.5)  # Simulate data generation time
+            
+            progress(0.2, desc="📊 Preparing features and labels...")
+            
+            # Prepare features and labels
+            feature_columns = ['invoice_amount', 'days_overdue', 'previous_delays', 
+                              'credit_score', 'industry_risk', 'seasonality']
+            X = df[feature_columns].values
+            y = df['paid_on_time'].values
+            
+            # Split data
+            X_train, X_test, y_train, y_test = train_test_split(X, y, test_size=0.2, random_state=42)
+            
+            progress(0.3, desc="🧠 Building neural network...")
+            
+            # Create model
+            self.model = tf.keras.Sequential([
+                tf.keras.layers.Dense(32, activation='relu', input_shape=(6,)),
+                tf.keras.layers.Dropout(0.2),
+                tf.keras.layers.Dense(16, activation='relu'),
+                tf.keras.layers.Dropout(0.2),
+                tf.keras.layers.Dense(1, activation='sigmoid')
+            ])
+            
+            self.model.compile(
+                optimizer=tf.keras.optimizers.Adam(0.001),
+                loss='binary_crossentropy',
+                metrics=['accuracy']
+            )
+            
+            progress(0.4, desc="🎯 Training model (50 epochs)...")
+            
+            # Train model
+            history = self.model.fit(
+                X_train, y_train,
+                epochs=50,
+                batch_size=32,
+                validation_split=0.2,
+                verbose=0
+            )
+            
+            progress(0.8, desc="📈 Evaluating model performance...")
+            
+            # Make predictions on test set
+            y_pred_proba = self.model.predict(X_test, verbose=0)
+            y_pred = (y_pred_proba > 0.5).astype(int)
+            
+            # Calculate metrics
+            accuracy = accuracy_score(y_test, y_pred)
+            precision = precision_score(y_test, y_pred)
+            recall = recall_score(y_test, y_pred)
+            f1 = f1_score(y_test, y_pred)
+            
+            self.training_history = history.history
+            self.is_trained = True
+            
+            progress(1.0, desc="✅ Training completed successfully!")
+            
+            # Create training visualization
+            fig = go.Figure()
+            
+            epochs = list(range(1, len(history.history['accuracy']) + 1))
+            
+            fig.add_trace(go.Scatter(
+                x=epochs,
+                y=history.history['accuracy'],
+                mode='lines+markers',
+                name='Training Accuracy',
+                line=dict(color='#007bff', width=4),
+                marker=dict(size=8)
+            ))
+            
+            fig.add_trace(go.Scatter(
+                x=epochs,
+                y=history.history['val_accuracy'],
+                mode='lines+markers',
+                name='Validation Accuracy',
+                line=dict(color='#28a745', width=4),
+                marker=dict(size=8)
+            ))
+            
+            fig.update_layout(
+                title={
+                    'text': '📊 Model Training Progress',
+                    'x': 0.5,
+                    'font': {'size': 20}
+                },
+                xaxis_title='Epoch',
+                yaxis_title='Accuracy',
+                template='plotly_white',
+                height=450,
+                hovermode='x unified',
+                legend=dict(
+                    yanchor="bottom",
+                    y=0.02,
+                    xanchor="right",
+                    x=0.98
+                )
+            )
+            
+            # Create metrics cards HTML
+            metrics_html = f"""
+            <div style="display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin: 20px 0;">
+                <div style="background: linear-gradient(135deg, #007bff, #0056b3); color: white; padding: 20px; border-radius: 15px; text-align: center; box-shadow: 0 4px 15px rgba(0,123,255,0.3);">
+                    <div style="font-size: 2.5rem; font-weight: bold; margin-bottom: 5px;">{accuracy:.1%}</div>
+                    <div style="font-size: 1.1rem;">🎯 Accuracy</div>
+                </div>
+                <div style="background: linear-gradient(135deg, #28a745, #20c997); color: white; padding: 20px; border-radius: 15px; text-align: center; box-shadow: 0 4px 15px rgba(40,167,69,0.3);">
+                    <div style="font-size: 2.5rem; font-weight: bold; margin-bottom: 5px;">{precision:.1%}</div>
+                    <div style="font-size: 1.1rem;">🎯 Precision</div>
+                </div>
+                <div style="background: linear-gradient(135deg, #ffc107, #fd7e14); color: white; padding: 20px; border-radius: 15px; text-align: center; box-shadow: 0 4px 15px rgba(255,193,7,0.3);">
+                    <div style="font-size: 2.5rem; font-weight: bold; margin-bottom: 5px;">{recall:.1%}</div>
+                    <div style="font-size: 1.1rem;">📊 Recall</div>
+                </div>
+                <div style="background: linear-gradient(135deg, #17a2b8, #138496); color: white; padding: 20px; border-radius: 15px; text-align: center; box-shadow: 0 4px 15px rgba(23,162,184,0.3);">
+                    <div style="font-size: 2.5rem; font-weight: bold; margin-bottom: 5px;">{f1:.1%}</div>
+                    <div style="font-size: 1.1rem">⚖️ F1 Score</div>
+                </div>
+            </div>
+            <div style="background: #d4edda; border: 1px solid #c3e6cb; color: #155724; padding: 15px; border-radius: 10px; margin-top: 15px; text-align: center;">
+                <strong>✅ Model trained successfully on 1,000 synthetic SAP AR records!</strong><br>
+                <em>The model is now ready to make predictions on unpaid invoices.</em>
+            </div>
+            """
+            
+            return fig, metrics_html, gr.update(interactive=True, variant="primary")
+        
+        except Exception as e:
+            error_html = f"""
+            <div style="background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; padding: 15px; border-radius: 10px; text-align: center;">
+                <strong>❌ Training failed:</strong> {str(e)}
+            </div>
+            """
+            return None, error_html, gr.update(interactive=False)
     
     def generate_unpaid_invoices(self):
         """Generate sample unpaid invoices for prediction"""
         customers = ['SAP-CUST001', 'SAP-CUST002', 'SAP-CUST003', 'SAP-CUST004', 'SAP-CUST005']
         
         invoices = []
-        for i in range(15):
+        for i in range(12):
             invoice_id = f"INV-{datetime.now().strftime('%Y%m%d')}-{i:03d}"
             customer = random.choice(customers)
             amount = random.randint(5000, 50000)
@@ -194,63 +227,123 @@ class SAPARPredictor:
     def make_predictions(self):
         """Make predictions on unpaid invoices"""
         if not self.is_trained:
-            return None, "❌ Please train the model first!"
-        
-        # Generate unpaid invoices
-        df = self.generate_unpaid_invoices()
-        
-        # Prepare features for prediction
-        features = []
-        for _, row in df.iterrows():
-            features.append([
-                row['Amount ($)'] / 50000,  # Normalize
-                row['Days Overdue'] / 120,  # Normalize
-                row['Previous Delays'] / 5,  # Normalize
-                row['Credit Score'] / 100,  # Normalize
-                row['Industry Risk'],
-                row['Seasonality']
-            ])
-        
-        # Make predictions
-        predictions = self.model.predict(np.array(features))
-        
-        # Add predictions to dataframe
-        df['Payment Probability'] = [f"{p[0]:.1%}" for p in predictions]
-        df['Prediction'] = ['✅ Will Pay' if p[0] > 0.5 else '❌ Risk of Default' for p in predictions]
-        df['Risk Level'] = ['🟢 Low' if p[0] > 0.7 else '🟡 Medium' if p[0] > 0.4 else '🔴 High' for p in predictions]
-        
-        # Format amount column
-        df['Amount ($)'] = df['Amount ($)'].apply(lambda x: f"${x:,}")
-        
-        # Create probability distribution chart
-        prob_values = [p[0] for p in predictions]
-        
-        fig = go.Figure(data=[
-            go.Histogram(
+            error_msg = """
+            <div style="background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; padding: 15px; border-radius: 10px; text-align: center;">
+                <strong>❌ Please train the model first!</strong><br>
+                <em>Go to the Model Training tab and click "Train ML Model"</em>
+            </div>
+            """
+            return None, error_msg, None
+        
+        try:
+            # Generate unpaid invoices
+            df = self.generate_unpaid_invoices()
+            
+            # Prepare features for prediction
+            features = []
+            for _, row in df.iterrows():
+                features.append([
+                    row['Amount ($)'] / 50000,  # Normalize
+                    row['Days Overdue'] / 120,  # Normalize
+                    row['Previous Delays'] / 5,  # Normalize
+                    row['Credit Score'] / 100,  # Normalize
+                    row['Industry Risk'],
+                    row['Seasonality']
+                ])
+            
+            # Make predictions
+            predictions = self.model.predict(np.array(features), verbose=0)
+            
+            # Create results dataframe with better formatting
+            results_df = df.copy()
+            prob_values = [p[0] for p in predictions]
+            
+            # Add prediction columns
+            results_df['Payment Probability'] = [f"{p:.1%}" for p in prob_values]
+            results_df['Prediction'] = ['✅ Will Pay' if p > 0.5 else '❌ Risk of Default' for p in prob_values]
+            results_df['Risk Level'] = ['🟢 Low Risk' if p > 0.7 else '🟡 Medium Risk' if p > 0.4 else '🔴 High Risk' for p in prob_values]
+            
+            # Format amount column
+            results_df['Amount ($)'] = results_df['Amount ($)'].apply(lambda x: f"${x:,}")
+            
+            # Reorder columns for better display
+            column_order = ['Invoice ID', 'Customer', 'Amount ($)', 'Days Overdue', 'Credit Score', 
+                           'Payment Probability', 'Prediction', 'Risk Level']
+            results_df = results_df[column_order]
+            
+            # Create probability distribution chart
+            fig = go.Figure()
+            
+            # Create histogram
+            fig.add_trace(go.Histogram(
                 x=prob_values,
-                nbinsx=20,
+                nbinsx=15,
                 marker_color='rgba(0, 123, 255, 0.7)',
                 marker_line_color='rgba(0, 123, 255, 1)',
-                marker_line_width=1
+                marker_line_width=2,
+                name='Payment Probability'
+            ))
+            
+            # Add vertical lines for risk thresholds
+            fig.add_vline(x=0.4, line_dash="dash", line_color="orange", 
+                         annotation_text="Medium Risk Threshold")
+            fig.add_vline(x=0.7, line_dash="dash", line_color="green", 
+                         annotation_text="Low Risk Threshold")
+            
+            fig.update_layout(
+                title={
+                    'text': '📊 Distribution of Payment Probabilities',
+                    'x': 0.5,
+                    'font': {'size': 18}
+                },
+                xaxis_title='Payment Probability',
+                yaxis_title='Number of Invoices',
+                template='plotly_white',
+                height=400,
+                showlegend=False
             )
-        ])
-        
-        fig.update_layout(
-            title='Distribution of Payment Probabilities',
-            xaxis_title='Payment Probability',
-            yaxis_title='Number of Invoices',
-            template='plotly_white',
-            height=300
-        )
-        
-        success_msg = f"🔮 Generated predictions for {len(df)} unpaid invoices!"
-        
-        return df, success_msg, fig
+            
+            # Count predictions by category
+            will_pay = sum(1 for p in prob_values if p > 0.5)
+            risk_default = len(prob_values) - will_pay
+            high_risk = sum(1 for p in prob_values if p <= 0.4)
+            
+            success_msg = f"""
+            <div style="background: #d4edda; border: 1px solid #c3e6cb; color: #155724; padding: 20px; border-radius: 10px; margin: 15px 0;">
+                <div style="text-align: center; margin-bottom: 15px;">
+                    <strong style="font-size: 1.2rem;">🔮 Prediction Results Generated Successfully!</strong>
+                </div>
+                <div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; text-align: center;">
+                    <div style="background: rgba(40, 167, 69, 0.1); padding: 15px; border-radius: 8px; border: 2px solid #28a745;">
+                        <div style="font-size: 2rem; font-weight: bold; color: #28a745;">{will_pay}</div>
+                        <div style="font-weight: bold;">✅ Will Pay</div>
+                    </div>
+                    <div style="background: rgba(220, 53, 69, 0.1); padding: 15px; border-radius: 8px; border: 2px solid #dc3545;">
+                        <div style="font-size: 2rem; font-weight: bold; color: #dc3545;">{risk_default}</div>
+                        <div style="font-weight: bold;">❌ Risk of Default</div>
+                    </div>
+                    <div style="background: rgba(255, 193, 7, 0.1); padding: 15px; border-radius: 8px; border: 2px solid #ffc107;">
+                        <div style="font-size: 2rem; font-weight: bold; color: #856404;">{high_risk}</div>
+                        <div style="font-weight: bold;">🔴 High Risk</div>
+                    </div>
+                </div>
+            </div>
+            """
+            
+            return results_df, success_msg, fig
+        
+        except Exception as e:
+            error_msg = f"""
+            <div style="background: #f8d7da; border: 1px solid #f5c6cb; color: #721c24; padding: 15px; border-radius: 10px; text-align: center;">
+                <strong>❌ Prediction failed:</strong> {str(e)}
+            </div>
+            """
+            return None, error_msg, None
 
 # Initialize the predictor
 predictor = SAPARPredictor()
 
-# Create Gradio interface
+# Create Gradio interface with improved layout
 with gr.Blocks(
     theme=gr.themes.Soft(
         primary_hue="blue",
@@ -260,26 +353,30 @@ with gr.Blocks(
     title="SAP AR ML Prediction Demo",
     css="""
     .gradio-container {
-        max-width: 1200px !important;
+        max-width: 1400px !important;
+        margin: 0 auto !important;
     }
     .main-header {
         text-align: center;
         margin-bottom: 2rem;
-    }
-    .metric-card {
+        padding: 2rem;
         background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-        padding: 1rem;
-        border-radius: 10px;
+        border-radius: 15px;
         color: white;
-        text-align: center;
+        margin-bottom: 30px;
+    }
+    .tab-nav {
+        margin-bottom: 20px;
     }
     """
 ) as demo:
     
     gr.HTML("""
     <div class="main-header">
-        <h1>🏢 SAP Account Receivable ML Prediction Demo</h1>
-        <p style="font-size: 1.1rem; color: #666;">
+        <h1 style="font-size: 2.5rem; margin-bottom: 15px; text-shadow: 2px 2px 4px rgba(0,0,0,0.3);">
+            🏢 SAP Account Receivable ML Prediction Demo
+        </h1>
+        <p style="font-size: 1.2rem; opacity: 0.95; margin: 0;">
             Machine Learning-powered invoice payment prediction system using TensorFlow
         </p>
     </div>
@@ -288,49 +385,71 @@ with gr.Blocks(
     with gr.Tabs() as tabs:
         
         with gr.Tab("🎯 Model Training", id=0):
-            gr.Markdown("""
-            ### Train ML Model
-            Train a neural network on synthetic SAP AR data to predict invoice payment likelihood.
-            The model uses features like invoice amount, days overdue, customer credit score, and more.
-            """)
-            
             with gr.Row():
-                with gr.Column(scale=1):
+                with gr.Column(scale=2):
+                    gr.Markdown("""
+                    ### 🚀 Train Your ML Model
+                    
+                    This will create a neural network trained on **1,000 synthetic SAP AR records** to predict invoice payment likelihood. 
+                    The model analyzes multiple factors including invoice amount, days overdue, customer credit score, and payment history.
+                    """)
+                    
                     train_btn = gr.Button(
                         "🚀 Train ML Model", 
                         variant="primary", 
-                        size="lg"
+                        size="lg",
+                        scale=1
                     )
-                    
-                with gr.Column(scale=2):
-                    metrics_display = gr.Markdown("")
-            
-            training_plot = gr.Plot(label="Training Progress")
-            predict_btn = gr.Button(
-                "🔮 Make Predictions", 
-                variant="secondary", 
-                interactive=False,
-                size="lg"
-            )
-        
-        with gr.Tab("📊 Predictions", id=1):
+                
+                with gr.Column(scale=1):
+                    gr.Markdown("""
+                    ### 📋 Model Features
+                    - Invoice Amount
+                    - Days Overdue  
+                    - Previous Delays
+                    - Credit Score
+                    - Industry Risk
+                    - Seasonality
+                    """)
+            
+            metrics_display = gr.HTML()
+            
+            with gr.Row():
+                training_plot = gr.Plot(label="📈 Training Progress")
+            
+            with gr.Row():
+                predict_btn = gr.Button(
+                    "🔮 Generate Predictions", 
+                    variant="secondary", 
+                    interactive=False,
+                    size="lg"
+                )
+        
+        with gr.Tab("📊 Invoice Predictions", id=1):
             gr.Markdown("""
-            ### Invoice Payment Predictions
-            View real-time predictions for unpaid invoices using the trained ML model.
+            ### 🔮 Real-time Payment Predictions
+            View ML-powered predictions for unpaid invoices with probability scores and risk assessments.
             """)
             
-            prediction_status = gr.Markdown("")
-            predictions_df = gr.Dataframe(
-                label="Invoice Predictions",
-                interactive=False,
-                wrap=True
-            )
-            probability_plot = gr.Plot(label="Probability Distribution")
+            prediction_status = gr.HTML()
+            
+            with gr.Row():
+                with gr.Column(scale=2):
+                    predictions_df = gr.Dataframe(
+                        label="📋 Invoice Predictions",
+                        interactive=False,
+                        wrap=True,
+                        height=400
+                    )
+                
+                with gr.Column(scale=1):
+                    probability_plot = gr.Plot(label="📊 Probability Distribution")
     
     # Event handlers
     train_btn.click(
         fn=predictor.train_model,
-        outputs=[training_plot, metrics_display, predict_btn]
+        outputs=[training_plot, metrics_display, predict_btn],
+        show_progress=True
     )
     
     predict_btn.click(
@@ -340,4 +459,4 @@ with gr.Blocks(
 
 # Launch the app
 if __name__ == "__main__":
-    demo.launch()
+    demo.launch(share=True)