feat(search): implement load more functionality

- Added HeadlinesSearchLoadMore event
- Implemented _onSearchLoadMore handler
- Added cursor based pagination
- Display loading indicator

Author: fulleni

lib/headlines-search/bloc/headlines_search_bloc.dart

@@ -18,10 +18,12 @@ class HeadlinesSearchBloc
           .asyncExpand(mapper),
     );
     on<HeadlinesSearchRequested>(_onSearchRequested);
+    on<HeadlinesSearchLoadMore>(_onSearchLoadMore);
   }
 
   final HtHeadlinesRepository _headlinesRepository;
   String _searchTerm = '';
+  static const _limit = 10;
 
   Future<void> _onSearchTermChanged(
     HeadlinesSearchTermChanged event,
@@ -38,13 +40,54 @@ class HeadlinesSearchBloc
     Emitter<HeadlinesSearchState> emit,
   ) async {
     if (_searchTerm.isEmpty) {
-      return; // Don't search if the term is empty
+      return;
     }
     emit(HeadlinesSearchLoading());
     try {
-      final response =
-          await _headlinesRepository.searchHeadlines(query: _searchTerm);
-      emit(HeadlinesSearchLoaded(headlines: response.items));
+      final response = await _headlinesRepository.searchHeadlines(
+        query: _searchTerm,
+        limit: _limit,
+      );
+      emit(
+        HeadlinesSearchLoaded(
+          headlines: response.items,
+          hasReachedMax: !response.hasMore,
+          cursor: response.cursor,
+        ),
+      );
+    } on HeadlinesSearchException catch (e) {
+      emit(HeadlinesSearchError(message: e.message));
+    } catch (e) {
+      emit(HeadlinesSearchError(message: e.toString()));
+    }
+  }
+
+  Future<void> _onSearchLoadMore(
+    HeadlinesSearchLoadMore event,
+    Emitter<HeadlinesSearchState> emit,
+  ) async {
+    if (state is! HeadlinesSearchLoaded) return;
+
+    final currentState = state as HeadlinesSearchLoaded;
+
+    if (currentState.hasReachedMax) return;
+
+    try {
+      final response = await _headlinesRepository.searchHeadlines(
+        query: _searchTerm,
+        limit: _limit,
+        startAfterId: currentState.cursor,
+      );
+      emit(
+        response.items.isEmpty
+            ? currentState.copyWith(hasReachedMax: true)
+            : currentState.copyWith(
+                headlines: List.of(currentState.headlines)
+                  ..addAll(response.items),
+                hasReachedMax: !response.hasMore,
+                cursor: response.cursor,
+              ),
+      );
     } on HeadlinesSearchException catch (e) {
       emit(HeadlinesSearchError(message: e.message));
     } catch (e) {

lib/headlines-search/bloc/headlines_search_event.dart

@@ -17,3 +17,5 @@ final class HeadlinesSearchTermChanged extends HeadlinesSearchEvent {
 }
 
 final class HeadlinesSearchRequested extends HeadlinesSearchEvent {}
+
+final class HeadlinesSearchLoadMore extends HeadlinesSearchEvent {}

lib/headlines-search/bloc/headlines_search_state.dart

@@ -4,20 +4,38 @@ sealed class HeadlinesSearchState extends Equatable {
   const HeadlinesSearchState();
 
   @override
-  List<Object> get props => [];
+  List<Object?> get props => [];
 }
 
 final class HeadlinesSearchInitial extends HeadlinesSearchState {}
 
 final class HeadlinesSearchLoading extends HeadlinesSearchState {}
 
 final class HeadlinesSearchLoaded extends HeadlinesSearchState {
-  const HeadlinesSearchLoaded({required this.headlines});
+  const HeadlinesSearchLoaded({
+    required this.headlines,
+    this.hasReachedMax = false,
+    this.cursor,
+  });
 
   final List<Headline> headlines;
+  final bool hasReachedMax;
+  final String? cursor;
+
+  HeadlinesSearchLoaded copyWith({
+    List<Headline>? headlines,
+    bool? hasReachedMax,
+    String? cursor,
+  }) {
+    return HeadlinesSearchLoaded(
+      headlines: headlines ?? this.headlines,
+      hasReachedMax: hasReachedMax ?? this.hasReachedMax,
+      cursor: cursor ?? this.cursor,
+    );
+  }
 
   @override
-  List<Object> get props => [headlines];
+  List<Object?> get props => [headlines, hasReachedMax, cursor];
 }
 
 final class HeadlinesSearchError extends HeadlinesSearchState {

lib/headlines-search/view/headlines_search_view.dart

@@ -7,9 +7,22 @@ import 'package:ht_main/shared/widgets/failure_state_widget.dart';
 import 'package:ht_main/shared/widgets/initial_state_widget.dart';
 import 'package:ht_main/shared/widgets/loading_state_widget.dart';
 
-class HeadlinesSearchView extends StatelessWidget {
+class HeadlinesSearchView extends StatefulWidget {
   const HeadlinesSearchView({super.key});
 
+  @override
+  State<HeadlinesSearchView> createState() => _HeadlinesSearchViewState();
+}
+
+class _HeadlinesSearchViewState extends State<HeadlinesSearchView> {
+  final _scrollController = ScrollController();
+
+  @override
+  void initState() {
+    super.initState();
+    _scrollController.addListener(_onScroll);
+  }
+
   @override
   Widget build(BuildContext context) {
     return Scaffold(
@@ -48,8 +61,14 @@ class HeadlinesSearchView extends StatelessWidget {
                 headline: 'Loading...',
                 subheadline: 'Fetching headlines',
               ),
-            HeadlinesSearchLoaded(:final headlines) =>
-              _HeadlinesSearchLoadedView(headlines: headlines),
+            HeadlinesSearchLoaded(
+              :final headlines,
+              :final hasReachedMax
+            ) =>
+              _HeadlinesSearchLoadedView(
+                headlines: headlines,
+                hasReachedMax: hasReachedMax,
+              ),
             HeadlinesSearchError(:final message) => FailureStateWidget(
                 message: message,
                 onRetry: () {
@@ -63,18 +82,48 @@ class HeadlinesSearchView extends StatelessWidget {
       ),
     );
   }
+
+  @override
+  void dispose() {
+    _scrollController
+      ..removeListener(_onScroll)
+      ..dispose();
+    super.dispose();
+  }
+
+  void _onScroll() {
+    if (_isBottom) {
+      context.read<HeadlinesSearchBloc>().add(HeadlinesSearchLoadMore());
+    }
+  }
+
+  bool get _isBottom {
+    if (!_scrollController.hasClients) return false;
+    final maxScroll = _scrollController.position.maxScrollExtent;
+    final currentScroll = _scrollController.offset;
+    return currentScroll >= (maxScroll * 0.9);
+  }
 }
 
 class _HeadlinesSearchLoadedView extends StatelessWidget {
-  const _HeadlinesSearchLoadedView({required this.headlines});
+  const _HeadlinesSearchLoadedView({
+    required this.headlines,
+    required this.hasReachedMax,
+  });
 
   final List<Headline> headlines;
+  final bool hasReachedMax;
 
   @override
   Widget build(BuildContext context) {
     return ListView.builder(
-      itemCount: headlines.length,
+      itemCount: hasReachedMax ? headlines.length : headlines.length + 1,
       itemBuilder: (context, index) {
+        if (index >= headlines.length) {
+          return const Center(
+            child: CircularProgressIndicator(),
+          );
+        }
         return HeadlineItemWidget(headline: headlines[index]);
       },
     );

pubspec.yaml

@@ -1,6 +1,6 @@
 name: ht_main
 description: main headlines toolkit mobile app.
-version: 0.19.0
+version: 0.20.0
 publish_to: none
 repository: https://github.com/headlines-toolkit/ht-main
 environment: