Skip to content

Commit 1f93a89

Browse files
tonisevenertonisevener
committed
Refactor to reuse WMFActivityTabInfoCardView for categories
1 parent 5a55c0d commit 1f93a89

File tree

2 files changed

+88
-78
lines changed

2 files changed

+88
-78
lines changed

‎WMFComponents/Sources/WMFComponents/Components/Activity Tab/WMFActivityTabInfoCardView.swift‎

Lines changed: 9 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -4,22 +4,22 @@ struct WMFActivityTabInfoCardView<Content: View>: View {
44
private let icon: UIImage?
55
private let title: String
66
private let dateText: String?
7-
private let amount: Int
8-
private let onTapModule: () -> Void
7+
private let additionalAccessibilityLabel: String?
8+
private let onTapModule: (() -> Void)?
99
private let content: () -> Content
1010

1111
init(
1212
icon: UIImage?,
1313
title: String,
1414
dateText: String?,
15-
amount: Int = 0,
16-
onTapModule: @escaping () -> Void,
15+
additionalAccessibilityLabel: String?,
16+
onTapModule: (() -> Void)?,
1717
@ViewBuilder content: @escaping () -> Content = { EmptyView() }
1818
) {
1919
self.icon = icon
2020
self.title = title
2121
self.dateText = dateText
22-
self.amount = amount
22+
self.additionalAccessibilityLabel = additionalAccessibilityLabel
2323
self.content = content
2424
self.onTapModule = onTapModule
2525
}
@@ -28,7 +28,7 @@ struct WMFActivityTabInfoCardView<Content: View>: View {
2828
private var theme: WMFTheme { appEnvironment.theme }
2929

3030
var body: some View {
31-
Button(action: onTapModule) {
31+
Button(action: { onTapModule?() }) {
3232
VStack(spacing: 24) {
3333
HStack {
3434
if let icon {
@@ -52,17 +52,9 @@ struct WMFActivityTabInfoCardView<Content: View>: View {
5252
}
5353
}
5454

55-
HStack(alignment: .bottom) {
56-
Text("\(amount)")
57-
.foregroundStyle(Color(theme.text))
58-
.font(Font(WMFFont.for(.boldTitle1)))
59-
Spacer()
60-
content()
61-
}
62-
.padding(.bottom, 16)
55+
content()
6356
}
64-
.padding(.horizontal, 16)
65-
.padding(.top, 16)
57+
.padding(16)
6658
.background(Color(theme.paperBackground))
6759
.cornerRadius(10)
6860
.overlay(
@@ -77,15 +69,9 @@ struct WMFActivityTabInfoCardView<Content: View>: View {
7769
}
7870

7971
private var accessibilityString: String {
80-
let numberFormatter = NumberFormatter()
81-
numberFormatter.numberStyle = .decimal
82-
83-
let formattedAmount = numberFormatter.string(from: NSNumber(value: amount)) ?? "\(amount)"
84-
8572
var parts = [title]
8673
if let dateText { parts.append(dateText) }
87-
parts.append(formattedAmount)
74+
if let additionalAccessibilityLabel { parts.append(additionalAccessibilityLabel)}
8875
return parts.joined(separator: ", ")
8976
}
90-
9177
}

‎WMFComponents/Sources/WMFComponents/Components/Activity Tab/WMFActivityTabView.swift‎

Lines changed: 79 additions & 55 deletions
Original file line numberDiff line numberDiff line change
@@ -168,13 +168,23 @@ public struct WMFActivityTabView: View {
168168
}
169169

170170
private func totalEditsView(amount: Int) -> some View {
171-
WMFActivityTabInfoCardView(
171+
172+
let formattedAmount = amountAccessibilityLabel(for: amount)
173+
174+
return WMFActivityTabInfoCardView(
172175
icon: WMFSFSymbolIcon.for(symbol: .globeAmericas, font: WMFFont.boldCaption1),
173176
title: viewModel.localizedStrings.totalEdits,
174177
dateText: nil,
175-
amount: amount,
178+
additionalAccessibilityLabel: formattedAmount,
176179
onTapModule: {
177180
viewModel.onTapGlobalEdits?()
181+
}, content: {
182+
HStack(alignment: .bottom) {
183+
Text("\(amount)")
184+
.foregroundStyle(Color(theme.text))
185+
.font(Font(WMFFont.for(.boldTitle1)))
186+
Spacer()
187+
}
178188
}
179189
)
180190
// .padding(.top, 20)
@@ -282,45 +292,60 @@ public struct WMFActivityTabView: View {
282292
}
283293

284294
private func articlesReadModule(proxy: ScrollViewProxy) -> some View {
285-
WMFActivityTabInfoCardView(
295+
296+
let formattedAmount = amountAccessibilityLabel(for: viewModel.articlesReadViewModel.totalArticlesRead)
297+
298+
return WMFActivityTabInfoCardView(
286299
icon: WMFSFSymbolIcon.for(symbol: .bookPages, font: WMFFont.boldCaption1),
287300
title: viewModel.localizedStrings.totalArticlesRead,
288301
dateText: viewModel.articlesReadViewModel.dateTimeLastRead,
289-
amount: viewModel.articlesReadViewModel.totalArticlesRead,
302+
additionalAccessibilityLabel: formattedAmount,
290303
onTapModule: {
291304
withAnimation(.easeInOut) {
292305
proxy.scrollTo("timelineSection", anchor: .top)
293306
}
294307
},
295308
content: {
296-
articlesReadGraph(weeklyReads: viewModel.articlesReadViewModel.weeklyReads)
309+
HStack(alignment: .bottom) {
310+
Text("\(viewModel.articlesReadViewModel.totalArticlesRead)")
311+
.foregroundStyle(Color(theme.text))
312+
.font(Font(WMFFont.for(.boldTitle1)))
313+
Spacer()
314+
articlesReadGraph(weeklyReads: viewModel.articlesReadViewModel.weeklyReads)
315+
}
316+
297317
}
298318
)
299319
}
300320

301321
private var savedArticlesModule: some View {
302322

303-
Group {
304-
let thumbURLs = viewModel.articlesSavedViewModel.articlesSavedThumbURLs
305-
let displayCount = min(thumbURLs.count, 3)
306-
let remaining = viewModel.articlesSavedViewModel.articlesSavedAmount - displayCount
307-
308-
WMFActivityTabInfoCardView(
309-
icon: WMFSFSymbolIcon.for(symbol: .bookmark, font: WMFFont.boldCaption1),
310-
title: viewModel.localizedStrings.articlesSavedTitle,
311-
dateText: viewModel.articlesSavedViewModel.dateTimeLastSaved,
312-
amount: viewModel.articlesSavedViewModel.articlesSavedAmount,
313-
onTapModule: {
314-
viewModel.articlesSavedViewModel.onTapSaved?()
315-
},
316-
content: {
323+
let thumbURLs = viewModel.articlesSavedViewModel.articlesSavedThumbURLs
324+
let displayCount = min(thumbURLs.count, 3)
325+
let remaining = viewModel.articlesSavedViewModel.articlesSavedAmount - displayCount
317326

327+
let formattedAmount = amountAccessibilityLabel(for: viewModel.articlesSavedViewModel.articlesSavedAmount)
328+
329+
return WMFActivityTabInfoCardView(
330+
icon: WMFSFSymbolIcon.for(symbol: .bookmark, font: WMFFont.boldCaption1),
331+
title: viewModel.localizedStrings.articlesSavedTitle,
332+
dateText: viewModel.articlesSavedViewModel.dateTimeLastSaved,
333+
additionalAccessibilityLabel: formattedAmount,
334+
onTapModule: {
335+
viewModel.articlesSavedViewModel.onTapSaved?()
336+
},
337+
content: {
338+
HStack(alignment: .bottom) {
339+
Text("\(viewModel.articlesSavedViewModel.articlesSavedAmount)")
340+
.foregroundStyle(Color(theme.text))
341+
.font(Font(WMFFont.for(.boldTitle1)))
342+
Spacer()
318343
if !thumbURLs.isEmpty {
319344
savedArticlesImages(thumbURLs: thumbURLs, totalSavedCount: viewModel.articlesSavedViewModel.articlesSavedAmount, remaining: remaining)
320345
}
321346
}
322-
)
323-
}
347+
}
348+
)
324349
}
325350

326351
private func showPlus(displayCount: Int, totalSavedCount: Int) -> Bool {
@@ -389,46 +414,45 @@ public struct WMFActivityTabView: View {
389414
}
390415

391416
private func topCategoriesModule(categories: [String]) -> some View {
392-
VStack(alignment: .leading, spacing: 24) {
393-
HStack {
394-
if let icon = WMFSFSymbolIcon.for(symbol: .rectangle3) {
395-
Image(uiImage: icon)
396-
}
397-
Text(viewModel.localizedStrings.topCategories)
398-
.foregroundStyle(Color(theme.text))
399-
.font(Font(WMFFont.for(.boldCaption1)))
400-
}
401-
.frame(maxWidth: .infinity, alignment: .leading)
402-
403-
ForEach(categories.indices, id: \.self) { index in
404-
let category = categories[index]
417+
418+
WMFActivityTabInfoCardView(
419+
icon: WMFSFSymbolIcon.for(symbol: .rectangle3, font: WMFFont.boldCaption1),
420+
title: viewModel.localizedStrings.topCategories,
421+
dateText: nil,
422+
additionalAccessibilityLabel: nil,
423+
onTapModule: nil,
424+
content: {
405425
VStack(alignment: .leading, spacing: 16) {
406-
Text(category)
407-
.foregroundStyle(Color(theme.text))
408-
.font(Font(WMFFont.for(.callout)))
409-
.lineLimit(2)
410-
411-
if index < categories.count - 1 {
412-
Divider()
413-
.frame(height: 1)
414-
.overlay(
415-
Rectangle()
416-
.fill(Color(uiColor: theme.baseBackground))
417-
.frame(height: 1)
418-
)
419-
.padding(0)
426+
ForEach(categories.indices, id: \.self) { index in
427+
let category = categories[index]
428+
Text(category)
429+
.foregroundStyle(Color(theme.text))
430+
.font(Font(WMFFont.for(.callout)))
431+
.frame(maxWidth: .infinity, alignment: .leading)
432+
.lineLimit(2)
433+
434+
if index < categories.count - 1 {
435+
Divider()
436+
.frame(height: 1)
437+
.overlay(
438+
Rectangle()
439+
.fill(Color(uiColor: theme.baseBackground))
440+
.frame(height: 1)
441+
)
442+
.padding(0)
443+
}
420444
}
421445
}
422446
}
423-
}
424-
.padding(16)
425-
.background(Color(theme.paperBackground))
426-
.cornerRadius(10)
427-
.overlay(
428-
RoundedRectangle(cornerRadius: 10)
429-
.stroke(Color(theme.baseBackground), lineWidth: 0.5)
430447
)
431448
}
449+
450+
private func amountAccessibilityLabel(for amount: Int) -> String {
451+
let numberFormatter = NumberFormatter()
452+
numberFormatter.numberStyle = .decimal
453+
454+
return numberFormatter.string(from: NSNumber(value: amount)) ?? "\(amount)"
455+
}
432456
}
433457

434458
struct TimelineSectionView: View {

0 commit comments

Comments
 (0)