Integrate infinite scroll and refresh to activity screen

mobile-app/analysis_options.yaml

@@ -21,6 +21,7 @@ analyzer:
     - "**/*.g.dart"
     - "**/*.freezed.dart"
     - "lib/generated/**"
+    - "build/**"
   errors:
     avoid_print: ignore # print is the most reliable way to debug the app
     missing_required_param: error

mobile-app/lib/providers/active_account_transactions_provider.dart

@@ -2,10 +2,41 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
 import 'package:quantus_sdk/quantus_sdk.dart';
 import 'package:resonance_network_wallet/models/combined_transactions_list.dart';
 import 'package:resonance_network_wallet/models/filtered_transactions_params.dart';
+import 'package:resonance_network_wallet/models/pagination_state.dart';
 import 'package:resonance_network_wallet/providers/account_id_list_cache.dart';
 import 'package:resonance_network_wallet/providers/account_providers.dart';
+import 'package:resonance_network_wallet/providers/controllers/unified_pagination_controller.dart';
 import 'package:resonance_network_wallet/providers/filtered_all_transactions_provider.dart';
 
+FilteredTransactionsParams? activeAccountFilteredParams(DisplayAccount? activeAccount, TransactionFilter filter) {
+  if (activeAccount == null) return null;
+  return FilteredTransactionsParams(
+    accountIds: AccountIdListCache.get([activeAccount.account.accountId]),
+    filter: filter,
+  );
+}
+
+UnifiedPaginationController? activeAccountPaginationNotifier(WidgetRef ref, TransactionFilter filter) {
+  final params = activeAccountFilteredParams(ref.read(activeAccountProvider).value, filter);
+  if (params == null) return null;
+  return ref.read(filteredPaginationControllerProviderFamily(params).notifier);
+}
+
+/// Pagination state for the active account and [TransactionFilter].
+final activeAccountPaginationProvider = Provider.family<PaginationState?, TransactionFilter>((ref, filter) {
+  final activeAccountValue = ref.watch(activeAccountProvider);
+
+  return activeAccountValue.when(
+    data: (activeAccount) {
+      final params = activeAccountFilteredParams(activeAccount, filter);
+      if (params == null) return null;
+      return ref.watch(filteredPaginationControllerProviderFamily(params));
+    },
+    loading: () => null,
+    error: (_, _) => null,
+  );
+});
+
 /// Provides a filtered list of transactions for the currently active account.
 ///
 /// Parameterised by [TransactionFilter] so callers can independently watch
@@ -21,10 +52,7 @@ final activeAccountTransactionsProvider = Provider.family<AsyncValue<CombinedTra
       if (activeAccount == null) {
         return AsyncValue.data(CombinedTransactionsList.empty);
       }
-      final params = FilteredTransactionsParams(
-        accountIds: AccountIdListCache.get([activeAccount.account.accountId]),
-        filter: filter,
-      );
+      final params = activeAccountFilteredParams(activeAccount, filter)!;
       return ref.watch(filteredTransactionsProviderFamily(params));
     },
     loading: () => const AsyncValue.loading(),

mobile-app/lib/providers/all_transactions_provider.dart

@@ -16,7 +16,8 @@ final allTransactionsProvider = Provider<AsyncValue<CombinedTransactionsList>>((
   final pending = ref.watch(pendingTransactionsProvider);
   final pagination = ref.watch(paginationControllerProvider);
 
-  if (pagination.error != null) {
+  final hasLoadedChainData = pagination.otherTransfers.isNotEmpty || pagination.scheduledReversibleTransfers.isNotEmpty;
+  if (pagination.error != null && !hasLoadedChainData) {
     return AsyncValue.error(pagination.error!, pagination.stackTrace!);
   }
   if (pagination.isFetching && pagination.otherTransfers.isEmpty) {

mobile-app/lib/providers/filtered_all_transactions_provider.dart

@@ -31,10 +31,15 @@ final filteredTransactionsProviderFamily =
       final pending = ref.watch(pendingTransactionsProvider);
       final pagination = ref.watch(filteredPaginationControllerProviderFamily(normalizedParams));
 
-      if (pagination.error != null) {
+      final hasLoadedChainData =
+          pagination.otherTransfers.isNotEmpty || pagination.scheduledReversibleTransfers.isNotEmpty;
+      if (pagination.error != null && !hasLoadedChainData) {
         print('FilteredTransactionsProvider: Error: ${pagination.error}');
         return AsyncValue.error(pagination.error!, pagination.stackTrace!);
       }
+      if (pagination.error != null) {
+        print('FilteredTransactionsProvider: Load-more error: ${pagination.error}');
+      }
       if (pagination.isFetching && pagination.otherTransfers.isEmpty) {
         return const AsyncValue.loading();
       }

mobile-app/lib/v2/screens/activity/activity_screen.dart

@@ -26,7 +26,41 @@ class ActivityScreen extends ConsumerStatefulWidget {
 }
 
 class _ActivityScreenState extends ConsumerState<ActivityScreen> {
+  static const _loadMoreThreshold = 200.0;
+
   TransactionFilter _filterOption = TransactionFilter.all;
+  late final ScrollController _scrollController;
+
+  @override
+  void initState() {
+    super.initState();
+    _scrollController = ScrollController()..addListener(_onScroll);
+  }
+
+  @override
+  void dispose() {
+    _scrollController.removeListener(_onScroll);
+    _scrollController.dispose();
+    super.dispose();
+  }
+
+  void _onScroll() {
+    if (!_scrollController.hasClients) return;
+    final pos = _scrollController.position;
+    if (pos.pixels < pos.maxScrollExtent - _loadMoreThreshold) return;
+
+    final pagination = ref.read(activeAccountPaginationProvider(_filterOption));
+    if (pagination == null || pagination.isFetching || !pagination.hasMore) return;
+
+    activeAccountPaginationNotifier(ref, _filterOption)?.fetchMore();
+  }
+
+  Future<void> _refresh() async {
+    final pagination = ref.read(activeAccountPaginationProvider(_filterOption));
+    if (pagination == null || pagination.isFetching) return;
+
+    await activeAccountPaginationNotifier(ref, _filterOption)?.loadingRefresh();
+  }
 
   void _onFilterOptionChanged(TransactionFilter option) {
     if (_filterOption == option) return;
@@ -49,6 +83,7 @@ class _ActivityScreenState extends ConsumerState<ActivityScreen> {
     final text = context.themeText;
     final accountAsync = ref.watch(activeAccountProvider);
     final txAsync = ref.watch(activeAccountTransactionsProvider(_filterOption));
+    final pagination = ref.watch(activeAccountPaginationProvider(_filterOption));
     final formatTxAmount = ref.watch(txAmountDisplayProvider);
 
     final filterButtons = TransactionFilter.values
@@ -113,41 +148,77 @@ class _ActivityScreenState extends ConsumerState<ActivityScreen> {
                       otherTransfers: data.otherTransfers,
                     );
                     if (all.isEmpty) {
-                      return Center(
-                        child: Text(l10n.activityEmpty, style: text.paragraph?.copyWith(color: colors.textSecondary)),
+                      return RefreshIndicator(
+                        onRefresh: _refresh,
+                        color: colors.textPrimary,
+                        backgroundColor: colors.surface,
+                        child: ListView(
+                          controller: _scrollController,
+                          physics: const AlwaysScrollableScrollPhysics(),
+                          children: [
+                            SizedBox(
+                              height: MediaQuery.sizeOf(context).height * 0.3,
+                              child: Center(
+                                child: Text(
+                                  l10n.activityEmpty,
+                                  style: text.paragraph?.copyWith(color: colors.textSecondary),
+                                ),
+                              ),
+                            ),
+                          ],
+                        ),
                       );
                     }
                     final grouped = _groupByDate(all, l10n, appLocale.numberFormatLocale);
+                    final showLoadMoreFooter = pagination != null && pagination.isFetching && pagination.hasMore;
 
-                    return ListView.builder(
-                      padding: EdgeInsets.zero,
-                      itemCount: grouped.length,
-                      itemBuilder: (context, i) {
-                        final group = grouped[i];
-                        return Column(
-                          crossAxisAlignment: CrossAxisAlignment.start,
-                          children: [
-                            if (i > 0) const SizedBox(height: 32),
-                            Text(group.label, style: text.receiveLabel?.copyWith(color: colors.textTertiary)),
-                            ...group.transactions.mapIndexed((index, tx) {
-                              final itemData = TxItemData.from(tx, active.account.accountId, colors, l10n);
-                              final isLastItem = index == group.transactions.length - 1;
-                              return buildTxItem(
-                                tx,
-                                itemData,
-                                colors,
-                                text,
-                                l10n,
-                                formattedAmount: formatTxAmount(itemData.amount, isSend: itemData.isSend).primaryAmount,
-                                isLastItem: isLastItem,
-                                onTap: () {
-                                  showTransactionDetailSheet(context, tx, active.account.accountId);
-                                },
-                              );
-                            }),
-                          ],
-                        );
-                      },
+                    return RefreshIndicator(
+                      onRefresh: _refresh,
+                      color: colors.textPrimary,
+                      backgroundColor: colors.surface,
+                      child: ListView.builder(
+                        key: ValueKey(_filterOption),
+                        controller: _scrollController,
+                        physics: const AlwaysScrollableScrollPhysics(),
+                        padding: EdgeInsets.zero,
+                        itemCount: grouped.length + (showLoadMoreFooter ? 1 : 0),
+                        itemBuilder: (context, i) {
+                          if (showLoadMoreFooter && i == grouped.length) {
+                            return const Padding(
+                              padding: EdgeInsets.symmetric(vertical: 24),
+                              child: Center(child: Loader()),
+                            );
+                          }
+
+                          final group = grouped[i];
+                          return Column(
+                            crossAxisAlignment: CrossAxisAlignment.start,
+                            children: [
+                              if (i > 0) const SizedBox(height: 32),
+                              Text(group.label, style: text.receiveLabel?.copyWith(color: colors.textTertiary)),
+                              ...group.transactions.mapIndexed((index, tx) {
+                                final itemData = TxItemData.from(tx, active.account.accountId, colors, l10n);
+                                final isLastItem = index == group.transactions.length - 1;
+                                return buildTxItem(
+                                  tx,
+                                  itemData,
+                                  colors,
+                                  text,
+                                  l10n,
+                                  formattedAmount: formatTxAmount(
+                                    itemData.amount,
+                                    isSend: itemData.isSend,
+                                  ).primaryAmount,
+                                  isLastItem: isLastItem,
+                                  onTap: () {
+                                    showTransactionDetailSheet(context, tx, active.account.accountId);
+                                  },
+                                );
+                              }),
+                            ],
+                          );
+                        },
+                      ),
                     );
                   },
                 );