Responsive navigation settings

This commit is contained in:
Juan Gilsanz Polo 2023-04-30 22:54:39 +02:00
parent aefdac5650
commit ef43f8b5dd
11 changed files with 273 additions and 113 deletions

View file

@ -17,6 +17,8 @@ class AppConfigProvider with ChangeNotifier {
int _selectedScreen = 0;
int? _selectedSettingsScreen;
bool _showingSnackbar = false;
int _selectedTheme = 0;
@ -119,6 +121,10 @@ class AppConfigProvider with ChangeNotifier {
return _doNotRememberVersion;
}
int? get selectedSettingsScreen {
return _selectedSettingsScreen;
}
void setDbInstance(Database db) {
_dbInstance = db;
}
@ -160,6 +166,11 @@ class AppConfigProvider with ChangeNotifier {
notifyListeners();
}
void setSelectedSettingsScreen(int? screen) {
_selectedSettingsScreen = screen;
notifyListeners();
}
Future<bool> setOverrideSslCheck(bool status) async {
final updated = await updateConfigQuery(
db: _dbInstance!,

View file

@ -60,7 +60,7 @@ class _AccessSettingsWidgetState extends State<AccessSettingsWidget> with Ticker
@override
void initState() {
fetchClients();
if (mounted) fetchClients();
super.initState();
tabController = TabController(
initialIndex: 0,

View file

@ -204,7 +204,7 @@ class _DhcpWidgetState extends State<DhcpWidget> {
@override
void initState() {
loadDhcpStatus();
if (mounted) loadDhcpStatus();
super.initState();
}

View file

@ -52,24 +52,26 @@ class _SafeSearchSettingsScreenWidgetState extends State<SafeSearchSettingsScree
bool youtubeEnabled = false;
Future requestSafeSearchSettings() async {
final result = await getServerStatus(widget.serversProvider.selectedServer!);
if (mounted) {
if (result['result'] == 'success') {
widget.serversProvider.setServerStatusData(result['data']);
widget.serversProvider.setServerStatusLoad(1);
setState(() {
generalEnabled = result['data'].safeSearchEnabled;
bingEnabled = result['data'].safeSeachBing;
duckduckgoEnabled = result['data'].safeSearchDuckduckgo;
googleEnabled = result['data'].safeSearchGoogle;
pixabayEnabled = result['data'].safeSearchPixabay;
yandexEnabled = result['data'].safeSearchYandex;
youtubeEnabled = result['data'].safeSearchYoutube;
});
}
else {
widget.appConfigProvider.addLog(result['log']);
widget.serversProvider.setServerStatusLoad(2);
final result = await getServerStatus(widget.serversProvider.selectedServer!);
if (mounted) {
if (result['result'] == 'success') {
widget.serversProvider.setServerStatusData(result['data']);
widget.serversProvider.setServerStatusLoad(1);
setState(() {
generalEnabled = result['data'].safeSearchEnabled;
bingEnabled = result['data'].safeSeachBing;
duckduckgoEnabled = result['data'].safeSearchDuckduckgo;
googleEnabled = result['data'].safeSearchGoogle;
pixabayEnabled = result['data'].safeSearchPixabay;
yandexEnabled = result['data'].safeSearchYandex;
youtubeEnabled = result['data'].safeSearchYoutube;
});
}
else {
widget.appConfigProvider.addLog(result['log']);
widget.serversProvider.setServerStatusLoad(2);
}
}
}
}

View file

@ -1,6 +1,7 @@
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:flutter_split_view/flutter_split_view.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/screens/settings/server_info/server_info.dart';
@ -9,7 +10,6 @@ import 'package:adguard_home_manager/screens/settings/access_settings/access_set
import 'package:adguard_home_manager/screens/settings/customization/customization.dart';
import 'package:adguard_home_manager/screens/settings/dhcp/dhcp.dart';
import 'package:adguard_home_manager/screens/settings/safe_search_settings.dart';
import 'package:adguard_home_manager/widgets/section_label.dart';
import 'package:adguard_home_manager/screens/settings/update_server/update.dart';
import 'package:adguard_home_manager/screens/settings/dns/dns.dart';
import 'package:adguard_home_manager/screens/settings/dns_rewrites/dns_rewrites.dart';
@ -17,6 +17,8 @@ import 'package:adguard_home_manager/screens/servers/servers.dart';
import 'package:adguard_home_manager/screens/settings/advanced_setings.dart';
import 'package:adguard_home_manager/screens/settings/general_settings.dart';
import 'package:adguard_home_manager/widgets/custom_settings_tile.dart';
import 'package:adguard_home_manager/widgets/section_label.dart';
import 'package:adguard_home_manager/widgets/custom_list_tile.dart';
import 'package:adguard_home_manager/constants/strings.dart';
@ -25,21 +27,61 @@ import 'package:adguard_home_manager/functions/compare_versions.dart';
import 'package:adguard_home_manager/constants/urls.dart';
import 'package:adguard_home_manager/providers/servers_provider.dart';
import 'package:adguard_home_manager/providers/app_config_provider.dart';
class Settings extends StatelessWidget {
const Settings({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return const SplitView.material(
breakpoint: 900,
child: SettingsWidget(),
);
}
}
class SettingsWidget extends StatelessWidget {
const SettingsWidget({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final appConfigProvider = Provider.of<AppConfigProvider>(context);
final serversProvider = Provider.of<ServersProvider>(context);
void navigateServers() {
Future.delayed(const Duration(milliseconds: 0), (() {
Navigator.of(context).push(
MaterialPageRoute(builder: (context) => const Servers())
final width = MediaQuery.of(context).size.width;
Widget settingsTile({
required String title,
required String subtitle,
required IconData icon,
Widget? trailing,
required Widget screenToNavigate,
required int thisItem
}) {
if (width > 900) {
return CustomSettingsTile(
title: title,
subtitle: subtitle,
icon: icon,
trailing: trailing,
thisItem: thisItem,
selectedItem: appConfigProvider.selectedSettingsScreen,
onTap: () {
appConfigProvider.setSelectedSettingsScreen(thisItem);
SplitView.of(context).setSecondary(screenToNavigate);
},
);
}));
}
else {
return CustomListTile(
title: title,
subtitle: subtitle,
icon: icon,
trailing: trailing,
onTap: () {
appConfigProvider.setSelectedSettingsScreen(thisItem);
SplitView.of(context).setSecondary(screenToNavigate);
},
);
}
}
return Scaffold(
@ -55,79 +97,49 @@ class Settings extends StatelessWidget {
currentVersion: serversProvider.serverStatus.data!.serverVersion,
referenceVersion: 'v0.107.28',
referenceVersionBeta: 'v0.108.0-b.33'
) == true) CustomListTile(
) == true) settingsTile(
icon: Icons.search_rounded,
title: AppLocalizations.of(context)!.safeSearch,
subtitle: AppLocalizations.of(context)!.safeSearchSettings,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const SafeSearchSettingsScreen()
)
)
},
thisItem: 0,
screenToNavigate: const SafeSearchSettingsScreen(),
),
CustomListTile(
settingsTile(
icon: Icons.lock_rounded,
title: AppLocalizations.of(context)!.accessSettings,
subtitle: AppLocalizations.of(context)!.accessSettingsDescription,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const AccessSettings()
)
)
},
thisItem: 1,
screenToNavigate: const AccessSettings(),
),
CustomListTile(
settingsTile(
icon: Icons.install_desktop_rounded,
title: AppLocalizations.of(context)!.dhcpSettings,
subtitle: AppLocalizations.of(context)!.dhcpSettingsDescription,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const Dhcp()
)
)
},
thisItem: 2,
screenToNavigate: const Dhcp(),
),
CustomListTile(
settingsTile(
icon: Icons.dns_rounded,
title: AppLocalizations.of(context)!.dnsSettings,
subtitle: AppLocalizations.of(context)!.dnsSettingsDescription,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const DnsSettings()
)
)
},
thisItem: 3,
screenToNavigate: const DnsSettings(),
),
CustomListTile(
settingsTile(
icon: Icons.security_rounded,
title: AppLocalizations.of(context)!.encryptionSettings,
subtitle: AppLocalizations.of(context)!.encryptionSettingsDescription,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const EncryptionSettings()
)
)
},
thisItem: 4,
screenToNavigate: const EncryptionSettings(),
),
CustomListTile(
settingsTile(
icon: Icons.route_rounded,
title: AppLocalizations.of(context)!.dnsRewrites,
subtitle: AppLocalizations.of(context)!.dnsRewritesDescription,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const DnsRewrites()
)
)
},
thisItem: 5,
screenToNavigate: const DnsRewrites(),
),
if (serversProvider.updateAvailable.data != null) CustomListTile(
if (serversProvider.updateAvailable.data != null) settingsTile(
icon: Icons.system_update_rounded,
title: AppLocalizations.of(context)!.updates,
subtitle: AppLocalizations.of(context)!.updatesDescription,
@ -144,37 +156,26 @@ class Settings extends StatelessWidget {
),
)
: null,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const UpdateScreen()
)
)
},
thisItem: 6,
screenToNavigate: const UpdateScreen(),
),
CustomListTile(
settingsTile(
icon: Icons.info_rounded,
title: AppLocalizations.of(context)!.serverInformation,
subtitle: AppLocalizations.of(context)!.serverInformationDescription,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const ServerInformation()
)
)
},
thisItem: 7,
screenToNavigate: const ServerInformation(),
),
],
SectionLabel(label: AppLocalizations.of(context)!.appSettings),
CustomListTile(
settingsTile(
icon: Icons.palette_rounded,
title: AppLocalizations.of(context)!.customization,
subtitle: AppLocalizations.of(context)!.customizationDescription,
onTap: () => Navigator.push(context, MaterialPageRoute(
builder: (context) => const Customization()
))
thisItem: 8,
screenToNavigate: const Customization(),
),
CustomListTile(
settingsTile(
icon: Icons.storage_rounded,
title: AppLocalizations.of(context)!.servers,
subtitle: serversProvider.selectedServer != null
@ -182,31 +183,22 @@ class Settings extends StatelessWidget {
? "${AppLocalizations.of(context)!.connectedTo} ${serversProvider.selectedServer!.name}"
: "${AppLocalizations.of(context)!.selectedServer} ${serversProvider.selectedServer!.name}"
: AppLocalizations.of(context)!.noServerSelected,
onTap: navigateServers,
thisItem: 9,
screenToNavigate: const Servers(),
),
CustomListTile(
settingsTile(
icon: Icons.settings,
title: AppLocalizations.of(context)!.generalSettings,
subtitle: AppLocalizations.of(context)!.generalSettingsDescription,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const GeneralSettings()
)
)
},
thisItem: 10,
screenToNavigate: const GeneralSettings(),
),
CustomListTile(
settingsTile(
icon: Icons.build_outlined,
title: AppLocalizations.of(context)!.advancedSettings,
subtitle: AppLocalizations.of(context)!.advancedSetupDescription,
onTap: () => {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => const AdvancedSettings()
)
)
},
thisItem: 11,
screenToNavigate: const AdvancedSettings(),
),
SectionLabel(label: AppLocalizations.of(context)!.aboutApp),
CustomListTile(

View file

@ -89,6 +89,10 @@ class BottomNavBar extends StatelessWidget {
if (value != 2) {
logsProvider.resetFilters();
}
// Reset settings selected screen
if (value != screens.length-1) {
appConfigProvider.setSelectedSettingsScreen(null);
}
appConfigProvider.setSelectedScreen(value);
},
);

View file

@ -0,0 +1,120 @@
import 'package:flutter/material.dart';
class CustomSettingsTile extends StatelessWidget {
final String title;
final String? subtitle;
final Widget? subtitleWidget;
final void Function()? onTap;
final IconData? icon;
final Widget? trailing;
final EdgeInsets? padding;
final int thisItem;
final int? selectedItem;
const CustomSettingsTile({
Key? key,
required this.title,
this.subtitle,
this.subtitleWidget,
this.onTap,
this.icon,
this.trailing,
this.padding,
required this.thisItem,
required this.selectedItem,
}) : super(key: key);
@override
Widget build(BuildContext context) {
final width = MediaQuery.of(context).size.width;
Widget tileBody = Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Flexible(
child: Row(
mainAxisSize: MainAxisSize.min,
children: [
if (icon != null) ...[
Icon(
icon,
size: 24,
color: Theme.of(context).listTileTheme.iconColor,
),
const SizedBox(width: 16),
],
Flexible(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
title,
style: TextStyle(
fontSize: 16,
fontWeight: FontWeight.w400,
color: Theme.of(context).colorScheme.onSurface,
),
),
if (subtitle != null || subtitleWidget != null) ...[
const SizedBox(height: 5),
if (subtitle == null && subtitleWidget != null) subtitleWidget!,
if (subtitle != null && subtitleWidget == null) Text(
subtitle!,
style: TextStyle(
color: Theme.of(context).listTileTheme.textColor,
fontSize: 14,
fontWeight: FontWeight.w400
),
),
]
],
),
)
],
),
),
if (trailing != null) ...[
const SizedBox(width: 10),
trailing!
]
],
);
if (width < 700) {
return Material(
color: Colors.transparent,
child: InkWell(
onTap: onTap,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
child: tileBody,
)
),
);
}
else {
return Padding(
padding: const EdgeInsets.symmetric(horizontal: 12),
child: Material(
color: Colors.transparent,
borderRadius: BorderRadius.circular(28),
child: InkWell(
borderRadius: BorderRadius.circular(28),
onTap: onTap,
child: Container(
width: double.maxFinite,
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(28),
color: thisItem == selectedItem
? Theme.of(context).colorScheme.primaryContainer
: null
),
child: tileBody
),
),
),
);
}
}
}

View file

@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/providers/logs_provider.dart';
import 'package:adguard_home_manager/config/app_screens.dart';
import 'package:adguard_home_manager/models/app_screen.dart';
import 'package:adguard_home_manager/providers/app_config_provider.dart';
@ -14,6 +15,7 @@ class SideNavigationRail extends StatelessWidget {
Widget build(BuildContext context) {
final serversProvider = Provider.of<ServersProvider>(context);
final appConfigProvider = Provider.of<AppConfigProvider>(context);
final logsProvider = Provider.of<LogsProvider>(context);
List<AppScreen> screens = serversProvider.selectedServer != null
? screensServerConnected
@ -56,6 +58,18 @@ class SideNavigationRail extends StatelessWidget {
label: Text(translatedName(screen.name))
)).toList(),
onDestinationSelected: (value) {
// Reset clients tab to 0 when changing screen
if (value != 1) {
appConfigProvider.setSelectedClientsTab(0);
}
// Reset logs filters when changing screen
if (value != 2) {
logsProvider.resetFilters();
}
// Reset settings selected screen
if (value != screens.length-1) {
appConfigProvider.setSelectedSettingsScreen(null);
}
appConfigProvider.setSelectedScreen(value);
},
labelType: NavigationRailLabelType.all,

View file

@ -23,9 +23,17 @@ class DeleteModal extends StatelessWidget {
final appConfigProvider = Provider.of<AppConfigProvider>(context);
void removeServer() async {
final previouslySelectedServer = serversProvider.selectedServer;
final deleted = await serversProvider.removeServer(serverToDelete);
Navigator.pop(context);
if (deleted == true) {
if (previouslySelectedServer != null && previouslySelectedServer.id == serverToDelete.id) {
appConfigProvider.setSelectedScreen(0);
}
showSnacbkar(
context: context,
appConfigProvider: appConfigProvider,

View file

@ -291,6 +291,14 @@ packages:
url: "https://pub.dev"
source: hosted
version: "2.2.17"
flutter_split_view:
dependency: "direct main"
description:
name: flutter_split_view
sha256: "0fb1f3aa6a6f2031d936ae5596fc5178affacdc7d793b27cdbc191a1ae8e56bf"
url: "https://pub.dev"
source: hosted
version: "0.1.2"
flutter_svg:
dependency: "direct main"
description:

View file

@ -60,6 +60,7 @@ dependencies:
git:
url: https://github.com/google/flutter-desktop-embedding
path: plugins/window_size
flutter_split_view: ^0.1.2
dev_dependencies:
flutter_test: