From 1be51a666b2465774d68fb4baf439074b77029a3 Mon Sep 17 00:00:00 2001 From: julian Date: Thu, 2 May 2024 11:32:02 -0600 Subject: [PATCH] frost initiate tx signing screen ui polish --- .../send_steps/frost_send_step_1a.dart | 79 +++++++--- lib/widgets/detail_item.dart | 137 +++++++++++------- lib/widgets/frost_step_user_steps.dart | 38 +++-- 3 files changed, 168 insertions(+), 86 deletions(-) diff --git a/lib/pages/send_view/frost_ms/send_steps/frost_send_step_1a.dart b/lib/pages/send_view/frost_ms/send_steps/frost_send_step_1a.dart index fd83a05a0..0a026f02d 100644 --- a/lib/pages/send_view/frost_ms/send_steps/frost_send_step_1a.dart +++ b/lib/pages/send_view/frost_ms/send_steps/frost_send_step_1a.dart @@ -10,6 +10,7 @@ import 'package:stackwallet/utilities/logger.dart'; import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/wallets/wallet/impl/bitcoin_frost_wallet.dart'; +import 'package:stackwallet/widgets/custom_buttons/checkbox_text_button.dart'; import 'package:stackwallet/widgets/custom_buttons/simple_copy_button.dart'; import 'package:stackwallet/widgets/desktop/primary_button.dart'; import 'package:stackwallet/widgets/detail_item.dart'; @@ -34,6 +35,9 @@ class _FrostSendStep1aState extends ConsumerState { "Check the box and press “Attempt sign”.", ]; + late final int _threshold; + + bool _userVerifyContinue = false; bool _attemptSignLock = false; Future _attemptSign() async { @@ -71,10 +75,20 @@ class _FrostSendStep1aState extends ConsumerState { } } + @override + void initState() { + final wallet = ref.read(pWallets).getWallet( + ref.read(pFrostScaffoldArgs)!.walletId!, + ) as BitcoinFrostWallet; + + _threshold = wallet.frostInfo.threshold; + super.initState(); + } + @override Widget build(BuildContext context) { final double qrImageSize = - Util.isDesktop ? 360 : MediaQuery.of(context).size.width - 32; + Util.isDesktop ? 360 : MediaQuery.of(context).size.width / 1.67; return Padding( padding: const EdgeInsets.all(16), @@ -120,23 +134,26 @@ class _FrostSendStep1aState extends ConsumerState { ], ), for (int i = 0; i < steps2to4.length; i++) - Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - "${i + 2}.", - style: STextStyles.w500_12(context), - ), - const SizedBox( - width: 4, - ), - Expanded( - child: Text( - steps2to4[i], + Padding( + padding: const EdgeInsets.only(top: 4), + child: Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + "${i + 2}.", style: STextStyles.w500_12(context), ), - ), - ], + const SizedBox( + width: 4, + ), + Expanded( + child: Text( + steps2to4[i], + style: STextStyles.w500_12(context), + ), + ), + ], + ), ), ], ), @@ -161,12 +178,11 @@ class _FrostSendStep1aState extends ConsumerState { ], ), ), - if (!Util.isDesktop) - const SizedBox( - height: 32, - ), + SizedBox( + height: Util.isDesktop ? 20 : 16, + ), DetailItem( - title: "Encoded config", + title: "Encoded transaction config", detail: ref.watch(pFrostTxData.state).state!.frostMSConfig!, button: Util.isDesktop ? IconCopyButton( @@ -179,12 +195,33 @@ class _FrostSendStep1aState extends ConsumerState { SizedBox( height: Util.isDesktop ? 20 : 16, ), + DetailItem( + title: "Threshold", + detail: "$_threshold signatures", + horizontal: true, + ), + SizedBox( + height: Util.isDesktop ? 20 : 16, + ), if (!Util.isDesktop) const Spacer( flex: 2, ), + CheckboxTextButton( + label: "I have verified that everyone has imported the config and " + "is ready to sign", + onChanged: (value) { + setState(() { + _userVerifyContinue = value; + }); + }, + ), + SizedBox( + height: Util.isDesktop ? 20 : 16, + ), PrimaryButton( label: "Attempt sign", + enabled: _userVerifyContinue, onPressed: () { _attemptSign(); }, diff --git a/lib/widgets/detail_item.dart b/lib/widgets/detail_item.dart index 75e0e6a1e..ee3694d0a 100644 --- a/lib/widgets/detail_item.dart +++ b/lib/widgets/detail_item.dart @@ -7,22 +7,35 @@ import 'package:stackwallet/widgets/rounded_white_container.dart'; class DetailItem extends StatelessWidget { const DetailItem({ - Key? key, + super.key, required this.title, required this.detail, this.button, + this.overrideDetailTextColor, this.showEmptyDetail = true, + this.horizontal = false, this.disableSelectableText = false, - }) : super(key: key); + }); final String title; final String detail; final Widget? button; final bool showEmptyDetail; + final bool horizontal; final bool disableSelectableText; + final Color? overrideDetailTextColor; @override Widget build(BuildContext context) { + final TextStyle detailStyle; + if (overrideDetailTextColor != null) { + detailStyle = STextStyles.w500_14(context).copyWith( + color: overrideDetailTextColor, + ); + } else { + detailStyle = STextStyles.w500_14(context); + } + return ConditionalParent( condition: !Util.isDesktop, builder: (child) => RoundedWhiteContainer( @@ -34,56 +47,80 @@ class DetailItem extends StatelessWidget { padding: const EdgeInsets.all(16), child: child, ), - child: Column( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Row( - mainAxisAlignment: MainAxisAlignment.spaceBetween, - children: [ - disableSelectableText - ? Text( - title, - style: STextStyles.itemSubtitle(context), - ) - : SelectableText( - title, - style: STextStyles.itemSubtitle(context), - ), - button ?? Container(), - ], - ), - const SizedBox( - height: 5, - ), - detail.isEmpty && showEmptyDetail - ? disableSelectableText - ? Text( - "$title will appear here", - style: STextStyles.w500_14(context).copyWith( - color: Theme.of(context) - .extension()! - .textSubtitle3, + child: horizontal + ? Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + disableSelectableText + ? Text( + title, + style: STextStyles.itemSubtitle(context), + ) + : SelectableText( + title, + style: STextStyles.itemSubtitle(context), ), - ) - : SelectableText( - "$title will appear here", - style: STextStyles.w500_14(context).copyWith( - color: Theme.of(context) - .extension()! - .textSubtitle3, + disableSelectableText + ? Text( + detail, + style: detailStyle, + ) + : SelectableText( + detail, + style: detailStyle, ), - ) - : disableSelectableText - ? Text( - detail, - style: STextStyles.w500_14(context), - ) - : SelectableText( - detail, - style: STextStyles.w500_14(context), - ), - ], - ), + ], + ) + : Column( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Row( + mainAxisAlignment: MainAxisAlignment.spaceBetween, + children: [ + disableSelectableText + ? Text( + title, + style: STextStyles.itemSubtitle(context), + ) + : SelectableText( + title, + style: STextStyles.itemSubtitle(context), + ), + button ?? Container(), + ], + ), + const SizedBox( + height: 5, + ), + detail.isEmpty && showEmptyDetail + ? disableSelectableText + ? Text( + "$title will appear here", + style: STextStyles.w500_14(context).copyWith( + color: Theme.of(context) + .extension()! + .textSubtitle3, + ), + ) + : SelectableText( + "$title will appear here", + style: STextStyles.w500_14(context).copyWith( + color: Theme.of(context) + .extension()! + .textSubtitle3, + ), + ) + : disableSelectableText + ? Text( + detail, + style: detailStyle, + ) + : SelectableText( + detail, + style: detailStyle, + ), + ], + ), ), ); } diff --git a/lib/widgets/frost_step_user_steps.dart b/lib/widgets/frost_step_user_steps.dart index 6624ef45d..729264344 100644 --- a/lib/widgets/frost_step_user_steps.dart +++ b/lib/widgets/frost_step_user_steps.dart @@ -1,5 +1,6 @@ import 'package:flutter/material.dart'; import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/widgets/conditional_parent.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart'; class FrostStepUserSteps extends StatelessWidget { @@ -13,23 +14,30 @@ class FrostStepUserSteps extends StatelessWidget { child: Column( children: [ for (int i = 0; i < userSteps.length; i++) - Row( - crossAxisAlignment: CrossAxisAlignment.start, - children: [ - Text( - "${i + 1}.", - style: STextStyles.w500_12(context), - ), - const SizedBox( - width: 4, - ), - Expanded( - child: Text( - userSteps[i], + ConditionalParent( + condition: i > 0, + builder: (child) => Padding( + padding: const EdgeInsets.only(top: 4), + child: child, + ), + child: Row( + crossAxisAlignment: CrossAxisAlignment.start, + children: [ + Text( + "${i + 1}.", style: STextStyles.w500_12(context), ), - ), - ], + const SizedBox( + width: 4, + ), + Expanded( + child: Text( + userSteps[i], + style: STextStyles.w500_12(context), + ), + ), + ], + ), ), ], ),