import SwiftUI
import ComponentLibrary

struct OutgoingMessage: View {
    let message: String
    let audioFileName: String?
    
    init(message: String, audioFileName: String? = nil) {
        self.message = message
        self.audioFileName = audioFileName
    }
    
    var body: some View {
        HStack {
            Spacer()
            
            VStack(alignment: .trailing, spacing: 0) {
                if let audioFileName = audioFileName {
                    audioFileView(fileName: audioFileName)
                }
                
                Text(message)
                    .figmaMCPTypography(TypographyV1.FigmaMCP.mediumRegular)
                    .foregroundColor(.white)
                    .tracking(0.32)
                    .multilineTextAlignment(.leading)
                    .padding(12)
                    .background(
                        RoundedRectangle(cornerRadius: 12)
                            .fill(ChatConstants.Colors.Background.Fog.thin)
                    )
            }
        }
    }
    
    @ViewBuilder
    private func audioFileView(fileName: String) -> some View {
        HStack(spacing: 8) {
            Image.FigmaMCP.audioFile
                .resizable()
                .renderingMode(.template)
                .frame(width: 16, height: 16)
                .foregroundColor(ChatConstants.Colors.Foreground.tertiary)
            
            Text(fileName.uppercased())
                .figmaMCPTypography(TypographyV1.FigmaMCP.timecode)
                .foregroundColor(ChatConstants.Colors.Foreground.tertiary)
                .tracking(0.2)
        }
        .padding(.horizontal, 12)
        .padding(.vertical, 8)
        .background(
            RoundedRectangle(cornerRadius: 8)
                .fill(ChatConstants.Colors.Background.Fog.thin)
        )
        .padding(.bottom, 8)
    }
}

#Preview {
    VStack(spacing: 16) {
        OutgoingMessage(message: "I want to make a song about my best friend")
        
        OutgoingMessage(message: "Can you make it upbeat and fun?")
        
        OutgoingMessage(message: "Something with a catchy chorus that talks about all the adventures we've had together")
        
        OutgoingMessage(message: "Here's some audio reference for the style I'm looking for", audioFileName: "audio_1.mp3")
        
        Spacer()
    }
    .padding(.horizontal, 16)
    .background(ChatConstants.Colors.Background.primary)
    .frame(maxWidth: .infinity, maxHeight: .infinity)
}