GitLab/fluffychat
2
0
Fork 0
mirror of https://gitlab.com/famedly/fluffychat.git synced 2025-01-11 10:12:49 +01:00
Code Issues Projects Releases Wiki Activity

feat: Nicer chat backup design

Browse Source
This commit is contained in:
Krille Fear 2021-10-10 11:40:08 +02:00
parent 849a3d95e4
commit 0433d8cf81
4 changed files with 145 additions and 109 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/backup.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.7 KiB

4
assets/l10n/intl_en.arb
View File

@ -398,11 +398,15 @@
"type": "text", "type": "text",
"placeholders": {} "placeholders": {}
}, },
"setupChatBackup": "Set up chat backup",
"iWroteDownTheKey": "I wrote down the key",
"yourChatBackupHasBeenSetUp": "Your chat backup has been set up.",
"chatBackup": "Chat backup", "chatBackup": "Chat backup",
"@chatBackup": { "@chatBackup": {
"type": "text", "type": "text",
"placeholders": {} "placeholders": {}
}, },
"setupChatBackupDescription": "To protect your messages, we have generated a security key for you. Please keep this in a safe place, such as a password manager.",
"chatBackupDescription": "Your chat backup is secured with a security key. Please make sure you don't lose it.", "chatBackupDescription": "Your chat backup is secured with a security key. Please make sure you don't lose it.",
"@chatBackupDescription": { "@chatBackupDescription": {
"type": "text", "type": "text",

248
lib/pages/bootstrap_dialog.dart
View File

@ -1,6 +1,4 @@
import 'package:adaptive_dialog/adaptive_dialog.dart'; import 'package:adaptive_dialog/adaptive_dialog.dart';
import 'package:fluffychat/config/setting_keys.dart';
import 'package:fluffychat/utils/matrix_sdk_extensions.dart/flutter_matrix_hive_database.dart';
import 'package:matrix/encryption.dart'; import 'package:matrix/encryption.dart';
import 'package:matrix/encryption/utils/bootstrap.dart'; import 'package:matrix/encryption/utils/bootstrap.dart';
import 'package:matrix/matrix.dart'; import 'package:matrix/matrix.dart';
@ -67,12 +65,6 @@ class _BootstrapDialogState extends State<BootstrapDialog> {
}); });
} }
void cancelAndDontAskAgain() async {
await (widget.client.database as FlutterMatrixHiveStore)
.put(SettingKeys.dontAskForBootstrapKey, true);
Navigator.of(context, rootNavigator: false).pop<bool>(false);
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
_wipe ??= widget.wipe; _wipe ??= widget.wipe;
@ -83,43 +75,58 @@ class _BootstrapDialogState extends State<BootstrapDialog> {
titleText = L10n.of(context).loadingPleaseWait; titleText = L10n.of(context).loadingPleaseWait;
if (bootstrap == null) { if (bootstrap == null) {
titleText = L10n.of(context).chatBackup; titleText = L10n.of(context).setupChatBackup;
body = Text(L10n.of(context).chatBackupDescription); body = Column(
mainAxisSize: MainAxisSize.min,
children: [
Image.asset('assets/backup.png', fit: BoxFit.contain),
Text(L10n.of(context).setupChatBackupDescription),
],
);
buttons.add(AdaptiveFlatButton( buttons.add(AdaptiveFlatButton(
label: L10n.of(context).next, label: L10n.of(context).next,
onPressed: () => _createBootstrap(false), onPressed: () => _createBootstrap(false),
)); ));
buttons.add(AdaptiveFlatButton(
label: L10n.of(context).dontAskAgain,
onPressed: cancelAndDontAskAgain,
textColor: Colors.red,
));
} else if (bootstrap.newSsssKey?.recoveryKey != null && } else if (bootstrap.newSsssKey?.recoveryKey != null &&
_recoveryKeyStored == false) { _recoveryKeyStored == false) {
final key = bootstrap.newSsssKey.recoveryKey; final key = bootstrap.newSsssKey.recoveryKey;
titleText = L10n.of(context).securityKey; titleText = L10n.of(context).securityKey;
body = Container( return Scaffold(
alignment: Alignment.center, appBar: AppBar(
width: 200, leading: IconButton(
height: 128, icon: Icon(Icons.close),
child: Text( onPressed: Navigator.of(context).pop,
key,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: 18,
wordSpacing: 38,
fontFamily: 'monospace',
), ),
title: Text(L10n.of(context).securityKey),
),
body: ListView(
padding: const EdgeInsets.all(16.0),
children: [
TextField(
minLines: 4,
maxLines: 4,
readOnly: true,
controller: TextEditingController(text: key),
),
const SizedBox(height: 16),
ElevatedButton.icon(
icon: Icon(Icons.copy_outlined),
label: Text(L10n.of(context).copyToClipboard),
onPressed: () => Clipboard.setData(ClipboardData(text: key)),
),
const SizedBox(height: 16),
ElevatedButton.icon(
style: ElevatedButton.styleFrom(
primary: Theme.of(context).secondaryHeaderColor,
onPrimary: Theme.of(context).primaryColor,
),
icon: Icon(Icons.check_outlined),
label: Text(L10n.of(context).iWroteDownTheKey),
onPressed: () => setState(() => _recoveryKeyStored = true),
),
],
), ),
); );
buttons.add(AdaptiveFlatButton(
label: L10n.of(context).copyToClipboard,
onPressed: () => Clipboard.setData(ClipboardData(text: key)),
));
buttons.add(AdaptiveFlatButton(
label: L10n.of(context).next,
onPressed: () => setState(() => _recoveryKeyStored = true),
));
} else { } else {
switch (bootstrap.state) { switch (bootstrap.state) {
case BootstrapState.loading: case BootstrapState.loading:
@ -151,22 +158,20 @@ class _BootstrapDialogState extends State<BootstrapDialog> {
break; break;
case BootstrapState.openExistingSsss: case BootstrapState.openExistingSsss:
_recoveryKeyStored = true; _recoveryKeyStored = true;
titleText = return Scaffold(
_recoveryKeyInputError ?? L10n.of(context).pleaseEnterSecurityKey; appBar: AppBar(
body = PlatformInfos.isCupertinoStyle leading: IconButton(
? CupertinoTextField( icon: Icon(Icons.close),
minLines: 1, onPressed: Navigator.of(context).pop,
maxLines: 1, ),
autofocus: true, title: Text(L10n.of(context).pleaseEnterSecurityKey),
autocorrect: false, ),
autofillHints: _recoveryKeyInputLoading body: ListView(
? null padding: const EdgeInsets.all(16.0),
: [AutofillHints.password], children: [
controller: _recoveryKeyTextEditingController, TextField(
) minLines: 4,
: TextField( maxLines: 4,
minLines: 1,
maxLines: 1,
autofocus: true, autofocus: true,
autocorrect: false, autocorrect: false,
autofillHints: _recoveryKeyInputLoading autofillHints: _recoveryKeyInputLoading
@ -174,63 +179,90 @@ class _BootstrapDialogState extends State<BootstrapDialog> {
: [AutofillHints.password], : [AutofillHints.password],
controller: _recoveryKeyTextEditingController, controller: _recoveryKeyTextEditingController,
decoration: InputDecoration( decoration: InputDecoration(
border: UnderlineInputBorder(), hintText: 'Abc123 Def456',
filled: false, labelText: L10n.of(context).securityKey,
hintText: L10n.of(context).securityKey, errorText: _recoveryKeyInputError,
), ),
); ),
buttons.add(AdaptiveFlatButton( const SizedBox(height: 16),
label: L10n.of(context).unlockChatBackup, ElevatedButton.icon(
onPressed: () async { icon: Icon(Icons.lock_open_outlined),
setState(() { label: Text(L10n.of(context).unlockChatBackup),
_recoveryKeyInputError = null; onPressed: () async {
_recoveryKeyInputLoading = true; setState(() {
}); _recoveryKeyInputError = null;
try { _recoveryKeyInputLoading = true;
await bootstrap.newSsssKey.unlock( });
keyOrPassphrase: _recoveryKeyTextEditingController.text, try {
); await bootstrap.newSsssKey.unlock(
await bootstrap.openExistingSsss(); keyOrPassphrase:
} catch (e, s) { _recoveryKeyTextEditingController.text,
Logs().w('Unable to unlock SSSS', e, s); );
setState(() => _recoveryKeyInputError = await bootstrap.openExistingSsss();
L10n.of(context).oopsSomethingWentWrong); } catch (e, s) {
} finally { Logs().w('Unable to unlock SSSS', e, s);
setState(() => _recoveryKeyInputLoading = false); setState(() => _recoveryKeyInputError =
} L10n.of(context).oopsSomethingWentWrong);
})); } finally {
buttons.add(AdaptiveFlatButton( setState(() => _recoveryKeyInputLoading = false);
label: L10n.of(context).transferFromAnotherDevice, }
onPressed: () async { }),
final req = await showFutureLoadingDialog( const SizedBox(height: 16),
context: context, Row(children: [
future: () => widget.client.userDeviceKeys[widget.client.userID] Expanded(child: Divider()),
.startVerification(), Padding(
); padding: const EdgeInsets.all(12.0),
if (req.error != null) return; child: Text(L10n.of(context).or),
await KeyVerificationDialog(request: req.result).show(context); ),
Navigator.of(context, rootNavigator: false).pop(); Expanded(child: Divider()),
}, ]),
)); const SizedBox(height: 16),
buttons.add(AdaptiveFlatButton( ElevatedButton.icon(
textColor: Colors.red, style: ElevatedButton.styleFrom(
label: L10n.of(context).securityKeyLost, primary: Theme.of(context).secondaryHeaderColor,
onPressed: () async { onPrimary: Theme.of(context).primaryColor,
if (OkCancelResult.ok == ),
await showOkCancelAlertDialog( icon: Icon(Icons.transfer_within_a_station_outlined),
useRootNavigator: false, label: Text(L10n.of(context).transferFromAnotherDevice),
context: context, onPressed: () async {
title: L10n.of(context).securityKeyLost, final req = await showFutureLoadingDialog(
message: L10n.of(context).wipeChatBackup, context: context,
okLabel: L10n.of(context).ok, future: () => widget
cancelLabel: L10n.of(context).cancel, .client.userDeviceKeys[widget.client.userID]
isDestructiveAction: true, .startVerification(),
)) { );
_createBootstrap(true); if (req.error != null) return;
} await KeyVerificationDialog(request: req.result)
}, .show(context);
)); Navigator.of(context, rootNavigator: false).pop();
break; },
),
const SizedBox(height: 16),
ElevatedButton.icon(
style: ElevatedButton.styleFrom(
primary: Theme.of(context).secondaryHeaderColor,
onPrimary: Colors.red,
),
icon: Icon(Icons.delete_outlined),
label: Text(L10n.of(context).securityKeyLost),
onPressed: () async {
if (OkCancelResult.ok ==
await showOkCancelAlertDialog(
useRootNavigator: false,
context: context,
title: L10n.of(context).securityKeyLost,
message: L10n.of(context).wipeChatBackup,
okLabel: L10n.of(context).ok,
cancelLabel: L10n.of(context).cancel,
isDestructiveAction: true,
)) {
_createBootstrap(true);
}
},
)
],
),
);
case BootstrapState.askWipeCrossSigning: case BootstrapState.askWipeCrossSigning:
WidgetsBinding.instance.addPostFrameCallback( WidgetsBinding.instance.addPostFrameCallback(
(_) => bootstrap.wipeCrossSigning(_wipe), (_) => bootstrap.wipeCrossSigning(_wipe),
@ -270,8 +302,8 @@ class _BootstrapDialogState extends State<BootstrapDialog> {
body = Column( body = Column(
mainAxisSize: MainAxisSize.min, mainAxisSize: MainAxisSize.min,
children: [ children: [
Icon(Icons.check_circle, color: Colors.green, size: 40), Image.asset('assets/backup.png', fit: BoxFit.contain),
Text(L10n.of(context).keysCached), Text(L10n.of(context).yourChatBackupHasBeenSetUp),
], ],
); );
buttons.add(AdaptiveFlatButton( buttons.add(AdaptiveFlatButton(

2
lib/widgets/encryption_button.dart
View File

@ -95,7 +95,7 @@ class _EncryptionButtonState extends State<EncryptionButton> {
: (allUsersValid ? Colors.green : Colors.orange); : (allUsersValid ? Colors.green : Colors.orange);
} else if (!widget.room.encrypted && } else if (!widget.room.encrypted &&
widget.room.joinRules != JoinRules.public) { widget.room.joinRules != JoinRules.public) {
color = null; color = Colors.red;
} }
return IconButton( return IconButton(
tooltip: widget.room.encrypted tooltip: widget.room.encrypted