luckyimnotanigger/adguard-home-manager
1
0
Fork 0
mirror of https://github.com/JGeek00/adguard-home-manager.git synced 2025-05-15 14:32:48 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Improved top items lists, improved menus and fixed units

Browse source
This commit is contained in:
Juan Gilsanz Polo 2023-11-26 05:21:35 +01:00
parent bc8aa3b670
commit 63d57245a7
19 changed files with 713 additions and 767 deletions
Download patch file Download diff file Expand all files Collapse all files

46
lib/screens/home/top_items/row_item.dart
View file

@ -2,12 +2,10 @@ import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/widgets/domain_options.dart';
import 'package:adguard_home_manager/widgets/options_menu.dart';
import 'package:adguard_home_manager/models/menu_option.dart';
import 'package:adguard_home_manager/constants/enums.dart';
import 'package:adguard_home_manager/models/applied_filters.dart';
import 'package:adguard_home_manager/providers/app_config_provider.dart';
import 'package:adguard_home_manager/providers/logs_provider.dart';
import 'package:adguard_home_manager/providers/status_provider.dart';
class RowItem extends StatefulWidget {
@ -18,6 +16,8 @@ class RowItem extends StatefulWidget {
final bool clients;
final bool showColor;
final String? unit;
final List<MenuOption> options;
final void Function(dynamic)? onTapEntry;
const RowItem({
super.key,
@ -27,6 +27,8 @@ class RowItem extends StatefulWidget {
required this.number,
required this.clients,
required this.showColor,
required this.options,
this.onTapEntry,
this.unit,
});
@ -80,8 +82,6 @@ class _RowItemState extends State<RowItem> with TickerProviderStateMixin {
@override
Widget build(BuildContext context) {
final statusProvider = Provider.of<StatusProvider>(context);
final appConfigProvider = Provider.of<AppConfigProvider>(context);
final logsProvider = Provider.of<LogsProvider>(context);
String? name;
if (widget.clients == true) {
@ -94,36 +94,10 @@ class _RowItemState extends State<RowItem> with TickerProviderStateMixin {
return Material(
color: Colors.transparent,
child: DomainOptions(
item: widget.domain,
isDomain: widget.type == HomeTopItems.queriedDomains || widget.type == HomeTopItems.blockedDomains,
isBlocked: widget.type == HomeTopItems.blockedDomains,
onTap: () {
if (widget.type == HomeTopItems.queriedDomains || widget.type == HomeTopItems.blockedDomains) {
logsProvider.setSearchText(widget.domain);
logsProvider.setSelectedClients(null);
logsProvider.setAppliedFilters(
AppliedFiters(
selectedResultStatus: 'all',
searchText: widget.domain,
clients: null
)
);
appConfigProvider.setSelectedScreen(2);
}
else if (widget.type == HomeTopItems.recurrentClients) {
logsProvider.setSearchText(null);
logsProvider.setSelectedClients([widget.domain]);
logsProvider.setAppliedFilters(
AppliedFiters(
selectedResultStatus: 'all',
searchText: null,
clients: [widget.domain]
)
);
appConfigProvider.setSelectedScreen(2);
}
},
child: OptionsMenu(
value: widget.domain,
options: widget.options,
onTap: widget.onTapEntry,
child: Padding(
padding: const EdgeInsets.symmetric(
horizontal: 20,

193
lib/screens/home/top_items/top_item_expansion_panel.dart
View file

@ -1,193 +0,0 @@
import 'package:flutter/material.dart';
import 'package:adguard_home_manager/widgets/custom_pie_chart.dart';
import 'package:adguard_home_manager/screens/home/top_items/row_item.dart';
import 'package:adguard_home_manager/constants/enums.dart';
class TopItemExpansionPanel extends StatefulWidget {
final HomeTopItems type;
final String label;
final List<Map<String, dynamic>> data;
final Map<String, double> chartData;
final bool withChart;
const TopItemExpansionPanel({
super.key,
required this.type,
required this.label,
required this.data,
required this.chartData,
required this.withChart
});
@override
State<TopItemExpansionPanel> createState() => _TopItemExpansionPanelState();
}
class _TopItemExpansionPanelState extends State<TopItemExpansionPanel> {
bool _showChart = true;
final colors = [
Colors.red,
Colors.green,
Colors.blue,
Colors.orange,
Colors.teal,
Colors.grey
];
@override
Widget build(BuildContext context) {
final width = MediaQuery.of(context).size.width;
if (widget.withChart == true) {
return Column(
children: [
ExpansionPanelList(
expandedHeaderPadding: const EdgeInsets.all(0),
elevation: 0,
expansionCallback: (_, isExpanded) => setState(() => _showChart = isExpanded),
animationDuration: const Duration(milliseconds: 250),
children: [
ExpansionPanel(
headerBuilder: (context, isExpanded) => Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Row(
mainAxisAlignment: width <= 700
? MainAxisAlignment.spaceBetween
: MainAxisAlignment.center,
children: [
Flexible(
child: Text(
widget.label,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w500,
color: Theme.of(context).colorScheme.onSurface
),
),
),
],
),
),
body: Padding(
padding: const EdgeInsets.symmetric(vertical: 16),
child: Column(
children: [
SizedBox(
height: 150,
child: CustomPieChart(
data: widget.chartData,
colors: colors
)
),
const SizedBox(height: 16),
],
),
),
isExpanded: _showChart
),
],
),
Padding(
padding: const EdgeInsets.only(top: 8),
child: _ItemsList(
colors: colors,
data: widget.data,
clients: widget.type == HomeTopItems.recurrentClients,
type: widget.type,
showChart: _showChart,
unit: widget.type == HomeTopItems.avgUpstreamResponseTime ? 'ms' : null,
),
),
if (widget.type != HomeTopItems.avgUpstreamResponseTime) OthersRowItem(
items: widget.data,
showColor: _showChart,
),
const SizedBox(height: 16),
],
);
}
else {
return Column(
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 18),
child: Row(
mainAxisAlignment: width <= 700
? MainAxisAlignment.spaceBetween
: MainAxisAlignment.center,
children: [
Flexible(
child: Text(
widget.label,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w500,
color: Theme.of(context).colorScheme.onSurface
),
),
),
],
),
),
Padding(
padding: const EdgeInsets.only(top: 16),
child: _ItemsList(
colors: colors,
data: widget.data,
clients: widget.type == HomeTopItems.recurrentClients,
type: widget.type,
showChart: false,
unit: widget.type == HomeTopItems.avgUpstreamResponseTime ? 'ms' : null,
),
),
if (widget.type != HomeTopItems.avgUpstreamResponseTime) OthersRowItem(
items: widget.data,
showColor: false,
),
const SizedBox(height: 16),
],
);
}
}
}
class _ItemsList extends StatelessWidget {
final List<Color> colors;
final List<Map<String, dynamic>> data;
final bool? clients;
final HomeTopItems type;
final bool showChart;
final String? unit;
const _ItemsList({
required this.colors,
required this.data,
required this.clients,
required this.type,
required this.showChart,
this.unit,
});
@override
Widget build(BuildContext context) {
return Column(
children: data.sublist(
0, data.length > 5 ? 5 : data.length
).asMap().entries.map((e) => RowItem(
clients: clients ?? false,
domain: e.value.keys.toList()[0],
number: e.value.values.toList()[0].runtimeType == double
? "${e.value.values.toList()[0].toStringAsFixed(2)}${unit != null ? ' $unit' : ''}"
: "${e.value.values.toList()[0].toString()}${unit != null ? ' $unit' : ''}",
type: type,
chartColor: colors[e.key],
showColor: showChart,
)).toList()
);
}
}

216
lib/screens/home/top_items/top_items.dart
View file

@ -7,23 +7,34 @@ import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/screens/home/top_items/row_item.dart';
import 'package:adguard_home_manager/screens/home/top_items/top_item_expansion_panel.dart';
import 'package:adguard_home_manager/screens/top_items/top_items_modal.dart';
import 'package:adguard_home_manager/screens/top_items/top_items.dart';
import 'package:adguard_home_manager/widgets/custom_pie_chart.dart';
import 'package:adguard_home_manager/models/menu_option.dart';
import 'package:adguard_home_manager/constants/enums.dart';
import 'package:adguard_home_manager/providers/status_provider.dart';
import 'package:adguard_home_manager/providers/app_config_provider.dart';
class TopItems extends StatefulWidget {
final HomeTopItems type;
final String label;
final List<Map<String, dynamic>> data;
final bool withChart;
final bool withProgressBar;
final String Function(dynamic) buildValue;
final List<MenuOption> menuOptions;
final void Function(dynamic)? onTapEntry;
const TopItems({
super.key,
required this.type,
required this.label,
required this.data,
required this.withChart,
required this.withProgressBar,
required this.buildValue,
required this.menuOptions,
this.onTapEntry,
});
@override
@ -50,47 +61,21 @@ class _TopItemsState extends State<TopItems> {
@override
Widget build(BuildContext context) {
final statusProvider = Provider.of<StatusProvider>(context);
final width = MediaQuery.of(context).size.width;
List<Map<String, dynamic>> generateData() {
switch (widget.type) {
case HomeTopItems.queriedDomains:
return statusProvider.serverStatus!.stats.topQueriedDomains;
case HomeTopItems.blockedDomains:
return statusProvider.serverStatus!.stats.topBlockedDomains;
case HomeTopItems.recurrentClients:
return statusProvider.serverStatus!.stats.topClients;
case HomeTopItems.topUpstreams:
return statusProvider.serverStatus!.stats.topUpstreamResponses ?? [];
case HomeTopItems.avgUpstreamResponseTime:
return statusProvider.serverStatus!.stats.topUpstreamsAvgTime ?? [];
default:
return [];
}
}
final data = generateData();
final withChart = widget.type != HomeTopItems.avgUpstreamResponseTime;
Map<String, double> chartData() {
Map<String, double> values = {};
data.sublist(0, data.length > 5 ? 5 : data.length).forEach((element) {
widget.data.sublist(0, widget.data.length > 5 ? 5 : widget.data.length).forEach((element) {
values = {
...values,
element.keys.first: element.values.first.toDouble()
};
});
if (data.length > 5) {
if (widget.data.length > 5) {
final int rest = List<int>.from(
data.sublist(5, data.length).map((e) => e.values.first.toInt())
widget.data.sublist(5, widget.data.length).map((e) => e.values.first.toInt())
).reduce((a, b) => a + b);
values = {
...values,
@ -117,8 +102,8 @@ class _TopItemsState extends State<TopItems> {
return SizedBox(
child: Column(
children: [
if (data.isEmpty) noItems,
if (data.isNotEmpty && width > 700) Padding(
if (widget.data.isEmpty) noItems,
if (widget.data.isNotEmpty && width > 700) Padding(
padding: EdgeInsets.only(bottom: withChart == false ? 16 : 0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
@ -157,14 +142,16 @@ class _TopItemsState extends State<TopItems> {
),
_ItemsList(
colors: colors,
data: data,
data: widget.data,
clients: widget.type == HomeTopItems.recurrentClients,
type: widget.type,
showChart: withChart == true ? _showChart : false,
unit: widget.type == HomeTopItems.avgUpstreamResponseTime ? 'ms' : null,
buildValue: widget.buildValue,
menuOptions: widget.menuOptions,
onTapEntry: widget.onTapEntry,
),
if (withChart == true) OthersRowItem(
items: data,
items: widget.data,
showColor: true,
)
]
@ -173,15 +160,128 @@ class _TopItemsState extends State<TopItems> {
],
),
),
if (data.isNotEmpty && width <= 700) TopItemExpansionPanel(
type: widget.type,
label: widget.label,
data: data,
chartData: chartData(),
withChart: withChart
if (widget.data.isNotEmpty && width <= 700) Builder(
builder: (context) {
if (widget.withChart == true) {
return Column(
children: [
ExpansionPanelList(
expandedHeaderPadding: const EdgeInsets.all(0),
elevation: 0,
expansionCallback: (_, isExpanded) => setState(() => _showChart = isExpanded),
animationDuration: const Duration(milliseconds: 250),
children: [
ExpansionPanel(
headerBuilder: (context, isExpanded) => Padding(
padding: const EdgeInsets.symmetric(horizontal: 20),
child: Row(
mainAxisAlignment: width <= 700
? MainAxisAlignment.spaceBetween
: MainAxisAlignment.center,
children: [
Flexible(
child: Text(
widget.label,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w500,
color: Theme.of(context).colorScheme.onSurface
),
),
),
],
),
),
body: Padding(
padding: const EdgeInsets.symmetric(vertical: 16),
child: Column(
children: [
SizedBox(
height: 150,
child: CustomPieChart(
data: chartData(),
colors: colors
)
),
const SizedBox(height: 16),
],
),
),
isExpanded: _showChart
),
],
),
Padding(
padding: const EdgeInsets.only(top: 8),
child: _ItemsList(
colors: colors,
data: widget.data,
clients: widget.type == HomeTopItems.recurrentClients,
type: widget.type,
showChart: _showChart,
buildValue: widget.buildValue,
menuOptions: widget.menuOptions,
onTapEntry: widget.onTapEntry,
),
),
if (widget.withChart == true) OthersRowItem(
items: widget.data,
showColor: _showChart,
),
const SizedBox(height: 16),
],
);
}
else {
return Column(
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 18),
child: Row(
mainAxisAlignment: width <= 700
? MainAxisAlignment.spaceBetween
: MainAxisAlignment.center,
children: [
Flexible(
child: Text(
widget.label,
overflow: TextOverflow.ellipsis,
style: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w500,
color: Theme.of(context).colorScheme.onSurface
),
),
),
],
),
),
Padding(
padding: const EdgeInsets.only(top: 16),
child: _ItemsList(
colors: colors,
data: widget.data,
clients: widget.type == HomeTopItems.recurrentClients,
type: widget.type,
showChart: false,
buildValue: widget.buildValue,
menuOptions: widget.menuOptions,
onTapEntry: widget.onTapEntry,
),
),
if (widget.withChart == true) OthersRowItem(
items: widget.data,
showColor: false,
),
const SizedBox(height: 16),
],
);
}
},
),
if (data.length > 5) ...[
if (widget.data.length > 5) ...[
Padding(
padding: const EdgeInsets.only(right: 20),
child: Row(
@ -197,9 +297,11 @@ class _TopItemsState extends State<TopItems> {
type: widget.type,
title: widget.label,
isClient: widget.type == HomeTopItems.recurrentClients,
data: generateData(),
withProgressBar: widget.type != HomeTopItems.avgUpstreamResponseTime,
unit: widget.type == HomeTopItems.avgUpstreamResponseTime ? 'ms' : null,
data: widget.data,
withProgressBar: widget.withProgressBar,
buildValue: widget.buildValue,
options: widget.menuOptions,
onTapEntry: widget.onTapEntry,
)
)
}
@ -210,9 +312,11 @@ class _TopItemsState extends State<TopItems> {
type: widget.type,
title: widget.label,
isClient: widget.type == HomeTopItems.recurrentClients,
data: generateData(),
withProgressBar: widget.type != HomeTopItems.avgUpstreamResponseTime,
unit: widget.type == HomeTopItems.avgUpstreamResponseTime ? 'ms' : null,
data: widget.data,
withProgressBar: widget.withProgressBar,
buildValue: widget.buildValue,
menuOptions: widget.menuOptions,
onTapEntry: widget.onTapEntry,
)
)
)
@ -247,7 +351,9 @@ class _ItemsList extends StatelessWidget {
final bool? clients;
final HomeTopItems type;
final bool showChart;
final String? unit;
final String Function(dynamic) buildValue;
final List<MenuOption> menuOptions;
final void Function(dynamic)? onTapEntry;
const _ItemsList({
required this.colors,
@ -255,7 +361,9 @@ class _ItemsList extends StatelessWidget {
required this.clients,
required this.type,
required this.showChart,
this.unit,
required this.buildValue,
required this.menuOptions,
this.onTapEntry,
});
@override
@ -266,12 +374,12 @@ class _ItemsList extends StatelessWidget {
).asMap().entries.map((e) => RowItem(
clients: clients ?? false,
domain: e.value.keys.toList()[0],
number: e.value.values.toList()[0].runtimeType == double
? "${e.value.values.toList()[0].toStringAsFixed(2)}${unit != null ? ' $unit' : ''}"
: "${e.value.values.toList()[0].toString()}${unit != null ? ' $unit' : ''}",
number: buildValue(e.value.values.toList()[0]),
type: type,
chartColor: colors[e.key],
showColor: showChart,
options: menuOptions,
onTapEntry: onTapEntry,
)).toList()
);
}

239
lib/screens/home/top_items/top_items_lists.dart Normal file
View file

@ -0,0 +1,239 @@
import 'dart:io';
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';
import 'package:adguard_home_manager/screens/home/top_items/top_items.dart';
import 'package:adguard_home_manager/functions/number_format.dart';
import 'package:adguard_home_manager/functions/snackbar.dart';
import 'package:adguard_home_manager/classes/process_modal.dart';
import 'package:adguard_home_manager/models/applied_filters.dart';
import 'package:adguard_home_manager/providers/app_config_provider.dart';
import 'package:adguard_home_manager/providers/logs_provider.dart';
import 'package:adguard_home_manager/functions/copy_clipboard.dart';
import 'package:adguard_home_manager/models/menu_option.dart';
import 'package:adguard_home_manager/providers/status_provider.dart';
import 'package:adguard_home_manager/constants/enums.dart';
class TopItemsLists extends StatelessWidget {
final List<HomeTopItems> order;
const TopItemsLists({
super.key,
required this.order,
});
@override
Widget build(BuildContext context) {
final statusProvider = Provider.of<StatusProvider>(context);
final appConfigProvider = Provider.of<AppConfigProvider>(context);
final logsProvider = Provider.of<LogsProvider>(context);
List<Widget> bottom = [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Divider(
thickness: 1,
color: Theme.of(context).colorScheme.onSurface.withOpacity(0.2),
),
),
const SizedBox(height: 16),
];
void filterDomainLogs({required String value}) {
logsProvider.setSearchText(value);
logsProvider.setSelectedClients(null);
logsProvider.setAppliedFilters(
AppliedFiters(
selectedResultStatus: 'all',
searchText: value,
clients: null
)
);
appConfigProvider.setSelectedScreen(2);
}
void filterClientLogs({required String value}) {
logsProvider.setSearchText(null);
logsProvider.setSelectedClients([value]);
logsProvider.setAppliedFilters(
AppliedFiters(
selectedResultStatus: 'all',
searchText: null,
clients: [value]
)
);
appConfigProvider.setSelectedScreen(2);
}
void blockUnblock({required String domain, required String newStatus}) async {
final ProcessModal processModal = ProcessModal();
processModal.open(AppLocalizations.of(context)!.savingUserFilters);
final rules = await statusProvider.blockUnblockDomain(
domain: domain,
newStatus: newStatus
);
processModal.close();
if (!context.mounted) return;
if (rules == true) {
showSnacbkar(
appConfigProvider: appConfigProvider,
label: AppLocalizations.of(context)!.userFilteringRulesUpdated,
color: Colors.green
);
}
else {
showSnacbkar(
appConfigProvider: appConfigProvider,
label: AppLocalizations.of(context)!.userFilteringRulesNotUpdated,
color: Colors.red
);
}
}
void copyValueClipboard(value) {
copyToClipboard(value: value, successMessage: AppLocalizations.of(context)!.copiedClipboard);
}
return Column(
children: order.asMap().entries.map((item) {
switch (item.value) {
case HomeTopItems.queriedDomains:
return Column(
children: [
TopItems(
label: AppLocalizations.of(context)!.topQueriedDomains,
type: HomeTopItems.queriedDomains,
data: statusProvider.serverStatus?.stats.topQueriedDomains ?? [],
withChart: true,
withProgressBar: true,
buildValue: (v) => v.toString(),
menuOptions: [
MenuOption(
title: AppLocalizations.of(context)!.blockDomain,
icon: Icons.block_rounded,
action: (v) => blockUnblock(domain: v.toString(), newStatus: 'block')
),
MenuOption(
title: AppLocalizations.of(context)!.copyClipboard,
icon: Icons.copy_rounded,
action: copyValueClipboard
),
],
onTapEntry: (v) => filterDomainLogs(value: v.toString()),
),
if (item.key < order.length - 1) ...bottom
],
);
case HomeTopItems.blockedDomains:
return Column(
children: [
TopItems(
label: AppLocalizations.of(context)!.topBlockedDomains,
type: HomeTopItems.blockedDomains,
data: statusProvider.serverStatus?.stats.topBlockedDomains ?? [],
withChart: true,
withProgressBar: true,
buildValue: (v) => v.toString(),
menuOptions: [
MenuOption(
title: AppLocalizations.of(context)!.unblockDomain,
icon: Icons.check_rounded,
action: (v) => blockUnblock(domain: v, newStatus: 'unblock')
),
MenuOption(
title: AppLocalizations.of(context)!.copyClipboard,
icon: Icons.copy_rounded,
action: copyValueClipboard
)
],
onTapEntry: (v) => filterDomainLogs(value: v),
),
if (item.key < order.length - 1) ...bottom
],
);
case HomeTopItems.recurrentClients:
return Column(
children: [
TopItems(
label: AppLocalizations.of(context)!.topClients,
type: HomeTopItems.recurrentClients,
data: statusProvider.serverStatus?.stats.topClients ?? [],
withChart: true,
withProgressBar: true,
buildValue: (v) => v.toString(),
menuOptions: [
MenuOption(
title: AppLocalizations.of(context)!.copyClipboard,
icon: Icons.copy_rounded,
action: copyValueClipboard
)
],
onTapEntry: (v) => filterClientLogs(value: v),
),
if (item.key < order.length - 1) ...bottom
],
);
case HomeTopItems.topUpstreams:
return statusProvider.serverStatus!.stats.topUpstreamResponses != null
? Column(
children: [
TopItems(
label: AppLocalizations.of(context)!.topUpstreams,
type: HomeTopItems.topUpstreams,
data: statusProvider.serverStatus?.stats.topUpstreamResponses ?? [],
withChart: true,
withProgressBar: true,
buildValue: (v) => v.toString(),
menuOptions: [
MenuOption(
title: AppLocalizations.of(context)!.copyClipboard,
icon: Icons.copy_rounded,
action: copyValueClipboard
)
],
),
if (item.key < order.length - 1) ...bottom
],
)
: const SizedBox();
case HomeTopItems.avgUpstreamResponseTime:
return statusProvider.serverStatus!.stats.topUpstreamsAvgTime != null
? Column(
children: [
TopItems(
label: AppLocalizations.of(context)!.averageUpstreamResponseTime,
type: HomeTopItems.avgUpstreamResponseTime,
data: statusProvider.serverStatus?.stats.topUpstreamsAvgTime ?? [],
withChart: false,
withProgressBar: false,
buildValue: (v) => "${doubleFormat(v*1000, Platform.localeName)} ms",
menuOptions: [
MenuOption(
title: AppLocalizations.of(context)!.copyClipboard,
icon: Icons.copy_rounded,
action: copyValueClipboard
)
],
),
if (item.key < order.length - 1) ...bottom
],
)
: const SizedBox();
default:
return const SizedBox();
}
}).toList(),
);
}
}