Improved the DocumentItem component to for the Browse module to support the folder swipe actions.

This commit is contained in:
Javier Cicchelli 2022-12-14 01:17:26 +01:00
parent 9a3b9049c7
commit c7f5d0db40

View File

@ -12,10 +12,10 @@ struct DocumentItem: View {
// MARK: Properties
let name: String
let lastModified: String
let fileSize: String
let item: FileSystemItem
let download: ItemIdClosure
let delete: ItemIdClosure
// MARK: Body
var body: some View {
@ -24,26 +24,64 @@ struct DocumentItem: View {
.icon(size: 32)
.foregroundColor(.red)
VStack {
Text(name)
VStack(spacing: 8) {
Text(item.name)
.itemName()
HStack {
Text(lastModified)
Text("lastModified")
Spacer()
Text(fileSize)
Text("fileSize")
}
.font(.subheadline)
.foregroundColor(.secondary)
}
}
.padding(.vertical, 8)
.padding(.vertical, 4)
.swipeActions(
edge: .trailing,
allowsFullSwipe: true
) {
Button {
delete(item.id)
} label: {
Label {
Text(
"browse.swipe_action.delete_item.text",
bundle: .module
)
} icon: {
Image.trash
}
}
.tint(.red)
Button {
download(item.id)
} label: {
Label {
Text(
"browse.swipe_action.download_item.text",
bundle: .module
)
} icon: {
Image.download
}
}
.tint(.orange)
}
}
}
// MARK: - Helpers
private extension DocumentItem {
var document: Document? { item as? Document }
}
// MARK: - Image+Constants
private extension Image {
@ -54,18 +92,30 @@ private extension Image {
struct DocumentItem_Previews: PreviewProvider {
static var previews: some View {
DocumentItem(
DocumentItem(item: Document(
id: "1234567890",
name: "Some document name goes in here...",
lastModified: "Some few hours ago",
fileSize: "23,5 Mbytes"
)
contentType: "some content type",
size: .random(in: 1 ... 100),
lastModifiedAt: .now
)) { _ in
// download closure with item id.
} delete: { _ in
// delete closure with item id.
}
.previewDisplayName("Document item")
DocumentItem(
DocumentItem(item: Document(
id: "1234567890",
name: "Some very, extremely long document name goes in here...",
lastModified: "Yesterday",
fileSize: "235,6 Kbytes"
)
contentType: "some content type",
size: .random(in: 1 ... 100),
lastModifiedAt: .now
)) { _ in
// download closure with item id.
} delete: { _ in
// delete closure with item id.
}
.previewDisplayName("Document item with long name")
}
}