//
//  ActionsComponent.swift
//  vibes
//
//  Created by Claude Code on 7/30/25.
//

import SwiftUI

struct ActionsComponent: View {
    let onAudioTap: () -> Void
    let onPersonaTap: (() -> Void)?
    let onUploadTap: (() -> Void)?
    
    init(onAudioTap: @escaping () -> Void, onPersonaTap: (() -> Void)? = nil, onUploadTap: (() -> Void)? = nil) {
        self.onAudioTap = onAudioTap
        self.onPersonaTap = onPersonaTap
        self.onUploadTap = onUploadTap
    }
    
    var body: some View {
        HStack(spacing: 1) { // gap-px = 1px between buttons
            // Audio Button with Menu
            ActionButtonWithMenu(
                title: "Audio",
                iconName: "Icon/plus",
                menuItems: [
                    ("Upload", "Icon/upload", { onUploadTap?() }),
                    ("Record", "Icon/microphone", { print("Record selected") }),
                    ("Library", "Icon/library", { print("Library selected") })
                ]
            )
            
            // Voice Button
            ActionButton(
                title: "Voice",
                action: onPersonaTap ?? {}
            )
        
        }
        .clipShape(RoundedRectangle(cornerRadius: 16)) // rounded-2xl = 16px
    }
}

struct ActionButton: View {
    let title: String
    let badgeText: String?
    let iconName: String
    let action: () -> Void
    
    init(title: String, badgeText: String? = nil, iconName: String = "Icon/plus", action: @escaping () -> Void) {
        self.title = title
        self.badgeText = badgeText
        self.iconName = iconName
        self.action = action
    }
    
    var body: some View {
        Button(action: action) {
            HStack(spacing: 8) { // gap-2 = 8px
                // Icon
                Image(iconName)
                    .resizable()
                    .renderingMode(.template)
                    .foregroundColor(Constants.ForegroundPrimary) // #faf7f5
                    .frame(width: 16, height: 16)
                
                // Button Text
                Text(title)
                    .font(Constants.Typography.small) // 14px PP Neue Montreal Regular
                    .foregroundColor(Constants.ForegroundPrimary) // #faf7f5
                    .lineLimit(1)
                
            }
            .frame(maxWidth: .infinity)
            .frame(height: 48) // Reasonable height for the buttons
            .background(
                Color.white.opacity(0.04) // Background/Fog/Thin: #ffffff0a
            )
        }
        .buttonStyle(ActionButtonStyle())
    }
}

struct ActionButtonWithMenu: View {
    let title: String
    let iconName: String
    let menuItems: [(String, String, () -> Void)] // (title, iconName, action)
    
    init(title: String, iconName: String = "Icon/plus", menuItems: [(String, String, () -> Void)]) {
        self.title = title
        self.iconName = iconName
        self.menuItems = menuItems
    }
    
    var body: some View {
        Menu {
            ForEach(0..<menuItems.count, id: \.self) { index in
                let item = menuItems[index]
                Button {
                    item.2() // action
                } label: {
                    // Alternative approach with explicit HStack for guaranteed left alignment
                    HStack(spacing: 8) {
                        Image(item.1) // iconName
                            .resizable()
                            .renderingMode(.template)
                            .foregroundColor(Constants.Colors.Foreground.primary)
                            .frame(width: 16, height: 16)
                        
                        Text(item.0) // title
                            .foregroundColor(Constants.Colors.Foreground.primary)
                        
                        Spacer()
                    }
                }
            }
        } label: {
            HStack(spacing: 8) { // gap-2 = 8px
                // Icon
                Image(iconName)
                    .resizable()
                    .renderingMode(.template)
                    .foregroundColor(Constants.ForegroundPrimary) // #faf7f5
                    .frame(width: 16, height: 16)
                
                // Button Text
                Text(title)
                    .font(Constants.Typography.small) // 14px PP Neue Montreal Regular
                    .foregroundColor(Constants.ForegroundPrimary) // #faf7f5
                    .lineLimit(1)
                
            }
            .frame(maxWidth: .infinity)
            .frame(height: 48) // Reasonable height for the buttons
            .background(
                Color.white.opacity(0.04) // Background/Fog/Thin: #ffffff0a
            )
        }
        .preferredColorScheme(.dark) // Force dark appearance for menu
        .buttonStyle(ActionButtonStyle())
    }
}

// Custom button style for press effects
struct ActionButtonStyle: ButtonStyle {
    func makeBody(configuration: Configuration) -> some View {
        configuration.label
            .scaleEffect(configuration.isPressed ? 0.98 : 1.0)
            .opacity(configuration.isPressed ? 0.8 : 1.0)
            .animation(.easeInOut(duration: 0.1), value: configuration.isPressed)
    }
}

#Preview {
    ActionsComponent(
        onAudioTap: {
            print("Audio tapped")
        },
        onPersonaTap: {
            print("Persona tapped")
        }
    )
    .padding()
    .background(Constants.BackgroundPrimary)
}