%pip install dash dash-bootstrap-components plotly pandas jupyter-dash

from dash import dcc, html, Input, Output, dash_table
import dash_bootstrap_components as dbc
import plotly.graph_objects as go
import pandas as pd
import numpy as np
from datetime import datetime, timedelta

# Application Initialisation
app = dash.Dash(
    __name__,
    external_stylesheets=[dbc.themes.DARKLY],
    title="Trading Dashboard",
    update_title=None,
)

def get_equity_data(strategy: str) -> pd.DataFrame:
    """Fetch equity curve for the selected strategy."""
    np.random.seed(hash(strategy) % 1000)
    n = 120
    returns = np.random.normal(0.002, 0.015, n)
    equity = [10_000.0]
    for r in returns:
        equity.append(equity[-1] * (1 + r))
    dates = pd.date_range(end=datetime.utcnow(), periods=n + 1, freq="1h")
    return pd.DataFrame({"datetime": dates.astype(str), "balance": equity})

def get_positions() -> list[dict]:
    """Fetch open positions from execution_live table."""
    return [
        {"Exchange": "Binance", "Symbol": "BTCUSDT", "Direction": "LONG",
         "Entry": 68_000, "Current": 69_200, "PnL%": 1.76, "Size": 0.15},
        {"Exchange": "Bybit",   "Symbol": "ETHUSDT", "Direction": "SHORT",
         "Entry": 3_500,  "Current": 3_460,  "PnL%": 1.14, "Size": 2.0},
    ]

def get_strategy_summary() -> list[dict]:
    """Fetch strategy execution summary."""
    return [
        {"Strategy": "btc_1h", "Trades": 42, "WinRate%": 61.9, "PnL%": 8.3},
        {"Strategy": "eth_4h", "Trades": 18, "WinRate%": 55.6, "PnL%": 3.1},
        {"Strategy": "sol_1d", "Trades": 9,  "WinRate%": 44.4, "PnL%": -1.2},
        {"Strategy": "btc_4h", "Trades": 31, "WinRate%": 67.7, "PnL%": 12.4},
    ]

STRATEGIES = ["btc_1h", "eth_4h", "sol_1d", "btc_4h"]

app.layout = dbc.Container([

    # Header
    dbc.Row([
        dbc.Col(html.H2("📈 Algorithmic Trading Dashboard",
                         className="text-white mt-3 mb-1")),
        dbc.Col(html.Div(id="last-updated", className="text-muted text-end mt-4"),
                width=3),
    ]),
    html.Hr(className="border-secondary"),

    # Controls
    dbc.Row([
        dbc.Col([
            html.Label("Strategy", className="text-white"),
            dcc.Dropdown(
                id="strategy-selector",
                options=[{"label": s, "value": s} for s in STRATEGIES],
                value="btc_1h",
                clearable=False,
                style={"color": "#333"},
            ),
        ], width=3),
        dbc.Col([
            html.Label("Refresh Interval", className="text-white"),
            dcc.Slider(id="refresh-slider", min=5, max=60, step=5, value=15,
                       marks={5: "5s", 15: "15s", 30: "30s", 60: "60s"}),
        ], width=5),
    ], className="mb-3"),

    # KPI Cards
    dbc.Row(id="kpi-row", className="mb-3"),

    # Equity Chart
    dbc.Row([
        dbc.Col(dbc.Card([
            dbc.CardHeader("Equity Curve", className="text-white"),
            dbc.CardBody(dcc.Graph(id="equity-chart", style={"height": "320px"})),
        ], className="bg-dark border-secondary"))
    ], className="mb-3"),

    # Positions & Summary
    dbc.Row([
        dbc.Col([
            dbc.Card([
                dbc.CardHeader("Open Positions", className="text-white"),
                dbc.CardBody(html.Div(id="positions-table")),
            ], className="bg-dark border-secondary"),
        ], width=6),
        dbc.Col([
            dbc.Card([
                dbc.CardHeader("Strategy Summary", className="text-white"),
                dbc.CardBody(html.Div(id="summary-table")),
            ], className="bg-dark border-secondary"),
        ], width=6),
    ]),

    # Auto-refresh interval
    dcc.Interval(id="interval", interval=15_000, n_intervals=0),

], fluid=True, style={"backgroundColor": "#1a1a2e", "minHeight": "100vh"})

@app.callback(
    Output("interval", "interval"),
    Input("refresh-slider", "value"),
)
def update_interval(seconds):
    """Sync the auto-refresh interval with the slider value."""
    return seconds * 1000

@app.callback(
    Output("equity-chart",  "figure"),
    Output("kpi-row",       "children"),
    Output("positions-table","children"),
    Output("summary-table", "children"),
    Output("last-updated",  "children"),
    Input("interval",           "n_intervals"),
    Input("strategy-selector",  "value"),
)
def refresh_dashboard(n, strategy):
    """
    Master callback — refreshes all dashboard components on each interval tick
    or when the strategy selector changes.
    """

    # Equity chart
    eq = get_equity_data(strategy)
    fig = go.Figure(go.Scatter(
        x=eq["datetime"], y=eq["balance"],
        mode="lines", fill="tozeroy",
        line=dict(color="#2ecc71", width=2),
        fillcolor="rgba(46,204,113,0.08)",
    ))
    fig.update_layout(
        margin=dict(l=0,r=0,t=10,b=0),
        plot_bgcolor="#1a1a2e", paper_bgcolor="#1a1a2e",
        font=dict(color="#ccc"),
        xaxis=dict(showgrid=False), yaxis=dict(showgrid=True, gridcolor="#333"),
    )

    # KPI cards
    summary = get_strategy_summary()
    row_data = next((r for r in summary if r["Strategy"] == strategy), {})
    kpi_cards = [
        dbc.Col(dbc.Card([
            dbc.CardBody([
                html.H6(k, className="text-muted small"),
                html.H4(v, className="text-white"),
            ])
        ], className="bg-dark border-secondary text-center"))
        for k, v in [
            ("Trades",   row_data.get("Trades", 0)),
            ("Win Rate", f"{row_data.get('WinRate%', 0):.1f}%"),
            ("PnL",      f"{row_data.get('PnL%', 0):.2f}%"),
        ]
    ]

    # Positions table
    pos_df = pd.DataFrame(get_positions())
    pos_table = dash_table.DataTable(
        data=pos_df.to_dict("records"),
        columns=[{"name": c, "id": c} for c in pos_df.columns],
        style_table={"overflowX": "auto"},
        style_cell={"backgroundColor": "#1a1a2e", "color": "#ccc", "border": "1px solid #333"},
        style_header={"backgroundColor": "#2d2d44", "color": "#fff", "fontWeight": "bold"},
        style_data_conditional=[
            {"if": {"filter_query": "{PnL%} > 0", "column_id": "PnL%"},
             "color": "#2ecc71"},
            {"if": {"filter_query": "{PnL%} < 0", "column_id": "PnL%"},
             "color": "#e74c3c"},
        ],
    )

    # Summary table
    sum_df = pd.DataFrame(summary)
    sum_table = dash_table.DataTable(
        data=sum_df.to_dict("records"),
        columns=[{"name": c, "id": c} for c in sum_df.columns],
        style_table={"overflowX": "auto"},
        style_cell={"backgroundColor": "#1a1a2e", "color": "#ccc", "border": "1px solid #333"},
        style_header={"backgroundColor": "#2d2d44", "color": "#fff", "fontWeight": "bold"},
    )

    updated = f"Updated: {datetime.utcnow().strftime('%H:%M:%S')} UTC"
    return fig, kpi_cards, pos_table, sum_table, updated

if __name__ == "__main__":
    app.run(debug=True, port=8050)