frost initiate tx signing screen ui polish

This commit is contained in:
julian 2024-05-02 11:32:02 -06:00
parent 4b4647e02c
commit 1be51a666b
3 changed files with 168 additions and 86 deletions

View file

@ -10,6 +10,7 @@ import 'package:stackwallet/utilities/logger.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/utilities/util.dart'; import 'package:stackwallet/utilities/util.dart';
import 'package:stackwallet/wallets/wallet/impl/bitcoin_frost_wallet.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/custom_buttons/simple_copy_button.dart';
import 'package:stackwallet/widgets/desktop/primary_button.dart'; import 'package:stackwallet/widgets/desktop/primary_button.dart';
import 'package:stackwallet/widgets/detail_item.dart'; import 'package:stackwallet/widgets/detail_item.dart';
@ -34,6 +35,9 @@ class _FrostSendStep1aState extends ConsumerState<FrostSendStep1a> {
"Check the box and press “Attempt sign”.", "Check the box and press “Attempt sign”.",
]; ];
late final int _threshold;
bool _userVerifyContinue = false;
bool _attemptSignLock = false; bool _attemptSignLock = false;
Future<void> _attemptSign() async { Future<void> _attemptSign() async {
@ -71,10 +75,20 @@ class _FrostSendStep1aState extends ConsumerState<FrostSendStep1a> {
} }
} }
@override
void initState() {
final wallet = ref.read(pWallets).getWallet(
ref.read(pFrostScaffoldArgs)!.walletId!,
) as BitcoinFrostWallet;
_threshold = wallet.frostInfo.threshold;
super.initState();
}
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
final double qrImageSize = final double qrImageSize =
Util.isDesktop ? 360 : MediaQuery.of(context).size.width - 32; Util.isDesktop ? 360 : MediaQuery.of(context).size.width / 1.67;
return Padding( return Padding(
padding: const EdgeInsets.all(16), padding: const EdgeInsets.all(16),
@ -120,23 +134,26 @@ class _FrostSendStep1aState extends ConsumerState<FrostSendStep1a> {
], ],
), ),
for (int i = 0; i < steps2to4.length; i++) for (int i = 0; i < steps2to4.length; i++)
Row( Padding(
crossAxisAlignment: CrossAxisAlignment.start, padding: const EdgeInsets.only(top: 4),
children: [ child: Row(
Text( crossAxisAlignment: CrossAxisAlignment.start,
"${i + 2}.", children: [
style: STextStyles.w500_12(context), Text(
), "${i + 2}.",
const SizedBox(
width: 4,
),
Expanded(
child: Text(
steps2to4[i],
style: STextStyles.w500_12(context), 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<FrostSendStep1a> {
], ],
), ),
), ),
if (!Util.isDesktop) SizedBox(
const SizedBox( height: Util.isDesktop ? 20 : 16,
height: 32, ),
),
DetailItem( DetailItem(
title: "Encoded config", title: "Encoded transaction config",
detail: ref.watch(pFrostTxData.state).state!.frostMSConfig!, detail: ref.watch(pFrostTxData.state).state!.frostMSConfig!,
button: Util.isDesktop button: Util.isDesktop
? IconCopyButton( ? IconCopyButton(
@ -179,12 +195,33 @@ class _FrostSendStep1aState extends ConsumerState<FrostSendStep1a> {
SizedBox( SizedBox(
height: Util.isDesktop ? 20 : 16, height: Util.isDesktop ? 20 : 16,
), ),
DetailItem(
title: "Threshold",
detail: "$_threshold signatures",
horizontal: true,
),
SizedBox(
height: Util.isDesktop ? 20 : 16,
),
if (!Util.isDesktop) if (!Util.isDesktop)
const Spacer( const Spacer(
flex: 2, 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( PrimaryButton(
label: "Attempt sign", label: "Attempt sign",
enabled: _userVerifyContinue,
onPressed: () { onPressed: () {
_attemptSign(); _attemptSign();
}, },

View file

@ -7,22 +7,35 @@ import 'package:stackwallet/widgets/rounded_white_container.dart';
class DetailItem extends StatelessWidget { class DetailItem extends StatelessWidget {
const DetailItem({ const DetailItem({
Key? key, super.key,
required this.title, required this.title,
required this.detail, required this.detail,
this.button, this.button,
this.overrideDetailTextColor,
this.showEmptyDetail = true, this.showEmptyDetail = true,
this.horizontal = false,
this.disableSelectableText = false, this.disableSelectableText = false,
}) : super(key: key); });
final String title; final String title;
final String detail; final String detail;
final Widget? button; final Widget? button;
final bool showEmptyDetail; final bool showEmptyDetail;
final bool horizontal;
final bool disableSelectableText; final bool disableSelectableText;
final Color? overrideDetailTextColor;
@override @override
Widget build(BuildContext context) { 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( return ConditionalParent(
condition: !Util.isDesktop, condition: !Util.isDesktop,
builder: (child) => RoundedWhiteContainer( builder: (child) => RoundedWhiteContainer(
@ -34,56 +47,80 @@ class DetailItem extends StatelessWidget {
padding: const EdgeInsets.all(16), padding: const EdgeInsets.all(16),
child: child, child: child,
), ),
child: Column( child: horizontal
crossAxisAlignment: CrossAxisAlignment.start, ? Row(
children: [ mainAxisAlignment: MainAxisAlignment.spaceBetween,
Row( children: [
mainAxisAlignment: MainAxisAlignment.spaceBetween, disableSelectableText
children: [ ? Text(
disableSelectableText title,
? Text( style: STextStyles.itemSubtitle(context),
title, )
style: STextStyles.itemSubtitle(context), : SelectableText(
) title,
: SelectableText( style: STextStyles.itemSubtitle(context),
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<StackColors>()!
.textSubtitle3,
), ),
) disableSelectableText
: SelectableText( ? Text(
"$title will appear here", detail,
style: STextStyles.w500_14(context).copyWith( style: detailStyle,
color: Theme.of(context) )
.extension<StackColors>()! : SelectableText(
.textSubtitle3, detail,
style: detailStyle,
), ),
) ],
: disableSelectableText )
? Text( : Column(
detail, crossAxisAlignment: CrossAxisAlignment.start,
style: STextStyles.w500_14(context), children: [
) Row(
: SelectableText( mainAxisAlignment: MainAxisAlignment.spaceBetween,
detail, children: [
style: STextStyles.w500_14(context), 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<StackColors>()!
.textSubtitle3,
),
)
: SelectableText(
"$title will appear here",
style: STextStyles.w500_14(context).copyWith(
color: Theme.of(context)
.extension<StackColors>()!
.textSubtitle3,
),
)
: disableSelectableText
? Text(
detail,
style: detailStyle,
)
: SelectableText(
detail,
style: detailStyle,
),
],
),
), ),
); );
} }

View file

@ -1,5 +1,6 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/utilities/text_styles.dart';
import 'package:stackwallet/widgets/conditional_parent.dart';
import 'package:stackwallet/widgets/rounded_white_container.dart'; import 'package:stackwallet/widgets/rounded_white_container.dart';
class FrostStepUserSteps extends StatelessWidget { class FrostStepUserSteps extends StatelessWidget {
@ -13,23 +14,30 @@ class FrostStepUserSteps extends StatelessWidget {
child: Column( child: Column(
children: [ children: [
for (int i = 0; i < userSteps.length; i++) for (int i = 0; i < userSteps.length; i++)
Row( ConditionalParent(
crossAxisAlignment: CrossAxisAlignment.start, condition: i > 0,
children: [ builder: (child) => Padding(
Text( padding: const EdgeInsets.only(top: 4),
"${i + 1}.", child: child,
style: STextStyles.w500_12(context), ),
), child: Row(
const SizedBox( crossAxisAlignment: CrossAxisAlignment.start,
width: 4, children: [
), Text(
Expanded( "${i + 1}.",
child: Text(
userSteps[i],
style: STextStyles.w500_12(context), style: STextStyles.w500_12(context),
), ),
), const SizedBox(
], width: 4,
),
Expanded(
child: Text(
userSteps[i],
style: STextStyles.w500_12(context),
),
),
],
),
), ),
], ],
), ),