import ManaCore
import SwiftUI

struct LoginView: View {
    @Environment(AuthClient.self) private var auth
    @State private var email = ""
    @State private var password = ""

    var body: some View {
        ZStack {
            CardsTheme.background.ignoresSafeArea()
            VStack(spacing: 24) {
                Text("Cardecky")
                    .font(.system(size: 48, weight: .bold))
                    .foregroundStyle(CardsTheme.primary)
                Text("Karteikarten des Vereins mana e.V.")
                    .font(.subheadline)
                    .foregroundStyle(CardsTheme.mutedForeground)

                VStack(spacing: 12) {
                    TextField("Email", text: $email)
                        .textContentType(.emailAddress)
                        .keyboardType(.emailAddress)
                        .textInputAutocapitalization(.never)
                        .autocorrectionDisabled()
                        .padding(.vertical, 12)
                        .padding(.horizontal, 16)
                        .background(CardsTheme.surface, in: RoundedRectangle(cornerRadius: 8))

                    SecureField("Passwort", text: $password)
                        .textContentType(.password)
                        .padding(.vertical, 12)
                        .padding(.horizontal, 16)
                        .background(CardsTheme.surface, in: RoundedRectangle(cornerRadius: 8))
                }
                .padding(.horizontal, 32)

                Button {
                    Task { await auth.signIn(email: email, password: password) }
                } label: {
                    HStack {
                        if case .signingIn = auth.status {
                            ProgressView()
                                .controlSize(.small)
                                .tint(CardsTheme.primaryForeground)
                        }
                        Text("Anmelden")
                            .fontWeight(.semibold)
                    }
                    .frame(maxWidth: .infinity)
                    .padding(.vertical, 14)
                    .background(CardsTheme.primary, in: RoundedRectangle(cornerRadius: 8))
                    .foregroundStyle(CardsTheme.primaryForeground)
                }
                .padding(.horizontal, 32)
                .disabled(isSigningIn || email.isEmpty || password.isEmpty)

                if case let .error(message) = auth.status {
                    Text(message)
                        .font(.footnote)
                        .foregroundStyle(CardsTheme.error)
                        .multilineTextAlignment(.center)
                        .padding(.horizontal, 32)
                }
            }
        }
    }

    private var isSigningIn: Bool {
        if case .signingIn = auth.status { return true }
        return false
    }
}

#Preview {
    LoginView()
        .environment(AuthClient(config: AppConfig.manaAppConfig))
}