Pinned items timeline implementation for the banner (#3099)

This commit is contained in:
Mauro
2024-08-05 14:09:05 +02:00
committed by GitHub
parent a11faeb131
commit ff2c42d53b
23 changed files with 336 additions and 83 deletions
@@ -23,16 +23,6 @@ struct PinnedItemsBannerView: View {
let onMainButtonTap: () -> Void
let onViewAllButtonTap: () -> Void
private var bannerIndicatorDescription: AttributedString {
let index = pinnedEventsState.selectedPinIndex + 1
let boldPlaceholder = "{bold}"
var finalString = AttributedString(L10n.screenRoomPinnedBannerIndicatorDescription(boldPlaceholder))
var boldString = AttributedString(L10n.screenRoomPinnedBannerIndicator(index, pinnedEventsState.pinnedEventIDs.count))
boldString.bold()
finalString.replace(boldPlaceholder, with: boldString)
return finalString
}
var body: some View {
HStack(spacing: 0) {
mainButton
@@ -48,7 +38,7 @@ struct PinnedItemsBannerView: View {
Button { onMainButtonTap() } label: {
HStack(spacing: 0) {
HStack(spacing: 10) {
PinnedItemsIndicatorView(pinIndex: pinnedEventsState.selectedPinIndex, pinsCount: pinnedEventsState.pinnedEventIDs.count)
PinnedItemsIndicatorView(pinIndex: pinnedEventsState.selectedPinIndex, pinsCount: pinnedEventsState.pinnedEventContents.count)
.accessibilityHidden(true)
CompoundIcon(\.pinSolid, size: .small, relativeTo: .compound.bodyMD)
.foregroundColor(Color.compound.iconSecondaryAlpha)
@@ -73,7 +63,7 @@ struct PinnedItemsBannerView: View {
private var content: some View {
VStack(alignment: .leading, spacing: 0) {
Text(bannerIndicatorDescription)
Text(pinnedEventsState.bannerIndicatorDescription)
.font(.compound.bodySM)
.foregroundColor(.compound.textActionAccent)
.lineLimit(1)
@@ -86,9 +76,32 @@ struct PinnedItemsBannerView: View {
}
struct PinnedItemsBannerView_Previews: PreviewProvider, TestablePreview {
static var attributedContent: AttributedString {
var boldPart = AttributedString("Image:")
boldPart.bold()
var final = boldPart + " content.png"
// This should be ignored when presented
final.font = .headline
return final
}
static var previews: some View {
PinnedItemsBannerView(pinnedEventsState: .init(pinnedEventIDs: ["Content", "NotShown1", "NotShown2"], selectedPinEventID: "Content"),
onMainButtonTap: { },
onViewAllButtonTap: { })
VStack(spacing: 20) {
PinnedItemsBannerView(pinnedEventsState: .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"),
onMainButtonTap: { },
onViewAllButtonTap: { })
PinnedItemsBannerView(pinnedEventsState: .init(pinnedEventContents: ["1": attributedContent],
selectedPinEventID: "1"),
onMainButtonTap: { },
onViewAllButtonTap: { })
}
}
}
@@ -50,11 +50,11 @@ struct RoomScreen: View {
}
.overlay(alignment: .top) {
Group {
if context.viewState.shouldShowPinBanner {
if context.viewState.shouldShowPinnedEventsBanner {
pinnedItemsBanner
}
}
.animation(.elementDefault, value: context.viewState.shouldShowPinBanner)
.animation(.elementDefault, value: context.viewState.shouldShowPinnedEventsBanner)
}
.navigationTitle(L10n.screenRoomTitle) // Hidden but used for back button text.
.navigationBarTitleDisplayMode(.inline)
@@ -69,7 +69,7 @@ struct RoomScreen: View {
canCurrentUserRedactSelf: context.viewState.canCurrentUserRedactSelf,
canCurrentUserRedactOthers: context.viewState.canCurrentUserRedactOthers,
canCurrentUserPin: context.viewState.canCurrentUserPin,
pinnedEventIDs: context.viewState.pinnedEventsState.pinnedEventIDs.set,
pinnedEventIDs: context.viewState.pinnedEventIDs,
isDM: context.viewState.isEncryptedOneToOneRoom,
isViewSourceEnabled: context.viewState.isViewSourceEnabled).makeActions()
if let actions {
@@ -111,7 +111,7 @@ struct RoomScreen: View {
private var pinnedItemsBanner: some View {
PinnedItemsBannerView(pinnedEventsState: context.viewState.pinnedEventsState,
onMainButtonTap: { context.send(viewAction: .tappedPinBanner) },
onMainButtonTap: { context.send(viewAction: .tappedPinnedEventsBanner) },
onViewAllButtonTap: { context.send(viewAction: .viewAllPins) })
.transition(.move(edge: .top))
}
@@ -145,7 +145,7 @@ struct TimelineItemBubbledStylerView<Content: View>: View {
canCurrentUserRedactSelf: context.viewState.canCurrentUserRedactSelf,
canCurrentUserRedactOthers: context.viewState.canCurrentUserRedactOthers,
canCurrentUserPin: context.viewState.canCurrentUserPin,
pinnedEventIDs: context.viewState.pinnedEventsState.pinnedEventIDs.set,
pinnedEventIDs: context.viewState.pinnedEventIDs,
isDM: context.viewState.isEncryptedOneToOneRoom,
isViewSourceEnabled: context.viewState.isViewSourceEnabled)
TimelineItemMacContextMenu(item: timelineItem, actionProvider: provider) { action in