import SwiftUI

@MainActor public struct NativeSignInView: View {
  @ObservedObject private var connection: NativeConnection
  private let name: String
  private let symbol: String
  @Environment(\.openURL) private var openURL

  public init(_ name: String, systemImage: String, connection: NativeConnection) {
    self.name = name
    symbol = systemImage
    self.connection = connection
  }
  public var body: some View {
    ScrollView {
      VStack(alignment: .leading, spacing: 24) {
        Image(systemName: symbol).font(.largeTitle).foregroundStyle(.tint)
          .padding(18).background(.tint.opacity(0.1), in: RoundedRectangle(cornerRadius: 20))
          .accessibilityHidden(true)
        Text(name).font(.largeTitle.bold())
        Text("Your team, wherever you work.").foregroundStyle(.secondary)
        if connection.signingIn {
          ProgressView("Finish signing in in your browser")
          Text(connection.code).font(.title.monospaced().bold()).textSelection(.enabled)
          Text("Compare this code with the one in your browser before approving sign-in.")
            .foregroundStyle(.secondary)

          Button("Cancel") { connection.cancel() }
        } else {
          VStack(alignment: .leading, spacing: 8) {
            Text("Server address").font(.headline)
            TextField("https://your-server", text: $connection.serverAddress)
              .textFieldStyle(.roundedBorder).accessibilityIdentifier("serverAddress")
              #if os(iOS)
                .keyboardType(.URL).textInputAutocapitalization(.never).autocorrectionDisabled()
              #endif
              .onSubmit(signIn)
          }
          TextField("Account name (optional)", text: $connection.accountName)
            .textFieldStyle(.roundedBorder)
          Button("Sign in", systemImage: "arrow.right", action: signIn)
            .buttonStyle(.borderedProminent).keyboardShortcut(.defaultAction)
        }
        if !connection.error.isEmpty {
          Label(connection.error, systemImage: "exclamationmark.circle")
            .foregroundStyle(.red).fixedSize(horizontal: false, vertical: true)
        }
      }.controlSize(.large).frame(maxWidth: 440, alignment: .leading).padding(32)
        .frame(maxWidth: .infinity)
    }
  }
  private func signIn() { connection.signIn() }
}