app.py

import pandas as pd
import gradio as gr
import random

def generate_random_data():
    """Generate random scatter plot data."""
    n_points = random.randint(20, 50)
    return pd.DataFrame({
        "x": [random.uniform(-100, 100) for _ in range(n_points)],
        "y": [random.uniform(-100, 100) for _ in range(n_points)]
    })

def load_css():
    """Load CSS styling."""
    try:
        with open("styles.css", "r") as f:
            return f.read()
    except FileNotFoundError:
        return "body { background: #000; color: #fff; }"

def refresh_plot():
    """Generate new random data and update description."""
    return generate_random_data(), "**Transformer CI Dashboard**<br>-<br>**AMD runs on MI325**<br>**NVIDIA runs on A10**<br><br>*This dashboard only tracks important models*<br>*(Data refreshed)*"

# Create Gradio interface
with gr.Blocks(title="Random Data Dashboard", css=load_css(), fill_height=True, fill_width=True) as demo:
    with gr.Row():
        # Sidebar
        with gr.Column(scale=1, elem_classes=["sidebar"]):
            gr.Markdown("# 🤖 TCID", elem_classes=["sidebar-title"])
            description = gr.Markdown("**Transformer CI Dashboard**<br>-<br>**AMD runs on MI325**<br>**NVIDIA runs on A10**<br><br>*This dashboard only tracks important models*", elem_classes=["sidebar-description"])
            summary_btn = gr.Button("summary\n📊", variant="primary", size="lg", elem_classes=["summary-button"])

        # Main plot area
        with gr.Column(elem_classes=["main-content"]):
            plot = gr.ScatterPlot(
                generate_random_data(),
                x="x", y="y",
                height="100vh",
                container=False,
                show_fullscreen_button=True,
                elem_classes=["plot-container"]
            )

    # Button click handler
    summary_btn.click(fn=refresh_plot, outputs=[plot, description])

if __name__ == "__main__":
    demo.launch()