import SwiftUI
import FlixyDesign
import MediaKit

/// Die Startseite: Aufmacher oben, darunter die Reihen vom Server.
struct HomeView: View {
    @Environment(FlixySession.self) private var session
    @Environment(HomeLayoutSettings.self) private var layout
    @State private var state: LoadState<[MediaRowGroup]> = .loading

    var body: some View {
        Group {
            switch state {
            case .loading:
                ProgressView().frame(maxWidth: .infinity, maxHeight: .infinity)

            case .failed(let message):
                ContentUnavailableView {
                    Label("error.title", systemImage: "exclamationmark.triangle")
                } description: {
                    Text(message)
                } actions: {
                    Button("action.retry") { Task { await load() } }
                }

            case .loaded(let allRows):
                let hubs = layout.apply(to: allRows)
                if hubs.isEmpty {
                    ContentUnavailableView {
                        Label("home.empty.title", systemImage: "film.stack")
                    } description: {
                        Text("home.empty.description")
                    }
                } else {
                    content(hubs: hubs)
                }
            }
        }
        .background(Color.flixyCanvas)
        // Kein Titel: der Name der App gehört auf den Homescreen, nicht
        // über jeden Bildschirm. Darunter liegt der Aufmacher, und der sagt
        // ohnehin mehr.
        .navigationTitle("")
        .navigationBarTitleDisplayMode(.inline)
        // Gar kein Hintergrund statt eines weichgezeichneten: die Knöpfe
        // bringen ihre eigene Glasfläche mit und bleiben auch über dem Bild
        // lesbar. `.ultraThinMaterial` verschleierte dagegen den halben
        // Aufmacher.
        .toolbarBackground(.hidden, for: .navigationBar)
        // Helle Symbole, weil darunter ein Bild liegt und kein heller Grund.
        .toolbarColorScheme(.dark, for: .navigationBar)
        .toolbar { SearchToolbarItem() }
        .navigationDestination(for: MediaRoute.self) { MediaDetailView(route: $0) }
        .task(id: session.server?.name) { await load() }
        .refreshable { await load() }
    }

    private func content(hubs: [MediaRowGroup]) -> some View {
        ScrollView {
            LazyVStack(alignment: .leading, spacing: FlixySpacing.section) {
                if let featured = heroItem(in: hubs) {
                    HeroSection(item: featured)
                }

                ForEach(hubs) { hub in
                    MediaRow(row: hub)
                }
            }
            .padding(.bottom, FlixySpacing.section)
        }
        .scrollIndicators(.hidden)
    }

    /// Was oben groß gezeigt wird.
    ///
    /// Erste Wahl ist etwas Angefangenes — wer die App öffnet, will meistens
    /// weiterschauen. Erst wenn es nichts Angefangenes gibt, tritt der
    /// Neuzugang an die Stelle.
    private func heroItem(in hubs: [MediaRowGroup]) -> MediaItem? {
        let continuing = hubs.first(where: \.isContinueWatching)
        return continuing?.items.first ?? hubs.first?.items.first
    }

    private func load() async {
        guard let backend = session.backend else { return }
        state = await LoadState.load(keepingPrevious: state) {
            try await backend.homeRows()
        }
    }
}