import APIClient
import ComponentLibrary
import ComposableArchitecture
import Localization
import NavigationRouterClient
import SwiftUI
import Utilities

@Reducer
public struct CreditsPopup {
    @ObservableState
    public struct State: Equatable {
        @Shared var me: Me
        let billingInfo: SubscriptionInfoResponse

        public init(me: Shared<Me>, billingInfo: SubscriptionInfoResponse) {
            self._me = me
            self.billingInfo = billingInfo
        }
    }

    public enum Action {
        case dismiss
        case upgradeTapped
    }

    @Dependency(\.dismiss) var dismiss
    @Dependency(NavigationRouterClient.self) var navigationRouter

    public init() {}

    public var body: some ReducerOf<Self> {
        Reduce { _, action in
            switch action {
            case .dismiss:
                return .run { _ in await dismiss() }

            case .upgradeTapped:
                return .run { _ in
                    await dismiss()
                    navigationRouter.send(route: .subscriptions)
                }
            }
        }

        Analytics()
    }
}

public struct CreditsPopupScreen: View {
    private let store: StoreOf<CreditsPopup>

    public init(store: StoreOf<CreditsPopup>) {
        self.store = store
    }

    public var body: some View {
        VStack(spacing: 0) {
            Image.Icon.logoV1
                .resizable()
                .aspectRatio(contentMode: .fit)
                .frame(height: 16, alignment: .center)
                .foregroundStyle(Color.SemanticV1.textPrimary)
                .padding(.top, 40)
                .padding(.bottom, 32)

            HStack(alignment: .center, spacing: 8) {
                Spacer()
                Text("\(store.billingInfo.songsLeft)")
                    .foregroundStyle(Color.SemanticV1.textPrimary)
                    .typographyV1(.headline2)
                Text(L10n.FeatureRoot.creditsPopupTitle)
                    .foregroundStyle(Color.SemanticV1.textPrimary)
                    .typographyV1(.headline4)
                Spacer()
            }
            .padding(.bottom, 10)

            Text(L10n.FeatureRoot.creditsPopupMessage)
                .multilineTextAlignment(.center)
                .lineLimit(7)
                .fixedSize(horizontal: false, vertical: true)
                .foregroundStyle(Color.SemanticV1.textSecondary)
                .typographyV1(.headline5)
                .padding(.bottom, 32)

            if store.me.flags[FlagKey.iosSubscriptions] == true {
                AuraButton(
                    title: L10n.FeatureRoot.creditsPopupButton,
                    auraStyle: .orangeAura,
                    withGradientOverlay: false,
                    action: { store.send(.upgradeTapped) }
                )
                .pillButtonSizeV1(.medium)
                .environment(\.colorScheme, .light)
            }
        }
        .overlay(alignment: .topTrailing) {
            ToolbarButton(.close) { store.send(.dismiss) }
        }
        .padding(20)
        .frame(maxWidth: .infinity)
        .ignoresSafeArea()
        .presentationBackground(Color.SemanticV1.alwaysBlack1.opacity(0.9))
        .environment(\.colorScheme, .dark)
    }
}