import ComponentLibrary
import ComposableArchitecture
import Localization
import SwiftUI
import APIClient

public struct ModalCarouselView: View {
    @Bindable private var store: StoreOf<ModalReducer>
    @State private var originalCurrentPageIndicatorColor: UIColor?
    @State private var originalPageIndicatorColor: UIColor?

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

    public var body: some View {
        ZStack {
            /// Dark background overlay
            Color.black.opacity(0.75)
                .frame(maxWidth: .infinity, maxHeight: .infinity)

            modalCarousel
                .clipShape(RoundedRectangle(cornerRadius: 18))
                .shadow(color: .black.opacity(0.25), radius: 4, x: 0, y: 4)
                .padding(.horizontal, 40)
        }
        .ignoresSafeArea()
        .onAppear {
            store.send(.onAppear)
        }
    }

    @ViewBuilder
    private var modalCarousel: some View {
        if store.modals.count <= 1, let modal = store.modals.first {
            ModalPageView(
                modal: modal,
                onPrimaryCTA: { store.send(.primaryCTATapped) },
                onDismiss: { store.send(.dismiss) }
            )
            .frame(maxWidth: 360, maxHeight: 650)
        } else {
            TabView(selection: $store.currentIndex.sending(\.pageChanged)) {
                ForEach(Array(store.modals.enumerated()), id: \.element.id) { index, modal in
                    ModalPageView(
                        modal: modal,
                        onPrimaryCTA: { store.send(.primaryCTATapped) },
                        onDismiss: { store.send(.dismiss) }
                    )
                    .padding(.horizontal, 6)
                    .tag(index)
                }
            }
            .tabViewStyle(.page(indexDisplayMode: .automatic))
            .frame(maxWidth: 372, maxHeight: 650)
            .onAppear {
                // Save original colors
                originalCurrentPageIndicatorColor = UIPageControl.appearance().currentPageIndicatorTintColor
                originalPageIndicatorColor = UIPageControl.appearance().pageIndicatorTintColor

                // Set custom colors for this modal
                UIPageControl.appearance().currentPageIndicatorTintColor = .darkGray
                UIPageControl.appearance().pageIndicatorTintColor = .lightGray
            }
            .onDisappear {
                // Restore original colors
                UIPageControl.appearance().currentPageIndicatorTintColor = originalCurrentPageIndicatorColor
                UIPageControl.appearance().pageIndicatorTintColor = originalPageIndicatorColor
            }
        }
    }
}