import SwiftUI

enum SavedItemType {
    case lyrics
    case styles
    
    var icon: String {
        switch self {
        case .lyrics: return "Icon/lyrics"
        case .styles: return "Icon/genres"
        }
    }
    
    var sampleData: [SavedItem] {
        switch self {
        case .lyrics:
            return [
                SavedItem(title: "Lonely road", subtitle: "3d ago"),
                SavedItem(title: "Lonely road", subtitle: "3d ago"),
                SavedItem(title: "Lonely road", subtitle: "3d ago"),
                SavedItem(title: "Lonely road", subtitle: "3d ago"),
                SavedItem(title: "Lonely road", subtitle: "3d ago"),
                SavedItem(title: "Lonely road", subtitle: "3d ago")
            ]
        case .styles:
            return [
                SavedItem(title: "Rnb indie vibes", subtitle: "3d ago"),
                SavedItem(title: "Rnb indie vibes", subtitle: "3d ago"),
                SavedItem(title: "Rnb indie vibes", subtitle: "3d ago"),
                SavedItem(title: "Rnb indie vibes", subtitle: "3d ago"),
                SavedItem(title: "Rnb indie vibes", subtitle: "3d ago"),
                SavedItem(title: "Rnb indie vibes", subtitle: "3d ago")
            ]
        }
    }
}

struct SavedItemsView: View {
    @State private var searchText: String = ""
    @Environment(\.dismiss) private var dismiss
    
    let itemType: SavedItemType
    let onItemSelected: ((String) -> Void)?
    
    init(itemType: SavedItemType, onItemSelected: ((String) -> Void)? = nil) {
        self.itemType = itemType
        self.onItemSelected = onItemSelected
    }
    
    private var displayItems: [SavedItem] {
        itemType.sampleData
    }
    
    var body: some View {
        VStack(spacing: 0) {
            // Drag handle
            RoundedRectangle(cornerRadius: 100)
                .fill(Color.white.opacity(0.1))
                .frame(width: 32, height: 4)
                .padding(16)
            
            // Search bar
            HStack(spacing: 12) {
                Image("Icon/search")
                    .resizable()
                    .renderingMode(.template)
                    .foregroundColor(Constants.Colors.Foreground.primary)
                    .frame(width: 16, height: 16)
                
                TextField("", text: $searchText, prompt: Text("Search")
                    .foregroundColor(Constants.Colors.Foreground.inactive))
                    .font(Constants.Typography.small)
                    .foregroundColor(Constants.Colors.Foreground.primary)
                    .tracking(0.28)
            }
            .padding(.horizontal, 16)
            .padding(.vertical, 8)
            .frame(height: 40)
            .background(Constants.Colors.Background.Fog.thin)
            .clipShape(RoundedRectangle(cornerRadius: 100))
            .padding(.horizontal, 24)
            .padding(.bottom, 16)
            
            // Items list
            List {
                ForEach(displayItems) { item in
                    HStack(spacing: 8) {
                        Image(itemType.icon)
                            .foregroundColor(Constants.Colors.Foreground.primary)
                            .frame(width: 24, height: 24)
                        
                        VStack(alignment: .leading, spacing: 4) {
                            Text(item.title)
                                .font(Constants.Typography.mediumRegular)
                                .foregroundColor(Constants.Colors.Foreground.primary)
                            
                            Text(item.subtitle)
                                .font(Constants.Typography.xSmallRegular)
                                .foregroundColor(Constants.Colors.Foreground.secondary)
                        }
                        
                        Spacer()
                        
                        Image("Icon/more-horizontal")
                            .foregroundColor(Constants.Colors.Foreground.tertiary)
                            .frame(width: 24, height: 24)
                    }
                    .listRowBackground(Color.clear)
                    .listRowSeparator(.hidden)
                    .onTapGesture {
                        onItemSelected?(item.title)
                        dismiss()
                    }
                }
            }
            .listStyle(PlainListStyle())
            .scrollContentBackground(.hidden)
            
            Spacer(minLength: 0)
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(
            Constants.Colors.Background.secondary
        )
    }
}

// MARK: - Supporting Types

struct SavedItem: Identifiable {
    let id = UUID()
    let title: String
    let subtitle: String
}

// MARK: - Convenience Extensions

extension SavedItemsView {
    /// Creates a SavedItemsView for lyrics
    static func lyrics(onItemSelected: ((String) -> Void)? = nil) -> SavedItemsView {
        SavedItemsView(itemType: .lyrics, onItemSelected: onItemSelected)
    }
    
    /// Creates a SavedItemsView for styles  
    static func styles(onItemSelected: ((String) -> Void)? = nil) -> SavedItemsView {
        SavedItemsView(itemType: .styles, onItemSelected: onItemSelected)
    }
}

// MARK: - Preview
#Preview {
    VStack {
        Text("Main Content")
            .font(Constants.Typography.largeTitle)
            .foregroundColor(Constants.Colors.Foreground.primary)
    }
    .frame(maxWidth: .infinity, maxHeight: .infinity)
    .background(Constants.Colors.Background.primary)
    .sheet(isPresented: .constant(true)) {
        SavedItemsView.lyrics { selectedItem in
            print("Selected lyrics: \(selectedItem)")
        }
    }
}