Apply system appearance via UIKit/AppKit (#1200)

SwiftUI implementation is fragile, system appearance with
`preferredColorScheme(nil)` is buggy.

Instead, rely on:

- iOS: UIKit → UIWindow.overrideUserInterfaceStyle
- macOS: AppKit → NSApp.appearance

Amends #1077 

Fixes #1199

Author: keeshux

Packages/App/Sources/UILibrary/Business/AppContext.swift

@@ -34,6 +34,8 @@ import UIAccessibility
 public final class AppContext: ObservableObject, Sendable {
     public let apiManager: APIManager
 
+    public let appearanceManager: AppearanceManager
+
     public let iapManager: IAPManager
 
     public let migrationManager: MigrationManager
@@ -65,6 +67,7 @@ public final class AppContext: ObservableObject, Sendable {
         onEligibleFeaturesBlock: ((Set<AppFeature>) async -> Void)? = nil
     ) {
         self.apiManager = apiManager
+        appearanceManager = AppearanceManager()
         self.iapManager = iapManager
         self.migrationManager = migrationManager
         self.preferencesManager = preferencesManager

Packages/App/Sources/UILibrary/Business/AppearanceManager.swift

@@ -0,0 +1,76 @@
+//
+//  AppearanceManager.swift
+//  Passepartout
+//
+//  Created by Davide De Rosa on 2/18/25.
+//  Copyright (c) 2025 Davide De Rosa. All rights reserved.
+//
+//  https://github.com/passepartoutvpn
+//
+//  This file is part of Passepartout.
+//
+//  Passepartout is free software: you can redistribute it and/or modify
+//  it under the terms of the GNU General Public License as published by
+//  the Free Software Foundation, either version 3 of the License, or
+//  (at your option) any later version.
+//
+//  Passepartout is distributed in the hope that it will be useful,
+//  but WITHOUT ANY WARRANTY; without even the implied warranty of
+//  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+//  GNU General Public License for more details.
+//
+//  You should have received a copy of the GNU General Public License
+//  along with Passepartout.  If not, see <http://www.gnu.org/licenses/>.
+//
+
+import Foundation
+import SwiftUI
+
+@MainActor
+public final class AppearanceManager: ObservableObject {
+    private let defaults: UserDefaults
+
+    @Published
+    public var systemAppearance: SystemAppearance? {
+        didSet {
+            defaults.set(systemAppearance?.rawValue, forKey: UIPreference.systemAppearance.key)
+            apply()
+        }
+    }
+
+    public init(defaults: UserDefaults = .standard) {
+        self.defaults = defaults
+        systemAppearance = defaults.string(forKey: UIPreference.systemAppearance.key)
+            .flatMap {
+                SystemAppearance(rawValue: $0)
+            }
+    }
+}
+
+private extension AppearanceManager {
+    func apply() {
+#if os(iOS)
+        guard let scene = UIApplication.shared.connectedScenes.first as? UIWindowScene,
+              let window = scene.keyWindow else {
+            return
+        }
+        switch systemAppearance {
+        case .light:
+            window.overrideUserInterfaceStyle = .light
+        case .dark:
+            window.overrideUserInterfaceStyle = .dark
+        case .none:
+            window.overrideUserInterfaceStyle = .unspecified
+        }
+#elseif os(macOS)
+        switch systemAppearance {
+        case .light:
+            NSApp.appearance = NSAppearance(named: .vibrantLight)
+        case .dark:
+            NSApp.appearance = NSAppearance(named: .vibrantDark)
+        case .none:
+            NSApp.appearance = nil
+        }
+#endif
+    }
+}

Packages/App/Sources/UILibrary/Domain/SystemAppearance.swift

@@ -24,20 +24,9 @@
 //
 
 import Foundation
-import SwiftUI
 
 public enum SystemAppearance: String, RawRepresentable {
     case light
 
     case dark
 }
-
-extension Optional where Wrapped == SystemAppearance {
-    public var colorScheme: ColorScheme? {
-        switch self {
-        case .none: return nil
-        case .light: return .light
-        case .dark: return .dark
-        }
-    }
-}

Packages/App/Sources/UILibrary/Extensions/View+Environment.swift

@@ -30,6 +30,7 @@ extension View {
     public func withEnvironment(from context: AppContext, theme: Theme) -> some View {
         environmentObject(theme)
             .environmentObject(context.apiManager)
+            .environmentObject(context.appearanceManager)
             .environmentObject(context.iapManager)
             .environmentObject(context.migrationManager)
             .environmentObject(context.preferencesManager)

Packages/App/Sources/UILibrary/Theme/UI/Theme+Modifiers.swift

@@ -65,10 +65,6 @@ public enum ThemeModalSize: Hashable {
 }
 
 extension View {
-    public func themeAppearance(systemScheme: ColorScheme) -> some View {
-        modifier(ThemeAppearanceModifier(systemScheme: systemScheme))
-    }
-
     public func themeModal<Content>(
         isPresented: Binding<Bool>,
         options: ThemeModalOptions? = nil,
@@ -342,9 +338,6 @@ struct ThemeBooleanModalModifier<Modal>: ViewModifier where Modal: View {
     @Environment(\.colorScheme)
     private var colorScheme
 
-    @AppStorage(UIPreference.systemAppearance.key)
-    private var systemAppearance: SystemAppearance?
-
     @Binding
     var isPresented: Bool
 
@@ -368,7 +361,6 @@ struct ThemeBooleanModalModifier<Modal>: ViewModifier where Modal: View {
 #endif
                     .interactiveDismissDisabled(!options.isInteractive)
                     .themeLockScreen()
-                    .themeAppearance(systemScheme: colorScheme)
             }
     }
 }
@@ -381,9 +373,6 @@ struct ThemeItemModalModifier<Modal, T>: ViewModifier where Modal: View, T: Iden
     @Environment(\.colorScheme)
     private var colorScheme
 
-    @AppStorage(UIPreference.systemAppearance.key)
-    private var systemAppearance: SystemAppearance?
-
     @Binding
     var item: T?
 
@@ -407,7 +396,6 @@ struct ThemeItemModalModifier<Modal, T>: ViewModifier where Modal: View, T: Iden
 #endif
                     .interactiveDismissDisabled(!options.isInteractive)
                     .themeLockScreen()
-                    .themeAppearance(systemScheme: colorScheme)
             }
     }
 }
@@ -472,19 +460,6 @@ struct ThemeNavigationStackModifier: ViewModifier {
 
 // MARK: - Content modifiers
 
-struct ThemeAppearanceModifier: ViewModifier {
-
-    @AppStorage(UIPreference.systemAppearance.key)
-    private var systemAppearance: SystemAppearance?
-
-    let systemScheme: ColorScheme
-
-    func body(content: Content) -> some View {
-        content
-            .preferredColorScheme(systemAppearance.colorScheme ?? systemScheme)
-    }
-}
-
 struct ThemeManualInputModifier: ViewModifier {
 }
 

Packages/App/Sources/UILibrary/Views/Preferences/PreferencesGroup.swift

@@ -32,8 +32,8 @@ import SwiftUI
 
 public struct PreferencesGroup: View {
 
-    @AppStorage(UIPreference.systemAppearance.key)
-    private var systemAppearance: SystemAppearance?
+    @EnvironmentObject
+    private var appearanceManager: AppearanceManager
 
 #if os(iOS)
     @AppStorage(UIPreference.locksInBackground.key)
@@ -80,7 +80,7 @@ private extension PreferencesGroup {
     ]
 
     var systemAppearancePicker: some View {
-        Picker(Strings.Views.Preferences.systemAppearance, selection: $systemAppearance) {
+        Picker(Strings.Views.Preferences.systemAppearance, selection: $appearanceManager.systemAppearance) {
             ForEach(Self.systemAppearances, id: \.self) {
                 Text($0.localizedDescription)
             }

Passepartout/App/Platforms/App+iOS.swift

@@ -52,7 +52,6 @@ extension PassepartoutApp {
                 .withEnvironment(from: context, theme: theme)
                 .environment(\.isUITesting, AppCommandLine.contains(.uiTesting))
                 .tint(.accentColor)
-                .themeAppearance(systemScheme: colorScheme)
         }
     }
 }

Passepartout/App/Platforms/App+macOS.swift

@@ -64,7 +64,6 @@ extension PassepartoutApp {
                 .withEnvironment(from: context, theme: theme)
                 .environment(\.isUITesting, AppCommandLine.contains(.uiTesting))
                 .frame(minWidth: 600, minHeight: 400)
-                .themeAppearance(systemScheme: colorScheme)
         }
         .defaultSize(width: 600, height: 400)
 
@@ -73,7 +72,6 @@ extension PassepartoutApp {
                 .withEnvironment(from: context, theme: theme)
                 .environmentObject(settings)
                 .environment(\.isUITesting, AppCommandLine.contains(.uiTesting))
-                .themeAppearance(systemScheme: colorScheme)
         }
         .defaultSize(width: 500, height: 400)