Use an iOS 26 close button and re-order some sections in SettingsScreen. (#5281)

* Settings > Change Done button to Close

Do it!

* Change ordering of menu item sections

Swap manage app section with manage account section.

* Use a primaryAction placement for the close button.

* Generate the preview snapshots.

* Merge the Manage account and Manage devices actions.

---------

Co-authored-by: Doug <douglase@element.io>
This commit is contained in:
Aaron Thornburgh
2026-03-20 16:00:10 +01:00
committed by GitHub
parent 8a65d613b1
commit 0601b3248a
14 changed files with 33 additions and 39 deletions
@@ -38,7 +38,6 @@ struct SettingsScreenViewState: BindableState {
var userID: String
var showLinkNewDeviceButton: Bool
var accountProfileURL: URL?
var accountSessionsListURL: URL?
var showAccountDeactivation: Bool
var userAvatarURL: URL?
var userDisplayName: String?
@@ -88,7 +88,6 @@ class SettingsScreenViewModel: SettingsScreenViewModelType, SettingsScreenViewMo
await userSession.clientProxy.loadUserAvatarURL()
await userSession.clientProxy.loadUserDisplayName()
await state.accountProfileURL = userSession.clientProxy.accountURL(action: .profile)
await state.accountSessionsListURL = userSession.clientProxy.accountURL(action: .devicesList)
}
}
@@ -15,20 +15,20 @@ struct SettingsScreen: View {
private var shouldHideManageAccountSection: Bool {
context.viewState.accountProfileURL == nil &&
context.viewState.accountSessionsListURL == nil &&
!context.viewState.showBlockedUsers
!context.viewState.showBlockedUsers &&
!context.viewState.showLinkNewDeviceButton
}
var body: some View {
Form {
userSection
manageMyAppSection
if !shouldHideManageAccountSection {
manageAccountSection
}
manageMyAppSection
generalSection
signOutSection
@@ -108,16 +108,8 @@ struct SettingsScreen: View {
private var manageAccountSection: some View {
Section {
if context.viewState.showLinkNewDeviceButton {
ListRow(label: .default(title: L10n.commonLinkNewDevice,
icon: \.devices),
kind: .navigationLink {
context.send(viewAction: .linkNewDevice)
})
}
if let url = context.viewState.accountProfileURL {
ListRow(label: .default(title: L10n.actionManageAccount,
ListRow(label: .default(title: L10n.actionManageAccountAndDevices,
icon: \.userProfile),
kind: .button {
context.send(viewAction: .manageAccount(url: url))
@@ -125,11 +117,11 @@ struct SettingsScreen: View {
.accessibilityIdentifier(A11yIdentifiers.settingsScreen.account)
}
if let url = context.viewState.accountSessionsListURL {
ListRow(label: .default(title: L10n.actionManageDevices,
if context.viewState.showLinkNewDeviceButton {
ListRow(label: .default(title: L10n.commonLinkNewDevice,
icon: \.devices),
kind: .button {
context.send(viewAction: .manageAccount(url: url))
kind: .navigationLink {
context.send(viewAction: .linkNewDevice)
})
}
@@ -246,8 +238,8 @@ struct SettingsScreen: View {
}
private var toolbar: some ToolbarContent {
ToolbarItem(placement: .confirmationAction) {
Button(L10n.actionDone) { context.send(viewAction: .close) }
ToolbarItem(placement: .primaryAction) {
ToolbarButton(role: .close) { context.send(viewAction: .close) }
.accessibilityIdentifier(A11yIdentifiers.settingsScreen.done)
}
}
@@ -270,13 +262,13 @@ struct SettingsScreen_Previews: PreviewProvider, TestablePreview {
ElementNavigationStack {
SettingsScreen(context: viewModel.context)
}
.snapshotPreferences(expect: viewModel.context.observe(\.viewState.accountSessionsListURL).map { $0 != nil })
.snapshotPreferences(expect: viewModel.context.observe(\.viewState.accountProfileURL).map { $0 != nil })
.previewDisplayName("Default")
ElementNavigationStack {
SettingsScreen(context: bugReportDisabledViewModel.context)
}
.snapshotPreferences(expect: bugReportDisabledViewModel.context.observe(\.viewState.accountSessionsListURL).map { $0 != nil })
.snapshotPreferences(expect: bugReportDisabledViewModel.context.observe(\.viewState.accountProfileURL).map { $0 != nil })
.previewDisplayName("Bug report disabled")
}