Merge remote-tracking branch 'origin/desktop' into desktop-testing

This commit is contained in:
julian 2022-11-12 09:52:46 -06:00
commit d8b71579e3
5 changed files with 480 additions and 43 deletions

View file

@ -0,0 +1,12 @@
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_5370_82626)">
<path d="M9.99935 18.3337C14.6017 18.3337 18.3327 14.6027 18.3327 10.0003C18.3327 5.39795 14.6017 1.66699 9.99935 1.66699C5.39698 1.66699 1.66602 5.39795 1.66602 10.0003C1.66602 14.6027 5.39698 18.3337 9.99935 18.3337Z" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M10 6.66699V13.3337" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M6.66602 10H13.3327" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
</g>
<defs>
<clipPath id="clip0_5370_82626">
<rect width="20" height="20" fill="white"/>
</clipPath>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 780 B

View file

@ -1,12 +1,15 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/models/contact.dart';
import 'package:stackwallet/providers/global/wallets_provider.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/desktop/desktop_app_bar.dart';
import 'package:stackwallet/widgets/icon_widgets/x_icon.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart';
import 'package:stackwallet/widgets/stack_text_field.dart';
import 'package:stackwallet/widgets/textfield_icon_button.dart';
@ -24,6 +27,11 @@ class _DesktopAddressBook extends ConsumerState<DesktopAddressBook> {
late final FocusNode _searchFocusNode;
List<Contact>? _cache;
List<Contact>? _cacheFav;
late bool hasContacts = false;
String filter = "";
@override
@ -49,6 +57,7 @@ class _DesktopAddressBook extends ConsumerState<DesktopAddressBook> {
return Column(
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
DesktopAppBar(
isCompactHeight: true,
@ -127,12 +136,81 @@ class _DesktopAddressBook extends ConsumerState<DesktopAddressBook> {
),
),
),
const SizedBox(width: 20),
TextButton(
style: Theme.of(context)
.extension<StackColors>()!
.getDesktopMenuButtonColorSelected(context),
onPressed: () {},
child: SizedBox(
width: 200,
height: 56,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 10),
child: SvgPicture.asset(Assets.svg.filter),
),
Text(
"Filter",
style: STextStyles.desktopTextExtraExtraSmall(context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark,
),
),
],
),
),
),
const SizedBox(width: 20),
TextButton(
style: Theme.of(context)
.extension<StackColors>()!
.getPrimaryEnabledButtonColor(context),
onPressed: () {},
child: SizedBox(
width: 200,
height: 56,
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 10),
child: SvgPicture.asset(Assets.svg.circlePlus),
),
Text(
"Add new",
style: STextStyles.desktopTextExtraExtraSmall(context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.popupBG,
),
),
],
),
),
),
],
),
),
// Expanded(
// child: hasWallets ? const MyWallets() : const EmptyWallets(),
// ),
Padding(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 26),
child: SizedBox(
width: 489,
child: RoundedWhiteContainer(
child: Center(
child: Text(
"Your contacts will appear here",
style: STextStyles.itemSubtitle(context),
),
),
),
),
),
],
);
}

View file

@ -2,11 +2,15 @@ import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/svg.dart';
import 'package:stackwallet/pages_desktop_specific/home/settings_menu/backup_and_restore/enable_backup_dialog.dart';
import 'package:stackwallet/utilities/assets.dart';
import 'package:stackwallet/utilities/constants.dart';
import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/theme/stack_colors.dart';
import 'package:stackwallet/widgets/desktop/primary_button.dart';
import 'package:stackwallet/widgets/progress_bar.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart';
import 'package:stackwallet/widgets/stack_text_field.dart';
import 'package:zxcvbn/zxcvbn.dart';
class SecuritySettings extends ConsumerStatefulWidget {
const SecuritySettings({Key? key}) : super(key: key);
@ -18,21 +22,55 @@ class SecuritySettings extends ConsumerStatefulWidget {
}
class _SecuritySettings extends ConsumerState<SecuritySettings> {
Future<void> enableAutoBackup() async {
// wait for keyboard to disappear
FocusScope.of(context).unfocus();
await Future<void>.delayed(
const Duration(milliseconds: 100),
);
late bool changePassword = false;
await showDialog<dynamic>(
context: context,
useSafeArea: false,
barrierDismissible: true,
builder: (context) {
return EnableBackupDialog();
},
);
late final TextEditingController passwordCurrentController;
late final TextEditingController passwordController;
late final TextEditingController passwordRepeatController;
late final FocusNode passwordCurrentFocusNode;
late final FocusNode passwordFocusNode;
late final FocusNode passwordRepeatFocusNode;
final zxcvbn = Zxcvbn();
bool hidePassword = true;
bool shouldShowPasswordHint = true;
double passwordStrength = 0.0;
bool get shouldEnableSave {
return passwordCurrentController.text.isNotEmpty &&
passwordController.text.isNotEmpty &&
passwordRepeatController.text.isNotEmpty;
}
String passwordFeedback =
"Add another word or two. Uncommon words are better. Use a few words, avoid common phrases. No need for symbols, digits, or uppercase letters.";
@override
void initState() {
passwordCurrentController = TextEditingController();
passwordController = TextEditingController();
passwordRepeatController = TextEditingController();
passwordCurrentFocusNode = FocusNode();
passwordFocusNode = FocusNode();
passwordRepeatFocusNode = FocusNode();
super.initState();
}
@override
void dispose() {
passwordCurrentController.dispose();
passwordController.dispose();
passwordRepeatController.dispose();
passwordCurrentFocusNode.dispose();
passwordFocusNode.dispose();
passwordRepeatFocusNode.dispose();
super.dispose();
}
@override
@ -78,12 +116,341 @@ class _SecuritySettings extends ConsumerState<SecuritySettings> {
),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: const [
children: [
Padding(
padding: EdgeInsets.all(
10,
),
child: NewPasswordButton(),
child: changePassword
? SizedBox(
width: 512,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
"Current password",
style:
STextStyles.desktopTextExtraExtraSmall(
context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark3),
textAlign: TextAlign.left,
),
const SizedBox(height: 10),
ClipRRect(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
child: TextField(
key: const Key(
"desktopSecurityRestoreFromFilePasswordFieldKey"),
focusNode: passwordCurrentFocusNode,
controller: passwordCurrentController,
style: STextStyles.field(context),
obscureText: hidePassword,
enableSuggestions: false,
autocorrect: false,
decoration: standardInputDecoration(
"Enter current password",
passwordCurrentFocusNode,
context,
).copyWith(
labelStyle:
STextStyles.fieldLabel(context),
suffixIcon: UnconstrainedBox(
child: Row(
children: [
const SizedBox(
width: 16,
),
GestureDetector(
key: const Key(
"desktopSecurityRestoreFromFilePasswordFieldShowPasswordButtonKey"),
onTap: () async {
setState(() {
hidePassword =
!hidePassword;
});
},
child: SvgPicture.asset(
hidePassword
? Assets.svg.eye
: Assets.svg.eyeSlash,
color: Theme.of(context)
.extension<StackColors>()!
.textDark3,
width: 16,
height: 16,
),
),
const SizedBox(
width: 12,
),
],
),
),
),
onChanged: (newValue) {},
),
),
const SizedBox(height: 16),
Text(
"New password",
style:
STextStyles.desktopTextExtraExtraSmall(
context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark3),
textAlign: TextAlign.left,
),
const SizedBox(height: 10),
ClipRRect(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
child: TextField(
key: const Key(
"desktopSecurityCreateNewPasswordFieldKey1"),
focusNode: passwordFocusNode,
controller: passwordController,
style: STextStyles.field(context),
obscureText: hidePassword,
enableSuggestions: false,
autocorrect: false,
decoration: standardInputDecoration(
"Enter new password",
passwordFocusNode,
context,
).copyWith(
labelStyle:
STextStyles.fieldLabel(context),
suffixIcon: UnconstrainedBox(
child: Row(
children: [
const SizedBox(
width: 16,
),
GestureDetector(
key: const Key(
"desktopSecurityCreateNewPasswordButtonKey1"),
onTap: () async {
setState(() {
hidePassword =
!hidePassword;
});
},
child: SvgPicture.asset(
hidePassword
? Assets.svg.eye
: Assets.svg.eyeSlash,
color: Theme.of(context)
.extension<StackColors>()!
.textDark3,
width: 16,
height: 16,
),
),
const SizedBox(
width: 12,
),
],
),
),
),
onChanged: (newValue) {
if (newValue.isEmpty) {
setState(() {
passwordFeedback = "";
});
return;
}
final result =
zxcvbn.evaluate(newValue);
String suggestionsAndTips = "";
for (var sug in result
.feedback.suggestions!
.toSet()) {
suggestionsAndTips += "$sug\n";
}
suggestionsAndTips +=
result.feedback.warning!;
String feedback =
// "Password Strength: ${((result.score! / 4.0) * 100).toInt()}%\n"
suggestionsAndTips;
passwordStrength = result.score! / 4;
// hack fix to format back string returned from zxcvbn
if (feedback
.contains("phrasesNo need")) {
feedback = feedback.replaceFirst(
"phrasesNo need",
"phrases\nNo need");
}
if (feedback.endsWith("\n")) {
feedback = feedback.substring(
0, feedback.length - 2);
}
setState(() {
passwordFeedback = feedback;
});
},
),
),
if (passwordFocusNode.hasFocus ||
passwordRepeatFocusNode.hasFocus ||
passwordController.text.isNotEmpty)
Padding(
padding: EdgeInsets.only(
left: 12,
right: 12,
top:
passwordFeedback.isNotEmpty ? 4 : 0,
),
child: passwordFeedback.isNotEmpty
? Text(
passwordFeedback,
style: STextStyles.infoSmall(
context),
)
: null,
),
if (passwordFocusNode.hasFocus ||
passwordRepeatFocusNode.hasFocus ||
passwordController.text.isNotEmpty)
Padding(
padding: const EdgeInsets.only(
left: 12,
right: 12,
top: 10,
),
child: ProgressBar(
key: const Key(
"desktopSecurityCreateStackBackUpProgressBar"),
width: 450,
height: 5,
fillColor: passwordStrength < 0.51
? Theme.of(context)
.extension<StackColors>()!
.accentColorRed
: passwordStrength < 1
? Theme.of(context)
.extension<StackColors>()!
.accentColorYellow
: Theme.of(context)
.extension<StackColors>()!
.accentColorGreen,
backgroundColor: Theme.of(context)
.extension<StackColors>()!
.buttonBackSecondary,
percent: passwordStrength < 0.25
? 0.03
: passwordStrength,
),
),
const SizedBox(height: 16),
Text(
"Confirm new password",
style:
STextStyles.desktopTextExtraExtraSmall(
context)
.copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textDark3),
textAlign: TextAlign.left,
),
const SizedBox(height: 10),
ClipRRect(
borderRadius: BorderRadius.circular(
Constants.size.circularBorderRadius,
),
child: TextField(
key: const Key(
"desktopSecurityCreateNewPasswordFieldKey2"),
focusNode: passwordRepeatFocusNode,
controller: passwordRepeatController,
style: STextStyles.field(context),
obscureText: hidePassword,
enableSuggestions: false,
autocorrect: false,
decoration: standardInputDecoration(
"Confirm new password",
passwordRepeatFocusNode,
context,
).copyWith(
labelStyle:
STextStyles.fieldLabel(context),
suffixIcon: UnconstrainedBox(
child: Row(
children: [
const SizedBox(
width: 16,
),
GestureDetector(
key: const Key(
"desktopSecurityCreateNewPasswordButtonKey2"),
onTap: () async {
setState(() {
hidePassword =
!hidePassword;
});
},
child: SvgPicture.asset(
hidePassword
? Assets.svg.eye
: Assets.svg.eyeSlash,
color: Theme.of(context)
.extension<StackColors>()!
.textDark3,
width: 16,
height: 16,
),
),
const SizedBox(
width: 12,
),
],
),
),
),
onChanged: (newValue) {
setState(() {});
},
),
),
const SizedBox(height: 20),
PrimaryButton(
width: 142,
desktopMed: true,
enabled: shouldEnableSave,
label: "Save changes",
onPressed: () {
setState(() {
changePassword = false;
});
},
)
],
),
)
: PrimaryButton(
width: 192,
desktopMed: true,
enabled: true,
label: "Set up new password",
onPressed: () {
setState(() {
changePassword = true;
});
},
),
),
],
),
@ -110,29 +477,7 @@ class NewPasswordButton extends ConsumerWidget {
style: Theme.of(context)
.extension<StackColors>()!
.getPrimaryEnabledButtonColor(context),
onPressed: () {
// Expandable(
// header: Row(
// mainAxisAlignment: MainAxisAlignment.start,
// children: [
// NewPasswordButton(),
// ],
// ),
// body: Column(
// mainAxisAlignment: MainAxisAlignment.start,
// children: [
// Text(
// "Current Password",
// style: STextStyles.desktopTextExtraSmall(context).copyWith(
// color:
// Theme.of(context).extension<StackColors>()!.textDark3,
// ),
// textAlign: TextAlign.left,
// ),
// ],
// ),
// );
},
onPressed: () {},
child: Text(
"Set up new password",
style: STextStyles.button(context),

View file

@ -59,6 +59,7 @@ class _SVG {
String txExchangeFailed(BuildContext context) =>
"assets/svg/${Theme.of(context).extension<StackColors>()!.themeType.name}/tx-exchange-icon-failed.svg";
String get circlePlus => "assets/svg/plus-circle.svg";
String get framedGear => "assets/svg/framed-gear.svg";
String get framedAddressBook => "assets/svg/framed-address-book.svg";
String get themeLight => "assets/svg/light/light-mode.svg";

View file

@ -314,6 +314,7 @@ flutter:
- assets/svg/exit-desktop.svg
- assets/svg/keys.svg
- assets/svg/arrow-down.svg
- assets/svg/plus-circle.svg
# coin icons
- assets/svg/coin_icons/Bitcoin.svg
- assets/svg/coin_icons/Litecoin.svg