import Foundation
import SwiftUI

struct CommentReplyOverlayView: View {
    let hasReplyComment: Bool
    let replyRootCommentUserDisplayName: String
    let replyRootCommentContent: String
    let onClearReplyTarget: () -> Void

    let backgroundColor: Color

    init(
        hasReplyComment: Bool,
        replyRootCommentUserDisplayName: String,
        replyRootCommentContent: String,
        onClearReplyTarget: @escaping () -> Void,
        backgroundColor: Color = .SemanticV1.backgroundTertiary
    ) {
        self.hasReplyComment = hasReplyComment
        self.replyRootCommentUserDisplayName = replyRootCommentUserDisplayName
        self.replyRootCommentContent = replyRootCommentContent
        self.onClearReplyTarget = onClearReplyTarget
        self.backgroundColor = backgroundColor
    }

    var body: some View {
        HStack {
            Text(replyRootCommentUserDisplayName)
                .typographyV1(.caption3)
                .foregroundStyle(Color.SemanticV1.textSecondary)
                .padding(.leading, 24.0)

            if hasReplyComment {
                Text(replyRootCommentContent)
                    .typographyV1(.caption3)
                    .foregroundStyle(Color.SemanticV1.textTertiary)
                    .padding(.leading, 8.0)
                    .lineLimit(1)
                    .opacity(.half)
            }

            Spacer()

            Image.Icon.close
                .resizable()
                .foregroundStyle(Color.SemanticV1.textSecondary)
                .frame(width: 16.0, height: 16.0)
                .padding(.trailing, 24.0)
                .contentShape(.rect)
                .onTapGesture {
                    onClearReplyTarget()
                }
        }
        .frame(height: 42.0)
        .background {
            Rectangle()
                .fill(.ultraThinMaterial)
                .overlay(backgroundColor)
        }
        .offset(y: hasReplyComment ? 0.0 : 8.0)
        .opacity(hasReplyComment ? 1.0 : 0.0)
        .animation(.easeInOut(duration: 0.15), value: hasReplyComment)
    }
}