Pinned events banner loading state (#3118)

This commit is contained in:
Mauro
2024-08-06 15:46:56 +02:00
committed by GitHub
parent 0c9da2cee9
commit 08347e15a5
26 changed files with 468 additions and 113 deletions
@@ -18,7 +18,7 @@ import Compound
import SwiftUI
struct PinnedItemsBannerView: View {
let pinnedEventsState: PinnedEventsState
let state: PinnedEventsBannerState
let onMainButtonTap: () -> Void
let onViewAllButtonTap: () -> Void
@@ -38,7 +38,7 @@ struct PinnedItemsBannerView: View {
Button { onMainButtonTap() } label: {
HStack(spacing: 0) {
HStack(spacing: 10) {
PinnedItemsIndicatorView(pinIndex: pinnedEventsState.selectedPinIndex, pinsCount: pinnedEventsState.pinnedEventContents.count)
PinnedItemsIndicatorView(pinIndex: state.selectedPinIndex, pinsCount: state.count)
.accessibilityHidden(true)
CompoundIcon(\.pinSolid, size: .small, relativeTo: .compound.bodyMD)
.foregroundColor(Color.compound.iconSecondaryAlpha)
@@ -48,26 +48,34 @@ struct PinnedItemsBannerView: View {
.frame(maxWidth: .infinity, alignment: .leading)
}
}
.disabled(state.isLoading)
.accessibilityElement(children: .contain)
}
@ViewBuilder
private var viewAllButton: some View {
Button { onViewAllButtonTap() } label: {
Text(L10n.screenRoomPinnedBannerViewAllButtonTitle)
.font(.compound.bodyMDSemibold)
.foregroundStyle(Color.compound.textPrimary)
switch state {
case .loaded:
Button { onViewAllButtonTap() } label: {
Text(L10n.screenRoomPinnedBannerViewAllButtonTitle)
.font(.compound.bodyMDSemibold)
.foregroundStyle(Color.compound.textPrimary)
.padding(.horizontal, 16)
.padding(.vertical, 5)
}
case .loading:
ProgressView()
.padding(.horizontal, 16)
.padding(.vertical, 5)
}
}
private var content: some View {
VStack(alignment: .leading, spacing: 0) {
Text(pinnedEventsState.bannerIndicatorDescription)
Text(state.bannerIndicatorDescription)
.font(.compound.bodySM)
.foregroundColor(.compound.textActionAccent)
.lineLimit(1)
Text(pinnedEventsState.selectedPinContent)
Text(state.displayedMessage)
.font(.compound.bodyMD)
.foregroundColor(.compound.textPrimary)
.lineLimit(1)
@@ -79,27 +87,30 @@ struct PinnedItemsBannerView_Previews: PreviewProvider, TestablePreview {
static var attributedContent: AttributedString {
var boldPart = AttributedString("Image:")
boldPart.bold()
var final = boldPart + " content.png"
var finalString = boldPart + " content.png"
// This should be ignored when presented
final.font = .headline
return final
finalString.font = .headline
return finalString
}
static var previews: some View {
VStack(spacing: 20) {
PinnedItemsBannerView(pinnedEventsState: .init(pinnedEventContents: ["1": "Content",
"2": "2",
"3": "3"],
selectedPinEventID: "1"),
PinnedItemsBannerView(state: .loaded(state: .init(pinnedEventContents: ["1": "Content",
"2": "2",
"3": "3"],
selectedPinEventID: "1")),
onMainButtonTap: { },
onViewAllButtonTap: { })
PinnedItemsBannerView(pinnedEventsState: .init(pinnedEventContents: ["1": "Very very very very long content here",
"2": "2"],
selectedPinEventID: "1"),
PinnedItemsBannerView(state: .loaded(state: .init(pinnedEventContents: ["1": "Very very very very long content here",
"2": "2"],
selectedPinEventID: "1")),
onMainButtonTap: { },
onViewAllButtonTap: { })
PinnedItemsBannerView(pinnedEventsState: .init(pinnedEventContents: ["1": attributedContent],
selectedPinEventID: "1"),
PinnedItemsBannerView(state: .loaded(state: .init(pinnedEventContents: ["1": attributedContent],
selectedPinEventID: "1")),
onMainButtonTap: { },
onViewAllButtonTap: { })
PinnedItemsBannerView(state: .loading(numbersOfEvents: 5),
onMainButtonTap: { },
onViewAllButtonTap: { })
}
@@ -58,6 +58,7 @@ struct ReadReceiptsSummaryView_Previews: PreviewProvider, TestablePreview {
mediaPlayerProvider: MediaPlayerProviderMock(),
voiceMessageMediaManager: VoiceMessageMediaManagerMock(),
userIndicatorController: UserIndicatorControllerMock(),
networkMonitor: ServiceLocator.shared.networkMonitor,
appMediator: AppMediatorMock.default,
appSettings: ServiceLocator.shared.settings,
analyticsService: ServiceLocator.shared.analytics)
@@ -110,7 +110,7 @@ struct RoomScreen: View {
}
private var pinnedItemsBanner: some View {
PinnedItemsBannerView(pinnedEventsState: context.viewState.pinnedEventsState,
PinnedItemsBannerView(state: context.viewState.pinnedEventsBannerState,
onMainButtonTap: { context.send(viewAction: .tappedPinnedEventsBanner) },
onViewAllButtonTap: { context.send(viewAction: .viewAllPins) })
.transition(.move(edge: .top))
@@ -213,6 +213,7 @@ struct RoomScreen_Previews: PreviewProvider, TestablePreview {
mediaPlayerProvider: MediaPlayerProviderMock(),
voiceMessageMediaManager: VoiceMessageMediaManagerMock(),
userIndicatorController: ServiceLocator.shared.userIndicatorController,
networkMonitor: ServiceLocator.shared.networkMonitor,
appMediator: AppMediatorMock.default,
appSettings: ServiceLocator.shared.settings,
analyticsService: ServiceLocator.shared.analytics)
@@ -96,6 +96,7 @@ struct TimelineReadReceiptsView_Previews: PreviewProvider, TestablePreview {
mediaPlayerProvider: MediaPlayerProviderMock(),
voiceMessageMediaManager: VoiceMessageMediaManagerMock(),
userIndicatorController: ServiceLocator.shared.userIndicatorController,
networkMonitor: ServiceLocator.shared.networkMonitor,
appMediator: AppMediatorMock.default,
appSettings: ServiceLocator.shared.settings,
analyticsService: ServiceLocator.shared.analytics)
@@ -101,6 +101,7 @@ struct HighlightedTimelineItemTimeline_Previews: PreviewProvider {
mediaPlayerProvider: MediaPlayerProviderMock(),
voiceMessageMediaManager: VoiceMessageMediaManagerMock(),
userIndicatorController: ServiceLocator.shared.userIndicatorController,
networkMonitor: ServiceLocator.shared.networkMonitor,
appMediator: AppMediatorMock.default,
appSettings: ServiceLocator.shared.settings,
analyticsService: ServiceLocator.shared.analytics)
@@ -86,6 +86,7 @@ struct TimelineView_Previews: PreviewProvider, TestablePreview {
mediaPlayerProvider: MediaPlayerProviderMock(),
voiceMessageMediaManager: VoiceMessageMediaManagerMock(),
userIndicatorController: ServiceLocator.shared.userIndicatorController,
networkMonitor: ServiceLocator.shared.networkMonitor,
appMediator: AppMediatorMock.default,
appSettings: ServiceLocator.shared.settings,
analyticsService: ServiceLocator.shared.analytics)