SelfPrivacy/selfprivacy.org.app
1
0
Fork 0
mirror of https://git.selfprivacy.org/kherel/selfprivacy.org.app.git synced 2025-02-02 14:16:58 +00:00
Code Issues Projects Releases Wiki Activity

feat(backups): Update the UI of the encryption key modal

Browse source
This commit is contained in:
Inex Code 2023-07-25 22:25:08 +03:00
parent 3b1e71d771
commit cfcfd5d708
4 changed files with 78 additions and 48 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
assets/translations/en.json
View file

@ -198,6 +198,10 @@
"autobackup_set_period": "Set period",
"autobackup_period_set": "Period set",
"backups_encryption_key": "Encryption key",
"backups_encryption_key_subtitle": "Keep it in a safe place.",
"backups_encryption_key_copy": "Copy the encryption key",
"backups_encryption_key_show": "Show the encryption key",
"backups_encryption_key_description": "This key is used to encrypt your backups. If you lose it, you will not be able to restore your backups. Keep it in a safe place, as it will be useful if you ever need to restore from backups manually.",
"pending_jobs": "Currently running backup jobs",
"snapshots_title": "Snapshot list"
},
@ -538,4 +542,4 @@
"reset_onboarding_description": "Reset onboarding switch to show onboarding screen again",
"cubit_statuses": "Cubit loading statuses"
}
}
}

9
lib/ui/pages/backups/backup_details.dart
View file

@ -156,9 +156,9 @@ class BackupDetailsPage extends StatelessWidget {
builder: (final BuildContext context) =>
DraggableScrollableSheet(
expand: false,
maxChildSize: 0.6,
minChildSize: 0.3,
initialChildSize: 0.3,
maxChildSize: 0.9,
minChildSize: 0.5,
initialChildSize: 0.7,
builder: (final context, final scrollController) =>
CopyEncryptionKeyModal(
scrollController: scrollController,
@ -172,6 +172,9 @@ class BackupDetailsPage extends StatelessWidget {
title: Text(
'backup.backups_encryption_key'.tr(),
),
subtitle: Text(
'backup.backups_encryption_key_subtitle'.tr(),
),
),
const SizedBox(height: 16),
if (backupJobs.isNotEmpty)

3
lib/ui/pages/backups/change_period_modal.dart
View file

@ -20,9 +20,6 @@ class ChangeAutobackupsPeriodModal extends StatefulWidget {
class _ChangeAutobackupsPeriodModalState
extends State<ChangeAutobackupsPeriodModal> {
// This is a modal with radio buttons to select the autobackup period
// Period might be none, selected from predefined list or custom
// Store in state the selected period
Duration? selectedPeriod;
static const List<Duration> autobackupPeriods = [

108
lib/ui/pages/backups/copy_encryption_key_modal.dart
View file

@ -20,6 +20,7 @@ class CopyEncryptionKeyModal extends StatefulWidget {
class _CopyEncryptionKeyModalState extends State<CopyEncryptionKeyModal> {
bool isKeyVisible = false;
@override
Widget build(final BuildContext context) {
final String encryptionKey =
@ -35,52 +36,77 @@ class _CopyEncryptionKeyModalState extends State<CopyEncryptionKeyModal> {
textAlign: TextAlign.center,
),
const SizedBox(height: 8),
Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
IconButton(
icon: Icon(
isKeyVisible
? Icons.visibility_outlined
: Icons.visibility_off_outlined,
),
onPressed: () {
setState(
() {
isKeyVisible = !isKeyVisible;
},
);
},
),
IconButton(
icon: const Icon(Icons.copy_all_outlined),
onPressed: () {
getIt<NavigationService>()
.showSnackBar('basis.copied_to_clipboard'.tr());
Clipboard.setData(
ClipboardData(
text: encryptionKey,
),
);
},
),
],
Text(
'backup.backups_encryption_key_description'.tr(),
style: Theme.of(context).textTheme.bodyMedium,
textAlign: TextAlign.center,
),
Flexible(
child: isKeyVisible
? SelectableText(
const SizedBox(height: 8),
Container(
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: Theme.of(context).colorScheme.surfaceVariant,
),
padding: const EdgeInsets.all(16),
child: Stack(
children: [
SelectableText(
encryptionKey,
style: Theme.of(context).textTheme.titleMedium?.copyWith(
color: Theme.of(context).colorScheme.onBackground,
),
)
: Text(
''.padLeft(encryptionKey.length, '●'),
style: Theme.of(context).textTheme.titleMedium?.copyWith(
color: Theme.of(context).colorScheme.onBackground,
color: Theme.of(context).colorScheme.onSurfaceVariant,
),
),
Positioned.fill(
child: InkWell(
onTap: () {
setState(
() {
isKeyVisible = !isKeyVisible;
},
);
},
child: AnimatedOpacity(
duration: const Duration(milliseconds: 200),
opacity: isKeyVisible ? 0 : 1,
child: Container(
color: Theme.of(context).colorScheme.surfaceVariant,
child: Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.visibility_outlined),
const SizedBox(width: 8),
Text(
'backup.backups_encryption_key_show'.tr(),
style: Theme.of(context)
.textTheme
.bodyMedium
?.copyWith(
color: Theme.of(context)
.colorScheme
.onSurfaceVariant,
),
),
],
)),
),
),
),
],
)),
const SizedBox(height: 8),
FilledButton.icon(
onPressed: () {
getIt<NavigationService>()
.showSnackBar('basis.copied_to_clipboard'.tr());
Clipboard.setData(
ClipboardData(
text: encryptionKey,
),
);
},
icon: const Icon(Icons.copy_all_outlined),
label: Text('backup.backups_encryption_key_copy'.tr()),
),
],
);