import SwiftUI

struct FeedView: View {
    @EnvironmentObject private var localization: LocalizationStore
    @EnvironmentObject private var analytics: HermesAnalyticsClient

    var body: some View {
        VStack(alignment: .leading, spacing: HermesTheme.sectionSpacing) {
            HermesSectionHeader(
                title: localization.string(for: "feed.title"),
                subtitle: localization.string(for: "feed.subtitle")
            )

            ZStack(alignment: .bottomLeading) {
                RoundedRectangle(cornerRadius: HermesTheme.cornerRadius, style: .continuous)
                    .fill(
                        LinearGradient(
                            colors: [HermesTheme.surfaceElevated, HermesTheme.background],
                            startPoint: .topLeading,
                            endPoint: .bottomTrailing
                        )
                    )
                    .frame(height: 220)

                VStack(alignment: .leading, spacing: 8) {
                    Text(localization.string(for: "feed.hero_title"))
                        .font(.title2.weight(.bold))
                        .foregroundStyle(HermesTheme.textPrimary)

                    Text(localization.string(for: "feed.hero_subtitle"))
                        .font(.callout)
                        .foregroundStyle(HermesTheme.textSecondary)
                        .frame(maxWidth: 260, alignment: .leading)
                }
                .padding(HermesTheme.contentPadding)
            }

            HStack(spacing: 12) {
                HermesMetricPill(label: localization.string(for: "feed.lock_label"), value: "01:42")
                HermesMetricPill(label: localization.string(for: "feed.odds_label"), value: "1.85 / 2.05")
            }

            Button {
                analytics.track("next_round_requested", attributes: ["screen_name": "feed"])
                analytics.track("cta_pressed", attributes: ["screen_name": "feed", "action": "watch_preview"])
            } label: {
                Text(localization.string(for: "feed.cta"))
            }
                .buttonStyle(HermesPrimaryButtonStyle())
        }
        .hermesCard(elevated: true)
        .onAppear {
            analytics.track("feed_viewed", attributes: ["screen_name": "feed"])
            analytics.track("screen_viewed", attributes: ["screen_name": "feed"])
        }
    }
}