Mirrored_Repos/AppFlowy
1
0
Fork 0
mirror of https://github.com/AppFlowy-IO/AppFlowy.git synced 2024-08-30 18:12:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #262 from Hari-07/settings-modal

Browse Source 
Settings Modal
This commit is contained in:
AppFlowy.IO 2022-01-21 05:22:59 -08:00 committed by GitHub
commit 9d8db6e746
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
10 changed files with 256 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/app_flowy/assets/translations/en.json
View File

@ -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"
}
}
}

64
frontend/app_flowy/lib/workspace/presentation/settings/settings_dialog.dart Normal file
View File

@ -0,0 +1,64 @@
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:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
class SettingsDialog extends StatefulWidget {
const SettingsDialog({Key? key}) : super(key: key);
@override
State<SettingsDialog> createState() => _SettingsDialogState();
}
class _SettingsDialogState extends State<SettingsDialog> {
int _selectedViewIndex = 0;
final List<Widget> settingsViews = const [
SettingsAppearanceView(),
SettingsLanguageView(),
];
@override
Widget build(BuildContext context) {
return AlertDialog(
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10),
),
title: Text(
LocaleKeys.settings_title.tr(),
style: const TextStyle(
fontWeight: FontWeight.bold,
),
),
content: ConstrainedBox(
constraints: const BoxConstraints(
maxHeight: 600,
),
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],
)
],
),
),
);
}
}

50
frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_appearance_view.dart Normal file
View File

@ -0,0 +1,50 @@
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';
class SettingsAppearanceView extends StatelessWidget {
const SettingsAppearanceView({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final theme = context.watch<AppTheme>();
return SingleChildScrollView(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
const SizedBox(
height: 15,
),
Row(
children: [
Text(
LocaleKeys.settings_appearance_lightLabel.tr(),
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
),
),
Switch(
value: theme.isDark,
onChanged: (val) {
context.read<ThemeModel>().swapTheme();
},
),
Text(
LocaleKeys.settings_appearance_darkLabel.tr(),
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.w500,
),
),
],
),
],
),
);
}
}

10
frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_language_view.dart Normal file
View File

@ -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'));
}
}

40
frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu.dart Normal file
View File

@ -0,0 +1,40 @@
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({
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: LocaleKeys.settings_menu_appearance.tr(),
icon: Icons.brightness_4,
changeSelectedIndex: changeSelectedIndex,
),
const SizedBox(
height: 10,
),
SettingsMenuElement(
index: 1,
currentIndex: currentIndex,
label: LocaleKeys.settings_menu_language.tr(),
icon: Icons.translate,
changeSelectedIndex: changeSelectedIndex,
),
],
);
}
}

50
frontend/app_flowy/lib/workspace/presentation/settings/widgets/settings_menu_element.dart Normal file
View File

@ -0,0 +1,50 @@
import 'package:flowy_infra/theme.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.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) {
final theme = context.watch<AppTheme>();
return ListTile(
leading: Icon(
icon,
size: 16,
color: index == currentIndex ? Colors.black : theme.textColor,
),
onTap: () {
changeSelectedIndex(index);
},
selected: index == currentIndex,
selectedColor: Colors.black,
selectedTileColor: theme.main2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(5),
),
minLeadingWidth: 0,
title: Text(
label,
style: const TextStyle(
fontSize: 14,
fontWeight: FontWeight.w600,
overflow: TextOverflow.ellipsis,
),
),
);
}
}

60
frontend/app_flowy/lib/workspace/presentation/widgets/menu/widget/menu_user.dart
View File

@ -1,15 +1,12 @@
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;
@ -17,7 +14,6 @@ class MenuUser extends StatelessWidget {
@override
Widget build(BuildContext context) {
final theme = context.watch<AppTheme>();
return BlocProvider<MenuUserBloc>(
create: (context) => getIt<MenuUserBloc>(param1: user)..add(const MenuUserEvent.initial()),
child: BlocBuilder<MenuUserBloc, MenuUserState>(
@ -26,14 +22,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 +53,28 @@ class MenuUser extends StatelessWidget {
);
}
Widget _renderThemeToggle(BuildContext context) {
final theme = context.watch<AppTheme>();
return CircleAvatar(
backgroundColor: theme.surface,
child: IconButton(
icon: Icon(theme.isDark ? Icons.dark_mode : Icons.light_mode),
color: (theme.iconColor),
onPressed: () {
context.read<ThemeModel>().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<MenuUserBloc>().state.user.name;
if (name.isEmpty) {
name = context.read<MenuUserBloc>().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,

3
frontend/scripts/generate_language_files.cmd
View File

@ -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/
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

2
frontend/scripts/generate_language_files.sh
View File

@ -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

14
frontend/scripts/makefile/flutter.toml
View File

@ -177,26 +177,24 @@ script_runner = "@shell"
[tasks.generate_language_files]
script_runner = "@shell"
script = [
'''
"""
cd app_flowy
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
"""
]
[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
'''
"""
]