import SwiftUI

struct InlineLyrics: View {
    let lyrics: LyricsStructure
    let isExpanded: Bool
    let onExpandTap: () -> Void
    let onSeeMoreTap: () -> Void
    
    var body: some View {
        VStack(spacing: 12) {
            // Header
            HStack {
                Text("Lyrics")
                    .font(Constants.Typography.mediumRegular)
                    .kerning(0.32)
                    .foregroundColor(.white)
                
                Spacer()
            }
            
            // Lyrics Content
            VStack(alignment: .leading, spacing: 12) {
                ForEach(Array(displaySections.enumerated()), id: \.offset) { index, section in
                    VStack(alignment: .leading, spacing: 4) {
                        // Section label (e.g., [Chorus], [Verse 1])
                        Text("[\(section.type)]")
                            .font(Constants.Typography.mediumRegular)
                            .kerning(0.32)
                            .foregroundColor(Constants.Colors.Foreground.tertiary)
                        
                        // Section content
                        Text(section.content)
                            .font(Constants.Typography.mediumRegular)
                            .kerning(0.32)
                            .foregroundColor(Constants.Colors.Foreground.tertiary)
                            .lineLimit(isExpanded ? nil : 4)
                            .multilineTextAlignment(.leading)
                    }
                    .frame(maxWidth: .infinity, alignment: .leading)
                }
                
                // See more/less button
                if hasMoreContent {
                    Button(action: onSeeMoreTap) {
                        HStack {
                            Text(isExpanded ? "See less" : "See more")
                                .font(Constants.Typography.mediumTitle)
                                .kerning(0.32)
                                .foregroundColor(Constants.Colors.Accent.brand)
                            Spacer()
                        }
                    }
                }
            }
            .frame(maxWidth: .infinity, alignment: .leading)
        }
        .padding(16)
        .background(
            RoundedRectangle(cornerRadius: 16)
                .fill(Constants.Colors.Background.Fog.thin)
        )
    }
    
    private var displaySections: [LyricsSection] {
        if isExpanded {
            return lyrics.sections
        } else {
            // Show only first 2 sections when collapsed
            return Array(lyrics.sections.prefix(2))
        }
    }
    
    private var hasMoreContent: Bool {
        lyrics.sections.count > 2
    }
}

#Preview {
    let sampleLyrics = LyricsStructure(sections: [
        LyricsSection(type: "Chorus", content: "My friend, my friend, a heart of gold\nA story whispered, never getting old\nThrough stormy weather, you're always there\nA bond unbreakable, beyond compare"),
        LyricsSection(type: "Verse 1", content: "My friend, my friend, a heart of gold\nA story whispered, never getting old\nThrough stormy weather, you're always there\nA bond unbreakable, beyond compare"),
        LyricsSection(type: "Verse 2", content: "In laughter and in tears we stand\nSide by side, hand in hand\nMemories we've made so true\nI'm grateful for a friend like you")
    ])
    
    VStack(spacing: 20) {
        InlineLyrics(
            lyrics: sampleLyrics,
            isExpanded: false,
            onExpandTap: { print("Expand tapped") },
            onSeeMoreTap: { print("See more tapped") }
        )
        
        InlineLyrics(
            lyrics: sampleLyrics,
            isExpanded: true,
            onExpandTap: { print("Expand tapped") },
            onSeeMoreTap: { print("See more tapped") }
        )
    }
    .padding()
    .background(Constants.Colors.Background.primary)
}