IceCubesApp/Packages/Notifications/Sources/Notifications/NotificationsListView.swift

192 lines
5.7 KiB
Swift
Raw Normal View History

2022-12-19 11:28:55 +00:00
import DesignSystem
2022-12-25 12:09:43 +00:00
import Env
2023-01-17 10:36:01 +00:00
import Models
import Network
import Shimmer
import SwiftUI
2022-12-19 11:28:55 +00:00
public struct NotificationsListView: View {
@Environment(\.scenePhase) private var scenePhase
2022-12-29 09:39:34 +00:00
@EnvironmentObject private var theme: Theme
2022-12-25 12:09:43 +00:00
@EnvironmentObject private var watcher: StreamWatcher
2022-12-19 11:28:55 +00:00
@EnvironmentObject private var client: Client
@EnvironmentObject private var routerPath: RouterPath
2023-01-31 18:43:07 +00:00
@EnvironmentObject private var account: CurrentAccount
2022-12-19 11:28:55 +00:00
@StateObject private var viewModel = NotificationsViewModel()
2023-01-22 05:38:30 +00:00
let lockedType: Models.Notification.NotificationType?
2023-01-17 10:36:01 +00:00
public init(lockedType: Models.Notification.NotificationType?) {
self.lockedType = lockedType
}
2023-01-17 10:36:01 +00:00
2022-12-19 11:28:55 +00:00
public var body: some View {
List {
topPaddingView
notificationsView
2022-12-19 11:28:55 +00:00
}
2023-01-31 18:43:07 +00:00
.id(account.account?.id)
.environment(\.defaultMinListRowHeight, 1)
.listStyle(.plain)
Timeline & Timeline detail accessibility uplift (#1323) * Improve accessibility of StatusPollView Previously, this view did not provide the proper context to indicate that it represented a poll. Now, we’ve added - A container that will stay “Active poll” or “Poll results” when the cursor first hits one of the options; - A prefix to say “Option X of Y” before each option; - A Selected trait on the selected option(s), if present - Consolidating and adding an `.updatesFrequently` trait to the footer view with the countdown. * Add poll description in StatusRowView combinedAccessibilityLabel This largely duplicates the logic in `StatusPollView`. * Improve accessibility of media attachments Previously, the media attachments without alt text would not show up in the consolidated `StatusRowView`, nor would they be meaningfully explained on the status detail screen. Now, they are presented with their attachment type. * Change accessibilityRepresentation of AppAcountsSelectorView * Change Notifications tab title view accessibility representation to Menu Previously it would present as a button * Hide layout `Rectangle`s from accessibility * Consolidate `StatusRowDetailView` accessibility representation * Improve readability of Poll accessibility label * Ensure poll options don’t present as interactive when the poll is finished * Improve accessibility of StatusRowCardView Previously, it would present as four separate elements, including an image without a description, all interactive, none with an interactive trait. Now, it presents as a single element with the `.link` trait * Improve accessibility of StatusRowHeaderView Previously, it had no traits and no actions except inherited ones. Now it presents as a button, triggering its primary action. It also has custom actions corresponding to its context menu * Avoid applying the StatusRowView custom actions to every view when contained * Provide context for the application name * Add pauses to StatusRowView combinedAccessibilityLabel * Hide `TimelineView.scrollToTopView` from accessibility * Set appropriate font style on Notification header After the change the Text needed a `.headline` style to match the prior appearance. * Fix bug in accessibilityRepresentation of TimelineView nav bar title Previously, it would not display the proper label for .remoteLocal filter options. * Ensure that pop-up button nav bar titles are interactive * Ensure TextView responds to Environment.sizeCategory This resolves #1309 * Fix button --------- Co-authored-by: Thomas Ricouard <ricouard77@gmail.com>
2023-03-28 16:48:58 +00:00
.toolbar {
ToolbarItem(placement: .principal) {
let title = lockedType?.menuTitle() ?? viewModel.selectedType?.menuTitle() ?? "notifications.navigation-title"
if lockedType == nil {
Text(title)
.font(.headline)
.accessibilityRepresentation {
Menu(title) {}
}
.accessibilityAddTraits(.isHeader)
.accessibilityRemoveTraits(.isButton)
.accessibilityRespondsToUserInteraction(true)
} else {
Text(title)
.font(.headline)
.accessibilityAddTraits(.isHeader)
}
}
}
2023-01-04 07:14:37 +00:00
.toolbar {
if lockedType == nil {
ToolbarTitleMenu {
2023-01-04 07:14:37 +00:00
Button {
viewModel.selectedType = nil
2023-01-04 07:14:37 +00:00
} label: {
Label("notifications.navigation-title", systemImage: "bell.fill")
}
Divider()
ForEach(Notification.NotificationType.allCases, id: \.self) { type in
Button {
viewModel.selectedType = type
} label: {
2023-02-28 17:48:22 +00:00
Label {
Text(type.menuTitle())
} icon: {
type.icon(isPrivate: false)
}
}
2023-01-04 07:14:37 +00:00
}
}
}
}
Timeline & Timeline detail accessibility uplift (#1323) * Improve accessibility of StatusPollView Previously, this view did not provide the proper context to indicate that it represented a poll. Now, we’ve added - A container that will stay “Active poll” or “Poll results” when the cursor first hits one of the options; - A prefix to say “Option X of Y” before each option; - A Selected trait on the selected option(s), if present - Consolidating and adding an `.updatesFrequently` trait to the footer view with the countdown. * Add poll description in StatusRowView combinedAccessibilityLabel This largely duplicates the logic in `StatusPollView`. * Improve accessibility of media attachments Previously, the media attachments without alt text would not show up in the consolidated `StatusRowView`, nor would they be meaningfully explained on the status detail screen. Now, they are presented with their attachment type. * Change accessibilityRepresentation of AppAcountsSelectorView * Change Notifications tab title view accessibility representation to Menu Previously it would present as a button * Hide layout `Rectangle`s from accessibility * Consolidate `StatusRowDetailView` accessibility representation * Improve readability of Poll accessibility label * Ensure poll options don’t present as interactive when the poll is finished * Improve accessibility of StatusRowCardView Previously, it would present as four separate elements, including an image without a description, all interactive, none with an interactive trait. Now, it presents as a single element with the `.link` trait * Improve accessibility of StatusRowHeaderView Previously, it had no traits and no actions except inherited ones. Now it presents as a button, triggering its primary action. It also has custom actions corresponding to its context menu * Avoid applying the StatusRowView custom actions to every view when contained * Provide context for the application name * Add pauses to StatusRowView combinedAccessibilityLabel * Hide `TimelineView.scrollToTopView` from accessibility * Set appropriate font style on Notification header After the change the Text needed a `.headline` style to match the prior appearance. * Fix bug in accessibilityRepresentation of TimelineView nav bar title Previously, it would not display the proper label for .remoteLocal filter options. * Ensure that pop-up button nav bar titles are interactive * Ensure TextView responds to Environment.sizeCategory This resolves #1309 * Fix button --------- Co-authored-by: Thomas Ricouard <ricouard77@gmail.com>
2023-03-28 16:48:58 +00:00
.navigationBarTitleDisplayMode(.inline)
2023-01-05 13:11:55 +00:00
.scrollContentBackground(.hidden)
2022-12-19 11:28:55 +00:00
.task {
2022-12-21 17:28:21 +00:00
viewModel.client = client
viewModel.currentAccount = account
if let lockedType {
viewModel.selectedType = lockedType
}
2022-12-21 16:39:48 +00:00
await viewModel.fetchNotifications()
2022-12-19 11:28:55 +00:00
}
.refreshable {
2023-02-28 17:55:08 +00:00
SoundEffectManager.shared.playSound(of: .pull)
HapticManager.shared.fireHaptic(of: .dataRefresh(intensity: 0.3))
await viewModel.fetchNotifications()
2023-02-28 17:55:08 +00:00
HapticManager.shared.fireHaptic(of: .dataRefresh(intensity: 0.7))
SoundEffectManager.shared.playSound(of: .refresh)
}
2022-12-25 12:09:43 +00:00
.onChange(of: watcher.latestEvent?.id, perform: { _ in
if let latestEvent = watcher.latestEvent {
viewModel.handleEvent(event: latestEvent)
}
})
.onChange(of: scenePhase, perform: { scenePhase in
switch scenePhase {
case .active:
Task {
await viewModel.fetchNotifications()
}
default:
break
}
})
2022-12-19 11:28:55 +00:00
}
2023-01-17 10:36:01 +00:00
2022-12-21 11:39:29 +00:00
@ViewBuilder
private var notificationsView: some View {
switch viewModel.state {
case .loading:
ForEach(ConsolidatedNotification.placeholders()) { notification in
NotificationRowView(notification: notification,
client: client,
routerPath: routerPath,
followRequests: account.followRequests)
2022-12-21 11:39:29 +00:00
.redacted(reason: .placeholder)
.listRowInsets(.init(top: 12,
leading: .layoutPadding + 4,
bottom: 12,
trailing: .layoutPadding))
.redacted(reason: .placeholder)
2022-12-21 11:39:29 +00:00
}
2023-01-17 10:36:01 +00:00
2022-12-21 11:39:29 +00:00
case let .display(notifications, nextPageState):
if notifications.isEmpty {
EmptyView(iconName: "bell.slash",
title: "notifications.empty.title",
message: "notifications.empty.message")
2023-02-12 15:29:41 +00:00
.listSectionSeparator(.hidden)
} else {
ForEach(notifications) { notification in
NotificationRowView(notification: notification,
client: client,
routerPath: routerPath,
followRequests: account.followRequests)
.listRowInsets(.init(top: 12,
leading: .layoutPadding + 4,
bottom: 12,
trailing: .layoutPadding))
.id(notification.id)
}
2022-12-21 11:39:29 +00:00
}
2023-01-17 10:36:01 +00:00
2022-12-21 11:39:29 +00:00
switch nextPageState {
2022-12-29 09:39:34 +00:00
case .none:
EmptyView()
2022-12-21 11:39:29 +00:00
case .hasNextPage:
loadingRow
.onAppear {
Task {
await viewModel.fetchNextPage()
}
}
case .loadingNextPage:
loadingRow
}
2023-01-17 10:36:01 +00:00
2023-01-07 17:01:06 +00:00
case .error:
ErrorView(title: "notifications.error.title",
message: "notifications.error.message",
2023-03-13 12:38:28 +00:00
buttonTitle: "action.retry")
{
2023-01-07 17:01:06 +00:00
Task {
await viewModel.fetchNotifications()
}
}
2023-02-04 20:30:50 +00:00
.listSectionSeparator(.hidden)
2022-12-21 11:39:29 +00:00
}
}
2023-01-17 10:36:01 +00:00
2022-12-21 11:39:29 +00:00
private var loadingRow: some View {
HStack {
Spacer()
ProgressView()
Spacer()
}
.listRowInsets(.init(top: .layoutPadding,
leading: .layoutPadding + 4,
bottom: .layoutPadding,
trailing: .layoutPadding))
}
2023-01-30 06:27:06 +00:00
private var topPaddingView: some View {
2023-01-30 06:27:06 +00:00
HStack {}
.listRowBackground(Color.clear)
.listRowSeparator(.hidden)
.listRowInsets(.init())
.frame(height: .layoutPadding)
Accessibility tweaks + Notifications and Messages tab uplift (#1292) * Improve StatusRowView accessibility actions Previously, there was no way to interact with links and hashtags. Now, these are added to the Actions rotor * Hide `topPaddingView`s from accessibility * Fix accessible header rendering in non-filterable TimelineViews Previously, all navigation title views were assumed to be popup buttons. Now, we only change the representation for timelines that are filterable. * Combine tagHeaderView text elements Previously, these were two separate items * Prefer shorter Quote action label * Improve accessibility of StatusEmbeddedView Previously, this element would be three different ones, and include all the actions on the `StatusRowView` proper. Now, it presents as one element with no actions. * Add haptics to StatusRowView accessibility actions * Improve accessibility of ConversationsListRow This commit adds: - A combined representation of the component views - “Unread” as the first part of the label (if this is the case) - All relevant actions as custom actions - Reply as magic tap * Remove StatusRowView accessibilityActions if viewModel.showActions is false * Hide media attachments from accessibility if the view is not focused * Combine NotificationRowView accessibility elements; add user actions Previously, there was no real way to interact with these notifications. Now, the notifications that show the actions row have the appropriate StatusRowView-derived actions, and new followers notifications have more actions that let you see each user’s profile. * Prefer @Environment’s `accessibilityEnabled` over `isVoiceOverRunning` This way we can cater for Voice Control, Full Keyboard Access and Switch Control as well. --------- Co-authored-by: Thomas Ricouard <ricouard77@gmail.com>
2023-03-24 06:52:29 +00:00
.accessibilityHidden(true)
2022-12-21 11:39:29 +00:00
}
2022-12-19 11:28:55 +00:00
}