no feat(router): implement GoRouter navigation system

conflict: resolved conflicts

approved by esmaeil-ahmadipour

CHANGELOG.md

@@ -1,3 +1,13 @@
+# 1.3.0+4
+
+- Implement Theme Management
+  - feature(features:main:theme): add theme manager for switch between dark and light themes [#33](https://github.com/pactus-project/pactus-gui/pull/33)
+
+# 1.2.0+3
+
+- Implement Localization Management
+  - feat(localization): integrate l10n_flutter with Bloc for language management [#30](https://github.com/pactus-project/pactus-gui/pull/30)
+
 # 1.1.0+2
 
 - Rewriting Project and Upgrading to Flutter 3.24.5

lib/main.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
 import 'package:flutter_localizations/flutter_localizations.dart';
+import 'package:gui/src/features/main/theme/bloc/theme_bloc.dart';
 import 'core/router/app_router.dart';
 import 'src/features/main/language/presentation/bloc/language_bloc.dart';
 
@@ -12,6 +13,9 @@ void main() {
         BlocProvider<LanguageBloc>(
           create: (_) => LanguageBloc(),
         ),
+        BlocProvider<ThemeBloc>(
+          create: (_) => ThemeBloc(),
+        ),
       ],
       child: MyApp(),
     ),
@@ -24,24 +28,27 @@ class MyApp extends StatelessWidget {
   @override
   Widget build(BuildContext context) {
     return BlocBuilder<LanguageBloc, LanguageState>(
-      builder: (context, state) {
-        return MaterialApp.router(
-          // Changed to MaterialApp.router
-          routerConfig: routerConfig, // Added router configuration
-          title: 'Flutter Demo',
-          locale: state.selectedLanguage.value,
-          localizationsDelegates: const [
-            AppLocalizations.delegate,
-            GlobalMaterialLocalizations.delegate,
-            GlobalWidgetsLocalizations.delegate,
-            GlobalCupertinoLocalizations.delegate,
-          ],
-          supportedLocales: const [
-            Locale('en'),
-            Locale('es'),
-            Locale('fr'),
-          ],
-          // Removed 'home' property as it's handled by the router
+      builder: (context, languageState) {
+        return BlocBuilder<ThemeBloc, ThemeState>(
+          builder: (context, themeState) {
+            return MaterialApp.router(
+              routerConfig: routerConfig,
+              title: 'Flutter Demo',
+              locale: languageState.selectedLanguage.value,
+              theme: themeState.themeData,
+              localizationsDelegates: const [
+                AppLocalizations.delegate,
+                GlobalMaterialLocalizations.delegate,
+                GlobalWidgetsLocalizations.delegate,
+                GlobalCupertinoLocalizations.delegate,
+              ],
+              supportedLocales: const [
+                Locale('en'),
+                Locale('es'),
+                Locale('fr'),
+              ],
+            );
+          },
         );
       },
     );

lib/src/core/enums/theme_modes.dart

@@ -0,0 +1,11 @@
+/// # [ThemeModes] Documentation
+///
+/// An enumeration representing different modes of application themes.
+///
+/// ## Enum Overview
+///
+/// - Enum Name: [ThemeModes]
+/// - Values:
+///   - [light] : Represents the light theme mode.
+///   - [dark] : Represents the dark theme mode.
+enum ThemeModes { light, dark }

lib/src/features/home/presentation/screen/home_screen.dart

@@ -1,5 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
+import 'package:gui/src/features/main/theme/presentation/widgets/theme_selector.dart';
+import 'package:gui/src/features/main/theme/theme_data/pallets/on_surface_pallet.dart';
 import '../../../main/language/presentation/widget/language_widget.dart';
 
 class HomeScreen extends StatefulWidget {
@@ -18,23 +20,31 @@ class _HomeScreenState extends State<HomeScreen> {
 
   @override
   Widget build(BuildContext context) {
+    final theme = Theme.of(context);
     return Scaffold(
       appBar: AppBar(
-        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
-        title: Text(AppLocalizations.of(context)?.title ?? ''),
+        backgroundColor: theme.colorScheme.inversePrimary,
+        title: Text(AppLocalizations.of(context)!.title),
       ),
       body: Center(
         child: Column(
           mainAxisAlignment: MainAxisAlignment.center,
           children: <Widget>[
             Text(
-              AppLocalizations.of(context)?.subtitle ?? '',
+              AppLocalizations.of(context)!.subtitle,
+              style: theme.textTheme.titleMedium!.copyWith(
+                color: theme.extension<OnSurfacePallet>()!.onSurface3,
+              ),
             ),
             Text(
               '$_counter',
-              style: Theme.of(context).textTheme.headlineMedium,
+              style: theme.textTheme.headlineMedium!.copyWith(
+                color: theme.extension<OnSurfacePallet>()!.onSurface3,
+              ),
             ),
             const SizedBox(height: 20),
+            const ThemeSelector(),
+            const SizedBox(height: 20),
             const LanguageSelector(), // Add the language selector here
           ],
         ),

lib/src/features/main/theme/bloc/theme_bloc.dart

@@ -0,0 +1,30 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:gui/src/core/enums/theme_modes.dart';
+import 'package:gui/src/features/main/theme/theme_data/app_theme_data.dart';
+
+part 'theme_event.dart';
+part 'theme_state.dart';
+
+class ThemeBloc extends Bloc<ThemeEvent, ThemeState> {
+  ThemeBloc()
+      : super(
+          ThemeState.initial(AppThemeData.themeDataModes[ThemeModes.light]!),
+        ) {
+    on<ThemeChanged>(_onThemeChanged);
+  }
+
+  void _onThemeChanged(ThemeChanged event, Emitter<ThemeState> emit) {
+    final isLightTheme = event.theme == ThemeModes.light;
+
+    final textTheme =
+        isLightTheme ? AppThemeData.lightTextTheme : AppThemeData.darkTextTheme;
+
+    emit(
+      ThemeState.initial(
+        AppThemeData.themeDataModes[event.theme]!
+            .copyWith(textTheme: textTheme),
+      ),
+    );
+  }
+}

lib/src/features/main/theme/bloc/theme_event.dart

@@ -0,0 +1,8 @@
+part of 'theme_bloc.dart';
+
+abstract class ThemeEvent {}
+
+class ThemeChanged extends ThemeEvent {
+  ThemeChanged({required this.theme});
+  final ThemeModes theme;
+}

lib/src/features/main/theme/bloc/theme_state.dart

@@ -0,0 +1,10 @@
+part of 'theme_bloc.dart';
+
+class ThemeState {
+  ThemeState._({required this.themeData});
+
+  factory ThemeState.initial(ThemeData themeData) {
+    return ThemeState._(themeData: themeData);
+  }
+  final ThemeData themeData;
+}

lib/src/features/main/theme/presentation/widgets/theme_selector.dart

@@ -0,0 +1,33 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:gui/src/core/enums/theme_modes.dart';
+import 'package:gui/src/features/main/theme/bloc/theme_bloc.dart';
+import 'package:gui/src/features/main/theme/theme_data/pallets/on_surface_pallet.dart';
+
+class ThemeSelector extends StatelessWidget {
+  const ThemeSelector({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final isLightTheme = theme.brightness == Brightness.light;
+    return Row(
+      mainAxisAlignment: MainAxisAlignment.center,
+      children: [
+        ElevatedButton(
+          onPressed: () {
+            context.read<ThemeBloc>().add(
+                  ThemeChanged(
+                    theme: isLightTheme ? ThemeModes.dark : ThemeModes.light,
+                  ),
+                );
+          },
+          child: Icon(
+            isLightTheme ? Icons.nightlight_round_rounded : Icons.sunny,
+            color: theme.extension<OnSurfacePallet>()!.onSurface3,
+          ),
+        ),
+      ],
+    );
+  }
+}