feat: initial steps to allow changing the app font (#1433)

* feat: initial steps to allow customizing app font

* chore: remove unnecessary factory constructor

frontend/app_flowy/lib/workspace/application/appearance.dart

@@ -17,7 +17,12 @@ class AppearanceSettingsCubit extends Cubit<AppearanceSettingsState> {
 
   AppearanceSettingsCubit(AppearanceSettingsPB setting)
       : _setting = setting,
-        super(AppearanceSettingsState.initial(setting.theme, setting.locale));
+        super(AppearanceSettingsState.initial(
+          setting.theme,
+          setting.font,
+          setting.monospaceFont,
+          setting.locale,
+        ));
 
   /// Updates the current theme and notify the listeners the theme was changed.
   /// Do nothing if the passed in themeType equal to the current theme type.
@@ -29,7 +34,13 @@ class AppearanceSettingsCubit extends Cubit<AppearanceSettingsState> {
     _setting.theme = themeTypeToString(brightness);
     _saveAppearanceSettings();
 
-    emit(state.copyWith(theme: AppTheme.fromType(brightness)));
+    emit(state.copyWith(
+      theme: AppTheme.fromName(
+        themeName: _setting.theme,
+        font: state.theme.font,
+        monospaceFont: state.theme.monospaceFont,
+      ),
+    ));
   }
 
   /// Updates the current locale and notify the listeners the locale was changed
@@ -113,10 +124,16 @@ class AppearanceSettingsState with _$AppearanceSettingsState {
 
   factory AppearanceSettingsState.initial(
     String themeName,
+    String font,
+    String monospaceFont,
     LocaleSettingsPB locale,
   ) =>
       AppearanceSettingsState(
-        theme: AppTheme.fromName(name: themeName),
+        theme: AppTheme.fromName(
+          themeName: themeName,
+          font: font,
+          monospaceFont: monospaceFont,
+        ),
         locale: Locale(locale.languageCode, locale.countryCode),
       );
 }

frontend/app_flowy/packages/flowy_infra/lib/theme.dart

@@ -65,16 +65,18 @@ class AppTheme {
 
   late Color shadow;
 
+  late String font;
+  late String monospaceFont;
+
   /// Default constructor
   AppTheme({this.brightness = Brightness.light});
 
-  factory AppTheme.fromName({required String name}) {
+  factory AppTheme.fromName({
-    return AppTheme.fromType(themeTypeFromString(name));
+    required String themeName,
-  }
+    required String font,
-
+    required String monospaceFont,
-  /// fromType factory constructor
+  }) {
-  factory AppTheme.fromType(Brightness themeType) {
+    switch (themeTypeFromString(themeName)) {
-    switch (themeType) {
       case Brightness.light:
         return AppTheme(brightness: Brightness.light)
           ..surface = Colors.white
@@ -108,7 +110,9 @@ class AppTheme {
           ..textColor = _black
           ..iconColor = _black
           ..shadow = _black
-          ..disableIconColor = const Color(0xffbdbdbd);
+          ..disableIconColor = const Color(0xffbdbdbd)
+          ..font = font
+          ..monospaceFont = monospaceFont;
 
       case Brightness.dark:
         return AppTheme(brightness: Brightness.dark)
@@ -143,14 +147,18 @@ class AppTheme {
           ..textColor = _white
           ..iconColor = _white
           ..shadow = _black
-          ..disableIconColor = const Color(0xff333333);
+          ..disableIconColor = const Color(0xff333333)
+          ..font = font
+          ..monospaceFont = monospaceFont;
     }
   }
 
   ThemeData get themeData {
     return ThemeData(
       brightness: brightness,
-      textTheme: TextTheme(bodyText2: TextStyle(color: shader1)),
+      textTheme: TextTheme(
+        bodyText2: TextStyle(color: shader1),
+      ),
       textSelectionTheme: TextSelectionThemeData(
           cursorColor: main2, selectionHandleColor: main2),
       primaryIconTheme: IconThemeData(color: hover),

frontend/rust-lib/flowy-user/src/entities/user_setting.rs

@@ -17,14 +17,20 @@ pub struct AppearanceSettingsPB {
     pub theme: String,
 
     #[pb(index = 2)]
+    pub font: String,
+
+    #[pb(index = 3)]
+    pub monospace_font: String,
+
+    #[pb(index = 4)]
     #[serde(default)]
     pub locale: LocaleSettingsPB,
 
-    #[pb(index = 3)]
+    #[pb(index = 5)]
     #[serde(default = "DEFAULT_RESET_VALUE")]
     pub reset_to_default: bool,
 
-    #[pb(index = 4)]
+    #[pb(index = 6)]
     #[serde(default)]
     pub setting_key_value: HashMap<String, String>,
 }
@@ -50,12 +56,16 @@ impl std::default::Default for LocaleSettingsPB {
 }
 
 pub const APPEARANCE_DEFAULT_THEME: &str = "light";
+pub const APPEARANCE_DEFAULT_FONT: &str = "Poppins";
+pub const APPEARANCE_DEFAULT_MONOSPACE_FONT: &str = "SF Mono";
 const APPEARANCE_RESET_AS_DEFAULT: bool = true;
 
 impl std::default::Default for AppearanceSettingsPB {
     fn default() -> Self {
         AppearanceSettingsPB {
             theme: APPEARANCE_DEFAULT_THEME.to_owned(),
+            font: APPEARANCE_DEFAULT_FONT.to_owned(),
+            monospace_font: APPEARANCE_DEFAULT_MONOSPACE_FONT.to_owned(),
             locale: LocaleSettingsPB::default(),
             reset_to_default: APPEARANCE_RESET_AS_DEFAULT,
             setting_key_value: HashMap::default(),