93 lines
3.2 KiB
Swift
93 lines
3.2 KiB
Swift
import SwiftUI
|
|
|
|
struct MainContentMostCommentedAudioSection: View {
|
|
let title: String
|
|
let items: [CommentedAudioResponse]
|
|
let onTapContent: (Int) -> Void
|
|
|
|
private let thumbnailSize: CGFloat = 88
|
|
|
|
private var cardWidth: CGFloat {
|
|
UIScreen.main.bounds.width - (SodaSpacing.s14 * 2)
|
|
}
|
|
|
|
var body: some View {
|
|
if !items.isEmpty {
|
|
VStack(alignment: .leading, spacing: SodaSpacing.s14) {
|
|
SectionTitle(title: title)
|
|
|
|
ScrollView(.horizontal, showsIndicators: false) {
|
|
HStack(alignment: .top, spacing: SodaSpacing.s4) {
|
|
ForEach(items) { item in
|
|
card(item)
|
|
}
|
|
}
|
|
.padding(.leading, SodaSpacing.s14)
|
|
.padding(.trailing, SodaSpacing.s20)
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
private func card(_ item: CommentedAudioResponse) -> some View {
|
|
Button {
|
|
onTapContent(item.audioContentId)
|
|
} label: {
|
|
VStack(alignment: .leading, spacing: SodaSpacing.s14) {
|
|
audioSummary(item)
|
|
|
|
commentPreview(item)
|
|
}
|
|
.padding(SodaSpacing.s14)
|
|
.frame(width: cardWidth, alignment: .leading)
|
|
.background(Color.gray900)
|
|
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
|
|
}
|
|
.buttonStyle(.plain)
|
|
}
|
|
|
|
private func audioSummary(_ item: CommentedAudioResponse) -> some View {
|
|
HStack(alignment: .center, spacing: SodaSpacing.s14) {
|
|
DownsampledKFImage(
|
|
url: URL(string: item.imageUrl),
|
|
size: CGSize(width: thumbnailSize, height: thumbnailSize)
|
|
)
|
|
.background(Color.gray800)
|
|
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
|
|
|
|
Text(item.title)
|
|
.appFont(size: 16, weight: .bold)
|
|
.foregroundColor(.white)
|
|
.lineLimit(1)
|
|
.truncationMode(.tail)
|
|
.frame(maxWidth: .infinity, alignment: .leading)
|
|
}
|
|
}
|
|
|
|
private func commentPreview(_ item: CommentedAudioResponse) -> some View {
|
|
HStack(alignment: .center, spacing: SodaSpacing.s14) {
|
|
DownsampledKFImage(
|
|
url: URL(string: item.latestCommentWriterProfileImageUrl),
|
|
size: CGSize(width: 28, height: 28)
|
|
)
|
|
.background(Color.gray700)
|
|
.clipShape(Circle())
|
|
|
|
Text(item.latestComment)
|
|
.appFont(size: 14, weight: .regular)
|
|
.foregroundColor(.white)
|
|
.lineLimit(2)
|
|
.truncationMode(.tail)
|
|
.frame(maxWidth: .infinity, alignment: .leading)
|
|
|
|
Image(systemName: "chevron.down")
|
|
.font(.system(size: 12, weight: .medium))
|
|
.foregroundColor(.white)
|
|
.frame(width: 18, height: 18)
|
|
}
|
|
.padding(SodaSpacing.s12)
|
|
.background(Color.gray800)
|
|
.clipShape(RoundedRectangle(cornerRadius: SodaSpacing.s14, style: .continuous))
|
|
}
|
|
}
|