Improve page and post detail views

This commit is contained in:
Christoph Hagen
2024-12-07 00:09:35 +01:00
parent 42a5d01480
commit 394cf7a2e4
13 changed files with 355 additions and 109 deletions

View File

@ -0,0 +1,64 @@
import SwiftUI
struct LocalizedPostDetailView: View {
@ObservedObject
private var item: LocalizedPost
init(post: LocalizedPost, showImagePicker: Bool = false) {
self.item = post
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
}
}
}
}

View File

@ -34,115 +34,64 @@ struct PostDetailView: View {
private var language
@ObservedObject
var post: Post
@State
private var showPagePicker = false
private var item: Post
init(post: Post) {
self.post = post
}
private var linkedPageText: String {
if let page = post.linkedPage {
return page.localized(in: language).title
}
return "Add"
self.item = post
}
var body: some View {
ScrollView {
VStack(alignment: .leading) {
Text("Post data")
Text("ID")
.font(.headline)
DetailListItem {
Text("ID")
.foregroundStyle(.primary)
TextField("ID", text: $post.id)
.multilineTextAlignment(.trailing)
}
DetailListItem {
TextField("", text: $item.id)
.textFieldStyle(.roundedBorder)
.padding(.bottom)
HStack {
Text("Draft")
.font(.headline)
Spacer()
Toggle(isOn: $post.isDraft) {
Text("")
}.toggleStyle(.switch)
Toggle("", isOn: $item.isDraft)
.toggleStyle(.switch)
}
DetailListItem {
.padding(.bottom)
HStack {
Text("Start")
.font(.headline)
Spacer()
DatePicker("", selection: $post.startDate, displayedComponents: .date)
DatePicker("", selection: $item.startDate, displayedComponents: .date)
.datePickerStyle(.compact)
.padding(.bottom)
}
DetailListItem {
Text("End")
HStack(alignment: .firstTextBaseline) {
Text("Has end date")
.font(.headline)
Spacer()
Toggle(isOn: $post.hasEndDate) {
Text("")
}.toggleStyle(.switch)
DatePicker("", selection: $post.endDate, displayedComponents: .date)
.datePickerStyle(.compact)
.disabled(!post.hasEndDate)
Toggle("", isOn: $item.hasEndDate)
.toggleStyle(.switch)
.padding(.bottom)
}
DetailListItem {
Text("Linked page")
Spacer()
Button(action: { showPagePicker = true }) {
Text(linkedPageText)
if item.hasEndDate {
HStack(alignment: .firstTextBaseline) {
Text("End date")
.font(.headline)
Spacer()
DatePicker("", selection: $item.endDate, displayedComponents: .date)
.datePickerStyle(.compact)
.padding(.bottom)
}
.buttonStyle(.plain)
.foregroundStyle(.blue)
}
LocalizedPostDetailView(post: post.localized(in: language))
LocalizedPostDetailView(post: item.localized(in: language))
}
.padding()
}
.sheet(isPresented: $showPagePicker) {
PagePickerView(
showPagePicker: $showPagePicker,
selectedPage: $post.linkedPage)
}
}
}
struct LocalizedPostDetailView: View {
@ObservedObject
var post: LocalizedPost
@State
private var showImagePicker = false
var body: some View {
VStack(alignment: .leading) {
Text("Link Preview")
.font(.headline)
DetailListItem {
Text("Title")
Spacer()
OptionalTextField("", text: $post.linkPreviewTitle)
}
DetailListItem {
Text("Image")
Spacer()
Button(action: { showImagePicker = true }) {
Text(post.linkPreviewImage?.id ?? "Select")
}
.buttonStyle(.plain)
.foregroundStyle(.blue)
}
DetailListItem {
Text("Description")
Spacer()
OptionalTextField("", text: $post.linkPreviewDescription)
}
}
.sheet(isPresented: $showImagePicker) {
ImagePickerView(showImagePicker: $showImagePicker) { image in
post.linkPreviewImage = image
}
}
}
}