ReadKeep/readeck/UI/Settings/SettingsServerView.swift

//
//  SettingsServerView.swift
//  readeck
//
//  Created by Ilyas Hallak on 29.06.25.
//

import SwiftUI

struct SettingsServerView: View {
    @State private var viewModel = SettingsServerViewModel()
    @State private var showingLogoutAlert = false
    
    init(viewModel: SettingsServerViewModel = SettingsServerViewModel(), showingLogoutAlert: Bool = false) {
        self.viewModel = viewModel
        self.showingLogoutAlert = showingLogoutAlert
    }
    
    var body: some View {
        VStack(spacing: 20) {
            SectionHeader(title: viewModel.isSetupMode ? "Server Settings" : "Server Connection", icon: "server.rack")
                .padding(.bottom, 4)
            
            Text(viewModel.isSetupMode ?
                 "Enter your Readeck server details to get started." :
                 "Your current server connection and login credentials.")
                .font(.body)
                .foregroundColor(.secondary)
                .multilineTextAlignment(.center)
                .padding(.bottom, 8)
            
            // Form
            VStack(spacing: 16) {
                VStack(alignment: .leading, spacing: 6) {
                    Text("Server Endpoint")
                        .font(.headline)
                    TextField("https://readeck.example.com", text: $viewModel.endpoint)
                        .textFieldStyle(.roundedBorder)
                        .keyboardType(.URL)
                        .autocapitalization(.none)
                        .disableAutocorrection(true)
                        .disabled(!viewModel.isSetupMode)
                        .onChange(of: viewModel.endpoint) {
                            if viewModel.isSetupMode {
                                viewModel.clearMessages()
                            }
                        }
                }
                VStack(alignment: .leading, spacing: 6) {
                    Text("Username")
                        .font(.headline)
                    TextField("Your Username", text: $viewModel.username)
                        .textFieldStyle(.roundedBorder)
                        .autocapitalization(.none)
                        .disableAutocorrection(true)
                        .disabled(!viewModel.isSetupMode)
                        .onChange(of: viewModel.username) {
                            if viewModel.isSetupMode {
                                viewModel.clearMessages()
                            }
                        }
                }
                VStack(alignment: .leading, spacing: 6) {
                    Text("Password")
                        .font(.headline)
                    SecureField("Your Password", text: $viewModel.password)
                        .textFieldStyle(.roundedBorder)
                        .disabled(!viewModel.isSetupMode)
                        .onChange(of: viewModel.password) {
                            if viewModel.isSetupMode {
                                viewModel.clearMessages()
                            }
                        }
                }
            }
            
            // Connection Status
            if viewModel.isLoggedIn {
                HStack {
                    Image(systemName: "checkmark.circle.fill")
                        .foregroundColor(.green)
                    Text("Successfully logged in")
                        .foregroundColor(.green)
                        .font(.caption)
                }
            }
            
            // Messages
            if let errorMessage = viewModel.errorMessage {
                HStack {
                    Image(systemName: "exclamationmark.triangle.fill")
                        .foregroundColor(.red)
                    Text(errorMessage)
                        .foregroundColor(.red)
                        .font(.caption)
                }
            }
            
            if let successMessage = viewModel.successMessage {
                HStack {
                    Image(systemName: "checkmark.circle.fill")
                        .foregroundColor(.green)
                    Text(successMessage)
                        .foregroundColor(.green)
                        .font(.caption)
                }
            }
            
            if viewModel.isSetupMode {
                VStack(spacing: 10) {
                    Button(action: {
                        Task {
                            await viewModel.saveServerSettings()
                        }
                    }) {
                        HStack {
                            if viewModel.isLoading {
                                ProgressView()
                                    .scaleEffect(0.8)
                                    .progressViewStyle(CircularProgressViewStyle(tint: .white))
                            }
                            Text(viewModel.isLoading ? "Saving..." : (viewModel.isLoggedIn ? "Re-login & Save" : "Login & Save"))
                                .fontWeight(.semibold)
                        }
                        .frame(maxWidth: .infinity)
                        .padding()
                        .background(viewModel.canLogin ? Color.accentColor : Color.gray)
                        .foregroundColor(.white)
                        .cornerRadius(10)
                    }
                    .disabled(!viewModel.canLogin || viewModel.isLoading)                    
                }
            } else {
                Button(action: {
                    showingLogoutAlert = true
                }) {
                    HStack {
                        Image(systemName: "rectangle.portrait.and.arrow.right")
                        Text("Logout")
                            .fontWeight(.semibold)
                    }
                    .frame(maxWidth: .infinity)
                    .padding()
                    .background(Color.red)
                    .foregroundColor(.white)
                    .cornerRadius(10)
                }
            }
        }
        .alert("Logout", isPresented: $showingLogoutAlert) {
            Button("Cancel", role: .cancel) { }
            Button("Logout", role: .destructive) {
                Task {
                    await viewModel.logout()
                }
            }
        } message: {
            Text("Are you sure you want to log out? This will delete all your login credentials and return you to setup.")
        }
        .task {
            await viewModel.loadServerSettings()
        }
    }
}

#Preview {
    SettingsServerView(viewModel: .init(
        MockUseCaseFactory()
    ))
}