TF-1246: Enable FCM for Web browser

docs/configuration/fcm_configuration.md

@@ -6,6 +6,7 @@
 - Now only support to Android
 ### How to config
 1.Add environment of FCM service in [env.fcm](https://github.com/linagora/tmail-flutter/blob/master/configurations/env.fcm)
+Android config:
 ```
 FIREBASE_ANDROID_API_KEY=abc
 FIREBASE_ANDROID_APP_ID=abc
@@ -14,6 +15,17 @@ FIREBASE_ANDROID_PROJECT_ID=abc
 FIREBASE_ANDROID_DATABASE_URL=https://abc.app
 FIREBASE_ANDROID_STORAGE_BUCKET=abc.com
 ```
+Web config:
+```
+FIREBASE_WEB_API_KEY=abc
+FIREBASE_WEB_APP_ID=abc
+FIREBASE_WEB_MESSAGING_SENDER_ID=abc
+FIREBASE_WEB_PROJECT_ID=abc
+FIREBASE_WEB_DATABASE_URL=https://abc.app
+FIREBASE_WEB_STORAGE_BUCKET=abc.com
+FIREBASE_WEB_AUTH_DOMAIN=abc.com
+FIREBASE_WEB_VAPID_PUBLIC_KEY=abc
+```
 2. Active field FCM_AVAILABLE in [env.file](https://github.com/linagora/tmail-flutter/blob/master/env.file)
 ```
 FCM_AVAILABLE=supported

lib/features/base/base_controller.dart

@@ -9,6 +9,7 @@ import 'package:core/utils/app_logger.dart';
 import 'package:core/utils/fps_manager.dart';
 import 'package:dartz/dartz.dart';
 import 'package:fcm/model/firebase_capability.dart';
+import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_svg/flutter_svg.dart';
 import 'package:forward/forward/capability_forward.dart';
@@ -162,14 +163,16 @@ abstract class BaseController extends GetxController
       if (AppConfig.fcmAvailable) {
         await AppUtils.loadFcmConfigFile();
         FcmConfiguration.initialize();
+        if (!kIsWeb) {
           await LocalNotificationManager.instance.setUp();
+        }
         FcmInteractorBindings().dependencies();
         FcmController.instance.initialize(accountId: accountId);
       } else {
         throw NotSupportFCMException();
       }
     } catch(e) {
-      logError('BaseController::injectFirebaseBindings(): exception: $e');
+      logError('BaseController::injectFCMBindings(): exception: $e');
     }
   }
 }

lib/features/mailbox_dashboard/presentation/controller/mailbox_dashboard_controller.dart

@@ -1058,6 +1058,7 @@ class MailboxDashBoardController extends ReloadableController {
     _handleComposerCache();
     injectAutoCompleteBindings(sessionCurrent, accountId.value);
     injectRuleFilterBindings(sessionCurrent, accountId.value);
+    injectFCMBindings(sessionCurrent, accountId.value);
     injectVacationBindings(sessionCurrent, accountId.value);
     _getVacationResponse();
   }

lib/features/push_notification/domain/exceptions/fcm_exception.dart

@@ -1,5 +1,7 @@
 class NotSupportFCMException implements Exception {}
 
+class NotLoadedFCMTokenException implements Exception {}
+
 class NotFoundStateToRefreshException implements Exception {}
 
 class NotFoundEmailDeliveryStateException implements Exception {}

lib/features/push_notification/presentation/services/fcm_receiver.dart

@@ -1,6 +1,9 @@
 
 import 'package:core/utils/app_logger.dart';
 import 'package:firebase_messaging/firebase_messaging.dart';
+import 'package:flutter/foundation.dart';
+import 'package:flutter_dotenv/flutter_dotenv.dart';
+import 'package:tmail_ui_user/features/push_notification/domain/exceptions/fcm_exception.dart';
 import 'package:tmail_ui_user/features/push_notification/presentation/services/fcm_service.dart';
 
 @pragma('vm:entry-point')
@@ -26,9 +29,14 @@ class FcmReceiver {
   }
 
   void getFcmToken() async {
-    final token = await FirebaseMessaging.instance.getToken();
+    try {
+      final token = await FirebaseMessaging.instance.getToken(vapidKey: kIsWeb ? dotenv.get('FIREBASE_WEB_VAPID_PUBLIC_KEY', fallback: '') : null);
       log('FcmReceiver::onFcmToken():token: $token');
       FcmService.instance.handleRefreshToken(token);
+    } catch(e) {
+      log('FcmReceiver::onFcmToken():exception: $e');
+      throw NotLoadedFCMTokenException();
+    }
   }
 
   void onRefreshFcmToken() {

web/firebase-messaging-sw.js

@@ -0,0 +1,13 @@
+importScripts("https://www.gstatic.com/firebasejs/9.10.0/firebase-app-compat.js");
+importScripts("https://www.gstatic.com/firebasejs/9.10.0/firebase-messaging-compat.js");
+
+firebase.initializeApp({
+    apiKey: "...",
+    authDomain: "...",
+    databaseURL: "...",
+    projectId: "...",
+    storageBucket: "...",
+    messagingSenderId: "...",
+    appId: "...",
+});
+const messaging = firebase.messaging();

web/index.html

@@ -56,6 +56,7 @@
         // Wait for registration to finish before dropping the <script> tag.
         // Otherwise, the browser will load the script multiple times,
         // potentially different versions.
+        navigator.serviceWorker.register('firebase-messaging-sw.js');
         var serviceWorkerUrl = 'flutter_service_worker.js?v=' + serviceWorkerVersion;
         navigator.serviceWorker.register(serviceWorkerUrl)
           .then((reg) => {