CCExtractor#7 Add Dark Mode Support to Firebase Editor App

android/app/google-services.json

@@ -1,37 +1,45 @@
 {
   "project_info": {
-    "project_number": "211384953661",
-    "project_id": "gsoc-24-3f4d1",
-    "storage_bucket": "gsoc-24-3f4d1.appspot.com"
+    "project_number": "124506192389",
+    "project_id": "arya-30631",
+    "storage_bucket": "arya-30631.firebasestorage.app"
   },
   "client": [
     {
       "client_info": {
-        "mobilesdk_app_id": "1:211384953661:android:14233d29467afa30317354",
+        "mobilesdk_app_id": "1:124506192389:android:3b5d15df5a5c4ce2c33a6c",
         "android_client_info": {
           "package_name": "com.example.firebase_editor_gsoc"
         }
       },
       "oauth_client": [
         {
-          "client_id": "211384953661-sac152s9j9uif0asf1772jkc9nr5le8t.apps.googleusercontent.com",
+          "client_id": "124506192389-u63mabk5mu5j8uiecnfk5rmpq874orsk.apps.googleusercontent.com",
+          "client_type": 1,
+          "android_info": {
+            "package_name": "com.example.firebase_editor_gsoc",
+            "certificate_hash": "ef9611c769de4c139ac9d28b61f2f9fbcb80acb0"
+          }
+        },
+        {
+          "client_id": "124506192389-d33edk5jiu8len9u7dgptfon6gc64tdb.apps.googleusercontent.com",
           "client_type": 3
         }
       ],
       "api_key": [
         {
-          "current_key": "AIzaSyAO1F8fTW1EG88fnnTTFRJiKXH4I-MHlbI"
+          "current_key": "AIzaSyCUpHP6uGWzHKCtu5_vPmI1vcI7ph_Ihvk"
         }
       ],
       "services": {
         "appinvite_service": {
           "other_platform_oauth_client": [
             {
-              "client_id": "211384953661-sac152s9j9uif0asf1772jkc9nr5le8t.apps.googleusercontent.com",
+              "client_id": "124506192389-d33edk5jiu8len9u7dgptfon6gc64tdb.apps.googleusercontent.com",
               "client_type": 3
             },
             {
-              "client_id": "211384953661-9hkosute6of7qapl18kjacl04m6f14ko.apps.googleusercontent.com",
+              "client_id": "124506192389-32s8la4ndjd5q30phqj8cnsbrht2gp67.apps.googleusercontent.com",
               "client_type": 2,
               "ios_info": {
                 "bundle_id": "com.example.firebaseEditorGsoc"

firebase.json

@@ -1 +1 @@
-{"flutter":{"platforms":{"android":{"default":{"projectId":"gsoc-24-3f4d1","appId":"1:211384953661:android:14233d29467afa30317354","fileOutput":"android/app/google-services.json"}},"dart":{"lib/firebase_options.dart":{"projectId":"gsoc-24-3f4d1","configurations":{"android":"1:211384953661:android:14233d29467afa30317354","ios":"1:211384953661:ios:007f4e6da5f618ea317354"}}}}}}
+{"flutter":{"platforms":{"android":{"default":{"projectId":"arya-30631","appId":"1:124506192389:android:3b5d15df5a5c4ce2c33a6c","fileOutput":"android/app/google-services.json"}},"dart":{"lib/firebase_options.dart":{"projectId":"arya-30631","configurations":{"android":"1:124506192389:android:3b5d15df5a5c4ce2c33a6c","ios":"1:124506192389:ios:41bf9826de2537b9c33a6c","macos":"1:124506192389:ios:41bf9826de2537b9c33a6c","web":"1:124506192389:web:7fcd937cc1553229c33a6c","windows":"1:124506192389:web:17314a34483c0f39c33a6c"}}}}}}

lib/main.dart

@@ -2,13 +2,16 @@ import 'package:firebase_core/firebase_core.dart';
 import 'package:firebase_editor_gsoc/controllers/access_controller.dart';
 import 'package:firebase_editor_gsoc/controllers/token_controller.dart';
 import 'package:firebase_editor_gsoc/controllers/user_controller.dart';
-import 'package:firebase_editor_gsoc/firebase_options.dart';
+import 'package:firebase_editor_gsoc/widgets/firebase_options.dart';
 import 'package:firebase_editor_gsoc/views/user_sign_in/user_login.dart';
 import 'package:firebase_editor_gsoc/views/screens/starter_screens/starter_screen_1.dart';
 import 'package:firebase_messaging/firebase_messaging.dart';
 import 'package:flutter/material.dart';
 import 'package:get/get.dart';
 import 'package:shared_preferences/shared_preferences.dart';
+import 'package:provider/provider.dart';
+import 'package:firebase_editor_gsoc/utils/theme_provider.dart';
+import 'package:firebase_editor_gsoc/views/home/home_screen.dart';
 
 // navigator key for navigation purposes
 // This key is crucial for navigating without direct access to BuildContext.
@@ -17,8 +20,7 @@ final navigatorKey = GlobalKey<NavigatorState>();
 /// for handling notifications when app is in terminated state
 /// must be a top level function
 /// to make a pop up,, give android channel id in additional setting in firebase
-
-// @pragma('vm:entry-point')
+@pragma('vm:entry-point')
 Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
   await Firebase.initializeApp();
 }
@@ -42,65 +44,76 @@ void main() async {
   final bool hasSeenStarterScreens =
       prefs.getBool('hasSeenStarterScreens') ?? false;
 
-  runApp(MyApp(hasSeenStarterScreens: hasSeenStarterScreens));
+  runApp(
+    ChangeNotifierProvider(
+      create: (_) => ThemeProvider(),
+      child: MyApp(hasSeenStarterScreens: hasSeenStarterScreens),
+    ),
+  );
 }
 
 class MyApp extends StatelessWidget {
   final bool hasSeenStarterScreens;
 
   const MyApp({super.key, required this.hasSeenStarterScreens});
 
-  // This widget is the root of your application.
   @override
   Widget build(BuildContext context) {
+    final themeProvider = Provider.of<ThemeProvider>(context);
+
     return GetMaterialApp(
       title: 'Firebase Editor',
-      theme: ThemeData(
-          colorScheme: ColorScheme.fromSeed(
-            seedColor: Colors.blue,
-            secondary: Colors.amber, // Adding a secondary color
-          ),
-          useMaterial3: true,
-          textTheme: const TextTheme(
-              displayLarge: TextStyle(
-                  fontSize: 62.0,
-                  fontWeight: FontWeight.bold,
-                  color: Colors.white),
-              displayMedium: TextStyle(
-                  fontSize: 42.0,
-                  fontWeight: FontWeight.bold,
-                  color: Colors.white),
-              titleLarge:
-                  TextStyle(fontSize: 24.0, fontStyle: FontStyle.italic),
-              titleMedium:
-                  TextStyle(fontSize: 26.0, fontWeight: FontWeight.bold),
-              bodyMedium: TextStyle(fontSize: 14.0, fontFamily: 'Hind'),
-              bodySmall: TextStyle(
-                  fontSize: 18.0,
-                  fontWeight: FontWeight.w400,
-                  color: Colors.white)),
-          elevatedButtonTheme: ElevatedButtonThemeData(
-            style: ElevatedButton.styleFrom(
-              foregroundColor: Colors.black,
-              backgroundColor: Colors.white, // Button text color
-              padding:
-                  const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
-            ),
-          ),
-          appBarTheme: const AppBarTheme(
-            backgroundColor: Colors.blue,
-            titleTextStyle: TextStyle(
-              color: Colors.white,
-              fontSize: 24.0,
-            ),
-            iconTheme: IconThemeData(
-              color: Colors.white,
-            ),
-          )),
-      home:
-          hasSeenStarterScreens ?  LoginScreen() : const StarterScreen1(),
+
+      /// Use the custom themes from ThemeProvider
+      theme: themeProvider.lightTheme,
+      darkTheme: themeProvider.darkTheme,
+      themeMode: themeProvider.currentTheme, // Toggles based on isDarkMode
+
+      home: hasSeenStarterScreens ? LoginScreen() : const StarterScreen1(),
       navigatorKey: navigatorKey, // Assign the global navigator key
       debugShowCheckedModeBanner: false,
     );
   }
 }
+
+// HomeScreen Implementation
+class HomeScreen extends StatelessWidget {
+  const HomeScreen({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final themeProvider = Provider.of<ThemeProvider>(context);
+
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text('Home'),
+        actions: [
+          IconButton(
+            icon: Icon(
+              themeProvider.isDarkMode ? Icons.light_mode : Icons.dark_mode,
+            ),
+            // Use onPrimary for icons on the appBar's primary color
+            color: Theme.of(context).colorScheme.onPrimary,
+            onPressed: () => themeProvider.toggleTheme(),
+          ),
+        ],
+      ),
+      body: const HomeContent(),
+    );
+  }
+}
+
+class HomeContent extends StatelessWidget {
+  const HomeContent({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Center(
+      child: Text(
+        'Welcome to Home Screen',
+        // Use the headlineMedium from the theme
+        style: Theme.of(context).textTheme.headlineMedium,
+      ),
+    );
+  }
+}

lib/utils/theme_provider.dart

@@ -0,0 +1,59 @@
+import 'package:flutter/material.dart';
+
+class ThemeProvider with ChangeNotifier {
+  bool _isDarkMode = false;
+  bool get isDarkMode => _isDarkMode;
+
+  /// Controls whether the app shows the light or dark theme
+  ThemeMode get currentTheme => _isDarkMode ? ThemeMode.dark : ThemeMode.light;
+
+  /// Define your light theme
+  ThemeData get lightTheme => ThemeData(
+    brightness: Brightness.light,
+    // Using a color scheme, app bar theme, and text theme suitable for light mode
+    colorScheme: const ColorScheme.light(
+      primary: Colors.blue,
+      background: Colors.white,
+      onBackground: Colors.black,
+    ),
+    appBarTheme: const AppBarTheme(
+      backgroundColor: Colors.blue,
+      foregroundColor: Colors.white,
+    ),
+    textTheme: const TextTheme(
+      bodyMedium: TextStyle(color: Colors.black),
+      headlineMedium: TextStyle(
+        color: Colors.black87,
+        fontWeight: FontWeight.bold,
+      ),
+    ),
+  );
+
+  /// Define your dark theme
+  ThemeData get darkTheme => ThemeData(
+    brightness: Brightness.dark,
+    // Using a color scheme, app bar theme, and text theme suitable for dark mode
+    colorScheme: ColorScheme.dark(
+      primary: Colors.blueGrey,
+      background: Colors.grey.shade900,
+      onBackground: Colors.white,
+    ),
+    appBarTheme: AppBarTheme(
+      backgroundColor: Colors.grey.shade900,
+      foregroundColor: Colors.white,
+    ),
+    textTheme: const TextTheme(
+      bodyMedium: TextStyle(color: Colors.white),
+      headlineMedium: TextStyle(
+        color: Colors.white,
+        fontWeight: FontWeight.bold,
+      ),
+    ),
+  );
+
+  /// Toggles between light and dark
+  void toggleTheme() {
+    _isDarkMode = !_isDarkMode;
+    notifyListeners(); // Notifies that the theme changed
+  }
+}