refactor: improve UI layout and loading state management for BIP85 derivations

Author: ethicnology

lib/core/widgets/bip85_derivation_widget.dart

@@ -72,10 +72,13 @@ class _Bip85DerivationWidgetState extends State<Bip85DerivationWidget> {
     final isRevoked = widget.derivation.status == Bip85Status.revoked;
 
     return Container(
-      padding: const EdgeInsets.all(16),
+      padding: const EdgeInsets.all(8),
       decoration: BoxDecoration(
         border: Border.all(color: context.appColors.border),
+        borderRadius: BorderRadius.circular(8),
+        color: context.appColors.surface,
       ),
+
       child: Column(
         crossAxisAlignment: .start,
         children: [

lib/features/bip85_entropy/bip85_home_page.dart

@@ -3,7 +3,6 @@ import 'package:bb_mobile/core/utils/build_context_x.dart';
 import 'package:bb_mobile/core/widgets/bip85_derivation_widget.dart';
 import 'package:bb_mobile/core/widgets/buttons/button.dart';
 import 'package:bb_mobile/core/widgets/loading/fading_linear_progress.dart';
-import 'package:bb_mobile/core/widgets/scrollable_column.dart';
 import 'package:bb_mobile/features/bip85_entropy/presentation/cubit.dart';
 import 'package:bb_mobile/features/bip85_entropy/presentation/state.dart';
 import 'package:flutter/material.dart';
@@ -23,9 +22,11 @@ class Bip85HomePage extends StatelessWidget {
 
           return Padding(
             padding: const EdgeInsets.symmetric(vertical: 16),
-            child: ScrollableColumn(
+            child: Column(
               children: [
-                FadingLinearProgress(trigger: state.xprvBase58.isEmpty),
+                FadingLinearProgress(
+                  trigger: state.xprvBase58.isEmpty || state.isLoading,
+                ),
                 Container(
                   margin: const EdgeInsets.all(16),
                   padding: const EdgeInsets.all(12),
@@ -48,36 +49,44 @@ class Bip85HomePage extends StatelessWidget {
                 ),
                 const Gap(16),
                 if (state.derivations.isNotEmpty && state.xprvBase58.isNotEmpty)
-                  ...List.generate(state.derivations.length, (index) {
-                    final derivation = state.derivations[index];
-                    return Padding(
-                      padding: const EdgeInsets.symmetric(vertical: 2),
-                      child: Bip85DerivationWidget(
-                        xprvBase58: state.xprvBase58,
-                        derivation: derivation,
-                        onAliasChanged: cubit.aliasDerivation,
-                        onDerivationRevoked: cubit.revokeDerivation,
-                        onDerivationActivated: cubit.activateDerivation,
-                      ),
-                    );
-                  }),
-                const Gap(16),
-                Row(
-                  mainAxisAlignment: .spaceBetween,
-                  children: [
-                    BBButton.small(
-                      onPressed: () => cubit.deriveNextMnemonic(),
-                      label: context.loc.bip85NextMnemonic,
-                      bgColor: context.appColors.onSurface,
-                      textColor: context.appColors.surface,
+                  Expanded(
+                    child: ListView.builder(
+                      itemCount: state.derivations.length,
+                      itemBuilder: (context, index) {
+                        final derivation = state.derivations[index];
+                        return Padding(
+                          padding: const EdgeInsets.all(8),
+                          child: Bip85DerivationWidget(
+                            xprvBase58: state.xprvBase58,
+                            derivation: derivation,
+                            onAliasChanged: cubit.aliasDerivation,
+                            onDerivationRevoked: cubit.revokeDerivation,
+                            onDerivationActivated: cubit.activateDerivation,
+                          ),
+                        );
+                      },
                     ),
-                    BBButton.small(
-                      onPressed: () => cubit.deriveNextHex(),
-                      label: context.loc.bip85NextHex,
-                      bgColor: context.appColors.onSurface,
-                      textColor: context.appColors.surface,
-                    ),
-                  ],
+                  ),
+                const Gap(16),
+                Padding(
+                  padding: const EdgeInsets.symmetric(horizontal: 16),
+                  child: Row(
+                    mainAxisAlignment: .spaceBetween,
+                    children: [
+                      BBButton.small(
+                        onPressed: () => cubit.deriveNextMnemonic(),
+                        label: context.loc.bip85NextMnemonic,
+                        bgColor: context.appColors.onSurface,
+                        textColor: context.appColors.surface,
+                      ),
+                      BBButton.small(
+                        onPressed: () => cubit.deriveNextHex(),
+                        label: context.loc.bip85NextHex,
+                        bgColor: context.appColors.onSurface,
+                        textColor: context.appColors.surface,
+                      ),
+                    ],
+                  ),
                 ),
               ],
             ),

lib/features/bip85_entropy/presentation/cubit.dart

@@ -48,16 +48,19 @@ class Bip85EntropyCubit extends Cubit<Bip85EntropyState> {
 
   Future<void> init() async {
     try {
+      emit(state.copyWith(isLoading: true));
       await fetchXprvBase58();
       await fetchAllDerivations();
+      emit(state.copyWith(isLoading: false));
     } catch (e) {
       emit(state.copyWith(error: Bip85EntropyError(e.toString())));
     }
   }
 
   Future<void> fetchAllDerivations() async {
+    emit(state.copyWith(isLoading: true));
     final derivations = await _fetchAllBip85DerivationsUsecase.execute();
-    emit(state.copyWith(derivations: derivations));
+    emit(state.copyWith(derivations: derivations, isLoading: false));
   }
 
   Future<void> fetchXprvBase58() async {
@@ -71,17 +74,21 @@ class Bip85EntropyCubit extends Cubit<Bip85EntropyState> {
 
   Future<void> deriveNextMnemonic() async {
     try {
+      emit(state.copyWith(isLoading: true));
       await _deriveNextBip85MnemonicFromDefaultWalletUsecase.execute();
       await fetchAllDerivations();
+      emit(state.copyWith(isLoading: false));
     } catch (e) {
       emit(state.copyWith(error: Bip85EntropyError(e.toString())));
     }
   }
 
   Future<void> deriveNextHex() async {
     try {
+      emit(state.copyWith(isLoading: true));
       await _deriveNextBip85HexFromDefaultWalletUsecase.execute(length: 30);
       await fetchAllDerivations();
+      emit(state.copyWith(isLoading: false));
     } catch (e) {
       emit(state.copyWith(error: Bip85EntropyError(e.toString())));
     }

lib/features/bip85_entropy/presentation/state.dart

@@ -10,5 +10,6 @@ sealed class Bip85EntropyState with _$Bip85EntropyState {
     Bip85EntropyError? error,
     @Default([]) List<Bip85DerivationEntity> derivations,
     @Default('') String xprvBase58,
+    @Default(false) bool isLoading,
   }) = _Bip85EntropyState;
 }