Do avatar placeholder in SwiftUI, Add AvatarViewModel, Add dependency injection for MxMediaManager dependency.

This commit is contained in:
David Langley
2021-08-15 00:36:15 +01:00
parent 90e686efd0
commit 807dfdfce2
28 changed files with 490 additions and 190 deletions
@@ -18,7 +18,7 @@ import Foundation
import SwiftUI
@available(iOS 14.0, *)
struct VectorFormItemButtonStyle: ButtonStyle {
struct FormItemButtonStyle: ButtonStyle {
@Environment(\.theme) var theme: Theme
func makeBody(configuration: Self.Configuration) -> some View {
configuration.label
@@ -17,19 +17,19 @@
import SwiftUI
@available(iOS 14.0, *)
struct FormPickerItemView: View {
struct FormPickerItem: View {
typealias ClickCallback = () -> Void
typealias TapCallback = () -> Void
@Environment(\.theme) var theme: Theme
var title: String
var selected: Bool
var onClick: ClickCallback?
var onTap: TapCallback?
var body: some View {
Button {
onClick?()
onTap?()
} label: {
VStack {
Spacer()
@@ -47,20 +47,20 @@ struct FormPickerItemView: View {
}
.padding(.leading)
}
.buttonStyle(VectorFormItemButtonStyle())
.buttonStyle(FormItemButtonStyle())
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, idealHeight: 44, alignment: .leading)
.fixedSize(horizontal: false, vertical: true)
}
}
@available(iOS 14.0, *)
struct FormPickerCell_Previews: PreviewProvider {
struct FormPickerItem_Previews: PreviewProvider {
static let items = ["Item 1", "Item 2", "Item 3"]
static var selected: String = items[0]
static var previews: some View {
VectorFormView {
VectorForm {
ForEach(items, id: \.self) { item in
FormPickerItemView(title: item, selected: selected == item)
FormPickerItem(title: item, selected: selected == item)
}
}
}
@@ -17,7 +17,7 @@
import SwiftUI
@available(iOS 14.0, *)
struct FormSectionFooterView: View {
struct FormSectionFooter: View {
@Environment(\.theme) var theme: Theme
var text: String
@@ -35,11 +35,11 @@ struct FormSectionFooterView: View {
@available(iOS 14.0, *)
struct FormSectionFooter_Previews: PreviewProvider {
static var previews: some View {
VectorFormView {
SwiftUI.Section(footer: FormSectionFooterView(text: "Please note that mentions & keyword notifications are not available in encrypted rooms on mobile.")) {
FormPickerItemView(title: "Item 1", selected: false)
FormPickerItemView(title: "Item 2", selected: false)
FormPickerItemView(title: "Item 3", selected: false)
VectorForm {
SwiftUI.Section(footer: FormSectionFooter(text: "Please note that mentions & keyword notifications are not available in encrypted rooms on mobile.")) {
FormPickerItem(title: "Item 1", selected: false)
FormPickerItem(title: "Item 2", selected: false)
FormPickerItem(title: "Item 3", selected: false)
}
}
}
@@ -17,7 +17,7 @@
import SwiftUI
@available(iOS 14.0, *)
struct FormSectionHeaderView: View {
struct FormSectionHeader: View {
@Environment(\.theme) var theme: Theme
var text: String
@@ -30,17 +30,18 @@ struct FormSectionHeaderView: View {
.padding(.bottom, 8)
.font(Font(theme.fonts.subheadline))
.textCase(.uppercase)
.frame(maxWidth: .infinity, alignment: .leading)
}
}
@available(iOS 14.0, *)
struct FormSectionHeader_Previews: PreviewProvider {
static var previews: some View {
VectorFormView {
SwiftUI.Section(header: FormSectionHeaderView(text: "Section Header")) {
FormPickerItemView(title: "Item 1", selected: false)
FormPickerItemView(title: "Item 2", selected: false)
FormPickerItemView(title: "Item 3", selected: false)
VectorForm {
SwiftUI.Section(header: FormSectionHeader(text: "Section Header")) {
FormPickerItem(title: "Item 1", selected: false)
FormPickerItem(title: "Item 2", selected: false)
FormPickerItem(title: "Item 3", selected: false)
}
}
}
@@ -1,4 +1,4 @@
//
//
// Copyright 2021 New Vector Ltd
//
// Licensed under the Apache License, Version 2.0 (the "License");
@@ -17,7 +17,7 @@
import SwiftUI
@available(iOS 14.0.0, *)
struct RoomNotificationSettingsView: View {
struct RoomNotificationSettings: View {
@Environment(\.theme) var theme: Theme
@ObservedObject var viewModel: RoomNotificationSettingsViewModel
@@ -32,7 +32,8 @@ struct RoomNotificationSettingsView: View {
}
}
}
@ViewBuilder
private var rightButton: some View {
Button(VectorL10n.save) {
viewModel.process(viewAction: .save)
@@ -40,70 +41,57 @@ struct RoomNotificationSettingsView: View {
}
var body: some View {
VectorFormView {
if let image = viewModel.viewState.avatar {
RoomNotificationSettingsHeaderView(image: image, displayName: viewModel.viewState.displayName)
VectorForm {
if case let .swiftUI(avatarData) = viewModel.viewState.avatarData {
RoomNotificationSettingsHeader(
avatarData: avatarData,
displayName: viewModel.viewState.displayName
)
}
SwiftUI.Section(
header: FormSectionHeaderView(text: VectorL10n.roomNotifsSettingsNotifyMeFor),
footer: FormSectionFooterView(text: viewModel.viewState.roomEncryptedString)
header: FormSectionHeader(text: VectorL10n.roomNotifsSettingsNotifyMeFor),
footer: FormSectionFooter(text: viewModel.viewState.roomEncryptedString)
) {
ForEach(viewModel.viewState.notificationOptions) { option in
FormPickerItemView(title: option.title, selected: viewModel.viewState.notificationState == option) {
FormPickerItem(title: option.title, selected: viewModel.viewState.notificationState == option) {
viewModel.process(viewAction: .selectNotificationState(option))
}
}
}
.navigationBarTitle(VectorL10n.roomDetailsNotifs)
.navigationBarItems(
leading: leftButton,
trailing: rightButton
)
.onAppear {
viewModel.process(viewAction: .load)
}
}
.navigationBarTitle(VectorL10n.roomDetailsNotifs)
.navigationBarItems(
leading: leftButton,
trailing: rightButton
).onAppear {
viewModel.process(viewAction: .load)
}
}
}
fileprivate extension RoomNotificationState {
var title: String {
switch self {
case .all:
return VectorL10n.roomNotifsSettingsAllMessages
case .mentionsAndKeywordsOnly:
return VectorL10n.roomNotifsSettingsMentionsAndKeywords
case .mute:
return VectorL10n.roomNotifsSettingsNone
}
}
}
fileprivate extension RoomNotificationSettingsViewState {
var roomEncryptedString: String {
roomEncrypted ? VectorL10n.roomNotifsSettingsEncryptedRoomNotice : ""
}
}
@available(iOS 14.0, *)
struct RoomNotificationSettingsView_Previews: PreviewProvider {
struct RoomNotificationSettings_Previews: PreviewProvider {
static let mockViewModel = RoomNotificationSettingsViewModel(
roomNotificationService: MockRoomNotificationSettingsService.example,
avatarService: MockAvatarService.example,
avatarData: .swiftUI(AvatarInput(mxContentUri: nil, itemId: "", displayName: "Alice")),
avatarData: .swiftUI(MockAvatarInput.example),
displayName: MockAvatarInput.example.displayName,
roomEncrypted: true
)
static var previews: some View {
Group {
NavigationView {
RoomNotificationSettingsView(viewModel: mockViewModel, presentedModally: true)
RoomNotificationSettings(viewModel: mockViewModel, presentedModally: true)
.navigationBarTitleDisplayMode(.inline)
.addDependency(MockAvatarService.example)
}
NavigationView {
RoomNotificationSettingsView(viewModel: mockViewModel, presentedModally: true)
RoomNotificationSettings(viewModel: mockViewModel, presentedModally: true)
.navigationBarTitleDisplayMode(.inline)
.theme(ThemeIdentifier.dark.theme)
.addDependency(MockAvatarService.example)
}
}
}
@@ -17,17 +17,17 @@
import SwiftUI
@available(iOS 14.0, *)
struct RoomNotificationSettingsHeaderView: View {
struct RoomNotificationSettingsHeader: View {
@Environment(\.theme) var theme: Theme
var image: UIImage
var avatarData: AvatarInputType
var displayName: String?
var body: some View {
HStack {
Spacer()
VStack(alignment: .center) {
VectorAvatarView(image: image, size: .xxLarge)
AvatarImage(avatarData: avatarData, size: .xxLarge)
if let displayName = displayName {
Text(displayName)
.font(Font(theme.fonts.title3SB))
@@ -43,10 +43,11 @@ struct RoomNotificationSettingsHeaderView: View {
}
@available(iOS 14.0, *)
struct RoomNotificationSettingsHeaderView_Previews: PreviewProvider {
struct RoomNotificationSettingsHeader_Previews: PreviewProvider {
static let image = UIImage(imageLiteralResourceName: "app_symbol")
static let name = "Element"
static var previews: some View {
RoomNotificationSettingsHeaderView(image: image, displayName: name)
RoomNotificationSettingsHeader(avatarData: MockAvatarInput.example, displayName: name)
.addDependency(MockAvatarService.example)
}
}
@@ -1,44 +0,0 @@
//
// Copyright 2021 New Vector Ltd
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
//
import SwiftUI
import DesignKit
@available(iOS 14.0, *)
struct VectorAvatarView: View {
var image: UIImage
var size: AvatarSize
var body: some View {
Image(uiImage: image)
.resizable()
.frame(width: CGFloat(size.rawValue), height: CGFloat(size.rawValue), alignment: .center)
.clipShape(Circle())
}
}
@available(iOS 14.0, *)
struct AvatarView_Previews: PreviewProvider {
static let image = UIImage(imageLiteralResourceName: "app_symbol")
static var previews: some View {
VStack {
VectorAvatarView(image: image, size: .xSmall)
VectorAvatarView(image: image, size: .medium)
VectorAvatarView(image: image, size: .xLarge)
}
}
}
@@ -17,7 +17,7 @@
import SwiftUI
@available(iOS 14.0, *)
struct VectorFormView<Content: View>: View {
struct VectorForm<Content: View>: View {
@Environment(\.theme) var theme: Theme
var content: () -> Content
@@ -48,15 +48,15 @@ struct VectorForm_Previews: PreviewProvider {
static var previews: some View {
Group {
VectorFormView {
SwiftUI.Section(header: FormSectionHeaderView(text: "Section Header")) {
FormPickerItemView(title: "Item 1", selected: true)
FormPickerItemView(title: "Item 2", selected: false)
FormPickerItemView(title: "Item 3", selected: false)
VectorForm {
SwiftUI.Section(header: FormSectionHeader(text: "Section Header")) {
FormPickerItem(title: "Item 1", selected: true)
FormPickerItem(title: "Item 2", selected: false)
FormPickerItem(title: "Item 3", selected: false)
}
}
VectorFormView {
FormPickerItemView(title: "Item 1", selected: true)
VectorForm {
FormPickerItem(title: "Item 1", selected: true)
}.theme(ThemeIdentifier.dark.theme)
}
}