import SwiftUI

public struct FullScreenTooltipView: View {
    let auraOverlayIcon: Image
    let titleText: String
    let subtitleText: String
    let subtitleTextIcon: Image?
    let buttonText: String
    let action: () -> Void

    public init(auraOverlayIcon: Image, titleText: String, subtitleText: String, subtitleTextIcon: Image?, buttonText: String, action: @escaping () -> Void) {
        self.auraOverlayIcon = auraOverlayIcon
        self.titleText = titleText
        self.subtitleText = subtitleText
        self.subtitleTextIcon = subtitleTextIcon
        self.buttonText = buttonText
        self.action = action
    }

    public var body: some View {
        VStack(spacing: 0) {
            Spacer()
                .frame(height: UIScreen.height * 0.33)

            ZStack {
                Color.clear
                    .frame(width: 50, height: 50)
                    .background {
                        #if targetEnvironment(simulator)
                            Color.orange
                        #else
                            AuraShaderView(
                                id: "omniplayer_tooltip",
                                colorSet: .custom(
                                    .custom(1.0846897, 0.07778742, 0.4651054),
                                    .custom(1.0, 0.28235295, 0.16078432),
                                    .custom(1.0, 0.69803923, 0.003921569)
                                ),
                                morphSpeed: 0.05,
                                scale: 0.820,
                                seed: 2.000
                            )
                        #endif
                    }
                    .clipShape(Circle())

                auraOverlayIcon
                    .resizable()
                    .frame(width: 32, height: 32)
            }
            .padding(.bottom, 15)

            Text(titleText)
                .typographyV1(.body5)
                .foregroundColor(.SemanticV2.omniplayerWhite)
                .padding(.bottom, 4)

            HStack(spacing: 0) {
                Text(subtitleText)
                    .typographyV1(.body6)
                    .foregroundStyle(Color.SemanticV2.foregroundTertiaryGlass)

                if let subtitleTextIcon = subtitleTextIcon {
                    subtitleTextIcon
                        .renderingMode(.template)
                        .resizable()
                        .frame(width: 24, height: 24)
                        .foregroundColor(Color.SemanticV2.foregroundTertiaryGlass)
                }
            }
            .padding(.bottom, 15)

            Button {
                action()
            } label: {
                Text(buttonText)
                    .typographyV1(.body6)
                    .foregroundStyle(Color.SemanticV2.omniplayerBlack)
            }
            .padding(.vertical, 8)
            .padding(.horizontal, 16)
            .background {
                Capsule()
                    .fill(Color.SemanticV2.omniplayerWhite)
            }

            Spacer()
        }
    }
}

private extension TypographyV1 {
    /// size: 18pt, lineHeight: 24pt, weight: medium, kerning: 0.02
    static let body5: TypographyV1 = .init(
        name: "Body 5",
        size: 18,
        style: .body,
        weight: .ppNeueMontrealMedium,
        kerning: 0.02,
        lineHeight: 24
    )

    /// size: 16pt, lineHeight: 24pt, weight: regular, kerning: 0.02
    static let body6: TypographyV1 = .init(
        name: "Body 6",
        size: 18,
        style: .body,
        weight: .ppNeueMontrealRegular,
        kerning: 0.02,
        lineHeight: 24
    )
}

#Preview {
    FullScreenTooltipView(auraOverlayIcon: Image.Omniplayer.arrowRight, titleText: "title", subtitleText: "subtitle", subtitleTextIcon: nil, buttonText: "got it", action: {})
}