From 94bd4289881f7fedb05a6acb773f54f690d62fe9 Mon Sep 17 00:00:00 2001 From: Inex Code Date: Thu, 14 Nov 2024 20:49:26 +0300 Subject: [PATCH] refactor(ui): Refactor the CreateBackupsModal --- .../create_backup_checkbox_item.dart | 80 +++++++++++++++++ .../pages/backups/create_backups_modal.dart | 85 +++++-------------- 2 files changed, 100 insertions(+), 65 deletions(-) create mode 100644 lib/ui/molecules/list_items/create_backup_checkbox_item.dart diff --git a/lib/ui/molecules/list_items/create_backup_checkbox_item.dart b/lib/ui/molecules/list_items/create_backup_checkbox_item.dart new file mode 100644 index 00000000..fd12f723 --- /dev/null +++ b/lib/ui/molecules/list_items/create_backup_checkbox_item.dart @@ -0,0 +1,80 @@ +import 'package:easy_localization/easy_localization.dart'; +import 'package:flutter/material.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:selfprivacy/logic/bloc/server_jobs/server_jobs_bloc.dart'; +import 'package:selfprivacy/logic/bloc/volumes/volumes_bloc.dart'; +import 'package:selfprivacy/logic/models/service.dart'; + +class CreateBackupCheckboxItem extends StatelessWidget { + const CreateBackupCheckboxItem({ + required this.service, + required this.busy, + required this.selected, + required this.onChanged, + super.key, + }); + + final Service service; + final bool busy; + final bool selected; + final void Function(bool?) onChanged; + + @override + Widget build(final BuildContext context) { + final List descriptionWidgets = []; + if (busy) { + descriptionWidgets.add( + Text( + 'backup.service_busy'.tr(), + ), + ); + } else { + descriptionWidgets.add( + Text( + 'service_page.uses'.tr( + namedArgs: { + 'usage': service.storageUsage.used.toString(), + 'volume': context + .read() + .state + .getVolume(service.storageUsage.volume ?? '') + .displayName, + }, + ), + style: Theme.of(context).textTheme.labelMedium?.copyWith( + color: Theme.of(context).colorScheme.onSurface, + ), + ), + ); + descriptionWidgets.add( + Text(service.backupDescription), + ); + } + return CheckboxListTile.adaptive( + onChanged: !busy ? onChanged : null, + title: Text( + service.displayName, + ), + subtitle: Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: descriptionWidgets, + ), + isThreeLine: true, + secondary: Padding( + padding: const EdgeInsets.only(top: 4.0), + child: SvgPicture.string( + service.svgIcon, + height: 24, + width: 24, + colorFilter: ColorFilter.mode( + busy + ? Theme.of(context).colorScheme.outlineVariant + : Theme.of(context).colorScheme.onSurface, + BlendMode.srcIn, + ), + ), + ), + value: selected, + ); + } +} diff --git a/lib/ui/pages/backups/create_backups_modal.dart b/lib/ui/pages/backups/create_backups_modal.dart index c17d04e4..a12b7699 100644 --- a/lib/ui/pages/backups/create_backups_modal.dart +++ b/lib/ui/pages/backups/create_backups_modal.dart @@ -1,10 +1,9 @@ import 'package:easy_localization/easy_localization.dart'; import 'package:flutter/material.dart'; -import 'package:flutter_svg/flutter_svg.dart'; import 'package:selfprivacy/logic/bloc/backups/backups_bloc.dart'; import 'package:selfprivacy/logic/bloc/server_jobs/server_jobs_bloc.dart'; -import 'package:selfprivacy/logic/bloc/volumes/volumes_bloc.dart'; import 'package:selfprivacy/logic/models/service.dart'; +import 'package:selfprivacy/ui/molecules/list_items/create_backup_checkbox_item.dart'; class CreateBackupsModal extends StatefulWidget { const CreateBackupsModal({ @@ -21,7 +20,7 @@ class CreateBackupsModal extends StatefulWidget { } class _CreateBackupsModalState extends State { - // Store in state the selected services to backup + /// Store in state the selected services to backup List selectedServices = []; // Select all services on modal open @@ -83,68 +82,24 @@ class _CreateBackupsModalState extends State { height: 1.0, ), ...widget.services.map( - (final Service service) { - final bool busy = busyServices.contains(service.id); - final List descriptionWidgets = []; - if (busy) { - descriptionWidgets.add(Text('backup.service_busy'.tr())); - } else { - descriptionWidgets.add( - Text( - 'service_page.uses'.tr( - namedArgs: { - 'usage': service.storageUsage.used.toString(), - 'volume': context - .read() - .state - .getVolume(service.storageUsage.volume ?? '') - .displayName, - }, - ), - style: Theme.of(context).textTheme.labelMedium, - ), - ); - descriptionWidgets.add( - Text(service.backupDescription), - ); - } - return CheckboxListTile.adaptive( - onChanged: !busy - ? (final bool? value) { - setState(() { - if (value ?? true) { - setState(() { - selectedServices.add(service); - }); - } else { - setState(() { - selectedServices.remove(service); - }); - } - }); - } - : null, - title: Text( - service.displayName, - ), - subtitle: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: descriptionWidgets, - ), - secondary: SvgPicture.string( - service.svgIcon, - height: 24, - width: 24, - colorFilter: ColorFilter.mode( - busy - ? Theme.of(context).colorScheme.outlineVariant - : Theme.of(context).colorScheme.onSurface, - BlendMode.srcIn, - ), - ), - value: selectedServices.contains(service), - ); - }, + (final Service service) => CreateBackupCheckboxItem( + service: service, + busy: busyServices.contains(service.id), + selected: selectedServices.contains(service), + onChanged: (final bool? value) { + setState(() { + if (value ?? true) { + setState(() { + selectedServices.add(service); + }); + } else { + setState(() { + selectedServices.remove(service); + }); + } + }); + }, + ), ), const SizedBox(height: 16), // Create backup button