diff --git a/lib/pages/cashfusion/fusion_progress_view.dart b/lib/pages/cashfusion/fusion_progress_view.dart index c487f0465..93bb88c6e 100644 --- a/lib/pages/cashfusion/fusion_progress_view.dart +++ b/lib/pages/cashfusion/fusion_progress_view.dart @@ -9,18 +9,15 @@ */ import 'package:flutter/material.dart'; -import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/flutter_svg.dart'; -import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/sub_widgets/restoring_item_card.dart'; import 'package:stackwallet/pages_desktop_specific/cashfusion/sub_widgets/fusion_dialog.dart'; -import 'package:stackwallet/providers/cash_fusion/fusion_progress_ui_state_provider.dart'; +import 'package:stackwallet/pages_desktop_specific/cashfusion/sub_widgets/fusion_progress.dart'; import 'package:stackwallet/themes/stack_colors.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/widgets/background.dart'; import 'package:stackwallet/widgets/custom_buttons/app_bar_icon_button.dart'; import 'package:stackwallet/widgets/desktop/secondary_button.dart'; -import 'package:stackwallet/widgets/rounded_container.dart'; class FusionProgressView extends StatefulWidget { const FusionProgressView({ @@ -110,234 +107,9 @@ class _FusionProgressViewState extends State { padding: const EdgeInsets.all(16), child: Column( children: [ - RoundedContainer( - color: Theme.of(context) - .extension()! - .snackBarBackError, - child: Text( - "Do not close this window. If you exit, " - "the process will be canceled.", - style: STextStyles.w500_14(context).copyWith( - color: Theme.of(context) - .extension()! - .snackBarTextError, - ), - textAlign: TextAlign.center, - ), + FusionProgress( + walletId: widget.walletId, ), - const SizedBox( - height: 20, - ), - Consumer( - builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider( - widget.walletId) - .select((value) => value.connecting)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: Theme.of(context) - .extension()! - .popupBG, - borderColor: Theme.of(context) - .extension()! - .background, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.node, - width: 16, - height: 16, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Connecting to server", - ), - ); - }, - ), - const SizedBox( - height: 12, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(widget.walletId) - .select((value) => value.outputs)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: Theme.of(context) - .extension()! - .popupBG, - borderColor: Theme.of(context) - .extension()! - .background, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.upFromLine, - width: 18, - height: 18, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Allocating outputs", - ), - ); - }), - const SizedBox( - height: 12, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(widget.walletId) - .select((value) => value.peers)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: Theme.of(context) - .extension()! - .popupBG, - borderColor: Theme.of(context) - .extension()! - .background, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.peers, - width: 20, - height: 20, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Waiting for peers", - ), - ); - }), - const SizedBox( - height: 12, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(widget.walletId) - .select((value) => value.fusing)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: Theme.of(context) - .extension()! - .popupBG, - borderColor: Theme.of(context) - .extension()! - .background, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.fusing, - width: 20, - height: 20, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Fusing", - ), - ); - }), - const SizedBox( - height: 12, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(widget.walletId) - .select((value) => value.complete)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: Theme.of(context) - .extension()! - .popupBG, - borderColor: Theme.of(context) - .extension()! - .shadow, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.checkCircle, - width: 18, - height: 18, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Complete", - ), - ); - }), const Spacer(), const SizedBox( height: 16, diff --git a/lib/pages_desktop_specific/cashfusion/sub_widgets/fusion_dialog.dart b/lib/pages_desktop_specific/cashfusion/sub_widgets/fusion_dialog.dart index caf2bcf2b..d2e7ef34e 100644 --- a/lib/pages_desktop_specific/cashfusion/sub_widgets/fusion_dialog.dart +++ b/lib/pages_desktop_specific/cashfusion/sub_widgets/fusion_dialog.dart @@ -1,15 +1,12 @@ import 'package:flutter/material.dart'; -import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:flutter_svg/svg.dart'; -import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/sub_widgets/restoring_item_card.dart'; -import 'package:stackwallet/providers/cash_fusion/fusion_progress_ui_state_provider.dart'; +import 'package:stackwallet/pages_desktop_specific/cashfusion/sub_widgets/fusion_progress.dart'; import 'package:stackwallet/themes/stack_colors.dart'; import 'package:stackwallet/utilities/assets.dart'; import 'package:stackwallet/utilities/text_styles.dart'; import 'package:stackwallet/widgets/desktop/desktop_dialog.dart'; import 'package:stackwallet/widgets/desktop/desktop_dialog_close_button.dart'; import 'package:stackwallet/widgets/desktop/secondary_button.dart'; -import 'package:stackwallet/widgets/rounded_container.dart'; enum CashFusionStatus { waiting, running, success, failed } @@ -83,229 +80,9 @@ class FusionDialog extends StatelessWidget { const SizedBox( height: 20, ), - RoundedContainer( - color: Theme.of(context) - .extension()! - .snackBarBackError, - child: Row( - mainAxisAlignment: MainAxisAlignment.center, - children: [ - Text( - "Do not close this window. If you exit, " - "the process will be canceled.", - style: STextStyles.smallMed14(context).copyWith( - color: Theme.of(context) - .extension()! - .snackBarTextError, - ), - ), - ], - ), + FusionProgress( + walletId: walletId, ), - const SizedBox( - height: 20, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(walletId) - .select((value) => value.connecting)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: - Theme.of(context).extension()!.popupBG, - borderColor: Theme.of(context) - .extension()! - .background, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.node, - width: 16, - height: 16, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Connecting to server", - ), - ); - }), - const SizedBox( - height: 12, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(walletId) - .select((value) => value.outputs)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: - Theme.of(context).extension()!.popupBG, - borderColor: Theme.of(context) - .extension()! - .background, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.upFromLine, - width: 30, - height: 30, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Allocating outputs", - ), - ); - }), - const SizedBox( - height: 12, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(walletId) - .select((value) => value.peers)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: - Theme.of(context).extension()!.popupBG, - borderColor: Theme.of(context) - .extension()! - .background, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.peers, - width: 30, - height: 30, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Waiting for peers", - ), - ); - }), - const SizedBox( - height: 12, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(walletId) - .select((value) => value.fusing)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: - Theme.of(context).extension()!.popupBG, - borderColor: Theme.of(context) - .extension()! - .background, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.fusing, - width: 30, - height: 30, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Fusing", - ), - ); - }), - const SizedBox( - height: 12, - ), - Consumer(builder: (_, ref, __) { - final state = ref.watch( - fusionProgressUIStateProvider(walletId) - .select((value) => value.complete)); - return RoundedContainer( - padding: EdgeInsets.zero, - color: - Theme.of(context).extension()!.popupBG, - borderColor: - Theme.of(context).extension()!.shadow, - child: RestoringItemCard( - left: SizedBox( - width: 32, - height: 32, - child: RoundedContainer( - padding: const EdgeInsets.all(0), - color: Theme.of(context) - .extension()! - .buttonBackSecondary, - child: Center( - child: SvgPicture.asset( - Assets.svg.checkCircle, - width: 16, - height: 16, - ), - ), - ), - ), - right: SizedBox( - width: 20, - height: 20, - child: _getIconForState(state), - ), - title: "Complete", - ), - ); - }), const SizedBox( height: 12, ), diff --git a/lib/pages_desktop_specific/cashfusion/sub_widgets/fusion_progress.dart b/lib/pages_desktop_specific/cashfusion/sub_widgets/fusion_progress.dart new file mode 100644 index 000000000..f3ce1b426 --- /dev/null +++ b/lib/pages_desktop_specific/cashfusion/sub_widgets/fusion_progress.dart @@ -0,0 +1,162 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_riverpod/flutter_riverpod.dart'; +import 'package:flutter_svg/flutter_svg.dart'; +import 'package:stackwallet/pages/settings_views/global_settings_view/stack_backup_views/sub_widgets/restoring_item_card.dart'; +import 'package:stackwallet/pages_desktop_specific/cashfusion/sub_widgets/fusion_dialog.dart'; +import 'package:stackwallet/providers/cash_fusion/fusion_progress_ui_state_provider.dart'; +import 'package:stackwallet/themes/stack_colors.dart'; +import 'package:stackwallet/utilities/assets.dart'; +import 'package:stackwallet/utilities/text_styles.dart'; +import 'package:stackwallet/utilities/util.dart'; +import 'package:stackwallet/widgets/conditional_parent.dart'; +import 'package:stackwallet/widgets/rounded_container.dart'; + +class FusionProgress extends ConsumerWidget { + const FusionProgress({super.key, required this.walletId}); + + final String walletId; + + @override + Widget build(BuildContext context, WidgetRef ref) { + return Column( + crossAxisAlignment: CrossAxisAlignment.stretch, + children: [ + RoundedContainer( + color: Theme.of(context).extension()!.snackBarBackError, + child: Text( + "Do not close this window. If you exit, " + "the process will be canceled.", + style: Util.isDesktop + ? STextStyles.smallMed14(context).copyWith( + color: Theme.of(context) + .extension()! + .snackBarTextError, + ) + : STextStyles.w500_14(context).copyWith( + color: Theme.of(context) + .extension()! + .snackBarTextError, + ), + textAlign: TextAlign.center, + ), + ), + const SizedBox( + height: 20, + ), + _ProgressItem( + iconAsset: Assets.svg.node, + label: "Connecting to server", + status: ref.watch(fusionProgressUIStateProvider(walletId) + .select((value) => value.connecting))), + const SizedBox( + height: 12, + ), + _ProgressItem( + iconAsset: Assets.svg.upFromLine, + label: "Allocating outputs", + status: ref.watch(fusionProgressUIStateProvider(walletId) + .select((value) => value.outputs))), + const SizedBox( + height: 12, + ), + _ProgressItem( + iconAsset: Assets.svg.peers, + label: "Waiting for peers", + status: ref.watch(fusionProgressUIStateProvider(walletId) + .select((value) => value.peers))), + const SizedBox( + height: 12, + ), + _ProgressItem( + iconAsset: Assets.svg.fusing, + label: "Fusing", + status: ref.watch(fusionProgressUIStateProvider(walletId) + .select((value) => value.fusing))), + const SizedBox( + height: 12, + ), + _ProgressItem( + iconAsset: Assets.svg.checkCircle, + label: "Complete", + status: ref.watch(fusionProgressUIStateProvider(walletId) + .select((value) => value.complete))), + ], + ); + } +} + +class _ProgressItem extends StatelessWidget { + const _ProgressItem({ + super.key, + required this.iconAsset, + required this.label, + required this.status, + }); + + final String iconAsset; + final String label; + final CashFusionStatus status; + + Widget _getIconForState(CashFusionStatus state, BuildContext context) { + switch (state) { + case CashFusionStatus.waiting: + return SvgPicture.asset( + Assets.svg.loader, + color: + Theme.of(context).extension()!.buttonBackSecondary, + ); + case CashFusionStatus.running: + return SvgPicture.asset( + Assets.svg.loader, + color: Theme.of(context).extension()!.accentColorGreen, + ); + case CashFusionStatus.success: + return SvgPicture.asset( + Assets.svg.checkCircle, + color: Theme.of(context).extension()!.accentColorGreen, + ); + case CashFusionStatus.failed: + return SvgPicture.asset( + Assets.svg.circleAlert, + color: Theme.of(context).extension()!.textError, + ); + } + } + + @override + Widget build(BuildContext context) { + return ConditionalParent( + condition: Util.isDesktop, + builder: (child) => RoundedContainer( + padding: EdgeInsets.zero, + color: Theme.of(context).extension()!.popupBG, + borderColor: Theme.of(context).extension()!.background, + child: child, + ), + child: RestoringItemCard( + left: SizedBox( + width: 32, + height: 32, + child: RoundedContainer( + padding: const EdgeInsets.all(0), + color: + Theme.of(context).extension()!.buttonBackSecondary, + child: Center( + child: SvgPicture.asset( + iconAsset, + width: 18, + height: 18, + ), + ), + ), + ), + right: SizedBox( + width: 20, + height: 20, + child: _getIconForState(status, context), + ), + title: label, + ), + ); + } +}