import SwiftUI

struct FeedView: View {
    @State private var viewModel = FeedViewModel()

    var body: some View {
        ScrollView {
            VStack(alignment: .leading, spacing: DS.Spacing.cardGap) {
                // Header
                HStack {
                    VStack(alignment: .leading, spacing: 4) {
                        Text("FEED")
                            .font(DS.Fonts.caption)
                            .foregroundStyle(DS.Colors.textQuaternary)
                            .kerning(3)
                        Text("Latest Intel")
                            #if os(tvOS)
                            .font(DS.Fonts.tvSectionTitle)
                            #else
                            .font(DS.Fonts.sectionTitle)
                            #endif
                            .foregroundStyle(DS.Colors.textPrimary)
                    }

                    Spacer()

                    if viewModel.isLoading {
                        ProgressView()
                    }
                }

                if viewModel.items.isEmpty && !viewModel.isLoading {
                    VStack(spacing: 16) {
                        Image(systemName: "newspaper")
                            .font(.system(size: 44))
                            .foregroundStyle(DS.Colors.textQuaternary)
                        Text("No feed items yet")
                            .font(DS.Fonts.body)
                            .foregroundStyle(DS.Colors.textTertiary)
                    }
                    .frame(maxWidth: .infinity)
                    .padding(.top, 80)
                } else {
                    LazyVStack(spacing: DS.Spacing.itemGap) {
                        ForEach(viewModel.items) { item in
                            FeedItemView(item: item)
                        }
                    }
                }
            }
            .padding(.horizontal, edgeInset)
            .padding(.vertical, DS.Spacing.sectionGap)
        }
        .background(DS.Colors.background)
        .task {
            await viewModel.loadFeed()
        }
        .onAppear {
            viewModel.startAutoRefresh()
        }
        .onDisappear {
            viewModel.stopAutoRefresh()
        }
    }

    #if os(tvOS)
    private var edgeInset: CGFloat { 60 }
    #else
    private var edgeInset: CGFloat { 20 }
    #endif
}