import SwiftUI
import HaloDesign

/// Der Anmeldebildschirm.
///
/// **Ein Weg, seit es einen Server gibt.** Hier standen zwei Knöpfe
/// nebeneinander, und der obere war der auffälligere — er führte zu Plex.
/// Bleibt einer übrig, erbt er die Hervorhebung: ein Knopf, der aussieht wie
/// die zweite Wahl, lässt den Benutzer nach der ersten suchen.
///
/// Jellyfin hat kein Verzeichnis, an dem die eigenen Server hängen. Deshalb
/// wird die Adresse eingetippt und, wann immer der Server es anbietet, ein
/// Code bestätigt statt eines Passworts — das führt `JellyfinSignInView`.
struct SignInView: View {
    @Environment(\.haloAccent) private var accent
    @State private var showsJellyfinSignIn = false

    var body: some View {
        VStack(spacing: HaloSpacing.section) {
            Spacer()

            VStack(spacing: HaloSpacing.regular) {
                Image(systemName: "play.rectangle.on.rectangle")
                    .font(.system(size: 52))
                    .foregroundStyle(accent)

                Text(Branding.appName)
                    .font(.haloHero)
                    .foregroundStyle(Color.haloTextPrimary)

                Text("signIn.tagline")
                    .font(.haloBody)
                    .foregroundStyle(Color.haloTextSecondary)
                    .multilineTextAlignment(.center)
            }

            Spacer()

            VStack(spacing: HaloSpacing.regular) {
                Button {
                    showsJellyfinSignIn = true
                } label: {
                    Text("signIn.withJellyfin")
                        .font(.haloRowHeader)
                        .frame(maxWidth: .infinity)
                        .padding(.vertical, HaloSpacing.regular)
                }
                .buttonStyle(.borderedProminent)
                .tint(accent)

                Text("signIn.privacy")
                    .font(.haloCaption)
                    .foregroundStyle(Color.haloTextMuted)
                    .multilineTextAlignment(.center)
            }

            Spacer().frame(height: HaloSpacing.section)
        }
        .padding(.horizontal, HaloSpacing.section)
        .frame(maxWidth: 420)
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(Color.haloCanvas)
        .sheet(isPresented: $showsJellyfinSignIn) {
            JellyfinSignInView()
        }
    }
}