import SwiftUI
import SFSafeSymbols

struct PageDetailView: View {

    @Environment(\.language)
    private var language

    @EnvironmentObject
    private var content: Content

    @ObservedObject
    private var page: Page

    private var transferImage: (language: ContentLanguage, image: FileResource)? {
        page.localized(in: language.next).linkPreview.image.map { (language.next, $0) }
    }

    init(page: Page) {
        self.page = page
    }

    var body: some View {
        ScrollView {
            VStack(alignment: .leading) {
                DetailTitle(
                    title: "Page",
                    text: "A page contains longer content")
                IdPropertyView(
                    id: $page.id,
                    footer: "The page id is used to link to it internally.",
                    validation: page.isValid,
                    update: { page.update(id: $0) })

                OptionalStringPropertyView(
                    title: "External url",
                    text: $page.externalLink,
                    footer: "Set an external url to mark this page as external. It will not be generated, and links will be created using the provided url")

                BoolPropertyView(
                    title: "Draft",
                    value: $page.isDraft,
                    footer: "Indicate a page as a draft to hide it from the website")
                .disabled(page.isExternalUrl)
                .onChange(of: page.externalLink) { _, newValue in
                    // Ensure that external pages are not drafts
                    if newValue != nil && page.isDraft {
                        page.isDraft = false
                    }
                }

                BoolPropertyView(
                    title: "Hide date",
                    value: $page.hideDate,
                    footer: "Do not show the date string on the page")
                .disabled(page.isExternalUrl)

                DatePropertyView(
                    title: "Start date",
                    value: $page.startDate,
                    footer: "The date when the page content started")
                .disabled(page.isExternalUrl)

                OptionalDatePropertyView(
                    title: "End date",
                    isEnabled: $page.hasEndDate,
                    date: $page.potentialEndDate,
                    footer: "The date when the page content ended")
                .disabled(page.isExternalUrl)

                LocalizedPageDetailView(
                    isExternalPage: page.isExternalUrl,
                    page: page.localized(in: language),
                    transferImage: transferImage)
                .id(page.id + language.rawValue)
            }
            .padding()
        }
    }
}

extension PageDetailView: MainContentView {

    init(item: Page) {
        self.init(page: item)
    }

    static let itemDescription = "a page"
}


#Preview {
    PageDetailView(page: Page.Mock.empty)
}