[PM-21624] Remove divider from SettingListItem (#1580)

matt-livefront · web-flow · commit b41b94749090 · 2025-05-15T16:57:08.000-05:00
diff --git a/BitwardenShared/Core/Platform/Models/Enum/LanguageOption.swift b/BitwardenShared/Core/Platform/Models/Enum/LanguageOption.swift
@@ -66,16 +66,6 @@ public enum LanguageOption: Equatable, Sendable {
 
     // MARK: Properties
 
-    /// Whether the language option is the last one in the list.
-    var isLast: Bool {
-        switch self {
-        case .default:
-            false
-        case let .custom(languageCode: languageCode):
-            languageCode == LanguageOption.allCases.last?.value
-        }
-    }
-
     /// The title of the language option as it appears in the list of options.
     var title: String {
         switch self {
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/About/AboutView.swift b/BitwardenShared/UI/Platform/Settings/Settings/About/AboutView.swift
@@ -73,7 +73,7 @@ struct AboutView: View {
                     accessibilityIdentifier: "FlightRecorderSwitch"
                 )
 
-                SettingsListItem(Localizations.viewRecordedLogs, hasDivider: false) {
+                SettingsListItem(Localizations.viewRecordedLogs) {
                     store.send(.viewFlightRecorderLogsTapped)
                 }
             }
@@ -91,7 +91,7 @@ struct AboutView: View {
 
             externalLinkRow(Localizations.learnOrg, action: .learnAboutOrganizationsTapped)
 
-            SettingsListItem(store.state.version, hasDivider: false) {
+            SettingsListItem(store.state.version) {
                 store.send(.versionTapped)
             } trailingContent: {
                 Asset.Images.copy24.swiftUIImage
@@ -122,7 +122,7 @@ struct AboutView: View {
     /// - Returns: A `SettingsListItem` configured for an external web link.
     ///
     private func externalLinkRow(_ name: String, action: AboutAction) -> some View {
-        SettingsListItem(name, hasDivider: false) {
+        SettingsListItem(name) {
             store.send(action)
         } trailingContent: {
             Asset.Images.externalLink24.swiftUIImage
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/AccountSecurity/AccountSecurityView.swift b/BitwardenShared/UI/Platform/Settings/Settings/AccountSecurity/AccountSecurityView.swift
@@ -80,7 +80,6 @@ struct AccountSecurityView: View {
             ContentBlock(dividerLeadingPadding: 16) {
                 SettingsListItem(
                     Localizations.accountFingerprintPhrase,
-                    hasDivider: false,
                     accessibilityIdentifier: "AccountFingerprintPhraseLabel"
                 ) {
                     Task {
@@ -90,7 +89,6 @@ struct AccountSecurityView: View {
 
                 SettingsListItem(
                     Localizations.twoStepLogin,
-                    hasDivider: false,
                     accessibilityIdentifier: "TwoStepLoginLinkItemView"
                 ) {
                     store.send(.twoStepLoginPressed)
@@ -102,7 +100,6 @@ struct AccountSecurityView: View {
                 if store.state.isLockNowVisible {
                     SettingsListItem(
                         Localizations.lockNow,
-                        hasDivider: false,
                         accessibilityIdentifier: "LockNowLabel"
                     ) {
                         Task {
@@ -113,15 +110,13 @@ struct AccountSecurityView: View {
 
                 SettingsListItem(
                     Localizations.logOut,
-                    hasDivider: false,
                     accessibilityIdentifier: "LogOutLabel"
                 ) {
                     store.send(.logout)
                 }
 
                 SettingsListItem(
                     Localizations.deleteAccount,
-                    hasDivider: false,
                     accessibilityIdentifier: "DeleteAccountLabel"
                 ) {
                     store.send(.deleteAccountPressed)
@@ -135,7 +130,6 @@ struct AccountSecurityView: View {
         SectionView(Localizations.approveLoginRequests) {
             SettingsListItem(
                 Localizations.pendingLogInRequests,
-                hasDivider: false,
                 accessibilityIdentifier: "PendingLogInRequestsLabel"
             ) {
                 store.send(.pendingLoginRequestsTapped)
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/Appearance/SelectLanguage/SelectLanguageView.swift b/BitwardenShared/UI/Platform/Settings/Settings/Appearance/SelectLanguage/SelectLanguageView.swift
@@ -13,13 +13,11 @@ struct SelectLanguageView: View {
     // MARK: View
 
     var body: some View {
-        VStack(spacing: 0) {
+        ContentBlock(dividerLeadingPadding: 16) {
             ForEach(LanguageOption.allCases) { languageOption in
                 languageOptionRow(languageOption)
             }
         }
-        .background(Asset.Colors.backgroundSecondary.swiftUIColor)
-        .cornerRadius(10)
         .scrollView()
         .navigationBar(title: Localizations.selectLanguage, titleDisplayMode: .inline)
         .toolbar {
@@ -42,10 +40,7 @@ struct SelectLanguageView: View {
 
     /// Construct the row for the language option.
     private func languageOptionRow(_ languageOption: LanguageOption) -> some View {
-        SettingsListItem(
-            languageOption.title,
-            hasDivider: !languageOption.isLast
-        ) {
+        SettingsListItem(languageOption.title) {
             store.send(.languageTapped(languageOption))
         } trailingContent: {
             checkmarkView(languageOption)
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/AutoFill/AutoFillView.swift b/BitwardenShared/UI/Platform/Settings/Settings/AutoFill/AutoFillView.swift
@@ -81,14 +81,11 @@ struct AutoFillView: View {
     private var autoFillSection: some View {
         SectionView(Localizations.autofill, contentSpacing: 8) {
             ContentBlock(dividerLeadingPadding: 16) {
-                SettingsListItem(Localizations.passwordAutofill, hasDivider: false) {
+                SettingsListItem(Localizations.passwordAutofill) {
                     store.send(.passwordAutoFillTapped)
                 }
 
-                SettingsListItem(
-                    Localizations.appExtension,
-                    hasDivider: false
-                ) {
+                SettingsListItem(Localizations.appExtension) {
                     store.send(.appExtensionTapped)
                 }
             }
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/SettingsListItem.swift b/BitwardenShared/UI/Platform/Settings/Settings/SettingsListItem.swift
@@ -16,9 +16,6 @@ struct SettingsListItem<Content: View>: View {
     /// An optional string to display as the badge next to the trailing content.
     let badgeValue: String?
 
-    /// Whether or not the list item should have a divider on the bottom.
-    let hasDivider: Bool
-
     /// The optional icon to display on the leading edge of the list item.
     let icon: ImageAsset?
 
@@ -63,11 +60,6 @@ struct SettingsListItem<Content: View>: View {
                         .multilineTextAlignment(.trailing)
                 }
                 .padding(.horizontal, icon == nil ? 16 : 12)
-
-                if hasDivider {
-                    Divider()
-                        .padding(.leading, icon == nil ? 16 : 48)
-                }
             }
         }
         .accessibilityIdentifier(accessibilityIdentifier ?? "")
@@ -80,7 +72,6 @@ struct SettingsListItem<Content: View>: View {
     ///
     /// - Parameters:
     ///  - name: The name of the list item.
-    ///  - hasDivider: Whether or not the list item should have a divider on the bottom.
     ///  - accessibilityIdentifier: The accessibility ID for the list item.
     ///  - badgeValue: An optional string to display as the badge next to the trailing content.
     ///  - icon: The optional icon to display on the leading edge of the list item.
@@ -92,7 +83,6 @@ struct SettingsListItem<Content: View>: View {
     ///
     init(
         _ name: String,
-        hasDivider: Bool = true,
         accessibilityIdentifier: String? = nil,
         badgeValue: String? = nil,
         icon: ImageAsset? = nil,
@@ -103,7 +93,6 @@ struct SettingsListItem<Content: View>: View {
         self.accessibilityIdentifier = accessibilityIdentifier
         self.badgeValue = badgeValue
         self.name = name
-        self.hasDivider = hasDivider
         self.icon = icon
         self.nameAccessibilityID = nameAccessibilityID
         self.trailingContent = trailingContent
@@ -116,7 +105,7 @@ struct SettingsListItem<Content: View>: View {
 #if DEBUG
 #Preview {
     ScrollView {
-        VStack(spacing: 0) {
+        ContentBlock(dividerLeadingPadding: 16) {
             SettingsListItem("Account Security", icon: Asset.Images.locked24) {} trailingContent: {
                 Text("Trailing content")
             }
@@ -134,5 +123,7 @@ struct SettingsListItem<Content: View>: View {
             }
         }
     }
+    .padding()
+    .background(Asset.Colors.backgroundPrimary.swiftUIColor)
 }
 #endif
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/SettingsView.swift b/BitwardenShared/UI/Platform/Settings/Settings/SettingsView.swift
@@ -57,7 +57,6 @@ struct SettingsView: View {
     private var aboutRow: some View {
         SettingsListItem(
             Localizations.about,
-            hasDivider: false,
             icon: Asset.Images.informationCircle24
         ) {
             store.send(.aboutPressed)
@@ -71,7 +70,6 @@ struct SettingsView: View {
     private var accountSecurityRow: some View {
         SettingsListItem(
             Localizations.accountSecurity,
-            hasDivider: false,
             badgeValue: store.state.accountSecurityBadgeValue,
             icon: Asset.Images.locked24
         ) {
@@ -84,7 +82,7 @@ struct SettingsView: View {
 
     /// The appearance settings row.
     private var appearanceRow: some View {
-        SettingsListItem(Localizations.appearance, hasDivider: false, icon: Asset.Images.paintBrush) {
+        SettingsListItem(Localizations.appearance, icon: Asset.Images.paintBrush) {
             store.send(.appearancePressed)
         } trailingContent: {
             chevron
@@ -96,7 +94,6 @@ struct SettingsView: View {
     private var autofillRow: some View {
         SettingsListItem(
             Localizations.autofill,
-            hasDivider: false,
             badgeValue: store.state.autofillBadgeValue,
             icon: Asset.Images.checkCircle24
         ) {
@@ -109,7 +106,7 @@ struct SettingsView: View {
 
     /// The other settings row.
     private var otherRow: some View {
-        SettingsListItem(Localizations.other, hasDivider: false, icon: Asset.Images.other) {
+        SettingsListItem(Localizations.other, icon: Asset.Images.other) {
             store.send(.otherPressed)
         } trailingContent: {
             chevron
@@ -121,7 +118,6 @@ struct SettingsView: View {
     private var vaultRow: some View {
         SettingsListItem(
             Localizations.vault,
-            hasDivider: false,
             badgeValue: store.state.vaultBadgeValue,
             icon: Asset.Images.vaultSettings
         ) {
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/Vault/ExportVault/ExportSettings/ExportSettingsView.swift b/BitwardenShared/UI/Platform/Settings/Settings/Vault/ExportVault/ExportSettings/ExportSettingsView.swift
@@ -14,15 +14,15 @@ struct ExportSettingsView: View {
 
     var body: some View {
         VStack(alignment: .leading, spacing: 16) {
-            SettingsListItem(Localizations.exportVaultToAFile, hasDivider: false) {
+            SettingsListItem(Localizations.exportVaultToAFile) {
                 store.send(.exportToFileTapped)
             } trailingContent: {
                 chevron
             }
             .accessibilityIdentifier("ExportVaultToAFileLabel")
             .cornerRadius(10)
 
-            SettingsListItem(Localizations.exportVaultToAnotherApp, hasDivider: false) {
+            SettingsListItem(Localizations.exportVaultToAnotherApp) {
                 store.send(.exportToAppTapped)
             } trailingContent: {
                 chevron
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/Vault/Folders/FoldersView.swift b/BitwardenShared/UI/Platform/Settings/Settings/Vault/Folders/FoldersView.swift
@@ -53,8 +53,8 @@ struct FoldersView: View {
 
     /// The section listing all the user's folders.
     private var folders: some View {
-        VStack(spacing: 0) {
-            ForEachIndexed(
+        ContentBlock(dividerLeadingPadding: 16) {
+            ForEach(
                 store.state.folders.sorted { first, second in
                     if first.name.localizedStandardCompare(second.name) == .orderedSame {
                         first.id?.localizedStandardCompare(second.id ?? "") == .orderedAscending
@@ -63,19 +63,14 @@ struct FoldersView: View {
                     }
                 },
                 id: \.id
-            ) { index, folder in
-                SettingsListItem(
-                    folder.name,
-                    hasDivider: index < (store.state.folders.count - 1),
-                    nameAccessibilityID: "FolderName"
-                ) {
+            ) { folder in
+                SettingsListItem(folder.name, nameAccessibilityID: "FolderName") {
                     guard let id = folder.id else { return }
                     store.send(.folderTapped(id: id))
                 }
                 .accessibilityIdentifier("FolderCell")
             }
         }
-        .clipShape(RoundedRectangle(cornerRadius: 10))
         .padding(.bottom, FloatingActionButton.bottomOffsetPadding)
     }
 }
diff --git a/BitwardenShared/UI/Platform/Settings/Settings/Vault/VaultSettingsView.swift b/BitwardenShared/UI/Platform/Settings/Settings/Vault/VaultSettingsView.swift
@@ -56,7 +56,7 @@ struct VaultSettingsView: View {
 
     /// The vault settings section.
     private var vaultSettings: some View {
-        VStack(spacing: 0) {
+        ContentBlock(dividerLeadingPadding: 16) {
             SettingsListItem(Localizations.folders) {
                 store.send(.foldersTapped)
             }
@@ -67,15 +67,14 @@ struct VaultSettingsView: View {
             }
             .accessibilityIdentifier("ExportVaultLabel")
 
-            SettingsListItem(Localizations.importItems, hasDivider: false) {
+            SettingsListItem(Localizations.importItems) {
                 store.send(.importItemsTapped)
             } trailingContent: {
                 Image(asset: Asset.Images.externalLink24)
                     .imageStyle(.rowIcon)
             }
             .accessibilityIdentifier("ImportItemsLinkItemView")
         }
-        .clipShape(RoundedRectangle(cornerRadius: 10))
     }
 }
 

Original file line number	Diff line number	Diff line change
`@@ -81,14 +81,11 @@ struct AutoFillView: View {`
`81`	`81`	`private var autoFillSection: some View {`
`82`	`82`	`SectionView(Localizations.autofill, contentSpacing: 8) {`
`83`	`83`	`ContentBlock(dividerLeadingPadding: 16) {`
`84`		`- SettingsListItem(Localizations.passwordAutofill, hasDivider: false) {`
	`84`	`+ SettingsListItem(Localizations.passwordAutofill) {`
`85`	`85`	`store.send(.passwordAutoFillTapped)`
`86`	`86`	`}`
`87`	`87`
`88`		`- SettingsListItem(`
`89`		`- Localizations.appExtension,`
`90`		`- hasDivider: false`
`91`		`- ) {`
	`88`	`+ SettingsListItem(Localizations.appExtension) {`
`92`	`89`	`store.send(.appExtensionTapped)`
`93`	`90`	`}`
`94`	`91`	`}`
Original file line number	Diff line number	Diff line change
`@@ -53,8 +53,8 @@ struct FoldersView: View {`
`53`	`53`
`54`	`54`	`/// The section listing all the user's folders.`
`55`	`55`	`private var folders: some View {`
`56`		`- VStack(spacing: 0) {`
`57`		`- ForEachIndexed(`
	`56`	`+ ContentBlock(dividerLeadingPadding: 16) {`
	`57`	`+ ForEach(`
`58`	`58`	`store.state.folders.sorted { first, second in`
`59`	`59`	`if first.name.localizedStandardCompare(second.name) == .orderedSame {`
`60`	`60`	`first.id?.localizedStandardCompare(second.id ?? "") == .orderedAscending`
`@@ -63,19 +63,14 @@ struct FoldersView: View {`
`63`	`63`	`}`
`64`	`64`	`},`
`65`	`65`	`id: \.id`
`66`		`- ) { index, folder in`
`67`		`- SettingsListItem(`
`68`		`- folder.name,`
`69`		`- hasDivider: index < (store.state.folders.count - 1),`
`70`		`- nameAccessibilityID: "FolderName"`
`71`		`- ) {`
	`66`	`+ ) { folder in`
	`67`	`+ SettingsListItem(folder.name, nameAccessibilityID: "FolderName") {`
`72`	`68`	`guard let id = folder.id else { return }`
`73`	`69`	`store.send(.folderTapped(id: id))`
`74`	`70`	`}`
`75`	`71`	`.accessibilityIdentifier("FolderCell")`
`76`	`72`	`}`
`77`	`73`	`}`
`78`		`- .clipShape(RoundedRectangle(cornerRadius: 10))`
`79`	`74`	`.padding(.bottom, FloatingActionButton.bottomOffsetPadding)`
`80`	`75`	`}`
`81`	`76`	`}`
Original file line number	Diff line number	Diff line change
`@@ -56,7 +56,7 @@ struct VaultSettingsView: View {`
`56`	`56`
`57`	`57`	`/// The vault settings section.`
`58`	`58`	`private var vaultSettings: some View {`
`59`		`- VStack(spacing: 0) {`
	`59`	`+ ContentBlock(dividerLeadingPadding: 16) {`
`60`	`60`	`SettingsListItem(Localizations.folders) {`
`61`	`61`	`store.send(.foldersTapped)`
`62`	`62`	`}`
`@@ -67,15 +67,14 @@ struct VaultSettingsView: View {`
`67`	`67`	`}`
`68`	`68`	`.accessibilityIdentifier("ExportVaultLabel")`
`69`	`69`
`70`		`- SettingsListItem(Localizations.importItems, hasDivider: false) {`
	`70`	`+ SettingsListItem(Localizations.importItems) {`
`71`	`71`	`store.send(.importItemsTapped)`
`72`	`72`	`} trailingContent: {`
`73`	`73`	`Image(asset: Asset.Images.externalLink24)`
`74`	`74`	`.imageStyle(.rowIcon)`
`75`	`75`	`}`
`76`	`76`	`.accessibilityIdentifier("ImportItemsLinkItemView")`
`77`	`77`	`}`
`78`		`- .clipShape(RoundedRectangle(cornerRadius: 10))`
`79`	`78`	`}`
`80`	`79`	`}`
`81`	`80`