import SwiftUI

struct SaveOptions: View {
    let songTitle: String?
    @State private var selectedWorkspace: String = "My Workspace"
    let onWorkspaceChange: ((String) -> Void)?
    
    init(songTitle: String? = nil, selectedWorkspace: String = "My Workspace", onWorkspaceChange: ((String) -> Void)? = nil) {
        self.songTitle = songTitle
        self._selectedWorkspace = State(initialValue: selectedWorkspace)
        self.onWorkspaceChange = onWorkspaceChange
    }
    
    var body: some View {
        VStack(spacing: 1) {
            // Song Title Row
            HStack(spacing: 8) {
                Image("Icon/music-note")
                    .resizable()
                    .renderingMode(.template)
                    .aspectRatio(contentMode: .fit)
                    .foregroundColor(Constants.Colors.Foreground.primary)
                    .frame(width: 16, height: 16)
                
                Text(songTitle ?? "Song Title")
                    .font(Constants.Typography.small)
                    .foregroundColor(songTitle != nil ? Constants.Colors.Foreground.primary : Constants.Colors.Background.Fog.dense)
                    .lineLimit(1)
                
                Spacer()
            }
            .padding(.horizontal, 16)
            .frame(height: 56)
            .background(Constants.Colors.Background.Fog.thin)
            
            // Save to Workspace Row
            HStack(spacing: 8) {
                // Left side - Folder icon and "Save to..." text
                HStack(spacing: 8) {
                    Image("Icon/folder")
                        .resizable()
                        .renderingMode(.template)
                        .aspectRatio(contentMode: .fit)
                        .foregroundColor(Constants.Colors.Foreground.primary)
                        .frame(width: 16, height: 16)
                    
                    Text("Save to...")
                        .font(Constants.Typography.small)
                        .foregroundColor(Constants.Colors.Foreground.primary)
                        .lineLimit(1)
                }
                
                Spacer()
                
                // Right side - Workspace selector button
                Button(action: {
                    // Handle workspace selection
                    print("Workspace selector tapped")
                    onWorkspaceChange?(selectedWorkspace)
                }) {
                    Text(selectedWorkspace)
                        .font(Constants.Typography.xSmallTitle)
                        .foregroundColor(Constants.Colors.Foreground.primary)
                        .tracking(0.24)
                        .padding(.horizontal, 16)
                        .frame(height: 40)
                        .background(Constants.Colors.Background.Fog.thin)
                        .clipShape(RoundedRectangle(cornerRadius: 100))
                }
                .buttonStyle(PlainButtonStyle())
            }
            .padding(.horizontal, 16)
            .frame(height: 56)
            .background(Constants.Colors.Background.Fog.thin)
        }
        .clipShape(RoundedRectangle(cornerRadius: 16))
    }
}

// MARK: - Preview
#Preview {
    VStack(spacing: 20) {
        SaveOptions(
            songTitle: "My Awesome Song"
        )
        
        SaveOptions(
            songTitle: nil
        )
        
        SaveOptions(
            songTitle: "Long Song Title That Should Truncate",
            selectedWorkspace: "Custom Workspace"
        ) { workspace in
            print("Selected workspace: \(workspace)")
        }
    }
    .padding()
    .background(Constants.Colors.Background.secondary)
}