fix: unable to remove the remote selection when the user close the page on mobile (#5376)

* fix: unable to remove the remote selection when the user close the page on mobile

* fix: unable to apply settings font to editor

* chore: remove transparent background color

frontend/appflowy_flutter/lib/plugins/document/application/document_bloc.dart

@@ -20,7 +20,6 @@ import 'package:appflowy/util/debounce.dart';
 import 'package:appflowy/util/throttle.dart';
 import 'package:appflowy/workspace/application/view/view_listener.dart';
 import 'package:appflowy/workspace/application/view/view_service.dart';
-import 'package:appflowy_backend/log.dart';
 import 'package:appflowy_backend/protobuf/flowy-document/entities.pb.dart';
 import 'package:appflowy_backend/protobuf/flowy-document/protobuf.dart';
 import 'package:appflowy_backend/protobuf/flowy-error/errors.pb.dart';
@@ -78,13 +77,13 @@ class DocumentBloc extends Bloc<DocumentEvent, DocumentState> {
 
   bool isClosing = false;
 
-  final _updateSelectionDebounce = Debounce();
+  static const _syncDuration = Duration(milliseconds: 250);
-  final _syncThrottle = Throttler(duration: const Duration(milliseconds: 500));
+  final _updateSelectionDebounce = Debounce(duration: _syncDuration);
+  final _syncThrottle = Throttler(duration: _syncDuration);
 
   // The conflict handle logic is not fully implemented yet
   // use the syncTimer to force to reload the document state when the conflict happens.
   Timer? _syncTimer;
-  bool _shouldSync = false;
 
   bool get isLocalMode {
     final userProfilePB = state.userProfilePB;
@@ -116,7 +115,6 @@ class DocumentBloc extends Bloc<DocumentEvent, DocumentState> {
   ) async {
     await event.when(
       initial: () async {
-        _resetSyncTimer();
         final result = await _fetchDocumentState();
         _onViewChanged();
         _onDocumentChanged();
@@ -211,19 +209,6 @@ class DocumentBloc extends Bloc<DocumentEvent, DocumentState> {
     );
   }
 
-  void _resetSyncTimer() {
-    _syncTimer?.cancel();
-    _syncTimer = null;
-    _syncTimer = Timer.periodic(const Duration(seconds: 10), (_) {
-      if (!_shouldSync) {
-        return;
-      }
-      Log.debug('auto sync document');
-      // unawaited(_documentCollabAdapter.forceReload());
-      _shouldSync = false;
-    });
-  }
-
   /// Fetch document
   Future<FlowyResult<EditorState?, FlowyError>> _fetchDocumentState() async {
     final result = await _documentService.openDocument(documentId: documentId);
@@ -263,10 +248,6 @@ class DocumentBloc extends Bloc<DocumentEvent, DocumentState> {
           // ignore: invalid_use_of_visible_for_testing_member
           emit(state.copyWith(isDocumentEmpty: editorState.document.isEmpty));
         }
-
-        // reset the sync timer
-        _shouldSync = true;
-        _resetSyncTimer();
       },
     );
 
@@ -328,8 +309,6 @@ class DocumentBloc extends Bloc<DocumentEvent, DocumentState> {
     }
 
     unawaited(_documentCollabAdapter.syncV3(docEvent: docEvent));
-
-    _resetSyncTimer();
   }
 
   Future<void> _onAwarenessStatesUpdate(
@@ -353,7 +332,6 @@ class DocumentBloc extends Bloc<DocumentEvent, DocumentState> {
   }
 
   void _throttleSyncDoc(DocEventPB docEvent) {
-    _shouldSync = true;
     _syncThrottle.call(() {
       _onDocumentStateUpdate(docEvent);
     });

frontend/appflowy_flutter/lib/plugins/document/application/document_collab_adapter.dart

@@ -183,7 +183,7 @@ class DocumentCollabAdapter {
     for (final state in values) {
       // the following code is only for version 1
       if (state.version != 1 || state.metadata.isEmpty) {
-        return;
+        continue;
       }
       final uid = state.user.uid.toString();
       final did = state.user.deviceId;
@@ -244,10 +244,9 @@ class DocumentCollabAdapter {
       );
       remoteSelections.add(remoteSelection);
     }
-    if (remoteSelections.isNotEmpty) {
+
     editorState.remoteSelections.value = remoteSelections;
   }
-  }
 }
 
 extension on List<Int64> {

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/page_style/_page_style_cover_image.dart

@@ -188,7 +188,6 @@ class PageStyleCoverImage extends StatelessWidget {
         );
       },
       title: LocaleKeys.pageStyle_presets.tr(),
-      barrierColor: Colors.transparent,
       backgroundColor: Theme.of(context).colorScheme.background,
       builder: (_) {
         return BlocProvider.value(
@@ -267,7 +266,6 @@ class PageStyleCoverImage extends StatelessWidget {
       showHeader: true,
       showRemoveButton: true,
       title: LocaleKeys.pageStyle_unsplash.tr(),
-      barrierColor: Colors.transparent,
       backgroundColor: Theme.of(context).colorScheme.background,
       onRemove: () {
         pageStyleBloc.add(

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/page_style/_page_style_icon.dart

@@ -77,7 +77,6 @@ class _PageStyleIconState extends State<PageStyleIcon> {
       showDoneButton: true,
       showHeader: true,
       title: LocaleKeys.titleBar_pageIcon.tr(),
-      barrierColor: Colors.transparent,
       backgroundColor: Theme.of(context).colorScheme.background,
       isScrollControlled: true,
       enableDraggableScrollable: true,

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_plugins/page_style/_page_style_layout.dart

@@ -208,7 +208,6 @@ class _FontButton extends StatelessWidget {
       showDoneButton: true,
       showHeader: true,
       title: LocaleKeys.titleBar_font.tr(),
-      barrierColor: Colors.transparent,
       backgroundColor: Theme.of(context).colorScheme.background,
       isScrollControlled: true,
       enableDraggableScrollable: true,

frontend/appflowy_flutter/lib/plugins/document/presentation/editor_style.dart

@@ -42,9 +42,13 @@ class EditorStyleCustomizer {
 
   EditorStyle desktop() {
     final theme = Theme.of(context);
+    final appearanceFont = context.read<AppearanceSettingsCubit>().state.font;
     final appearance = context.read<DocumentAppearanceCubit>().state;
     final fontSize = appearance.fontSize;
-    final fontFamily = appearance.fontFamily;
+    String fontFamily = appearance.fontFamily;
+    if (fontFamily.isEmpty && appearanceFont.isNotEmpty) {
+      fontFamily = appearanceFont;
+    }
 
     return EditorStyle.desktop(
       padding: padding,