import Foundation
import SwiftUI

struct CommentEmojiBar: View {
    let emojis: [String]
    let onTapEmoji: (String) -> Void

    init(emojis: [String], onTapEmoji: @escaping (String) -> Void) {
        self.emojis = emojis
        self.onTapEmoji = onTapEmoji
    }

    var body: some View {
        ZStack {
            ScrollView(.horizontal) {
                LazyHStack(spacing: 8.0) {
                    ForEach(emojis, id: \.self) { emoji in
                        Button {
                            onTapEmoji(emoji)
                        } label: {
                            Text(emoji)
                                .font(.system(size: 27.2))
                                .padding(.trailing, 16.0)
                        }
                    }
                }
                .frame(height: 32.0)
            }
            .scrollIndicators(.hidden)
            .contentMargins(.zero, for: .scrollContent)
            .safeAreaPadding(.horizontal, 16)
        }
        .mask {
            HStack(spacing: .zero) {
                LinearGradient(
                    colors: [
                        Color.white.opacity(.zero),
                        Color.white.opacity(1.0),
                    ],
                    startPoint: .leading,
                    endPoint: .trailing
                )
                .frame(width: 16)
                Color.white
                LinearGradient(
                    colors: [
                        Color.white.opacity(1.0),
                        Color.white.opacity(.zero),
                    ],
                    startPoint: .leading,
                    endPoint: .trailing
                )
                .frame(width: 16)
            }
        }
    }
}

#Preview {
    CommentEmojiBar(
        emojis: ["😂", "😒", "🙈", "😋", "👏", "👌", "😑", "🧐", "😎", "😏"],
        onTapEmoji: { _ in }
    )
}