Merge pull request #120 from flutter-news-app-full-source-code/Resolving-Remote-Config-Race-Condition-on-App-Launch

Resolving remote config race condition on app launch

Author: fulleni

lib/account/view/account_page.dart

@@ -23,7 +23,7 @@ class AccountPage extends StatelessWidget {
     final appState = context.watch<AppBloc>().state;
     final user = appState.user;
     final status = appState.status;
-    final isAnonymous = status == AppStatus.anonymous;
+    final isAnonymous = status == AppLifeCycleStatus.anonymous;
     final theme = Theme.of(context);
     final textTheme = theme.textTheme;
 

lib/app/bloc/app_bloc.dart

@@ -1,127 +1,137 @@
 part of 'app_bloc.dart';
 
-/// Represents the application's authentication status.
-enum AppStatus {
-  /// The application is initializing and the status is unknown.
-  initial,
+/// Defines the various statuses of the application's overall state.
+///
+/// This enum helps manage the application's flow, especially during startup
+/// and critical operations like fetching remote configuration or handling
+/// authentication changes.
+enum AppLifeCycleStatus {
+  /// The application is in the initial phase of bootstrapping,
+  /// fetching remote configuration and user settings.
+  initializing,
+
+  /// The user is not authenticated.
+  unauthenticated,
 
-  /// The user is authenticated.
+  /// The user is authenticated (e.g., standard user).
   authenticated,
 
-  /// The user is unauthenticated.
-  unauthenticated,
-
-  /// The user is anonymous (signed in using an anonymous provider).
+  /// The user is anonymous (e.g., guest user).
   anonymous,
 
-  /// Fetching the essential RemoteConfig.
+  /// The application is currently fetching remote configuration.
+  /// This status is used for re-fetching or background checks, not initial load.
   configFetching,
 
-  /// Fetching the essential RemoteConfig failed.
+  /// The application failed to fetch remote configuration.
   configFetchFailed,
 
-  /// A new version of the app is required.
-  updateRequired,
-
-  /// The app is currently under maintenance.
+  /// The application is currently under maintenance.
   underMaintenance,
+
+  /// A mandatory update is required for the application.
+  updateRequired,
 }
 
+/// {@template app_state}
+/// Represents the overall state of the application.
+///
+/// This state includes authentication status, user settings, remote
+/// configuration, and UI-related preferences.
+/// {@endtemplate}
 class AppState extends Equatable {
   /// {@macro app_state}
   const AppState({
+    required this.status,
     required this.settings,
-    required this.selectedBottomNavigationIndex,
-    this.themeMode = ThemeMode.system,
-    this.appTextScaleFactor = AppTextScaleFactor.medium,
-    this.flexScheme = FlexScheme.material,
-    this.fontFamily,
-    this.status = AppStatus.initial, // Changed from AppStatus
+    required this.environment,
     this.user,
-    this.locale = const Locale('en'), // Default to English
     this.remoteConfig,
-    this.environment,
+    this.themeMode = ThemeMode.system,
+    this.flexScheme = FlexScheme.blue,
+    this.fontFamily,
+    this.appTextScaleFactor = AppTextScaleFactor.medium,
+    this.selectedBottomNavigationIndex = 0,
+    this.locale,
   });
 
-  /// The index of the currently selected item in the bottom navigation bar.
-  final int selectedBottomNavigationIndex;
+  /// The current status of the application.
+  final AppLifeCycleStatus status;
 
-  /// The overall theme mode (light, dark, system).
-  final ThemeMode themeMode;
+  /// The currently authenticated or anonymous user.
+  final User? user;
 
-  /// The text scale factor for the app's UI.
-  final AppTextScaleFactor appTextScaleFactor;
+  /// The user's application settings, including display preferences.
+  final UserAppSettings settings;
 
-  /// The active color scheme defined by FlexColorScheme.
+  /// The remote configuration fetched from the backend.
+  final RemoteConfig? remoteConfig;
+
+  /// The current theme mode (light, dark, or system).
+  final ThemeMode themeMode;
+
+  /// The current FlexColorScheme scheme for accent colors.
   final FlexScheme flexScheme;
 
-  /// The active font family name (e.g., from Google Fonts).
-  /// Null uses the default font family defined in the FlexColorScheme theme.
+  /// The currently selected font family.
   final String? fontFamily;
 
-  /// The current authentication status of the application.
-  final AppStatus status;
-
-  /// The current user details. Null if unauthenticated.
-  final User? user;
+  /// The current text scale factor.
+  final AppTextScaleFactor appTextScaleFactor;
 
-  /// User-specific application settings.
-  final UserAppSettings settings;
+  /// The currently selected index for bottom navigation.
+  final int selectedBottomNavigationIndex;
 
-  /// The current application locale.
-  final Locale locale;
+  /// The current application environment.
+  final local_config.AppEnvironment environment;
 
-  /// The global application configuration (remote config).
-  final RemoteConfig? remoteConfig;
+  /// The currently selected locale for localization.
+  final Locale? locale;
 
-  /// The current application environment (e.g., production, development, demo).
-  final local_config.AppEnvironment? environment;
+  @override
+  List<Object?> get props => [
+    status,
+    user,
+    settings,
+    remoteConfig,
+    themeMode,
+    flexScheme,
+    fontFamily,
+    appTextScaleFactor,
+    selectedBottomNavigationIndex,
+    environment,
+    locale,
+  ];
 
-  /// Creates a copy of the current state with updated values.
+  /// Creates a copy of this [AppState] with the given fields replaced with
+  /// the new values.
   AppState copyWith({
-    int? selectedBottomNavigationIndex,
+    AppLifeCycleStatus? status,
+    User? user,
+    UserAppSettings? settings,
+    RemoteConfig? remoteConfig,
+    bool clearAppConfig = false,
     ThemeMode? themeMode,
     FlexScheme? flexScheme,
     String? fontFamily,
     AppTextScaleFactor? appTextScaleFactor,
-    AppStatus? status, // Changed from AppStatus
-    User? user,
-    UserAppSettings? settings,
-    Locale? locale,
-    RemoteConfig? remoteConfig,
+    int? selectedBottomNavigationIndex,
     local_config.AppEnvironment? environment,
-    bool clearFontFamily = false,
-    bool clearAppConfig = false,
-    bool clearEnvironment = false,
+    Locale? locale,
   }) {
     return AppState(
-      selectedBottomNavigationIndex:
-          selectedBottomNavigationIndex ?? this.selectedBottomNavigationIndex,
-      themeMode: themeMode ?? this.themeMode,
-      flexScheme: flexScheme ?? this.flexScheme,
-      fontFamily: clearFontFamily ? null : fontFamily ?? this.fontFamily,
-      appTextScaleFactor: appTextScaleFactor ?? this.appTextScaleFactor,
       status: status ?? this.status,
       user: user ?? this.user,
       settings: settings ?? this.settings,
-      locale: locale ?? this.locale,
       remoteConfig: clearAppConfig ? null : remoteConfig ?? this.remoteConfig,
-      environment: clearEnvironment ? null : environment ?? this.environment,
+      themeMode: themeMode ?? this.themeMode,
+      flexScheme: flexScheme ?? this.flexScheme,
+      fontFamily: fontFamily ?? this.fontFamily,
+      appTextScaleFactor: appTextScaleFactor ?? this.appTextScaleFactor,
+      selectedBottomNavigationIndex:
+          selectedBottomNavigationIndex ?? this.selectedBottomNavigationIndex,
+      environment: environment ?? this.environment,
+      locale: locale ?? this.locale,
     );
   }
-
-  @override
-  List<Object?> get props => [
-    selectedBottomNavigationIndex,
-    themeMode,
-    flexScheme,
-    fontFamily,
-    appTextScaleFactor,
-    status,
-    user,
-    settings,
-    locale,
-    remoteConfig,
-    environment,
-  ];
 }

lib/app/bloc/app_state.dart

@@ -4,6 +4,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_news_app_mobile_client_full_source_code/app/bloc/app_bloc.dart';
 import 'package:flutter_news_app_mobile_client_full_source_code/app/config/config.dart';
+import 'package:logging/logging.dart';
 
 /// {@template app_status_service}
 /// A service dedicated to monitoring the application's lifecycle and
@@ -32,7 +33,8 @@ class AppStatusService with WidgetsBindingObserver {
     required AppEnvironment environment,
   }) : _context = context,
        _checkInterval = checkInterval,
-       _environment = environment {
+       _environment = environment,
+       _logger = Logger('AppStatusService') {
     // Immediately register this service as a lifecycle observer.
     WidgetsBinding.instance.addObserver(this);
     // Start the periodic checks.
@@ -48,6 +50,9 @@ class AppStatusService with WidgetsBindingObserver {
   /// The current application environment.
   final AppEnvironment _environment;
 
+  /// The logger instance for this service.
+  final Logger _logger;
+
   /// The timer responsible for periodic checks.
   Timer? _timer;
 
@@ -62,10 +67,10 @@ class AppStatusService with WidgetsBindingObserver {
     _timer = Timer.periodic(_checkInterval, (_) {
       // In demo mode, periodic checks are not needed as there's no backend.
       if (_environment == AppEnvironment.demo) {
-        print('[AppStatusService] Demo mode: Skipping periodic check.');
+        _logger.info('[AppStatusService] Demo mode: Skipping periodic check.');
         return;
       }
-      print(
+      _logger.info(
         '[AppStatusService] Periodic check triggered. Requesting AppConfig fetch.',
       );
       // Add the event to the AppBloc to fetch the latest config.
@@ -84,13 +89,13 @@ class AppStatusService with WidgetsBindingObserver {
     // useful on web, where switching browser tabs would otherwise trigger
     // a reload, which is unnecessary and can be distracting for demos.
     if (_environment == AppEnvironment.demo) {
-      print('[AppStatusService] Demo mode: Skipping app lifecycle check.');
+      _logger.info('[AppStatusService] Demo mode: Skipping app lifecycle check.');
       return;
     }
 
     // We are only interested in the 'resumed' state.
     if (state == AppLifecycleState.resumed) {
-      print('[AppStatusService] App resumed. Requesting AppConfig fetch.');
+      _logger.info('[AppStatusService] App resumed. Requesting AppConfig fetch.');
       // When the app comes to the foreground, immediately trigger a check.
       // This is crucial for catching maintenance mode that was enabled
       // while the app was in the background.
@@ -106,7 +111,7 @@ class AppStatusService with WidgetsBindingObserver {
   /// the main app widget is disposed) to prevent memory leaks from the
   /// timer and the observer registration.
   void dispose() {
-    print('[AppStatusService] Disposing service.');
+    _logger.info('[AppStatusService] Disposing service.');
     // Stop the periodic timer.
     _timer?.cancel();
     // Remove this object from the list of lifecycle observers.

lib/app/services/app_status_service.dart

@@ -188,15 +188,15 @@ class _AppView extends StatefulWidget {
 
 class _AppViewState extends State<_AppView> {
   late final GoRouter _router;
-  late final ValueNotifier<AppStatus> _statusNotifier;
+  late final ValueNotifier<AppLifeCycleStatus> _statusNotifier;
   AppStatusService? _appStatusService;
 
   @override
   void initState() {
     super.initState();
     final appBloc = context.read<AppBloc>();
     // Initialize the notifier with the BLoC's current state
-    _statusNotifier = ValueNotifier<AppStatus>(appBloc.state.status);
+    _statusNotifier = ValueNotifier<AppLifeCycleStatus>(appBloc.state.status);
 
     // Instantiate and initialize the AppStatusService.
     // This service will automatically trigger checks when the app is resumed
@@ -259,7 +259,7 @@ class _AppViewState extends State<_AppView> {
           // By returning a dedicated widget here, we ensure these pages are
           // full-screen and exist outside the main app's navigation shell.
 
-          if (state.status == AppStatus.underMaintenance) {
+          if (state.status == AppLifeCycleStatus.underMaintenance) {
             // The app is in maintenance mode. Show the MaintenancePage.
             //
             // WHY A SEPARATE MATERIALAPP?
@@ -299,7 +299,7 @@ class _AppViewState extends State<_AppView> {
             );
           }
 
-          if (state.status == AppStatus.updateRequired) {
+          if (state.status == AppLifeCycleStatus.updateRequired) {
             // A mandatory update is required. Show the UpdateRequiredPage.
             return MaterialApp(
               debugShowCheckedModeBanner: false,
@@ -326,8 +326,8 @@ class _AppViewState extends State<_AppView> {
             );
           }
 
-          if (state.status == AppStatus.configFetching ||
-              state.status == AppStatus.configFetchFailed) {
+          if (state.status == AppLifeCycleStatus.configFetching ||
+              state.status == AppLifeCycleStatus.configFetchFailed) {
             // The app is in the process of fetching its initial remote
             // configuration or has failed to do so. The StatusPage handles
             // both the loading indicator and the retry mechanism.

lib/app/view/app.dart

@@ -8,7 +8,9 @@ class AppBlocObserver extends BlocObserver {
   @override
   void onChange(BlocBase<dynamic> bloc, Change<dynamic> change) {
     super.onChange(bloc, change);
-    log('onChange(${bloc.runtimeType}, $change)');
+    log(
+      'onChange(${bloc.runtimeType}, $change.currentState -> $change.nextState)',
+    );
   }
 
   @override

lib/bloc_observer.dart

@@ -1681,6 +1681,12 @@ abstract class AppLocalizations {
   /// In en, this message translates to:
   /// **'Ads help keep this app free !'**
   String get adInfoPlaceholderText;
+
+  /// Text for a button that allows the user to retry a failed operation.
+  ///
+  /// In en, this message translates to:
+  /// **'Retry'**
+  String get retryButtonText;
 }
 
 class _AppLocalizationsDelegate

lib/l10n/app_localizations.dart

@@ -877,4 +877,7 @@ class AppLocalizationsAr extends AppLocalizations {
   @override
   String get adInfoPlaceholderText =>
       'الإعلانات تساعد في إبقاء هذا التطبيق مجانيًا.';
+
+  @override
+  String get retryButtonText => 'إعادة المحاولة';
 }

lib/l10n/app_localizations_ar.dart

@@ -879,4 +879,7 @@ class AppLocalizationsEn extends AppLocalizations {
 
   @override
   String get adInfoPlaceholderText => 'Ads help keep this app free !';
+
+  @override
+  String get retryButtonText => 'Retry';
 }

lib/l10n/app_localizations_en.dart

@@ -1144,5 +1144,9 @@
     "adInfoPlaceholderText": "الإعلانات تساعد في إبقاء هذا التطبيق مجانيًا.",
     "@adInfoPlaceholderText": {
         "description": "رسالة معروضة في خانات الإعلانات عند تحميل الإعلانات أو فشلها، تشرح الغرض منها."
+    },
+    "retryButtonText": "إعادة المحاولة",
+    "@retryButtonText": {
+        "description": "Text for a button that allows the user to retry a failed operation."
     }
 }