import SwiftUI

struct FeedbackView: View {
    // Use Router for navigation instead of dismiss
    @EnvironmentObject private var router: Router
    
    @State private var selectedFeedback: FeedbackType? = FeedbackType.allCases.first
    @State private var showNextScreen = false
    
    enum FeedbackType: String, CaseIterable, Identifiable {
        case excellent = "Excellent"
        case good = "Good"
        case okay = "Okay"
        case bad = "Bad"
        
        var id: String { self.rawValue }
        var icon: String {
            switch self {
            case .excellent: return "😘"
            case .good: return "😊"
            case .okay: return "😐"
            case .bad: return "😞"
            }
        }
    }
    
    var body: some View {
        VStack(spacing: 0) {
            // Custom Navigation Bar
            HStack {
                // Back Button
                Button(action: { router.pop() }) {
                    Image(systemName: "chevron.left")
                        .font(.system(size: 17, weight: .semibold))
                        .foregroundColor(.primary)
                        .frame(width: 44, height: 44)
                }
                
                // Title
                Text("Feedback")
                    .font(Typography.font(for: .title2, family: .quicksandBold))
                    .frame(maxWidth: .infinity)
                
                // Spacer to balance the HStack
                Spacer()
                    .frame(width: 44, height: 44)
            }
            .frame(height: 44)
            .background(Color.themeTextWhiteSecondary)
            
            // Main Content
            GeometryReader { geometry in
                ScrollView {
                    VStack(spacing: 24) {
                        // Top spacing for vertical centering
                        Spacer(minLength: 0)
                        
                        VStack(spacing: 24) {
                            Text("How are you feeling?")
                                .font(Typography.font(for: .title2, family: .quicksandBold))
                                .multilineTextAlignment(.center)
                                .frame(maxWidth: .infinity)
                                .padding(.bottom, 50)
                            
                            // Feedback Type Selection
                            VStack(spacing: 12) {
                                ForEach(FeedbackType.allCases) { type in
                                    Button(action: {
                                        selectedFeedback = type
                                    }) {
                                        let isSelected = selectedFeedback == type
                                        HStack {
                                            Text(type.icon)
                                                .font(.body)
                                                .foregroundColor(isSelected ? .white : .primary)
                                            
                                            Text(type.rawValue)
                                                .font(.body)
                                                .foregroundColor(Color.themeTextMessageMain)
                                            
                                            Spacer()
                                        }
                                        .padding()
                                        .background(
                                            RoundedRectangle(cornerRadius: 12)
                                                .fill(isSelected ? Color.themePrimary : Color.themePrimaryLight)
                                        )
                                        .overlay(
                                            RoundedRectangle(cornerRadius: 12)
                                                .stroke(isSelected ? Color.themePrimary : Color.themePrimaryLight, lineWidth: 1)
                                        )
                                    }
                                    .buttonStyle(PlainButtonStyle())
                                }
                            }
                            .padding(.bottom, 24)
                        }
                        .padding(.horizontal, 20)
                        .padding(.vertical, 24)
                        .background(Color.white)
                        .cornerRadius(16)
                        .padding(.horizontal, 16)
                        .frame(minHeight: geometry.size.height - 120) // Subtract navigation bar and bottom button height
                        
                        // Bottom spacing for vertical centering
                        Spacer(minLength: 0)
                    }
                    .frame(maxWidth: .infinity, minHeight: geometry.size.height - 44) // Subtract navigation bar height
                }
            }
            .background(Color.themeTextWhiteSecondary)  // Add background color to the GeometryReader
            
            // Continue Button
           
                Button(action: {
                    router.navigate(to: .mediaUpload) // or your custom navigation method
                }) {
                    Text("Continue")
                        .font(.headline)
                        .foregroundColor(selectedFeedback != nil ? .themeTextMessageMain : .gray)
                        .frame(maxWidth: .infinity)
                        .frame(height: 56)
                        .background(
                            RoundedRectangle(cornerRadius: 32)
                                .fill(selectedFeedback != nil ? 
                                    Color.themePrimary : Color.themeTextWhiteSecondary)
                        )
                }
                .disabled(selectedFeedback == nil)
                .padding()
                .background(Color.themeTextWhiteSecondary)  // Add background color to the button area
        }
        .background(Color.themeTextWhiteSecondary)  // Set the background for the entire view
        .navigationBarHidden(true)
    }
}

// Feedback Detail View
struct FeedbackDetailView: View {
    let feedbackType: FeedbackView.FeedbackType
    @State private var feedbackText = ""
    @State private var contactInfo = ""
    
    var body: some View {
        VStack(spacing: 0) {
            // Navigation Bar
            HStack {
                // Back Button
                Button(action: { Router.shared.pop() }) {
                    Image(systemName: "chevron.left")
                        .font(.system(size: 17, weight: .semibold))
                        .foregroundColor(.primary)
                        .frame(width: 44, height: 44)
                }
                
                // Title
                Text(feedbackType.rawValue)
                    .font(.headline)
                    .frame(maxWidth: .infinity)
                
                // Spacer to balance the HStack
                Spacer()
                    .frame(width: 44, height: 44)
            }
            .frame(height: 44)
            .background(Color.themeTextWhiteSecondary)
            
            // Form
            ScrollView {
                VStack(spacing: 24) {
                    // Feedback Type
                    HStack {
                        Image(systemName: feedbackType.icon)
                            .foregroundColor(.blue)
                        Text(feedbackType.rawValue)
                            .font(.headline)
                        Spacer()
                    }
                    .padding()
                    .background(Color.blue.opacity(0.1))
                    .cornerRadius(12)
                    
                    // Feedback Text
                    VStack(alignment: .leading, spacing: 8) {
                        Text("Describe your \(feedbackType.rawValue.lowercased())")
                            .font(.subheadline)
                            .foregroundColor(.secondary)
                        
                        TextEditor(text: $feedbackText)
                            .frame(minHeight: 150)
                            .padding()
                            .background(Color(.systemGray6))
                            .cornerRadius(12)
                            .overlay(
                                RoundedRectangle(cornerRadius: 12)
                                    .stroke(Color(.systemGray4), lineWidth: 1)
                            )
                    }
                    
                    // Contact Info
                    VStack(alignment: .leading, spacing: 8) {
                        Text("Contact Information (Optional)")
                            .font(.subheadline)
                            .foregroundColor(.secondary)
                        
                        TextField("Email or phone number", text: $contactInfo)
                            .padding()
                            .background(Color(.systemGray6))
                            .cornerRadius(12)
                            .overlay(
                                RoundedRectangle(cornerRadius: 12)
                                    .stroke(Color(.systemGray4), lineWidth: 1)
                            )
                    }
                    
                    Spacer()
                }
                .padding(.horizontal, 20)
            }
            
            // Submit Button
            Button(action: {
                submitFeedback()
            }) {
                Text("Submit Feedback")
                    .font(.headline)
                    .foregroundColor(.white)
                    .frame(maxWidth: .infinity)
                    .frame(height: 56)
                    .background(
                        RoundedRectangle(cornerRadius: 25)
                            .fill(Color.themePrimary)
                    )
                    .padding(.horizontal, 24)
                    .padding(.bottom, 24)
            }
        }
        .navigationBarHidden(true)
    }
    
    private func submitFeedback() {
        // TODO: Implement feedback submission logic
        print("Feedback submitted:")
        print("Type: \(feedbackType.rawValue)")
        print("Message: \(feedbackText)")
        if !contactInfo.isEmpty {
            print("Contact: \(contactInfo)")
        }
        
        // Navigate back to feedback type selection
        Router.shared.pop()
    }
}

// Preview
struct FeedbackView_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView {
            FeedbackView()
                .environmentObject(Router.shared)
        }
    }
}

struct FeedbackDetailView_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView {
            FeedbackDetailView(feedbackType: .excellent)
        }
    }
}