Improve page and post detail views

CHDataManagement/Views/Pages/LocalizedPageDetailView.swift

@@ -0,0 +1,70 @@
+import SwiftUI
+import SFSafeSymbols
+
+struct LocalizedPageDetailView: View {
+
+    @ObservedObject
+    private var item: LocalizedPage
+
+    init(page: LocalizedPage, showImagePicker: Bool = false) {
+        self.item = page
+        self.showImagePicker = showImagePicker
+    }
+
+    @State
+    private var showImagePicker = false
+
+    var body: some View {
+        VStack(alignment: .leading) {
+            Text("Link Preview Title")
+                .font(.headline)
+            OptionalTextField("", text: $item.linkPreviewTitle,
+                              prompt: item.title)
+                .textFieldStyle(.roundedBorder)
+            .padding(.bottom)
+
+            HStack {
+                Text("Link Preview Image")
+                    .font(.headline)
+                IconButton(symbol: .squareAndPencilCircleFill,
+                           size: 22,
+                           color: .blue) {
+                    showImagePicker = true
+                }
+
+                IconButton(symbol: .trashCircleFill,
+                           size: 22,
+                           color: .red) {
+                    item.linkPreviewImage = nil
+                }
+                Spacer()
+            }
+
+            .buttonStyle(.plain)
+            if let image = item.linkPreviewImage {
+                image.imageToDisplay
+                    .resizable()
+                    .aspectRatio(contentMode: .fit)
+                    .frame(maxWidth: 400, maxHeight: 300)
+                    .cornerRadius(8)
+            }
+
+            Text("Link Preview Description")
+                .font(.headline)
+                .padding(.top)
+            OptionalDescriptionField(text: $item.linkPreviewDescription)
+                .textFieldStyle(.roundedBorder)
+                .padding(.bottom)
+        }
+        .sheet(isPresented: $showImagePicker) {
+            ImagePickerView(showImagePicker: $showImagePicker) { image in
+                item.linkPreviewImage = image
+            }
+        }
+    }
+}
+
+#Preview {
+    LocalizedPageDetailView(page: .english)
+        .environmentObject(Content.mock)
+}

CHDataManagement/Views/Pages/PageDetailView.swift

@@ -0,0 +1,72 @@
+import SwiftUI
+
+struct PageDetailView: View {
+
+    @Environment(\.language)
+    private var language
+
+    @ObservedObject
+    private var item: Page
+
+    init(page: Page) {
+        self.item = page
+    }
+
+    var body: some View {
+        ScrollView {
+            VStack(alignment: .leading) {
+                Text("ID")
+                    .font(.headline)
+                TextField("", text: $item.id)
+                    .textFieldStyle(.roundedBorder)
+                    .padding(.bottom)
+
+                HStack {
+                    Text("Draft")
+                        .font(.headline)
+                    Spacer()
+                    Toggle("", isOn: $item.isDraft)
+                        .toggleStyle(.switch)
+                }
+                .padding(.bottom)
+
+                HStack {
+                    Text("Start")
+                        .font(.headline)
+                    Spacer()
+                    DatePicker("", selection: $item.startDate, displayedComponents: .date)
+                        .datePickerStyle(.compact)
+                        .padding(.bottom)
+                }
+
+                HStack(alignment: .firstTextBaseline) {
+                    Text("Has end date")
+                        .font(.headline)
+                    Spacer()
+                    Toggle("", isOn: $item.hasEndDate)
+                        .toggleStyle(.switch)
+                        .padding(.bottom)
+                }
+
+                if item.hasEndDate {
+                    HStack(alignment: .firstTextBaseline) {
+                        Text("End date")
+                            .font(.headline)
+                        Spacer()
+                        DatePicker("", selection: $item.endDate, displayedComponents: .date)
+                            .datePickerStyle(.compact)
+                            .padding(.bottom)
+                    }
+                }
+
+                LocalizedPageDetailView(page: item.localized(in: language))
+
+            }
+            .padding()
+        }
+    }
+}
+
+#Preview {
+    PageDetailView(page: .empty)
+}

CHDataManagement/Views/Pages/PageListView.swift

@@ -53,7 +53,7 @@ struct PageListView: View {
             }
         } detail: {
             if let selected {
-                EmptyView()
+                PageDetailView(page: selected)
                     .frame(maxWidth: 350)
             } else {
                 EmptyView()
@@ -111,5 +111,5 @@ struct PageListView: View {
 
 #Preview {
     PageListView()
-        .environmentObject(Content())
+        .environmentObject(Content.mock)
 }