import SwiftUI

struct PostFeedSettingsView: View {

    @Environment(\.language)
    private var language

    @EnvironmentObject
    private var content: Content

    var body: some View {
        ScrollView {
            VStack(alignment: .leading) {
                DetailTitle(title: "Post Feed Settings",
                            text: "Change the way the posts are displayed")

                IntegerPropertyView(
                    title: "Content Width",
                    value: $content.settings.posts.contentWidth,
                    footer: "The maximum width of the content the post feed (in pixels)")

                IntegerPropertyView(
                    title: "Posts Per Page",
                    value: $content.settings.posts.postsPerPage,
                    footer: "The maximum number of posts displayed on a single page")

                FilePropertyView(
                    title: "Default CSS File",
                    footer: "The CSS file containing the styling of all post pages",
                    selectedFile: $content.settings.posts.defaultCssFile)

                FilePropertyView(
                    title: "Swiper CSS File",
                    footer: "The CSS file containing the styling of image galleries in post feeds",
                    selectedFile: $content.settings.posts.swiperCssFile)

                FilePropertyView(
                    title: "Swiper JavaScript File",
                    footer: "The JavaScript file to load the image gallery code in post feeds",
                    selectedFile: $content.settings.posts.swiperJsFile)

                LocalizedPostFeedSettingsView(
                    settings: content.settings.localized(in: language))
            }
            .padding()
        }
    }
}


#Preview {
    PostFeedSettingsView()
        .environmentObject(Content.mock)
        .padding()
}