Update voice broadcast tiles UI (#6965)

This commit is contained in:
Yoan Pintas
2022-10-25 15:58:06 +02:00
committed by GitHub
parent c8e87fb7e5
commit d53008c1ed
35 changed files with 248 additions and 93 deletions
@@ -45,7 +45,7 @@ final class VoiceBroadcastRecorderCoordinator: Coordinator, Presentable {
voiceBroadcastRecorderService = VoiceBroadcastRecorderService(session: parameters.session, roomId: parameters.room.matrixItemId)
let details = VoiceBroadcastRecorderDetails(senderDisplayName: parameters.senderDisplayName)
let details = VoiceBroadcastRecorderDetails(senderDisplayName: parameters.senderDisplayName, avatarData: parameters.room.avatarData)
let viewModel = VoiceBroadcastRecorderViewModel(details: details,
recorderService: voiceBroadcastRecorderService)
voiceBroadcastRecorderViewModel = viewModel
@@ -23,6 +23,13 @@ struct VoiceBroadcastRecorderView: View {
@Environment(\.theme) private var theme: ThemeSwiftUI
private var backgroundColor: Color {
if viewModel.viewState.recordingState != .paused {
return theme.colors.alert
}
return theme.colors.quarterlyContent
}
// MARK: Public
@ObservedObject var viewModel: VoiceBroadcastRecorderViewModel.Context
@@ -30,10 +37,35 @@ struct VoiceBroadcastRecorderView: View {
var body: some View {
let details = viewModel.viewState.details
VStack(alignment: .leading, spacing: 16.0) {
Text(details.senderDisplayName ?? "")
.font(theme.fonts.bodySB)
.foregroundColor(theme.colors.primaryContent)
VStack(alignment: .center) {
HStack(alignment: .top) {
AvatarImage(avatarData: viewModel.viewState.details.avatarData, size: .xSmall)
VStack(alignment: .leading, spacing: 0) {
Text(details.avatarData.displayName ?? details.avatarData.matrixItemId)
.font(theme.fonts.bodySB)
.foregroundColor(theme.colors.primaryContent)
Label {
Text(VectorL10n.voiceBroadcastTile)
.foregroundColor(theme.colors.secondaryContent)
.font(theme.fonts.caption1)
} icon: {
Image(uiImage: Asset.Images.voiceBroadcastTileLive.image)
}
}.frame(maxWidth: .infinity, alignment: .leading)
Label {
Text(VectorL10n.voiceBroadcastLive)
.font(theme.fonts.caption1SB)
.foregroundColor(Color.white)
} icon: {
Image(uiImage: Asset.Images.voiceBroadcastLive.image)
}
.padding(.horizontal, 5)
.background(RoundedRectangle(cornerRadius: 4, style: .continuous).fill(backgroundColor))
.accessibilityIdentifier("liveButton")
}
HStack(alignment: .top, spacing: 16.0) {
Button {
@@ -32,6 +32,7 @@ enum VoiceBroadcastRecorderState {
struct VoiceBroadcastRecorderDetails {
let senderDisplayName: String?
let avatarData: AvatarInputProtocol
}
struct VoiceBroadcastRecorderViewState: BindableState {
@@ -31,7 +31,7 @@ enum MockVoiceBroadcastRecorderScreenState: MockScreenState, CaseIterable {
}
var screenView: ([Any], AnyView) {
let details = VoiceBroadcastRecorderDetails(senderDisplayName: "")
let details = VoiceBroadcastRecorderDetails(senderDisplayName: "", avatarData: AvatarInput(mxContentUri: "", matrixItemId: "!fakeroomid:matrix.org", displayName: "The name of the room"))
let viewModel = MockVoiceBroadcastRecorderViewModel(initialViewState: VoiceBroadcastRecorderViewState(details: details, recordingState: .started, bindings: VoiceBroadcastRecorderViewStateBindings()))
return (