import SwiftUI
import ComposableArchitecture

struct FeedListView: View {
    let store: StoreOf<FeedListFeature>
    
    var body: some View {
        WithViewStore(self.store, observe: { $0 }) { viewStore in
            GeometryReader { geometry in
                ZStack {
                    // 背景图片
                    Image("bg")
                        .resizable()
                        .aspectRatio(contentMode: .fill)
                        .frame(maxWidth: .infinity, maxHeight: .infinity)
                        .clipped()
                        .ignoresSafeArea(.all)
                    VStack(alignment: .center, spacing: 0) {
                        // 顶部栏
                        HStack {
                            Spacer(minLength: 0)
                            Spacer(minLength: 0)
                            Text("Enjoy your Life Time")
                                .font(.system(size: 22, weight: .semibold))
                                .foregroundColor(.white)
                                .frame(maxWidth: .infinity, alignment: .center)
                            Spacer(minLength: 0)
                            Button(action: {
                                viewStore.send(.editFeedButtonTapped)
                            }) {
                                Image("add icon")
                                    .resizable()
                                    .frame(width: 36, height: 36)
                            }
                        }
                        .padding(.horizontal, 20)
                        .padding(.top, geometry.safeAreaInsets.top)
                        // 其他内容
                        Image(systemName: "heart.fill")
                            .font(.system(size: 60))
                            .foregroundColor(.red)
                            .padding(.top, 40)
                        Text("The disease is like a cruel ruler,\nand time is our most precious treasure.\nEvery moment we live is a victory\nagainst the inevitable.")
                            .font(.system(size: 16))
                            .multilineTextAlignment(.center)
                            .foregroundColor(.white.opacity(0.9))
                            .padding(.horizontal, 30)
                            .padding(.bottom, 30)
                        Spacer()
                    }
                    .frame(maxWidth: .infinity, alignment: .top)
                }
            }
            .onAppear {
                viewStore.send(.onAppear)
            }
            .sheet(isPresented: viewStore.binding(
                get: \.isEditFeedPresented,
                send: { $0 ? .editFeedButtonTapped : .editFeedDismissed }
            )) {
                EditFeedView()
            }
        }
    }
}