Use ListRow on PollFormScreen. (#2183)

This commit is contained in:
Doug
2023-11-29 09:57:35 +00:00
committed by GitHub
parent e7494164b2
commit df89e43f89
24 changed files with 111 additions and 86 deletions
+1 -1
View File
@@ -6692,7 +6692,7 @@
repositoryURL = "https://github.com/vector-im/compound-ios"; repositoryURL = "https://github.com/vector-im/compound-ios";
requirement = { requirement = {
kind = revision; kind = revision;
revision = 59166acc95a775ba3b7e7d39e5605611cf0e657f; revision = 8774e358ac6927f041400733ac681456f0910c10;
}; };
}; };
9A472EE0218FE7DCF5283429 /* XCRemoteSwiftPackageReference "SwiftUI-Introspect" */ = { 9A472EE0218FE7DCF5283429 /* XCRemoteSwiftPackageReference "SwiftUI-Introspect" */ = {
@@ -14,7 +14,7 @@
"kind" : "remoteSourceControl", "kind" : "remoteSourceControl",
"location" : "https://github.com/vector-im/compound-ios", "location" : "https://github.com/vector-im/compound-ios",
"state" : { "state" : {
"revision" : "59166acc95a775ba3b7e7d39e5605611cf0e657f" "revision" : "8774e358ac6927f041400733ac681456f0910c10"
} }
}, },
{ {
@@ -54,7 +54,7 @@ struct BugReportScreen: View {
private var textFieldSection: some View { private var textFieldSection: some View {
Section { Section {
ListRow(label: .plain(title: L10n.screenBugReportEditorPlaceholder), ListRow(label: .plain(title: L10n.screenBugReportEditorPlaceholder),
kind: .textField(text: $context.reportText)) kind: .textField(text: $context.reportText, axis: .vertical))
.lineLimit(4, reservesSpace: true) .lineLimit(4, reservesSpace: true)
.accessibilityIdentifier(A11yIdentifiers.bugReportScreen.report) .accessibilityIdentifier(A11yIdentifiers.bugReportScreen.report)
} footer: { } footer: {
@@ -34,7 +34,7 @@ struct PollFormScreen: View {
deletePollSection deletePollSection
} }
.trackAnalyticsIfNeeded(context: context) .trackAnalyticsIfNeeded(context: context)
.compoundForm() .compoundList()
.scrollDismissesKeyboard(.immediately) .scrollDismissesKeyboard(.immediately)
.environment(\.editMode, .constant(.active)) .environment(\.editMode, .constant(.active))
.navigationTitle(context.viewState.navigationTitle) .navigationTitle(context.viewState.navigationTitle)
@@ -48,32 +48,31 @@ struct PollFormScreen: View {
// MARK: - Private // MARK: - Private
private var questionSection: some View { private var questionSection: some View {
Section(L10n.screenCreatePollQuestionDesc) { Section {
TextField(text: $context.question) { ListRow(label: .plain(title: L10n.screenCreatePollQuestionHint),
Text(L10n.screenCreatePollQuestionHint) kind: .textField(text: $context.question))
.compoundFormTextFieldPlaceholder() .introspect(.textField, on: .supportedVersions) { textField in
} textField.clearButtonMode = .whileEditing
.introspect(.textField, on: .supportedVersions) { textField in }
textField.clearButtonMode = .whileEditing .focused($focus, equals: .question)
} .accessibilityIdentifier(A11yIdentifiers.pollFormScreen.question)
.textFieldStyle(.compoundForm) .onSubmit {
.focused($focus, equals: .question) focus = context.options.indices.first.map { .option(index: $0) }
.accessibilityIdentifier(A11yIdentifiers.pollFormScreen.question) }
.onSubmit { .submitLabel(.next)
focus = context.options.indices.first.map { .option(index: $0) } } header: {
} Text(L10n.screenCreatePollQuestionDesc)
.submitLabel(.next) .compoundListSectionHeader()
} }
.compoundFormSection()
} }
private var optionsSection: some View { private var optionsSection: some View {
Section { Section {
ForEach(context.options) { option in ForEach(context.options) { option in
if let index = context.options.firstIndex(of: option) { if let index = context.options.firstIndex(of: option) {
PollFormOptionView(text: $context.options[index].text.limited(to: 240), PollFormOptionRow(text: $context.options[index].text.limited(to: 240),
placeholder: L10n.screenCreatePollAnswerHint(index + 1), placeholder: L10n.screenCreatePollAnswerHint(index + 1),
canDeleteItem: context.options.count > 2) { canDeleteItem: context.options.count > 2) {
if case .option(let focusedIndex) = focus, focusedIndex == index { if case .option(let focusedIndex) = focus, focusedIndex == index {
focus = nil focus = nil
} }
@@ -94,22 +93,22 @@ struct PollFormScreen: View {
} }
if context.options.count < context.viewState.maxNumberOfOptions { if context.options.count < context.viewState.maxNumberOfOptions {
Button(L10n.screenCreatePollAddOptionBtn) { ListRow(label: .plain(title: L10n.screenCreatePollAddOptionBtn),
context.send(viewAction: .addOption) kind: .button {
focus = context.options.indices.last.map { .option(index: $0) } context.send(viewAction: .addOption)
} focus = context.options.indices.last.map { .option(index: $0) }
.accessibilityIdentifier(A11yIdentifiers.pollFormScreen.addOption) })
.accessibilityIdentifier(A11yIdentifiers.pollFormScreen.addOption)
} }
} }
.compoundFormSection()
} }
private var showResultsSection: some View { private var showResultsSection: some View {
Section { Section {
Toggle(L10n.screenCreatePollAnonymousDesc, isOn: $context.isUndisclosed) ListRow(label: .plain(title: L10n.screenCreatePollAnonymousDesc),
kind: .toggle($context.isUndisclosed))
.accessibilityIdentifier(A11yIdentifiers.pollFormScreen.pollKind) .accessibilityIdentifier(A11yIdentifiers.pollFormScreen.pollKind)
} }
.compoundFormSection()
} }
@ViewBuilder @ViewBuilder
@@ -117,13 +116,9 @@ struct PollFormScreen: View {
switch context.viewState.mode { switch context.viewState.mode {
case .edit: case .edit:
Section { Section {
Button(role: .destructive) { ListRow(label: .plain(title: L10n.actionDeletePoll, role: .destructive),
context.send(viewAction: .delete) kind: .button { context.send(viewAction: .delete) })
} label: {
Text(L10n.actionDeletePoll)
}
} }
.compoundFormSection()
case .new: case .new:
EmptyView() EmptyView()
} }
@@ -159,7 +154,7 @@ private extension View {
} }
} }
private struct PollFormOptionView: View { private struct PollFormOptionRow: View {
@Environment(\.editMode) var editMode @Environment(\.editMode) var editMode
@Binding var text: String @Binding var text: String
let placeholder: String let placeholder: String
@@ -167,24 +162,30 @@ private struct PollFormOptionView: View {
let deleteAction: () -> Void let deleteAction: () -> Void
var body: some View { var body: some View {
HStack(spacing: 8) { ListRow(kind: .custom {
if editMode?.wrappedValue == .active { HStack(spacing: 16) {
Button(role: .destructive, action: deleteAction) { if editMode?.wrappedValue == .active {
CompoundIcon(\.delete) Button(role: .destructive, action: deleteAction) {
CompoundIcon(\.delete)
}
.disabled(!canDeleteItem)
.buttonStyle(.compound(.plain))
.accessibilityLabel(L10n.actionRemove)
} }
.disabled(!canDeleteItem)
.buttonStyle(.compound(.plain)) TextField(text: $text) {
.accessibilityLabel(L10n.actionRemove) Text(placeholder)
.compoundTextFieldPlaceholder()
}
.introspect(.textField, on: .supportedVersions) { textField in
textField.clearButtonMode = .whileEditing
}
.tint(.compound.iconAccentTertiary)
.alignmentGuide(.listRowSeparatorLeading) { _ in 0 }
} }
TextField(text: $text) { .padding(.horizontal, ListRowPadding.horizontal)
Text(placeholder) .padding(.vertical, ListRowPadding.vertical)
.compoundFormTextFieldPlaceholder() })
}
.introspect(.textField, on: .supportedVersions) { textField in
textField.clearButtonMode = .whileEditing
}
.textFieldStyle(.compoundForm)
}
} }
} }
@@ -192,10 +193,29 @@ private struct PollFormOptionView: View {
struct PollFormScreen_Previews: PreviewProvider, TestablePreview { struct PollFormScreen_Previews: PreviewProvider, TestablePreview {
static let viewModel = PollFormScreenViewModel(mode: .new) static let viewModel = PollFormScreenViewModel(mode: .new)
static let editViewModel = PollFormScreenViewModel(mode: .edit(eventID: "1234", poll: poll))
static let poll = Poll(question: "Cats or Dogs?",
kind: .disclosed,
maxSelections: 1,
options: [
.init(id: "0", text: "Cats", votes: 0, allVotes: 0, isSelected: false, isWinning: false),
.init(id: "0", text: "Dogs", votes: 0, allVotes: 0, isSelected: false, isWinning: false),
.init(id: "0", text: "Fish", votes: 0, allVotes: 0, isSelected: false, isWinning: false)
],
votes: [:],
endDate: nil,
createdByAccountOwner: true)
static var previews: some View { static var previews: some View {
NavigationStack { NavigationStack {
PollFormScreen(context: viewModel.context) PollFormScreen(context: viewModel.context)
} }
.previewDisplayName("New")
NavigationStack {
PollFormScreen(context: editViewModel.context)
}
.previewDisplayName("Edit")
} }
} }
@@ -43,7 +43,7 @@ struct ReportContentScreen: View {
private var reasonSection: some View { private var reasonSection: some View {
Section { Section {
ListRow(label: .plain(title: L10n.reportContentHint), ListRow(label: .plain(title: L10n.reportContentHint),
kind: .textField(text: $context.reasonText)) kind: .textField(text: $context.reasonText, axis: .vertical))
.lineLimit(4, reservesSpace: true) .lineLimit(4, reservesSpace: true)
} footer: { } footer: {
Text(L10n.reportContentExplanation) Text(L10n.reportContentExplanation)
+2 -1
View File
@@ -49,7 +49,8 @@ class PollFormScreenUITests: XCTestCase {
let addOption = app.buttons[A11yIdentifiers.pollFormScreen.addOption] let addOption = app.buttons[A11yIdentifiers.pollFormScreen.addOption]
for _ in 1...18 { for _ in 1...18 {
if !addOption.exists { // Use the frame as a fallback to fix the button being obscured by the home indicator.
if !addOption.isHittable || addOption.frame.maxY > (app.frame.maxY - 20) {
app.swipeUp() app.swipeUp()
} }
addOption.tap() addOption.tap()
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:6d5ff2fccc554a739052160b4e224f2845ac09d1bfb733c8f5adb78b860aa6a2 oid sha256:2955b8a8c24fc65f917c722ed3ed73dc91adcd0c2b690fc1ba9fb0ebcb9a2e65
size 86358 size 87226
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:f63af9f1e715da12f55d7e91279c47219b42b27125e44f915c47227321a12bdb oid sha256:46e0da06cd751549c0debc4cc44ca7c05f368387f2b868db79ef33dccc16c368
size 185844 size 182444
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:49bc0269e6ee23dd860ebe5aa28115500cfa09120db606c072be0f3831804294 oid sha256:f80d3352ccc3f89a9a68c041145416562c3e5b6c893a6b099c3012f1cfbc300b
size 89795 size 90898
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:75e7080c7e2701f3c2225543f0862366af3726b289832f718a1f20687f718852 oid sha256:55c14d4b93f46ca93e3dcbfceaa41f04c72d07e2208d71579c54960b26e17789
size 98596 size 102626
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:aaf56b99ecc5b57d4a22a4c6fbefe5eae6e731c16794ec528072e0c5695d26eb oid sha256:4b106061996488ae46a3afa4701e44586230601faa5ad5b019f0f1b831637adb
size 308849 size 296955
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:08badf82fe902d28e5b94cb64b1e018039febf8c440aa9bcdf20278c2c85d0f0 oid sha256:fd42c7188d81f3f3e9d95dd38b8e1fc91a7606c7cd62fe2d489b174b51cf8253
size 103798 size 107729
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:a3f917bd4c44eaefe4e1d81333ea0f957ab58ea30eb7d9bbfc74b9d341e64107 oid sha256:0de593a81e150cd96f2b5a7b8dd0b4782c07e6deb1df8d4df4cee773a8283ae7
size 90650 size 91558
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:5952c0897de9cce140b877dda5413f2ee2a611d5bdfe7747b24289c3280534ef oid sha256:eb62280b037556efb52b2b0c55f7fc3b9f2b73f34f83d0af9b2c8881c3b66207
size 223668 size 217791
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:e4538a0afc6b1c8e04563ed6b780907bb79e9711c2538ab52347fc207b84feb3 oid sha256:c5f89615f4a3021fe65d5e1790a3c5b0708bf057cc56f9ed9b31c20ae5975f75
size 97971 size 98656
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:6f58f283d752f71111d6256fb4900811d4acd5c9986e49974079929eb8886e0b oid sha256:4cd6ee2d916ff6d436ac3c88c65f2483591997aeaa8e61b7be1db9d3d81beb1d
size 113717 size 116890
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:394201a98ed59bf494453a5746cd069058548d52bee6df79981489d4abe36540 oid sha256:e3dc7dc02f3a91e3bde9eedff35921ac6d0686ed477387493a7e81dec2a512c4
size 351267 size 338429
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:1bbc082476832b1cdd4ec0eee854bbe885b6c71189b77c8b578c10934b0d4c86 oid sha256:b146f3309a3356836781c2ce0a5b5bf89ecc5094a4ec5776d2f3a9f36e023379
size 123787 size 129146
@@ -1,3 +0,0 @@
version https://git-lfs.github.com/spec/v1
oid sha256:c8a37f2e525c24464f4a99e7110abad6bff7923429d5de27f25167c2b62b7241
size 122848
@@ -0,0 +1,3 @@
version https://git-lfs.github.com/spec/v1
oid sha256:b35a659b867b21712bceb7523dfa3c3f3c726b0dca8baea425aeb99c4c952e29
size 128152
@@ -0,0 +1,3 @@
version https://git-lfs.github.com/spec/v1
oid sha256:838e1140a68573de8781e620fa52652caf6b5ab8f53c25a277c8ec7762965c3d
size 124067
@@ -1,3 +1,3 @@
version https://git-lfs.github.com/spec/v1 version https://git-lfs.github.com/spec/v1
oid sha256:857f429b2a73b1c154e624afd9458440d82793abf7a79227614331179130fd71 oid sha256:23ef3965d902febf307ece27a688b9daebd9d2fa474dbc933fec76079224405e
size 84175 size 84182
+1
View File
@@ -0,0 +1 @@
Use the Compound List component on PollFormScreen.
+1 -1
View File
@@ -49,7 +49,7 @@ packages:
# path: ../matrix-rust-sdk # path: ../matrix-rust-sdk
Compound: Compound:
url: https://github.com/vector-im/compound-ios url: https://github.com/vector-im/compound-ios
revision: 59166acc95a775ba3b7e7d39e5605611cf0e657f revision: 8774e358ac6927f041400733ac681456f0910c10
# path: ../compound-ios # path: ../compound-ios
AnalyticsEvents: AnalyticsEvents:
url: https://github.com/matrix-org/matrix-analytics-events url: https://github.com/matrix-org/matrix-analytics-events