use dioxus::prelude::*;

use crate::i18n::{t, Locale};
use crate::models::AnalyticsMetric;

/// Analytics page placeholder for LangFuse integration.
///
/// Shows a "Coming Soon" card with a disabled launch button,
/// plus a mock stats bar showing sample metrics.
#[component]
pub fn AnalyticsPage() -> Element {
    let locale = use_context::<Signal<Locale>>();
    let l = *locale.read();

    let metrics = mock_metrics(l);

    rsx! {
        section { class: "placeholder-page",
            div { class: "analytics-stats-bar",
                for metric in &metrics {
                    div { class: "analytics-stat",
                        span { class: "analytics-stat-value", "{metric.value}" }
                        span { class: "analytics-stat-label", "{metric.label}" }
                        span { class: if metric.change_pct >= 0.0 { "analytics-stat-change analytics-stat-change--up" } else { "analytics-stat-change analytics-stat-change--down" },
                            "{metric.change_pct:+.1}%"
                        }
                    }
                }
            }
            div { class: "placeholder-card",
                div { class: "placeholder-icon", "L" }
                h2 { "{t(l, \"developer.analytics_title\")}" }
                p { class: "placeholder-desc",
                    "{t(l, \"developer.analytics_desc\")}"
                }
                button { class: "btn-primary", disabled: true, "{t(l, \"developer.launch_analytics\")}" }
                span { class: "placeholder-badge", "{t(l, \"common.coming_soon\")}" }
            }
        }
    }
}

/// Returns mock analytics metrics for the stats bar.
///
/// # Arguments
///
/// * `locale` - The current locale for translating metric labels
fn mock_metrics(locale: Locale) -> Vec<AnalyticsMetric> {
    vec![
        AnalyticsMetric {
            label: t(locale, "developer.total_requests"),
            value: "12,847".into(),
            change_pct: 14.2,
        },
        AnalyticsMetric {
            label: t(locale, "developer.avg_latency"),
            value: "245ms".into(),
            change_pct: -8.5,
        },
        AnalyticsMetric {
            label: t(locale, "developer.tokens_used"),
            value: "2.4M".into(),
            change_pct: 22.1,
        },
        AnalyticsMetric {
            label: t(locale, "developer.error_rate"),
            value: "0.3%".into(),
            change_pct: -12.0,
        },
    ]
}