import Foundation
import SwiftUI

// used as an overlay ontop of a Hook to blur out the hook content behind it, typically for when a hook has been reported or creator has been hidden
public struct HookBlurOverlayView: View {
    public let titleText: String
    public let descriptionText: String
    public var buttonAction: (() -> Void)?
    public var buttonText: String?
    let darkTrait = UITraitCollection(userInterfaceStyle: .dark)

    public init(titleText: String, descriptionText: String, buttonAction: (() -> Void)? = nil, buttonText: String? = nil) {
        self.titleText = titleText
        self.descriptionText = descriptionText
        self.buttonAction = buttonAction
        self.buttonText = buttonText
    }

    private func resolveColorForDarkTrait(_ color: Color) -> Color {
        Color(UIColor(color).resolvedColor(with: darkTrait))
    }

    private var backgroundColor: Color {
        return resolveColorForDarkTrait(Color.SemanticV2.backgroundSmokeThin)
    }

    public var body: some View {
        VStack(spacing: 0) {
            Spacer()
            checkIcon
            title
            description
            actionButton
            Spacer()
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background {
            Rectangle()
                .fill(.ultraThinMaterial)
                .overlay(backgroundColor)
                .ignoresSafeArea()
        }
        .ignoresSafeArea()
    }

    @ViewBuilder
    public var checkIcon: some View {
        Image.Icon.checkV1
            .resizable()
            .foregroundColor(.SemanticV2.accentPink)
            .frame(width: 32, height: 32)
            .padding(9)
            .background {
                Circle()
                    .fill(.ultraThinMaterial)
            }
            .padding(.bottom, 15)
    }

    @ViewBuilder
    public var title: some View {
        Text(titleText)
            .typographyV1(.titleFont)
            .foregroundStyle(Color.SemanticV2.foregroundPrimary)
    }

    @ViewBuilder
    public var description: some View {
        Text(descriptionText)
            .typographyV1(.descriptionFont)
            .foregroundStyle(Color.SemanticV2.foregroundPrimary)
            .opacity(0.5)
            .padding(.horizontal, 75)
            .padding(.bottom, 15)
            .multilineTextAlignment(.center)
    }

    @ViewBuilder
    public var actionButton: some View {
        if let buttonAction = buttonAction, let buttonText = buttonText {
            Button {
                buttonAction()
            } label: {
                Text(buttonText)
                    .typographyV1(.buttonFont)
                    .foregroundStyle(Color.SemanticV2.backgroundPrimary)
            }
            .padding(.vertical, 4)
            .padding(.horizontal, 16)
            .background(Color.SemanticV2.foregroundPrimary)
            .clipShape(Capsule())
        }
    }
}

private extension TypographyV1 {
    static let titleFont: TypographyV1 = .init(
        name: "Title Font",
        size: 18,
        style: .body,
        weight: .neueMontrealMedium,
        kerning: 0.36,
        lineHeight: 24
    )

    static let descriptionFont: TypographyV1 = .init(
        name: "Description Font",
        size: 16,
        style: .body,
        weight: .neueMontrealRegular,
        kerning: 0.32,
        lineHeight: 24
    )

    static let buttonFont: TypographyV1 = .init(
        name: "Button Font",
        size: 14,
        style: .body,
        weight: .neueMontrealMedium,
        lineHeight: 24
    )
}