Override profile list selection color (#486)

Both List and Toggle use accent color for their tint. Instead:

- Set grayish .tint on List to customize selection color
- Retain global accent in VPNToggle

Fixes #458

CHANGELOG.md

@@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - Restricted profile not updated. [#481](https://github.com/passepartoutvpn/passepartout-apple/pull/481)
+- Selection and switch have the same color in organizer. [#458](https://github.com/passepartoutvpn/passepartout-apple/issues/458)
 
 ## 2.3.5 (2024-01-19)
 

Passepartout/App/Constants/Theme.swift

@@ -134,11 +134,14 @@ extension View {
         #endif
     }
 
-    @ViewBuilder
-    private func themeTint() -> some View {
+    func themeTint() -> some View {
         tint(.accentColor)
     }
 
+    func themeListSelectionColor() -> some View {
+        tint(Color.gray.opacity(0.6))
+    }
+
     private func themeListStyleValue() -> some ListStyle {
         #if !os(tvOS)
         .insetGrouped

Passepartout/App/Views/OrganizerView+Profiles.swift

@@ -97,7 +97,9 @@ private extension OrganizerView.ProfilesList {
                     profilesView
                 }
             }
-        }.themeAnimation(on: profileManager.headers)
+        }
+        .themeAnimation(on: profileManager.headers)
+        .themeListSelectionColor()
     }
 
     var profilesView: some View {
@@ -117,7 +119,8 @@ private extension OrganizerView.ProfilesList {
             ProfileView()
         } label: {
             profileLabel(forProfile: profile)
-        }.contextMenu {
+        }
+        .contextMenu {
             OrganizerView.ProfileContextMenu(header: profile.header)
         }
     }
@@ -133,15 +136,6 @@ private extension OrganizerView.ProfilesList {
     var sortedProfiles: [Profile] {
         profileManager.profiles
             .sorted()
-//            .sorted {
-//                if profileManager.isActiveProfile($0.id) {
-//                    return true
-//                } else if profileManager.isActiveProfile($1.id) {
-//                    return false
-//                } else {
-//                    return $0 < $1
-//                }
-//            }
     }
 }
 

Passepartout/App/Views/VPNToggle.swift

@@ -60,6 +60,8 @@ struct VPNToggle: View {
         Toggle(title, isOn: isEnabled)
             .disabled(!canToggle)
             .themeAnimation(on: currentVPNState.isEnabled)
+            // .tint(.accent) // XXX: #458, this does not work
+            .tint(Color(.accent))
     }
 }