Connect romaji transliteration to new setting

lib/components/kanji/kanji_result_body/examples.dart

@@ -2,15 +2,17 @@ import 'package:flutter/material.dart';
 import 'package:unofficial_jisho_api/api.dart';
 
 import '../../../bloc/theme/theme_bloc.dart';
+import '../../../services/romaji_transliteration.dart';
+import '../../../settings.dart';
 
 class Examples extends StatelessWidget {
   final List<YomiExample> onyomi;
   final List<YomiExample> kunyomi;
 
   const Examples({
+    Key? key,
     required this.onyomi,
     required this.kunyomi,
-    Key? key,
   }) : super(key: key);
 
   @override
@@ -87,6 +89,7 @@ class _Kana extends StatelessWidget {
     required this.example,
   }) : super(key: key);
 
+
   @override
   Widget build(BuildContext context) {
     return Container(
@@ -102,7 +105,7 @@ class _Kana extends StatelessWidget {
         mainAxisAlignment: MainAxisAlignment.center,
         children: [
           Text(
-            example.reading,
+            romajiEnabled ? transliterateKanaToLatin(example.reading) : example.reading,
             style: TextStyle(
               color: colors.foreground,
               fontSize: 15.0,

lib/components/kanji/kanji_result_body/yomi_chips.dart

@@ -1,6 +1,8 @@
 import 'package:flutter/material.dart';
 
 import '../../../bloc/theme/theme_bloc.dart';
+import '../../../services/romaji_transliteration.dart';
+import '../../../settings.dart';
 
 enum YomiType {
   onyomi,
@@ -71,6 +73,7 @@ class YomiChips extends StatelessWidget {
   
   Widget yomiWrapper(BuildContext context) {
     final yomiCards = yomi
+        .map((y) => romajiEnabled ? transliterateKanaToLatin(y) : y)
         .map((y) => yomiCard(yomi: y, colors: type.getColors(context)))
         .toList();
 

lib/components/search/search_results_body/parts/header.dart

@@ -1,6 +1,9 @@
 import 'package:flutter/material.dart';
 import 'package:unofficial_jisho_api/api.dart';
 
+import '../../../../services/romaji_transliteration.dart';
+import '../../../../settings.dart';
+
 class JapaneseHeader extends StatelessWidget {
   final JishoJapaneseWord word;
 
@@ -13,14 +16,23 @@ class JapaneseHeader extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final String? wordReading = word.reading == null
+        ? null
+        : (romajiEnabled
+            ? transliterateKanaToLatin(word.reading!)
+            : word.reading!);
+
     return Container(
       alignment: Alignment.centerLeft,
       padding: const EdgeInsets.only(left: 10.0),
       child: Column(
         children: [
-          // TODO: take a look at this logic
+          // Both wordReading and word.word being present implies that the word has furigana.
-          hasFurigana ? Text(word.reading!) : const Text(''),
+          // If that's not the case, then the word is usually present in wordReading.
-          hasFurigana ? Text(word.word!) : Text(word.reading ?? word.word!),
+          // However, there are some exceptions where the reading is placed in word.
+          // I have no clue why this might be the case.
+          hasFurigana ? Text(wordReading!) : const Text(''),
+          hasFurigana ? Text(word.word!) : Text(wordReading ?? word.word!),
         ],
       ),
     );

lib/components/search/search_results_body/parts/other_forms.dart

@@ -2,6 +2,8 @@ import 'package:flutter/material.dart';
 import 'package:unofficial_jisho_api/api.dart';
 
 import '../../../../bloc/theme/theme_bloc.dart';
+import '../../../../services/romaji_transliteration.dart';
+import '../../../../settings.dart';
 
 class OtherForms extends StatelessWidget {
   final List<JishoJapaneseWord> forms;
@@ -38,6 +40,12 @@ class _KanaBox extends StatelessWidget {
     final _menuColors =
         BlocProvider.of<ThemeBloc>(context).state.theme.menuGreyLight;
     
+    final String? wordReading = word.reading == null
+        ? null
+        : (romajiEnabled
+            ? transliterateKanaToLatin(word.reading!)
+            : word.reading!);
+
     return Container(
       margin: const EdgeInsets.symmetric(
         horizontal: 5.0,
@@ -58,9 +66,9 @@ class _KanaBox extends StatelessWidget {
       child: DefaultTextStyle.merge(
         child: Column(
           children: [
-            // TODO: take a look at this logic
+            // See header.dart for more details about this logic
-            hasFurigana ? Text(word.reading ?? '') : const Text(''),
+            hasFurigana ? Text(wordReading ?? '') : const Text(''),
-            hasFurigana ? Text(word.word!) : Text(word.reading ?? ''),
+            hasFurigana ? Text(word.word!) : Text(wordReading ?? word.word!),
           ],
         ),
         style: TextStyle(color: _menuColors.foreground),

lib/screens/settings.dart

@@ -1,10 +1,10 @@
 import 'package:confirm_dialog/confirm_dialog.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_settings_ui/flutter_settings_ui.dart';
-import 'package:shared_preferences/shared_preferences.dart';
 
 import '../bloc/theme/theme_bloc.dart';
 import '../models/history/search.dart';
+import '../settings.dart';
 
 class SettingsView extends StatefulWidget {
   const SettingsView({Key? key}) : super(key: key);
@@ -14,33 +14,12 @@ class SettingsView extends StatefulWidget {
 }
 
 class _SettingsViewState extends State<SettingsView> {
-  final SharedPreferences prefs = GetIt.instance.get<SharedPreferences>();
+  final Database db = GetIt.instance.get<Database>();
-
-  bool romajiEnabled = false;
-
-  bool darkThemeEnabled = false;
-  bool autoThemeEnabled = false;
-
-  @override
-  void initState() {
-    super.initState();
-    romajiEnabled = prefs.getBool('romajiEnabled') ?? romajiEnabled;
-    darkThemeEnabled = prefs.getBool('darkThemeEnabled') ?? darkThemeEnabled;
-    autoThemeEnabled = prefs.getBool('autoThemeEnabled') ?? autoThemeEnabled;
-  }
-
-  /// Update stored preferences with values from setting page state
-  Future<void> _updatePrefs() async {
-    prefs.setBool('romajiEnabled', romajiEnabled);
-    prefs.setBool('darkThemeEnabled', darkThemeEnabled);
-    prefs.setBool('autoThemeEnabled', autoThemeEnabled);
-  }
 
   Future<void> clearHistory(context) async {
     final bool userIsSure = await confirm(context);
 
     if (userIsSure) {
-      final Database db = GetIt.instance.get<Database>();
       await Search.store.delete(db);
     }
   }
@@ -63,9 +42,10 @@ class _SettingsViewState extends State<SettingsView> {
           tiles: <SettingsTile>[
             SettingsTile.switchTile(
               title: 'Use romaji',
-              onToggle: (b) {}, //TODO: implement
+              onToggle: (b) {
+                setState(() => romajiEnabled = b);
+              },
               switchValue: romajiEnabled,
-              enabled: false,
               switchActiveColor: AppTheme.jishoGreen.background,
             ),
           ],
@@ -77,10 +57,7 @@ class _SettingsViewState extends State<SettingsView> {
             SettingsTile.switchTile(
               title: 'Automatically determine theme',
               onToggle: (b) {
-                setState(() {
+                setState(() => autoThemeEnabled = b);
-                  autoThemeEnabled = b;
-                });
-                _updatePrefs();
               },
               switchValue: autoThemeEnabled,
               enabled: false,
@@ -91,10 +68,7 @@ class _SettingsViewState extends State<SettingsView> {
               onToggle: (b) {
                 BlocProvider.of<ThemeBloc>(context)
                     .add(SetTheme(themeIsDark: b));
-                setState(() {
+                setState(() => darkThemeEnabled = b);
-                  darkThemeEnabled = b;
-                });
-                _updatePrefs();
               },
               switchValue: darkThemeEnabled,
               enabled: !autoThemeEnabled,

lib/settings.dart

@@ -0,0 +1,21 @@
+import 'package:get_it/get_it.dart';
+import 'package:shared_preferences/shared_preferences.dart';
+
+final SharedPreferences _prefs = GetIt.instance.get<SharedPreferences>();
+
+const Map<String, dynamic> _defaults = {
+  'romajiEnabled': false,
+  'darkThemeEnabled': false,
+  'autoThemeEnabled': false,
+};
+
+bool _getSettingOrDefault(String settingName) =>
+    _prefs.getBool(settingName) ?? _defaults[settingName];
+
+bool get romajiEnabled => _getSettingOrDefault('romajiEnabled');
+bool get darkThemeEnabled => _getSettingOrDefault('darkThemeEnabled');
+bool get autoThemeEnabled => _getSettingOrDefault('autoThemeEnabled');
+
+set romajiEnabled(b) => _prefs.setBool('romajiEnabled', b);
+set darkThemeEnabled(b) => _prefs.setBool('darkThemeEnabled', b);
+set autoThemeEnabled(b) => _prefs.setBool('autoThemeEnabled', b);