import SwiftUI

// MARK: - Contact Information Input Component
struct ContactInputView: View {
    @Binding var firstName: String
    @Binding var lastName: String
    @Binding var phone: String
    @Binding var email: String
    @Binding var company: String
    @Binding var title: String
    @Binding var address: String
    @Binding var website: String
    @Binding var nickname: String
    @Binding var birthday: Date
    @Binding var note: String
    @FocusState var focusedField: ContactField?
    
    // Contact field enum
    enum ContactField: Hashable {
        case firstName, lastName, phone, email, company, title, address, website, nickname, birthday, note
    }
    
    var body: some View {
        VStack(spacing: 16) {
            // Name
            HStack(spacing: 12) {
                VStack(alignment: .leading, spacing: 8) {
                    HStack {
                        Text("first_name".localized)
                            .font(.subheadline)
                            .foregroundColor(.primary)
                        Text("*")
                            .foregroundColor(.red)
                        Spacer()
                    }
                    
                    TextField("first_name".localized, text: $firstName)
                        .textFieldStyle(RoundedBorderTextFieldStyle())
                        .focused($focusedField, equals: .firstName)
                }
                
                VStack(alignment: .leading, spacing: 8) {
                    HStack {
                        Text("last_name".localized)
                            .font(.subheadline)
                            .foregroundColor(.primary)
                        Text("*")
                            .foregroundColor(.red)
                        Spacer()
                    }
                    
                    TextField("last_name".localized, text: $lastName)
                        .textFieldStyle(RoundedBorderTextFieldStyle())
                        .focused($focusedField, equals: .lastName)
                }
            }
            
            // Nickname
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("nickname".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                TextField("nickname".localized, text: $nickname)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .focused($focusedField, equals: .nickname)
            }
            
            // Phone
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("phone_number".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                TextField("contact_phone_placeholder".localized, text: $phone)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .keyboardType(.phonePad)
                    .focused($focusedField, equals: .phone)
            }
            
            // Email
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("email".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                TextField("contact_email_placeholder".localized, text: $email)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .keyboardType(.emailAddress)
                    .autocapitalization(.none)
                    .focused($focusedField, equals: .email)
            }
            
            // Company
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("company".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                TextField("company_name".localized, text: $company)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .focused($focusedField, equals: .company)
            }
            
            // Title
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("title".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                TextField("title_name".localized, text: $title)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .focused($focusedField, equals: .title)
            }
            
            // Address
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("address".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                TextField("detailed_address".localized, text: $address)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .focused($focusedField, equals: .address)
            }
            
            // Website
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("website".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                TextField("https://example.com", text: $website)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .keyboardType(.URL)
                    .autocapitalization(.none)
                    .focused($focusedField, equals: .website)
            }
            
            // Birthday
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("birthday".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                DatePicker("select_birthday".localized, selection: $birthday, displayedComponents: .date)
                    .datePickerStyle(CompactDatePickerStyle())
                    .focused($focusedField, equals: .birthday)
            }
            
            // Note
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text("note".localized)
                        .font(.subheadline)
                        .foregroundColor(.primary)
                    Spacer()
                }
                
                TextField("note_info".localized, text: $note)
                    .textFieldStyle(RoundedBorderTextFieldStyle())
                    .focused($focusedField, equals: .note)
            }
        }
        .toolbar {
            ToolbarItemGroup(placement: .keyboard) {
                Spacer()
                Button("done".localized) {
                    focusedField = nil
                }
                .foregroundColor(.blue)
                .font(.system(size: 16, weight: .medium))
            }
        }
    }
}

#Preview {
    ContactInputView(
        firstName: .constant(""),
        lastName: .constant(""),
        phone: .constant(""),
        email: .constant(""),
        company: .constant(""),
        title: .constant(""),
        address: .constant(""),
        website: .constant(""),
        nickname: .constant(""),
        birthday: .constant(Date()),
        note: .constant("")
    )
}