From 01d28609485819aad2b4238e617d55c7ceb29f6b Mon Sep 17 00:00:00 2001 From: Harinandan Date: Wed, 19 Jan 2022 10:26:46 +0530 Subject: [PATCH 01/12] Basic Setup of Settings Dialog --- .../settings/settings_dialog.dart | 81 ++++++++++++++++++ .../widgets/settings_appearance_view.dart | 50 +++++++++++ .../widgets/settings_language_view.dart | 10 +++ .../settings/widgets/settings_menu.dart | 82 +++++++++++++++++++ .../widgets/menu/widget/menu_user.dart | 54 +++++------- 5 files changed, 243 insertions(+), 34 deletions(-) create mode 100644 frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart create mode 100644 frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart create mode 100644 frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_language_view.dart create mode 100644 frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart new file mode 100644 index 0000000000..a75c410b26 --- /dev/null +++ b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart @@ -0,0 +1,81 @@ +import 'package:app_flowy/workspace/presentation/settings/widgets/settings_appearance_view.dart'; +import 'package:app_flowy/workspace/presentation/settings/widgets/settings_language_view.dart'; +import 'package:app_flowy/workspace/presentation/settings/widgets/settings_menu.dart'; +import 'package:flutter/material.dart'; + +class SettingsDialog extends StatefulWidget { + const SettingsDialog({Key? key}) : super(key: key); + + @override + State createState() => _SettingsDialogState(); +} + +class _SettingsDialogState extends State { + int _selectedViewIndex = 0; + + final List settingsViews = const [ + SettingsAppearanceView(), + SettingsLanguageView(), + ]; + + @override + Widget build(BuildContext context) { + return AlertDialog( + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(10), + ), + title: SizedBox( + height: 600, + width: 800, + child: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + const SettingsPanelHeader(), + Expanded( + child: Row( + children: [ + Expanded( + flex: 1, + child: SettingsMenu( + changeSelectedIndex: (index) { + setState(() { + _selectedViewIndex = index; + }); + }, + currentIndex: _selectedViewIndex, + ), + ), + Expanded( + flex: 4, + child: settingsViews[_selectedViewIndex], + ) + ], + ), + ), + ], + ), + ), + ); + } +} + +class SettingsPanelHeader extends StatelessWidget { + const SettingsPanelHeader({ + Key? key, + }) : super(key: key); + + @override + Widget build(BuildContext context) { + return const Padding( + padding: EdgeInsets.all(16.0), + child: Text( + //TODO: Change to i10n + 'Settings', + style: TextStyle( + fontWeight: FontWeight.bold, + fontSize: 24, + ), + ), + ); + } +} diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart new file mode 100644 index 0000000000..af66182d2a --- /dev/null +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart @@ -0,0 +1,50 @@ +import 'package:flowy_infra/theme.dart'; +import 'package:flutter/material.dart'; +import 'package:easy_localization/easy_localization.dart'; +import 'package:flutter_bloc/flutter_bloc.dart'; +import 'package:app_flowy/workspace/presentation/theme/theme_model.dart'; +import 'package:app_flowy/generated/locale_keys.g.dart'; + +class SettingsAppearanceView extends StatelessWidget { + const SettingsAppearanceView({Key? key}) : super(key: key); + + @override + Widget build(BuildContext context) { + final theme = context.watch(); + + return SingleChildScrollView( + child: Column( + children: [ + (theme.isDark ? _renderLightMode(context) : _renderDarkMode(context)), + ], + ), + ); + } + + Widget _renderThemeToggle(BuildContext context) { + final theme = context.watch(); + return CircleAvatar( + backgroundColor: theme.surface, + child: IconButton( + icon: Icon(theme.isDark ? Icons.dark_mode : Icons.light_mode), + color: (theme.iconColor), + onPressed: () { + context.read().swapTheme(); + }), + ); + } + + Widget _renderDarkMode(BuildContext context) { + return Tooltip( + message: LocaleKeys.tooltip_darkMode.tr(), + child: _renderThemeToggle(context), + ); + } + + Widget _renderLightMode(BuildContext context) { + return Tooltip( + message: LocaleKeys.tooltip_lightMode.tr(), + child: _renderThemeToggle(context), + ); + } +} diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_language_view.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_language_view.dart new file mode 100644 index 0000000000..4681fcc2b8 --- /dev/null +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_language_view.dart @@ -0,0 +1,10 @@ +import 'package:flutter/material.dart'; + +class SettingsLanguageView extends StatelessWidget { + const SettingsLanguageView({Key? key}) : super(key: key); + + @override + Widget build(BuildContext context) { + return const Center(child: Text('Work In Progress')); + } +} diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart new file mode 100644 index 0000000000..543f4fe9e0 --- /dev/null +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart @@ -0,0 +1,82 @@ +import 'package:flutter/material.dart'; + +class SettingsMenu extends StatelessWidget { + const SettingsMenu({ + Key? key, + required this.changeSelectedIndex, + required this.currentIndex, + }) : super(key: key); + + final Function changeSelectedIndex; + final int currentIndex; + + @override + Widget build(BuildContext context) { + return Column( + children: [ + SettingsMenuElement( + index: 0, + currentIndex: currentIndex, + label: 'Appearance', + icon: Icons.brightness_4, + changeSelectedIndex: changeSelectedIndex, + ), + const SizedBox( + height: 10, + ), + SettingsMenuElement( + index: 1, + currentIndex: currentIndex, + label: 'Language', + icon: Icons.translate, + changeSelectedIndex: changeSelectedIndex, + ), + ], + ); + } +} + +class SettingsMenuElement extends StatelessWidget { + const SettingsMenuElement({ + Key? key, + required this.index, + required this.label, + required this.icon, + required this.changeSelectedIndex, + required this.currentIndex, + }) : super(key: key); + + final int index; + final int currentIndex; + final String label; + final IconData icon; + final Function changeSelectedIndex; + + @override + Widget build(BuildContext context) { + return ListTile( + leading: Icon( + icon, + size: 16, + color: Colors.black, + ), + onTap: () { + changeSelectedIndex(index); + }, + selected: index == currentIndex, + selectedColor: Colors.black, + selectedTileColor: Colors.blue.shade700, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(5), + ), + minLeadingWidth: 0, + title: Text( + label, + style: const TextStyle( + fontSize: 14, + fontWeight: FontWeight.w600, + ), + ), + ); + } +} diff --git a/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart b/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart index 29775a264b..d084b864ff 100644 --- a/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart +++ b/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart @@ -1,5 +1,6 @@ import 'package:app_flowy/startup/startup.dart'; import 'package:app_flowy/workspace/application/menu/menu_user_bloc.dart'; +import 'package:app_flowy/workspace/presentation/settings/settings_dialog.dart'; import 'package:flowy_infra/size.dart'; import 'package:flowy_infra/theme.dart'; import 'package:flowy_infra_ui/widget/spacing.dart'; @@ -17,7 +18,6 @@ class MenuUser extends StatelessWidget { @override Widget build(BuildContext context) { - final theme = context.watch(); return BlocProvider( create: (context) => getIt(param1: user)..add(const MenuUserEvent.initial()), child: BlocBuilder( @@ -26,14 +26,12 @@ class MenuUser extends StatelessWidget { _renderAvatar(context), const HSpace(10), _renderUserName(context), - const HSpace(80), - (theme.isDark ? _renderLightMode(context) : _renderDarkMode(context)), - + const Spacer(), + (_renderSettingsButton(context)), //ToDo: when the user is allowed to create another workspace, //we get the below block back //_renderDropButton(context), ], - mainAxisAlignment: MainAxisAlignment.start, crossAxisAlignment: CrossAxisAlignment.center, ), ), @@ -59,40 +57,28 @@ class MenuUser extends StatelessWidget { ); } - Widget _renderThemeToggle(BuildContext context) { - final theme = context.watch(); - return CircleAvatar( - backgroundColor: theme.surface, - child: IconButton( - icon: Icon(theme.isDark ? Icons.dark_mode : Icons.light_mode), - color: (theme.iconColor), - onPressed: () { - context.read().swapTheme(); - }), - ); - } - - Widget _renderDarkMode(BuildContext context) { - return Tooltip( - message: LocaleKeys.tooltip_darkMode.tr(), - child: _renderThemeToggle(context), - ); - } - - Widget _renderLightMode(BuildContext context) { - return Tooltip( - message: LocaleKeys.tooltip_lightMode.tr(), - child: _renderThemeToggle(context), - ); - } - Widget _renderUserName(BuildContext context) { String name = context.read().state.user.name; if (name.isEmpty) { name = context.read().state.user.email; } - return Flexible( - child: FlowyText(name, fontSize: 12), + return FlowyText(name, fontSize: 12); + } + + Widget _renderSettingsButton(BuildContext context) { + return Tooltip( + message: 'Open Settings', + child: IconButton( + onPressed: () { + showDialog( + context: context, + builder: (context) { + return const SettingsDialog(); + }, + ); + }, + icon: const Icon(Icons.settings), + ), ); } //ToDo: when the user is allowed to create another workspace, From 03e58a90d2101095e6420385163d85a4307c8832 Mon Sep 17 00:00:00 2001 From: Harinandan Date: Wed, 19 Jan 2022 10:27:35 +0530 Subject: [PATCH 02/12] Cleanup imports --- .../presentation/widgets/menu/widget/menu_user.dart | 6 +----- 1 file changed, 1 insertion(+), 5 deletions(-) diff --git a/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart b/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart index d084b864ff..0310d57d6f 100644 --- a/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart +++ b/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart @@ -2,15 +2,11 @@ import 'package:app_flowy/startup/startup.dart'; import 'package:app_flowy/workspace/application/menu/menu_user_bloc.dart'; import 'package:app_flowy/workspace/presentation/settings/settings_dialog.dart'; import 'package:flowy_infra/size.dart'; -import 'package:flowy_infra/theme.dart'; +import 'package:flowy_infra_ui/style_widget/text.dart'; import 'package:flowy_infra_ui/widget/spacing.dart'; import 'package:flowy_sdk/protobuf/flowy-user-data-model/protobuf.dart' show UserProfile; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; -import 'package:flowy_infra_ui/style_widget/text.dart'; -import 'package:easy_localization/easy_localization.dart'; -import 'package:app_flowy/workspace/presentation/theme/theme_model.dart'; -import 'package:app_flowy/generated/locale_keys.g.dart'; class MenuUser extends StatelessWidget { final UserProfile user; From 0ed1847672bf26396b072a32eeecca75d38144fd Mon Sep 17 00:00:00 2001 From: Harinandan Date: Wed, 19 Jan 2022 10:29:02 +0530 Subject: [PATCH 03/12] Refactor Settings Menu Element into seperate file --- .../settings/widgets/settings_menu.dart | 46 +------------------ .../widgets/settings_menu_element.dart | 46 +++++++++++++++++++ 2 files changed, 47 insertions(+), 45 deletions(-) create mode 100644 frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart index 543f4fe9e0..22b049a4f5 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart @@ -1,3 +1,4 @@ +import 'package:app_flowy/workspace/presentation/settings/widgets/settings_menu_element.dart'; import 'package:flutter/material.dart'; class SettingsMenu extends StatelessWidget { @@ -35,48 +36,3 @@ class SettingsMenu extends StatelessWidget { ); } } - -class SettingsMenuElement extends StatelessWidget { - const SettingsMenuElement({ - Key? key, - required this.index, - required this.label, - required this.icon, - required this.changeSelectedIndex, - required this.currentIndex, - }) : super(key: key); - - final int index; - final int currentIndex; - final String label; - final IconData icon; - final Function changeSelectedIndex; - - @override - Widget build(BuildContext context) { - return ListTile( - leading: Icon( - icon, - size: 16, - color: Colors.black, - ), - onTap: () { - changeSelectedIndex(index); - }, - selected: index == currentIndex, - selectedColor: Colors.black, - selectedTileColor: Colors.blue.shade700, - shape: RoundedRectangleBorder( - borderRadius: BorderRadius.circular(5), - ), - minLeadingWidth: 0, - title: Text( - label, - style: const TextStyle( - fontSize: 14, - fontWeight: FontWeight.w600, - ), - ), - ); - } -} diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart new file mode 100644 index 0000000000..adfe45010e --- /dev/null +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart @@ -0,0 +1,46 @@ +import 'package:flutter/material.dart'; + +class SettingsMenuElement extends StatelessWidget { + const SettingsMenuElement({ + Key? key, + required this.index, + required this.label, + required this.icon, + required this.changeSelectedIndex, + required this.currentIndex, + }) : super(key: key); + + final int index; + final int currentIndex; + final String label; + final IconData icon; + final Function changeSelectedIndex; + + @override + Widget build(BuildContext context) { + return ListTile( + leading: Icon( + icon, + size: 16, + color: Colors.black, + ), + onTap: () { + changeSelectedIndex(index); + }, + selected: index == currentIndex, + selectedColor: Colors.black, + selectedTileColor: Colors.blue.shade700, + shape: RoundedRectangleBorder( + borderRadius: BorderRadius.circular(5), + ), + minLeadingWidth: 0, + title: Text( + label, + style: const TextStyle( + fontSize: 14, + fontWeight: FontWeight.w600, + ), + ), + ); + } +} From fd98b192afbc18f8d3ae5d4373c9858b1ae54334 Mon Sep 17 00:00:00 2001 From: Harinandan Date: Wed, 19 Jan 2022 14:11:33 +0530 Subject: [PATCH 04/12] Added adaptive theme and change theme button --- .../settings/settings_dialog.dart | 3 + .../widgets/settings_appearance_view.dart | 60 +++++++++---------- .../widgets/settings_menu_element.dart | 7 ++- 3 files changed, 37 insertions(+), 33 deletions(-) diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart index a75c410b26..a9f88fc4c9 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart @@ -33,6 +33,7 @@ class _SettingsDialogState extends State { const SettingsPanelHeader(), Expanded( child: Row( + crossAxisAlignment: CrossAxisAlignment.start, children: [ Expanded( flex: 1, @@ -45,6 +46,8 @@ class _SettingsDialogState extends State { currentIndex: _selectedViewIndex, ), ), + const VerticalDivider(), + const SizedBox(width: 10), Expanded( flex: 4, child: settingsViews[_selectedViewIndex], diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart index af66182d2a..139451fe47 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart @@ -1,9 +1,7 @@ +import 'package:app_flowy/workspace/presentation/theme/theme_model.dart'; import 'package:flowy_infra/theme.dart'; import 'package:flutter/material.dart'; -import 'package:easy_localization/easy_localization.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; -import 'package:app_flowy/workspace/presentation/theme/theme_model.dart'; -import 'package:app_flowy/generated/locale_keys.g.dart'; class SettingsAppearanceView extends StatelessWidget { const SettingsAppearanceView({Key? key}) : super(key: key); @@ -14,37 +12,37 @@ class SettingsAppearanceView extends StatelessWidget { return SingleChildScrollView( child: Column( + crossAxisAlignment: CrossAxisAlignment.start, children: [ - (theme.isDark ? _renderLightMode(context) : _renderDarkMode(context)), + const SizedBox( + height: 15, + ), + Row( + children: [ + const Text( + 'Light Mode', + style: TextStyle( + fontSize: 14, + fontWeight: FontWeight.w500, + ), + ), + Switch( + value: theme.isDark, + onChanged: (val) { + context.read().swapTheme(); + }, + ), + const Text( + 'Dark Mode', + style: TextStyle( + fontSize: 14, + fontWeight: FontWeight.w500, + ), + ), + ], + ), ], ), ); } - - Widget _renderThemeToggle(BuildContext context) { - final theme = context.watch(); - return CircleAvatar( - backgroundColor: theme.surface, - child: IconButton( - icon: Icon(theme.isDark ? Icons.dark_mode : Icons.light_mode), - color: (theme.iconColor), - onPressed: () { - context.read().swapTheme(); - }), - ); - } - - Widget _renderDarkMode(BuildContext context) { - return Tooltip( - message: LocaleKeys.tooltip_darkMode.tr(), - child: _renderThemeToggle(context), - ); - } - - Widget _renderLightMode(BuildContext context) { - return Tooltip( - message: LocaleKeys.tooltip_lightMode.tr(), - child: _renderThemeToggle(context), - ); - } } diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart index adfe45010e..6127ea96ae 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart @@ -1,3 +1,5 @@ +import 'package:flowy_infra/theme.dart'; +import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter/material.dart'; class SettingsMenuElement extends StatelessWidget { @@ -18,18 +20,19 @@ class SettingsMenuElement extends StatelessWidget { @override Widget build(BuildContext context) { + final theme = context.watch(); return ListTile( leading: Icon( icon, size: 16, - color: Colors.black, + color: index == currentIndex ? Colors.black : theme.textColor, ), onTap: () { changeSelectedIndex(index); }, selected: index == currentIndex, selectedColor: Colors.black, - selectedTileColor: Colors.blue.shade700, + selectedTileColor: theme.main2, shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(5), ), From 907b10b783750c1473a8384dc49874019fe17361 Mon Sep 17 00:00:00 2001 From: Harinandan Date: Wed, 19 Jan 2022 23:52:12 +0530 Subject: [PATCH 05/12] Added constrained box --- .../workspace/presentation/settings/settings_dialog.dart | 7 ++++--- 1 file changed, 4 insertions(+), 3 deletions(-) diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart index a9f88fc4c9..e4e73204c7 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart @@ -24,9 +24,10 @@ class _SettingsDialogState extends State { shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(10), ), - title: SizedBox( - height: 600, - width: 800, + title: ConstrainedBox( + constraints: const BoxConstraints( + maxHeight: 600, + ), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ From c1ccad104b15960f46e928da8a835f3a1d0dfbb2 Mon Sep 17 00:00:00 2001 From: Harinandan Date: Thu, 20 Jan 2022 08:13:38 +0530 Subject: [PATCH 06/12] Fixed adaptive Size issue --- .../settings/settings_dialog.dart | 67 ++++++------------- .../widgets/settings_menu_element.dart | 1 + 2 files changed, 23 insertions(+), 45 deletions(-) diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart index e4e73204c7..ef00dfd46d 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart @@ -24,62 +24,39 @@ class _SettingsDialogState extends State { shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(10), ), - title: ConstrainedBox( + title: const Text( + 'Settings', + style: TextStyle( + fontWeight: FontWeight.bold, + ), + ), + content: ConstrainedBox( constraints: const BoxConstraints( maxHeight: 600, ), - child: Column( + child: Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ - const SettingsPanelHeader(), Expanded( - child: Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Expanded( - flex: 1, - child: SettingsMenu( - changeSelectedIndex: (index) { - setState(() { - _selectedViewIndex = index; - }); - }, - currentIndex: _selectedViewIndex, - ), - ), - const VerticalDivider(), - const SizedBox(width: 10), - Expanded( - flex: 4, - child: settingsViews[_selectedViewIndex], - ) - ], + flex: 1, + child: SettingsMenu( + changeSelectedIndex: (index) { + setState(() { + _selectedViewIndex = index; + }); + }, + currentIndex: _selectedViewIndex, ), ), + const VerticalDivider(), + const SizedBox(width: 10), + Expanded( + flex: 4, + child: settingsViews[_selectedViewIndex], + ) ], ), ), ); } } - -class SettingsPanelHeader extends StatelessWidget { - const SettingsPanelHeader({ - Key? key, - }) : super(key: key); - - @override - Widget build(BuildContext context) { - return const Padding( - padding: EdgeInsets.all(16.0), - child: Text( - //TODO: Change to i10n - 'Settings', - style: TextStyle( - fontWeight: FontWeight.bold, - fontSize: 24, - ), - ), - ); - } -} diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart index 6127ea96ae..fe3d83bbb3 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart @@ -42,6 +42,7 @@ class SettingsMenuElement extends StatelessWidget { style: const TextStyle( fontSize: 14, fontWeight: FontWeight.w600, + overflow: TextOverflow.ellipsis, ), ), ); From 8c17e96c51fda7dc77c0a1da805badb011b8b162 Mon Sep 17 00:00:00 2001 From: Harinandan Date: Thu, 20 Jan 2022 08:37:47 +0530 Subject: [PATCH 07/12] Replaced literal strings with translation --- frontend/app_flowy/assets/translations/en.json | 13 ++++++++++++- .../presentation/settings/settings_dialog.dart | 8 +++++--- .../settings/widgets/settings_appearance_view.dart | 14 ++++++++------ .../settings/widgets/settings_menu.dart | 6 ++++-- 4 files changed, 29 insertions(+), 12 deletions(-) diff --git a/frontend/app_flowy/assets/translations/en.json b/frontend/app_flowy/assets/translations/en.json index 5c66f4c0a3..0b461e321c 100644 --- a/frontend/app_flowy/assets/translations/en.json +++ b/frontend/app_flowy/assets/translations/en.json @@ -90,7 +90,7 @@ "inlineCode": "Inline Code", "quote": "Quote Block" }, - "tooltip":{ + "tooltip": { "lightMode": "Switch to Light mode", "darkMode": "Switch to Dark mode" }, @@ -127,5 +127,16 @@ "instruction3": "Navigate to the following link in your web browser, and enter the above code:", "instruction4": "Press the button below when you've completed signup:" } + }, + "settings": { + "title": "Settings", + "menu": { + "appearance": "Appearance", + "language": "Language" + }, + "appearance": { + "lightLabel": "Light Mode", + "darkLabel": "Dark Mode" + } } } \ No newline at end of file diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart index ef00dfd46d..486825bc9e 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart @@ -2,6 +2,8 @@ import 'package:app_flowy/workspace/presentation/settings/widgets/settings_appea import 'package:app_flowy/workspace/presentation/settings/widgets/settings_language_view.dart'; import 'package:app_flowy/workspace/presentation/settings/widgets/settings_menu.dart'; import 'package:flutter/material.dart'; +import 'package:app_flowy/generated/locale_keys.g.dart'; +import 'package:easy_localization/easy_localization.dart'; class SettingsDialog extends StatefulWidget { const SettingsDialog({Key? key}) : super(key: key); @@ -24,9 +26,9 @@ class _SettingsDialogState extends State { shape: RoundedRectangleBorder( borderRadius: BorderRadius.circular(10), ), - title: const Text( - 'Settings', - style: TextStyle( + title: Text( + LocaleKeys.settings_title.tr(), + style: const TextStyle( fontWeight: FontWeight.bold, ), ), diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart index 139451fe47..fcc5847d43 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart @@ -2,6 +2,8 @@ import 'package:app_flowy/workspace/presentation/theme/theme_model.dart'; import 'package:flowy_infra/theme.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; +import 'package:app_flowy/generated/locale_keys.g.dart'; +import 'package:easy_localization/easy_localization.dart'; class SettingsAppearanceView extends StatelessWidget { const SettingsAppearanceView({Key? key}) : super(key: key); @@ -19,9 +21,9 @@ class SettingsAppearanceView extends StatelessWidget { ), Row( children: [ - const Text( - 'Light Mode', - style: TextStyle( + Text( + LocaleKeys.settings_appearance_lightLabel.tr(), + style: const TextStyle( fontSize: 14, fontWeight: FontWeight.w500, ), @@ -32,9 +34,9 @@ class SettingsAppearanceView extends StatelessWidget { context.read().swapTheme(); }, ), - const Text( - 'Dark Mode', - style: TextStyle( + Text( + LocaleKeys.settings_appearance_darkLabel.tr(), + style: const TextStyle( fontSize: 14, fontWeight: FontWeight.w500, ), diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart index 22b049a4f5..3d616cb86e 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart @@ -1,5 +1,7 @@ import 'package:app_flowy/workspace/presentation/settings/widgets/settings_menu_element.dart'; import 'package:flutter/material.dart'; +import 'package:app_flowy/generated/locale_keys.g.dart'; +import 'package:easy_localization/easy_localization.dart'; class SettingsMenu extends StatelessWidget { const SettingsMenu({ @@ -18,7 +20,7 @@ class SettingsMenu extends StatelessWidget { SettingsMenuElement( index: 0, currentIndex: currentIndex, - label: 'Appearance', + label: LocaleKeys.settings_menu_appearance.tr(), icon: Icons.brightness_4, changeSelectedIndex: changeSelectedIndex, ), @@ -28,7 +30,7 @@ class SettingsMenu extends StatelessWidget { SettingsMenuElement( index: 1, currentIndex: currentIndex, - label: 'Language', + label: LocaleKeys.settings_menu_language.tr(), icon: Icons.translate, changeSelectedIndex: changeSelectedIndex, ), From 2317f1682c64c452e6f04a3d049d24ae12c35acb Mon Sep 17 00:00:00 2001 From: Harinandan Date: Thu, 20 Jan 2022 08:39:46 +0530 Subject: [PATCH 08/12] Cleaned up imports --- .../lib/workspace/presentation/settings/settings_dialog.dart | 4 ++-- .../settings/widgets/settings_appearance_view.dart | 4 ++-- .../presentation/settings/widgets/settings_menu.dart | 4 ++-- .../presentation/settings/widgets/settings_menu_element.dart | 2 +- .../workspace/presentation/widgets/menu/widget/menu_user.dart | 2 +- 5 files changed, 8 insertions(+), 8 deletions(-) diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart index 486825bc9e..2fee55cc33 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart @@ -1,9 +1,9 @@ +import 'package:app_flowy/generated/locale_keys.g.dart'; import 'package:app_flowy/workspace/presentation/settings/widgets/settings_appearance_view.dart'; import 'package:app_flowy/workspace/presentation/settings/widgets/settings_language_view.dart'; import 'package:app_flowy/workspace/presentation/settings/widgets/settings_menu.dart'; -import 'package:flutter/material.dart'; -import 'package:app_flowy/generated/locale_keys.g.dart'; import 'package:easy_localization/easy_localization.dart'; +import 'package:flutter/material.dart'; class SettingsDialog extends StatefulWidget { const SettingsDialog({Key? key}) : super(key: key); diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart index fcc5847d43..6cfe8ed62d 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart @@ -1,9 +1,9 @@ +import 'package:app_flowy/generated/locale_keys.g.dart'; import 'package:app_flowy/workspace/presentation/theme/theme_model.dart'; +import 'package:easy_localization/easy_localization.dart'; import 'package:flowy_infra/theme.dart'; import 'package:flutter/material.dart'; import 'package:flutter_bloc/flutter_bloc.dart'; -import 'package:app_flowy/generated/locale_keys.g.dart'; -import 'package:easy_localization/easy_localization.dart'; class SettingsAppearanceView extends StatelessWidget { const SettingsAppearanceView({Key? key}) : super(key: key); diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart index 3d616cb86e..241c337705 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart @@ -1,7 +1,7 @@ -import 'package:app_flowy/workspace/presentation/settings/widgets/settings_menu_element.dart'; -import 'package:flutter/material.dart'; import 'package:app_flowy/generated/locale_keys.g.dart'; +import 'package:app_flowy/workspace/presentation/settings/widgets/settings_menu_element.dart'; import 'package:easy_localization/easy_localization.dart'; +import 'package:flutter/material.dart'; class SettingsMenu extends StatelessWidget { const SettingsMenu({ diff --git a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart index fe3d83bbb3..80e5c16e42 100644 --- a/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart +++ b/frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart @@ -1,6 +1,6 @@ import 'package:flowy_infra/theme.dart'; -import 'package:flutter_bloc/flutter_bloc.dart'; import 'package:flutter/material.dart'; +import 'package:flutter_bloc/flutter_bloc.dart'; class SettingsMenuElement extends StatelessWidget { const SettingsMenuElement({ diff --git a/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart b/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart index 0310d57d6f..38d760d51e 100644 --- a/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart +++ b/frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart @@ -23,7 +23,7 @@ class MenuUser extends StatelessWidget { const HSpace(10), _renderUserName(context), const Spacer(), - (_renderSettingsButton(context)), + _renderSettingsButton(context), //ToDo: when the user is allowed to create another workspace, //we get the below block back //_renderDropButton(context), From 33212df63a141e4ad22416180474f56aeb9110d6 Mon Sep 17 00:00:00 2001 From: Harinandan Date: Fri, 21 Jan 2022 02:54:36 +0530 Subject: [PATCH 09/12] Fixed problem with translation key gen --- frontend/scripts/generate_language_files.cmd | 2 +- frontend/scripts/generate_language_files.sh | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/frontend/scripts/generate_language_files.cmd b/frontend/scripts/generate_language_files.cmd index a8e938aa08..4522440595 100644 --- a/frontend/scripts/generate_language_files.cmd +++ b/frontend/scripts/generate_language_files.cmd @@ -1,4 +1,4 @@ echo 'Generating language files' cd app_flowy -flutter pub run easy_localization:generate -S assets/translations/ && flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations/ \ No newline at end of file +flutter pub run easy_localization:generate -S assets/translations/ && flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations/ -s en.json \ No newline at end of file diff --git a/frontend/scripts/generate_language_files.sh b/frontend/scripts/generate_language_files.sh index 6ef0b175f0..61215f1a64 100644 --- a/frontend/scripts/generate_language_files.sh +++ b/frontend/scripts/generate_language_files.sh @@ -3,4 +3,4 @@ echo 'Generating language files' cd app_flowy flutter pub run easy_localization:generate -S assets/translations/ -flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations +flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations -s en.json From 4da2dadf694eaff2f0b65cdb4fa645b95d1eea79 Mon Sep 17 00:00:00 2001 From: MikeWallaceDev Date: Thu, 20 Jan 2022 21:32:24 -0500 Subject: [PATCH 10/12] Fixed language generation from build script --- frontend/scripts/makefile/flutter.toml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/frontend/scripts/makefile/flutter.toml b/frontend/scripts/makefile/flutter.toml index 20705fb81a..70552195e6 100644 --- a/frontend/scripts/makefile/flutter.toml +++ b/frontend/scripts/makefile/flutter.toml @@ -181,7 +181,7 @@ script = [ flutter clean flutter pub get flutter pub run easy_localization:generate -S assets/translations/ - flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations + flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations -s en.json """, ] script_runner = "@shell" From 27f900753e484b1a21f8fd8ce48311d66a2a81c8 Mon Sep 17 00:00:00 2001 From: MikeWallaceDev Date: Thu, 20 Jan 2022 22:08:04 -0500 Subject: [PATCH 11/12] Fixed a typo --- frontend/scripts/makefile/flutter.toml | 10 ++++------ 1 file changed, 4 insertions(+), 6 deletions(-) diff --git a/frontend/scripts/makefile/flutter.toml b/frontend/scripts/makefile/flutter.toml index 1900097fd4..b1cda1d69f 100644 --- a/frontend/scripts/makefile/flutter.toml +++ b/frontend/scripts/makefile/flutter.toml @@ -177,7 +177,7 @@ script_runner = "@shell" [tasks.generate_language_files] script_runner = "@shell" script = [ - ''' + """ cd app_flowy flutter clean flutter pub get @@ -190,13 +190,11 @@ script = [ [tasks.generate_language_files.windows] script_runner = "@duckscript" script = [ - ''' - cd app_flowy + """ + cd ./app_flowy/ exec cmd.exe /c flutter clean exec cmd.exe /c flutter pub get exec cmd.exe /c flutter pub run easy_localization:generate -S assets/translations/ exec cmd.exe /c flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations - ''' + """ ] - - From cae691df9aef5a51a64483d62dc0fed8d53cc302 Mon Sep 17 00:00:00 2001 From: Harinandan Date: Fri, 21 Jan 2022 10:40:27 +0530 Subject: [PATCH 12/12] Moved language generation commands in cmd to seperate lines --- frontend/scripts/generate_language_files.cmd | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/frontend/scripts/generate_language_files.cmd b/frontend/scripts/generate_language_files.cmd index 4522440595..8980093db6 100644 --- a/frontend/scripts/generate_language_files.cmd +++ b/frontend/scripts/generate_language_files.cmd @@ -1,4 +1,5 @@ echo 'Generating language files' cd app_flowy -flutter pub run easy_localization:generate -S assets/translations/ && flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations/ -s en.json \ No newline at end of file +call flutter pub run easy_localization:generate -S assets/translations/ +call flutter pub run easy_localization:generate -f keys -o locale_keys.g.dart -S assets/translations/ -s en.json \ No newline at end of file