- improve state management in form

- improve state management in new_wallet_info
- remove unnecessary annotations
- remove hacks used to force rebuild

Author: MrCyjaneK

lib/utils/form/pin_form_element.dart

@@ -4,9 +4,14 @@ import 'package:cupcake/utils/form/abstract_value_outcome.dart';
 import 'package:cupcake/utils/secure_storage.dart';
 import 'package:flutter/cupertino.dart';
 import 'package:local_auth/local_auth.dart';
+import 'package:mobx/mobx.dart';
 
-class PinFormElement extends FormElement {
-  PinFormElement({
+part 'pin_form_element.g.dart';
+
+class PinFormElement = PinFormElementBase with _$PinFormElement;
+
+abstract class PinFormElementBase extends FormElement with Store {
+  PinFormElementBase({
     final String initialText = "",
     this.password = false,
     required this.validator,
@@ -19,6 +24,8 @@ class PinFormElement extends FormElement {
   })  : ctrl = TextEditingController(text: initialText),
         _errorHandler = errorHandler;
   final Future<void> Function(Object e) _errorHandler;
+
+  @action
   Future<void> loadSecureStorageValue(final VoidCallback callback) async {
     if (ctrl.text.isNotEmpty) return;
     if (!CupcakeConfig.instance.biometricEnabled) return;
@@ -46,27 +53,33 @@ class PinFormElement extends FormElement {
   }
 
   TextEditingController ctrl;
-  bool password;
-  bool showNumboard;
+
+  final bool password;
+  final bool showNumboard;
 
   @override
-  String label;
+  final String label;
 
-  ValueOutcome valueOutcome;
+  final ValueOutcome valueOutcome;
 
+  @computed
   @override
   Future<String> get value => valueOutcome.decode(ctrl.text);
 
+  @computed
   @override
   bool get isOk => validator(ctrl.text) == null;
 
   Future<void> Function()? onChanged;
   Future<void> Function()? onConfirm;
+
+  @action
   Future<void> onConfirmInternal(final BuildContext context) async {
     await valueOutcome.encode(ctrl.text);
     isConfirmed = true;
   }
 
+  @observable
   bool isConfirmed = false;
   String? Function(String? input) validator;
 

lib/utils/form/string_form_element.dart

@@ -1,8 +1,13 @@
 import 'package:cupcake/utils/form/abstract_form_element.dart';
 import 'package:flutter/cupertino.dart';
+import 'package:mobx/mobx.dart';
 
-class StringFormElement extends FormElement {
-  StringFormElement(
+part 'string_form_element.g.dart';
+
+class StringFormElement = StringFormElementBase with _$StringFormElement;
+
+abstract class StringFormElementBase extends FormElement with Store {
+  StringFormElementBase(
     this.label, {
     final String initialText = "",
     this.password = false,
@@ -19,12 +24,17 @@ class StringFormElement extends FormElement {
   bool password;
   @override
   String label;
+
+  @computed
   @override
   Future<String> get value => Future.value(ctrl.text);
 
+  @observable
   bool isExtra;
+
   bool randomNameGenerator;
 
+  @computed
   @override
   bool get isOk => validator(ctrl.text) == null;
 

lib/view_model/barcode_scanner_view_model.dart

@@ -27,7 +27,6 @@ abstract class BarcodeScannerViewModelBase extends ViewModel with Store {
 
   final MobileScannerController mobileScannerCtrl = MobileScannerController();
 
-  @action
   Future<void> handleUR() async {
     await callThrowable(
       () async {
@@ -59,7 +58,6 @@ abstract class BarcodeScannerViewModelBase extends ViewModel with Store {
     }
   }
 
-  @action
   List<int> urParts() {
     final List<int> l = [];
     for (final inp in URQRData.parse(urCodes).inputs) {

lib/view_model/create_wallet_view_model.dart

@@ -140,7 +140,6 @@ abstract class CreateWalletViewModelBase extends ViewModel with Store {
 
   final bool needsPasswordConfirm;
 
-  @action
   Future<void> completeSetup(final CoinWallet cw) async {
     await callThrowable(
       () async {
@@ -152,7 +151,6 @@ abstract class CreateWalletViewModelBase extends ViewModel with Store {
     );
   }
 
-  @action
   Future<void> createWallet() async {
     await callThrowable(
       () async {
@@ -162,7 +160,6 @@ abstract class CreateWalletViewModelBase extends ViewModel with Store {
     );
   }
 
-  @action
   Future<void> _createWallet() async {
     if (selectedCoin == null) throw Exception(L.error_selected_coin_null);
     if ((await walletName.value).isEmpty) {

lib/view_model/form_builder_view_model.dart

@@ -18,10 +18,6 @@ abstract class FormBuilderViewModelBase extends ViewModel with Store {
         _toggleIsPinSet = toggleIsPinSet,
         _isPinSet = isPinSet;
 
-  // Used to force a rebuild
-  @observable
-  int currentPageDoNotUse = 0;
-
   @observable
   List<FormElement> formElements;
 

lib/views/abstract.dart

@@ -62,7 +62,7 @@ class AbstractView extends StatefulWidget {
 
   State<AbstractView>? state;
 
-  AppBar? get appBar => viewModel.screenName.isEmpty
+  PreferredSizeWidget? get appBar => viewModel.screenName.isEmpty
       ? null
       : AppBar(
           title: viewModel.screenName.toLowerCase() != "cupcake"

lib/views/new_wallet_info.dart

@@ -4,6 +4,7 @@ import 'package:cupcake/view_model/new_wallet_info_view_model.dart';
 import 'package:cupcake/views/abstract.dart';
 import 'package:cupcake/views/widgets/buttons/long_primary.dart';
 import 'package:flutter/material.dart';
+import 'package:flutter_mobx/flutter_mobx.dart';
 
 class NewWalletInfoScreen extends AbstractView {
   NewWalletInfoScreen({
@@ -18,10 +19,15 @@ class NewWalletInfoScreen extends AbstractView {
   bool get canPop => false;
 
   @override
-  AppBar? get appBar => AppBar(
-        title: Text(viewModel.screenName),
-        automaticallyImplyLeading: canPop,
-        actions: _getActionButton(),
+  PreferredSizeWidget? get appBar => PreferredSize(
+        preferredSize: const Size.fromHeight(kToolbarHeight),
+        child: Observer(
+          builder: (final context) => AppBar(
+            title: Text(viewModel.screenName),
+            automaticallyImplyLeading: canPop,
+            actions: _getActionButton(),
+          ),
+        ),
       );
 
   List<Widget>? _getActionButton() {
@@ -70,19 +76,21 @@ class NewWalletInfoScreen extends AbstractView {
     return SafeArea(
       child: Padding(
         padding: const EdgeInsets.only(left: 32, right: 32, top: 0, bottom: 16),
-        child: Column(
-          children: [
-            if (viewModel.page.lottieAnimation != null) viewModel.page.lottieAnimation!,
-            ...viewModel.page.texts,
-            const Spacer(),
-            SizedBox(
-              width: double.maxFinite,
-              child: Row(
-                mainAxisSize: MainAxisSize.max,
-                children: _getBottomActionButtons(),
+        child: Observer(
+          builder: (final context) => Column(
+            children: [
+              if (viewModel.page.lottieAnimation != null) viewModel.page.lottieAnimation!,
+              ...viewModel.page.texts,
+              const Spacer(),
+              SizedBox(
+                width: double.maxFinite,
+                child: Row(
+                  mainAxisSize: MainAxisSize.max,
+                  children: _getBottomActionButtons(),
+                ),
               ),
-            ),
-          ],
+            ],
+          ),
         ),
       ),
     );

lib/views/widgets/form_builder.dart

@@ -51,7 +51,6 @@ class FormBuilder extends StatelessWidget {
   }
 
   Widget _build(final BuildContext context) {
-    final _ = viewModel.currentPageDoNotUse; // very silly way to force a rebuild
     if (_displayPinFormElement()) {
       var e = viewModel.formElements.first as PinFormElement;
       int i = 0;
@@ -68,7 +67,6 @@ class FormBuilder extends StatelessWidget {
         try {
           await e.onConfirmInternal(context);
           if (!context.mounted) return;
-          viewModel.currentPageDoNotUse++;
           viewModel.isPinSet = (count == i);
           await e.onConfirm?.call();
         } catch (err) {