Skip to content

Commit f04e6c4

Browse files
committed
Use info card view for contributions, mostviewed, + combined view for others
1 parent a26207e commit f04e6c4

File tree

2 files changed

+147
-33
lines changed

2 files changed

+147
-33
lines changed

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

Lines changed: 144 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -77,6 +77,8 @@ public struct WMFActivityTabView: View {
7777

7878
Section(header: YourImpactHeaderView(title: viewModel.localizedStrings.yourImpact)) {
7979
VStack(spacing: 16) {
80+
81+
// TODO: Uncomment here for user impact data with stub UI
8082
if let mostViewedArticlesViewModel = viewModel.mostViewedArticlesViewModel {
8183
MostViewedArticlesView(viewModel: mostViewedArticlesViewModel)
8284
}
@@ -85,16 +87,8 @@ public struct WMFActivityTabView: View {
8587
ContributionsView(viewModel: contributionsViewModel)
8688
}
8789

88-
if let allTimeImpactViewModel = viewModel.allTimeImpactViewModel {
89-
AllTimeImpactView(viewModel: allTimeImpactViewModel)
90-
}
91-
92-
if let recentActivityViewModel = viewModel.recentActivityViewModel {
93-
RecentActivityView(viewModel: recentActivityViewModel)
94-
}
95-
96-
if let articleViewsViewModel = viewModel.articleViewsViewModel {
97-
ArticleViewsView(viewModel: articleViewsViewModel)
90+
if viewModel.allTimeImpactViewModel != nil || viewModel.recentActivityViewModel != nil || viewModel.articleViewsViewModel != nil {
91+
CombinedImpactView(allTimeImpactViewModel: viewModel.allTimeImpactViewModel, recentActivityViewModel: viewModel.recentActivityViewModel, articleViewsViewModel: viewModel.articleViewsViewModel)
9892
}
9993

10094
if let globalEditCount = viewModel.globalEditCount, globalEditCount > 0 {
@@ -647,47 +641,135 @@ struct YourImpactHeaderView: View {
647641
Spacer()
648642
}
649643
.padding(.top, 12)
644+
.padding(.bottom, 16)
650645
}
651646
}
652647

653648
private struct MostViewedArticlesView: View {
654649
let viewModel: MostViewedArticlesViewModel
655650

656651
var body: some View {
657-
// TODO: TEMP UI
658-
VStack {
659-
Text("Most viewed")
660-
.bold()
661-
662-
ForEach(viewModel.topViewedArticles.map(\.title), id: \.self) { title in
663-
Text(title)
652+
653+
WMFActivityTabInfoCardView(
654+
icon: WMFSFSymbolIcon.for(symbol: .lineDiagonalArrow, font: WMFFont.boldCaption1),
655+
title: "Most viewed since your edit", // TODO: localize
656+
dateText: nil,
657+
additionalAccessibilityLabel: nil,
658+
onTapModule: nil,
659+
content: {
660+
// TODO: TEMP UI
661+
VStack {
662+
ForEach(viewModel.topViewedArticles.map(\.title), id: \.self) { title in
663+
Text(title)
664+
}
665+
}
664666
}
665-
}
667+
)
668+
669+
666670
}
667671
}
668672

669673
private struct ContributionsView: View {
670674
let viewModel: ContributionsViewModel
671675

672676
var body: some View {
673-
// TODO: TEMP UI
674-
VStack {
675-
Text("Contributions")
676-
.bold()
677-
Text("This month: \(viewModel.thisMonthCount)")
678-
Text("Last month: \(viewModel.lastMonthCount)")
677+
678+
WMFActivityTabInfoCardView(
679+
icon: WMFSFSymbolIcon.for(symbol: .personFilled, font: WMFFont.boldCaption1), // TODO: Correct icon
680+
title: "Contributions this month", // TODO: localize
681+
dateText: nil,
682+
additionalAccessibilityLabel: nil,
683+
onTapModule: nil,
684+
content: {
685+
// TODO: TEMP UI
686+
VStack {
687+
Text("Contributions")
688+
.bold()
689+
Text("This month: \(viewModel.thisMonthCount)")
690+
Text("Last month: \(viewModel.lastMonthCount)")
691+
}
692+
}
693+
)
694+
}
695+
}
696+
697+
private struct CombinedImpactView: View {
698+
let allTimeImpactViewModel: AllTimeImpactViewModel?
699+
let recentActivityViewModel: RecentActivityViewModel?
700+
let articleViewsViewModel: ArticleViewsViewModel?
701+
702+
@ObservedObject var appEnvironment = WMFAppEnvironment.current
703+
704+
var theme: WMFTheme {
705+
return appEnvironment.theme
706+
}
707+
708+
var body: some View {
709+
710+
VStack(spacing: 16) {
711+
if let allTimeImpactViewModel {
712+
AllTimeImpactView(viewModel: allTimeImpactViewModel)
713+
714+
Divider()
715+
.frame(height: 1)
716+
.overlay(
717+
Rectangle()
718+
.fill(Color(uiColor: theme.baseBackground))
719+
.frame(height: 1)
720+
)
721+
.padding(0)
722+
}
723+
724+
if let recentActivityViewModel {
725+
RecentActivityView(viewModel: recentActivityViewModel)
726+
727+
Divider()
728+
.frame(height: 1)
729+
.overlay(
730+
Rectangle()
731+
.fill(Color(uiColor: theme.baseBackground))
732+
.frame(height: 1)
733+
)
734+
.padding(0)
735+
}
736+
737+
if let articleViewsViewModel {
738+
ArticleViewsView(viewModel: articleViewsViewModel)
739+
}
679740
}
741+
.padding(16)
742+
.background(Color(theme.paperBackground))
743+
.cornerRadius(10)
744+
.overlay(
745+
RoundedRectangle(cornerRadius: 10)
746+
.stroke(Color(theme.baseBackground), lineWidth: 0.5)
747+
)
680748
}
681749
}
682750

683751
private struct AllTimeImpactView: View {
684752
let viewModel: AllTimeImpactViewModel
685753

754+
@ObservedObject var appEnvironment = WMFAppEnvironment.current
755+
756+
var theme: WMFTheme {
757+
return appEnvironment.theme
758+
}
759+
686760
var body: some View {
687-
// TODO: TEMP UI
688761
VStack {
689-
Text("All time impact")
690-
.bold()
762+
HStack {
763+
Text("All time impact") // TODO: Localize
764+
.foregroundStyle(Color(theme.text))
765+
.font(Font(WMFFont.for(.boldCaption1)))
766+
.multilineTextAlignment(.leading)
767+
.lineLimit(4)
768+
Spacer()
769+
}
770+
.padding(.bottom, 16)
771+
772+
// TODO: TEMP UI
691773
if let totalEdits = viewModel.totalEdits {
692774
Text("Total edits: \(totalEdits)")
693775
} else {
@@ -715,11 +797,26 @@ private struct AllTimeImpactView: View {
715797
private struct RecentActivityView: View {
716798
let viewModel: RecentActivityViewModel
717799

800+
@ObservedObject var appEnvironment = WMFAppEnvironment.current
801+
802+
var theme: WMFTheme {
803+
return appEnvironment.theme
804+
}
805+
718806
var body: some View {
719-
// TODO: TEMP UI
807+
720808
VStack {
721-
Text("Recent Activity")
722-
.bold()
809+
HStack {
810+
Text("Recent Activity") // TODO: Localize
811+
.foregroundStyle(Color(theme.text))
812+
.font(Font(WMFFont.for(.boldCaption1)))
813+
.multilineTextAlignment(.leading)
814+
.lineLimit(4)
815+
Spacer()
816+
}
817+
.padding(.bottom, 16)
818+
819+
// TODO: TEMP UI
723820
Text("Edit count: \(viewModel.editCount)")
724821
Text("Start date: \(viewModel.startDate)")
725822
Text("End count: \(viewModel.endDate)")
@@ -730,11 +827,25 @@ private struct RecentActivityView: View {
730827
private struct ArticleViewsView: View {
731828
let viewModel: ArticleViewsViewModel
732829

830+
@ObservedObject var appEnvironment = WMFAppEnvironment.current
831+
832+
var theme: WMFTheme {
833+
return appEnvironment.theme
834+
}
835+
733836
var body: some View {
734-
// TODO: TEMP UI
735837
VStack {
736-
Text("Views on articles you've edited")
737-
.bold()
838+
HStack {
839+
Text("Views on articles you've edited") // TODO: Localize
840+
.foregroundStyle(Color(theme.text))
841+
.font(Font(WMFFont.for(.boldCaption1)))
842+
.multilineTextAlignment(.leading)
843+
.lineLimit(4)
844+
Spacer()
845+
}
846+
.padding(.bottom, 16)
847+
848+
// TODO: TEMP UI
738849
Text("Views count: \(viewModel.totalViewsCount)")
739850
}
740851
}

WMFComponents/Sources/WMFComponents/Style/WMFIcon.swift

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -127,6 +127,7 @@ public enum WMFSFSymbolIcon {
127127
case clockBadgeX
128128
case bubbleRightFill
129129
case globeAmericas
130+
case lineDiagonalArrow
130131

131132
public var name: String? {
132133
switch self {
@@ -318,6 +319,8 @@ public enum WMFSFSymbolIcon {
318319
image = UIImage(systemName: "bubble.right.fill", withConfiguration: configuration)?.imageFlippedForRightToLeftLayoutDirection()
319320
case .globeAmericas:
320321
image = UIImage(systemName: "globe.americas.fill", withConfiguration: configuration)
322+
case .lineDiagonalArrow:
323+
image = UIImage(systemName: "line.diagonal.arrow", withConfiguration: configuration)
321324
}
322325

323326
image = image?.withRenderingMode(.alwaysTemplate)

0 commit comments

Comments
 (0)