react to key change

lib/android/state.dart

@@ -135,6 +135,7 @@ class NfcTapActionNotifier extends StateNotifier<NfcTapAction> {
   static const _prefNfcOpenApp = 'prefNfcOpenApp';
   static const _prefNfcCopyOtp = 'prefNfcCopyOtp';
   final SharedPreferences _prefs;
+
   NfcTapActionNotifier._(this._prefs, super._state);
 
   factory NfcTapActionNotifier(SharedPreferences prefs) {
@@ -176,6 +177,7 @@ class NfcKbdLayoutNotifier extends StateNotifier<String> {
   static const String _defaultClipKbdLayout = 'US';
   static const _prefClipKbdLayout = 'prefClipKbdLayout';
   final SharedPreferences _prefs;
+
   NfcKbdLayoutNotifier(this._prefs)
       : super(_prefs.getString(_prefClipKbdLayout) ?? _defaultClipKbdLayout);
 
@@ -194,6 +196,7 @@ final androidNfcBypassTouchProvider =
 class NfcBypassTouchNotifier extends StateNotifier<bool> {
   static const _prefNfcBypassTouch = 'prefNfcBypassTouch';
   final SharedPreferences _prefs;
+
   NfcBypassTouchNotifier(this._prefs)
       : super(_prefs.getBool(_prefNfcBypassTouch) ?? false);
 
@@ -212,6 +215,7 @@ final androidNfcSilenceSoundsProvider =
 class NfcSilenceSoundsNotifier extends StateNotifier<bool> {
   static const _prefNfcSilenceSounds = 'prefNfcSilenceSounds';
   final SharedPreferences _prefs;
+
   NfcSilenceSoundsNotifier(this._prefs)
       : super(_prefs.getBool(_prefNfcSilenceSounds) ?? false);
 
@@ -230,6 +234,7 @@ final androidUsbLaunchAppProvider =
 class UsbLaunchAppNotifier extends StateNotifier<bool> {
   static const _prefUsbOpenApp = 'prefUsbOpenApp';
   final SharedPreferences _prefs;
+
   UsbLaunchAppNotifier(this._prefs)
       : super(_prefs.getBool(_prefUsbOpenApp) ?? false);
 

lib/app/state.dart

@@ -27,6 +27,7 @@ import 'package:shared_preferences/shared_preferences.dart';
 import '../core/state.dart';
 import '../theme.dart';
 import 'features.dart' as features;
+import 'key_customization.dart';
 import 'logging.dart';
 import 'models.dart';
 
@@ -118,8 +119,12 @@ final l10nProvider = Provider<AppLocalizations>(
 );
 
 final themeModeProvider = StateNotifierProvider<ThemeModeNotifier, ThemeMode>(
-  (ref) => ThemeModeNotifier(
-      ref.watch(prefProvider), ref.read(supportedThemesProvider)),
+  (ref) {
+    // initialize the keyCustomizationManager
+    ref.read(keyCustomizationManagerProvider);
+    return ThemeModeNotifier(
+        ref.watch(prefProvider), ref.read(supportedThemesProvider));
+  },
 );
 
 class ThemeModeNotifier extends StateNotifier<ThemeMode> {
@@ -142,37 +147,60 @@ class ThemeModeNotifier extends StateNotifier<ThemeMode> {
 
 final primaryColorProvider = Provider<Color?>((ref) => null);
 
-final darkThemeProvider = StateNotifierProvider<ThemeNotifier, ThemeData>(
-  (ref) => ThemeNotifier(ref.watch(primaryColorProvider), ThemeMode.dark),
+final darkThemeProvider = NotifierProvider<ThemeNotifier, ThemeData>(
+  () => ThemeNotifier(ThemeMode.dark),
 );
 
-final lightThemeProvider = StateNotifierProvider<ThemeNotifier, ThemeData>(
-  (ref) => ThemeNotifier(ref.watch(primaryColorProvider), ThemeMode.light),
+final lightThemeProvider = NotifierProvider<ThemeNotifier, ThemeData>(
+  () => ThemeNotifier(ThemeMode.light),
 );
 
-class ThemeNotifier extends StateNotifier<ThemeData> {
+class ThemeNotifier extends Notifier<ThemeData> {
   final ThemeMode _themeMode;
 
-  ThemeNotifier(Color? systemPrimaryColor, this._themeMode)
-      : super(_get(systemPrimaryColor, _themeMode));
+  ThemeNotifier(this._themeMode);
+
+  @override
+  ThemeData build() {
+    return _get(
+      _themeMode,
+      yubiKeyData: ref.watch(currentDeviceDataProvider).valueOrNull,
+    );
+  }
 
   static ThemeData _getDefault(ThemeMode themeMode) =>
       themeMode == ThemeMode.light ? AppTheme.lightTheme : AppTheme.darkTheme;
 
-  static ThemeData _get(Color? primaryColor, ThemeMode themeMode) =>
-      (primaryColor != null)
-          ? _getDefault(themeMode).copyWith(
-              colorScheme: ColorScheme.fromSeed(
-                      brightness: themeMode == ThemeMode.dark
-                          ? Brightness.dark
-                          : Brightness.light,
-                      seedColor: primaryColor)
-                  .copyWith(primary: primaryColor))
-          : _getDefault(themeMode);
+  ThemeData _get(ThemeMode themeMode, {YubiKeyData? yubiKeyData}) {
+    Color? primaryColor;
+    if (yubiKeyData != null) {
+      final manager = ref.read(keyCustomizationManagerProvider);
+
+      final customization = manager.get(yubiKeyData.info.serial?.toString());
+      String? displayColorCustomization =
+          customization?.properties['display_color'];
+
+      if (displayColorCustomization != null) {
+        primaryColor = Color(int.parse(displayColorCustomization, radix: 16));
+      }
+    }
+
+    primaryColor ??= ref.read(primaryColorProvider);
+
+    return (primaryColor != null)
+        ? _getDefault(themeMode).copyWith(
+            colorScheme: ColorScheme.fromSeed(
+                    brightness: themeMode == ThemeMode.dark
+                        ? Brightness.dark
+                        : Brightness.light,
+                    seedColor: primaryColor)
+                .copyWith(primary: primaryColor))
+        : _getDefault(themeMode);
+  }
 
   void setPrimaryColor(Color? primaryColor) {
     _log.debug('Set primary color to $primaryColor');
-    state = _get(primaryColor, _themeMode);
+    state = _get(_themeMode);
   }
 }
 

lib/app/views/customize_page.dart

@@ -19,6 +19,8 @@ import 'package:flutter_gen/gen_l10n/app_localizations.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:logging/logging.dart';
 
+import '../../widgets/app_input_decoration.dart';
+import '../../widgets/app_text_form_field.dart';
 import '../../widgets/focus_utils.dart';
 import '../../widgets/responsive_dialog.dart';
 import '../key_customization.dart';
@@ -110,11 +112,11 @@ class _CustomizePageState extends ConsumerState<CustomizePage> {
             mainAxisSize: MainAxisSize.min,
             crossAxisAlignment: CrossAxisAlignment.start,
             children: [
-              TextFormField(
+              AppTextFormField(
                 //controller: displayNameController,
                 initialValue: _displayName,
                 maxLength: 20,
-                decoration: const InputDecoration(
+                decoration: const AppInputDecoration(
                   border: OutlineInputBorder(),
                   labelText: 'Nick name',
                   helperText: '', // Prevents dialog resizing when disabled

lib/desktop/state.dart

@@ -25,7 +25,6 @@ import 'package:logging/logging.dart';
 import 'package:shared_preferences/shared_preferences.dart';
 import 'package:window_manager/window_manager.dart';
 
-import '../app/key_customization.dart';
 import '../app/logging.dart';
 import '../app/models.dart';
 import '../app/state.dart';
@@ -216,18 +215,5 @@ class DesktopCurrentDeviceNotifier extends CurrentDeviceNotifier {
   setCurrentDevice(DeviceNode? device) {
     state = device;
     ref.read(prefProvider).setString(_lastDevice, device?.path.key ?? '');
-    if (device != null &&
-        device is UsbYubiKeyNode &&
-        device.info?.serial != null) {
-      final manager = ref.read(keyCustomizationManagerProvider);
-      final customization = manager.get(device.info?.serial!.toString());
-      String? displayColorCustomization =
-          customization?.properties['display_color'];
-      Color? displayColor;
-      if (displayColorCustomization != null) {
-        displayColor = Color(int.parse(displayColorCustomization, radix: 16));
-      }
-      ref.watch(darkThemeProvider.notifier).setPrimaryColor(displayColor);
-    }
   }
 }