diff --git a/frontend/app_flowy/lib/plugins/document/document.dart b/frontend/app_flowy/lib/plugins/document/document.dart index 0d0107b23c..6ee7f65b52 100644 --- a/frontend/app_flowy/lib/plugins/document/document.dart +++ b/frontend/app_flowy/lib/plugins/document/document.dart @@ -2,6 +2,7 @@ library document_plugin; import 'package:app_flowy/generated/locale_keys.g.dart'; import 'package:app_flowy/plugins/document/document_page.dart'; +import 'package:app_flowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart'; import 'package:app_flowy/plugins/document/presentation/more/more_button.dart'; import 'package:app_flowy/plugins/document/presentation/share/share_button.dart'; import 'package:app_flowy/plugins/util.dart'; @@ -11,8 +12,7 @@ import 'package:app_flowy/workspace/presentation/widgets/left_bar_item.dart'; import 'package:easy_localization/easy_localization.dart'; import 'package:flowy_sdk/protobuf/flowy-folder/view.pb.dart'; import 'package:flutter/material.dart'; -import 'package:provider/provider.dart'; -import 'package:shared_preferences/shared_preferences.dart'; +import 'package:flutter_bloc/flutter_bloc.dart'; class DocumentPluginBuilder extends PluginBuilder { @override @@ -37,27 +37,9 @@ class DocumentPluginBuilder extends PluginBuilder { ViewDataFormatPB get dataFormatType => ViewDataFormatPB.TreeFormat; } -class DocumentStyle with ChangeNotifier { - DocumentStyle() { - sync(); - } - - double _fontSize = 14.0; - double get fontSize => _fontSize; - set fontSize(double fontSize) { - _fontSize = fontSize; - notifyListeners(); - } - - void sync() async { - final prefs = await SharedPreferences.getInstance(); - fontSize = prefs.getDouble('kSelectFontSize') ?? _fontSize; - } -} - class DocumentPlugin extends Plugin { late PluginType _pluginType; - late final DocumentStyle _documentStyle; + late final DocumentAppearanceCubit _documentAppearanceCubit; @override final ViewPluginNotifier notifier; @@ -68,12 +50,12 @@ class DocumentPlugin extends Plugin { Key? key, }) : notifier = ViewPluginNotifier(view: view) { _pluginType = pluginType; - _documentStyle = DocumentStyle(); + _documentAppearanceCubit = DocumentAppearanceCubit(); } @override void dispose() { - _documentStyle.dispose(); + _documentAppearanceCubit.close(); super.dispose(); } @@ -81,7 +63,7 @@ class DocumentPlugin extends Plugin { PluginDisplay get display { return DocumentPluginDisplay( notifier: notifier, - documentStyle: _documentStyle, + documentAppearanceCubit: _documentAppearanceCubit, ); } @@ -96,11 +78,11 @@ class DocumentPluginDisplay extends PluginDisplay with NavigationItem { final ViewPluginNotifier notifier; ViewPB get view => notifier.view; int? deletedViewIndex; - DocumentStyle documentStyle; + DocumentAppearanceCubit documentAppearanceCubit; DocumentPluginDisplay({ required this.notifier, - required this.documentStyle, + required this.documentAppearanceCubit, Key? key, }); @@ -114,12 +96,16 @@ class DocumentPluginDisplay extends PluginDisplay with NavigationItem { }); }); - return ChangeNotifierProvider.value( - value: documentStyle, - child: DocumentPage( - view: view, - onDeleted: () => context.onDeleted(view, deletedViewIndex), - key: ValueKey(view.id), + return BlocProvider.value( + value: documentAppearanceCubit, + child: BlocBuilder( + builder: (_, state) { + return DocumentPage( + view: view, + onDeleted: () => context.onDeleted(view, deletedViewIndex), + key: ValueKey(view.id), + ); + }, ), ); } @@ -133,8 +119,8 @@ class DocumentPluginDisplay extends PluginDisplay with NavigationItem { children: [ DocumentShareButton(view: view), const SizedBox(width: 10), - ChangeNotifierProvider.value( - value: documentStyle, + BlocProvider.value( + value: documentAppearanceCubit, child: const DocumentMoreButton(), ), ], diff --git a/frontend/app_flowy/lib/plugins/document/editor_styles.dart b/frontend/app_flowy/lib/plugins/document/editor_styles.dart index e001622700..1993af45d8 100644 --- a/frontend/app_flowy/lib/plugins/document/editor_styles.dart +++ b/frontend/app_flowy/lib/plugins/document/editor_styles.dart @@ -1,10 +1,11 @@ -import 'package:app_flowy/plugins/document/document.dart'; +import 'package:app_flowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart'; import 'package:appflowy_editor/appflowy_editor.dart'; import 'package:flutter/material.dart'; import 'package:provider/provider.dart'; EditorStyle customEditorTheme(BuildContext context) { - final documentStyle = context.watch(); + final documentStyle = + context.watch().documentAppearance; var editorStyle = Theme.of(context).brightness == Brightness.dark ? EditorStyle.dark : EditorStyle.light; @@ -27,7 +28,8 @@ EditorStyle customEditorTheme(BuildContext context) { } Iterable> customPluginTheme(BuildContext context) { - final documentStyle = context.watch(); + final documentStyle = + context.watch().documentAppearance; final baseFontSize = documentStyle.fontSize; const basePadding = 12.0; var headingPluginStyle = Theme.of(context).brightness == Brightness.dark diff --git a/frontend/app_flowy/lib/plugins/document/presentation/more/cubit/document_appearance_cubit.dart b/frontend/app_flowy/lib/plugins/document/presentation/more/cubit/document_appearance_cubit.dart new file mode 100644 index 0000000000..7498561296 --- /dev/null +++ b/frontend/app_flowy/lib/plugins/document/presentation/more/cubit/document_appearance_cubit.dart @@ -0,0 +1,42 @@ +import 'package:bloc/bloc.dart'; +import 'package:shared_preferences/shared_preferences.dart'; + +const String _kDocumentAppearenceFontSize = 'kDocumentAppearenceFontSize'; + +class DocumentAppearance { + const DocumentAppearance({ + required this.fontSize, + }); + + final double fontSize; + // Will be supported... + // final String fontName; + + DocumentAppearance copyWith({double? fontSize}) { + return DocumentAppearance( + fontSize: fontSize ?? this.fontSize, + ); + } +} + +class DocumentAppearanceCubit extends Cubit { + DocumentAppearanceCubit() : super(const DocumentAppearance(fontSize: 14.0)) { + fetch(); + } + + late DocumentAppearance documentAppearance; + + void fetch() async { + final prefs = await SharedPreferences.getInstance(); + final fontSize = prefs.getDouble(_kDocumentAppearenceFontSize) ?? 14.0; + documentAppearance = DocumentAppearance(fontSize: fontSize); + emit(documentAppearance); + } + + void sync(DocumentAppearance documentAppearance) async { + final prefs = await SharedPreferences.getInstance(); + prefs.setDouble(_kDocumentAppearenceFontSize, documentAppearance.fontSize); + this.documentAppearance = documentAppearance; + emit(documentAppearance); + } +} diff --git a/frontend/app_flowy/lib/plugins/document/presentation/more/font_size_switcher.dart b/frontend/app_flowy/lib/plugins/document/presentation/more/font_size_switcher.dart index d27a60a810..b07dcfe5ed 100644 --- a/frontend/app_flowy/lib/plugins/document/presentation/more/font_size_switcher.dart +++ b/frontend/app_flowy/lib/plugins/document/presentation/more/font_size_switcher.dart @@ -1,9 +1,8 @@ -import 'package:app_flowy/plugins/document/document.dart'; +import 'package:app_flowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart'; import 'package:flowy_infra_ui/style_widget/text.dart'; import 'package:flutter/material.dart'; import 'package:app_flowy/generated/locale_keys.g.dart'; import 'package:provider/provider.dart'; -import 'package:shared_preferences/shared_preferences.dart'; import 'package:tuple/tuple.dart'; import 'package:easy_localization/easy_localization.dart'; @@ -16,8 +15,6 @@ class FontSizeSwitcher extends StatefulWidget { State createState() => _FontSizeSwitcherState(); } -const String _kSelectFontSize = 'kSelectFontSize'; - class _FontSizeSwitcherState extends State { final List _selectedFontSizes = [false, true, false]; final List> _fontSizes = [ @@ -30,13 +27,10 @@ class _FontSizeSwitcherState extends State { void initState() { super.initState(); - SharedPreferences.getInstance().then((prefs) { - final index = _fontSizes.indexWhere( - (element) => element.item2 == prefs.getDouble(_kSelectFontSize)); - if (index != -1) { - _updateSelectedFontSize(index); - } - }); + final fontSize = + context.read().documentAppearance.fontSize; + final index = _fontSizes.indexWhere((element) => element.item2 == fontSize); + _updateSelectedFontSize(index); } @override @@ -55,6 +49,7 @@ class _FontSizeSwitcherState extends State { isSelected: _selectedFontSizes, onPressed: (int index) { _updateSelectedFontSize(index); + _sync(index); }, borderRadius: const BorderRadius.all(Radius.circular(5)), selectedBorderColor: Theme.of(context).colorScheme.primaryContainer, @@ -77,15 +72,18 @@ class _FontSizeSwitcherState extends State { } void _updateSelectedFontSize(int index) { - final fontSize = _fontSizes[index].item2; - context.read().fontSize = fontSize; - SharedPreferences.getInstance().then( - (prefs) => prefs.setDouble(_kSelectFontSize, fontSize), - ); setState(() { for (int i = 0; i < _selectedFontSizes.length; i++) { _selectedFontSizes[i] = i == index; } }); } + + void _sync(int index) { + if (index < 0 || index >= _fontSizes.length) return; + final fontSize = _fontSizes[index].item2; + final cubit = context.read(); + final documentAppearance = cubit.documentAppearance; + cubit.sync(documentAppearance.copyWith(fontSize: fontSize)); + } } diff --git a/frontend/app_flowy/lib/plugins/document/presentation/more/more_button.dart b/frontend/app_flowy/lib/plugins/document/presentation/more/more_button.dart index 1dc5047584..3f1ec921df 100644 --- a/frontend/app_flowy/lib/plugins/document/presentation/more/more_button.dart +++ b/frontend/app_flowy/lib/plugins/document/presentation/more/more_button.dart @@ -1,17 +1,14 @@ -import 'package:app_flowy/plugins/document/document.dart'; +import 'package:app_flowy/plugins/document/presentation/more/cubit/document_appearance_cubit.dart'; import 'package:app_flowy/plugins/document/presentation/more/font_size_switcher.dart'; import 'package:flowy_infra/image.dart'; import 'package:flutter/material.dart'; -import 'package:provider/provider.dart'; +import 'package:flutter_bloc/flutter_bloc.dart'; class DocumentMoreButton extends StatelessWidget { const DocumentMoreButton({ Key? key, - // required this.documentStyle, }) : super(key: key); - // final DocumentStyle documentStyle; - @override Widget build(BuildContext context) { return PopupMenuButton( @@ -21,8 +18,8 @@ class DocumentMoreButton extends StatelessWidget { PopupMenuItem( value: 1, enabled: false, - child: ChangeNotifierProvider.value( - value: context.read(), + child: BlocProvider.value( + value: context.read(), child: const FontSizeSwitcher(), ), )