import SwiftUI

struct PostDetailView: View {
    let post: MoebooruPost
    @State var loadingStage: PostLoadingState = .loadingPreview

    var body: some View {
        VStack {
            Link(destination: URL(string: "https://yande.re/post/show/\(post.id)")!) {
                AsyncImage(url: post.sampleURL) { image in
                    image
                        .resizable()
                        .scaledToFit()
                        .onAppear {
                            self.loadingStage = .loaded
                        }
                } placeholder: {
                    AsyncImage(url: post.previewURL) { image in
                        image
                            .resizable()
                            .scaledToFit()
                            .onAppear {
                                self.loadingStage = .loadingFile
                            }
                    } placeholder: {
                        ProgressView()
                            .progressViewStyle(LinearProgressViewStyle())
                            .padding()
                            .onAppear {
                                self.loadingStage = .loadingPreview
                            }
                    }
                    .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)
                    .id(post.fileURL)
                }
                .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)
                .id(post.fileURL)
            }
            .buttonStyle(PlainButtonStyle())

            Spacer()

            VStack(spacing: 5) {
                HStack {
                    Text(post.tags.joined(separator: ", "))
                }
                .frame(maxWidth: .infinity, alignment: .leading)

                HStack {
                    Text(post.createdAt.formatted())
                        .frame(maxWidth: .infinity, alignment: .leading)

                    Group {
                        switch loadingStage {
                        case .loadingPreview:
                            Text("Loading preview …")
                        case .loadingFile:
                            Text("Loading file …")
                        case .loaded:
                            EmptyView()
                        }
                    }
                    .padding(.trailing, 5)
                }
                .frame(maxWidth: .infinity, alignment: .leading)
                .foregroundStyle(.secondary)
            }
            .padding(.horizontal, 10)
            .padding(.vertical, 10 / 1.33)
            .textSelection(.enabled)
            .font(.footnote)
            .background(.opacity(0.1))
        }
    }
}