feat(search): implement headlines search page

- Added search bloc and events
- Implemented search UI
- Integrated with headlines repository
- Added debounce for search term changes

Author: fulleni

lib/headlines-search/bloc/headlines_search_bloc.dart

@@ -0,0 +1,54 @@
+import 'package:bloc/bloc.dart';
+import 'package:equatable/equatable.dart';
+import 'package:ht_headlines_repository/ht_headlines_repository.dart';
+import 'package:stream_transform/stream_transform.dart';
+
+part 'headlines_search_event.dart';
+part 'headlines_search_state.dart';
+
+class HeadlinesSearchBloc
+    extends Bloc<HeadlinesSearchEvent, HeadlinesSearchState> {
+  HeadlinesSearchBloc({required HtHeadlinesRepository headlinesRepository})
+      : _headlinesRepository = headlinesRepository,
+        super(HeadlinesSearchInitial()) {
+    on<HeadlinesSearchTermChanged>(
+      _onSearchTermChanged,
+      transformer: (events, mapper) => events
+          .debounce(const Duration(milliseconds: 300))
+          .asyncExpand(mapper),
+    );
+    on<HeadlinesSearchRequested>(_onSearchRequested);
+  }
+
+  final HtHeadlinesRepository _headlinesRepository;
+  String _searchTerm = '';
+
+  Future<void> _onSearchTermChanged(
+    HeadlinesSearchTermChanged event,
+    Emitter<HeadlinesSearchState> emit,
+  ) async {
+    _searchTerm = event.searchTerm;
+    if (_searchTerm.isEmpty) {
+      emit(HeadlinesSearchInitial());
+    }
+  }
+
+  Future<void> _onSearchRequested(
+    HeadlinesSearchRequested event,
+    Emitter<HeadlinesSearchState> emit,
+  ) async {
+    if (_searchTerm.isEmpty) {
+      return; // Don't search if the term is empty
+    }
+    emit(HeadlinesSearchLoading());
+    try {
+      final response =
+          await _headlinesRepository.searchHeadlines(query: _searchTerm);
+      emit(HeadlinesSearchLoaded(headlines: response.items));
+    } on HeadlinesSearchException catch (e) {
+      emit(HeadlinesSearchError(message: e.message));
+    } catch (e) {
+      emit(HeadlinesSearchError(message: e.toString()));
+    }
+  }
+}

lib/headlines-search/bloc/headlines_search_event.dart

@@ -0,0 +1,19 @@
+part of 'headlines_search_bloc.dart';
+
+sealed class HeadlinesSearchEvent extends Equatable {
+  const HeadlinesSearchEvent();
+
+  @override
+  List<Object> get props => [];
+}
+
+final class HeadlinesSearchTermChanged extends HeadlinesSearchEvent {
+  const HeadlinesSearchTermChanged({required this.searchTerm});
+
+  final String searchTerm;
+
+  @override
+  List<Object> get props => [searchTerm];
+}
+
+final class HeadlinesSearchRequested extends HeadlinesSearchEvent {}

lib/headlines-search/bloc/headlines_search_state.dart

@@ -0,0 +1,30 @@
+part of 'headlines_search_bloc.dart';
+
+sealed class HeadlinesSearchState extends Equatable {
+  const HeadlinesSearchState();
+
+  @override
+  List<Object> get props => [];
+}
+
+final class HeadlinesSearchInitial extends HeadlinesSearchState {}
+
+final class HeadlinesSearchLoading extends HeadlinesSearchState {}
+
+final class HeadlinesSearchLoaded extends HeadlinesSearchState {
+  const HeadlinesSearchLoaded({required this.headlines});
+
+  final List<Headline> headlines;
+
+  @override
+  List<Object> get props => [headlines];
+}
+
+final class HeadlinesSearchError extends HeadlinesSearchState {
+  const HeadlinesSearchError({required this.message});
+
+  final String message;
+
+  @override
+  List<Object> get props => [message];
+}

lib/headlines-search/view/headlines_search_page.dart

@@ -0,0 +1,23 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:ht_headlines_repository/ht_headlines_repository.dart';
+import 'package:ht_main/headlines-search/bloc/headlines_search_bloc.dart';
+import 'package:ht_main/headlines-search/view/headlines_search_view.dart';
+
+class HeadlinesSearchPage extends StatelessWidget {
+  const HeadlinesSearchPage({super.key});
+
+  static Route<void> route() {
+    return MaterialPageRoute<void>(builder: (_) => const HeadlinesSearchPage());
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return BlocProvider(
+      create: (_) => HeadlinesSearchBloc(
+        headlinesRepository: context.read<HtHeadlinesRepository>(),
+      ),
+      child: const HeadlinesSearchView(),
+    );
+  }
+}

lib/headlines-search/view/headlines_search_view.dart

@@ -0,0 +1,56 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:ht_main/headlines-feed/widgets/headline_item_widget.dart';
+import 'package:ht_main/headlines-search/bloc/headlines_search_bloc.dart';
+
+class HeadlinesSearchView extends StatelessWidget {
+  const HeadlinesSearchView({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: SearchBar(
+          hintText: 'Search Headlines',
+          onChanged: (value) {
+            context
+                .read<HeadlinesSearchBloc>()
+                .add(HeadlinesSearchTermChanged(searchTerm: value));
+          },
+          onSubmitted: (value) {
+            context.read<HeadlinesSearchBloc>().add(HeadlinesSearchRequested());
+          },
+        ),
+      ),
+      body: BlocBuilder<HeadlinesSearchBloc, HeadlinesSearchState>(
+        builder: (context, state) {
+          if (state is HeadlinesSearchInitial) {
+            return const Center(
+              child: Column(
+                mainAxisAlignment: MainAxisAlignment.center,
+                children: [
+                  Icon(Icons.search, size: 64),
+                  SizedBox(height: 16),
+                  Text('Search Headlines', style: TextStyle(fontSize: 24)),
+                  Text('Enter keywords to find articles'),
+                ],
+              ),
+            );
+          } else if (state is HeadlinesSearchLoading) {
+            return const Center(child: CircularProgressIndicator());
+          } else if (state is HeadlinesSearchLoaded) {
+            return ListView.builder(
+              itemCount: state.headlines.length,
+              itemBuilder: (context, index) {
+                return HeadlineItemWidget(headline: state.headlines[index]);
+              },
+            );
+          } else if (state is HeadlinesSearchError) {
+            return Center(child: Text(state.message));
+          }
+          return Container(); // Should never reach here
+        },
+      ),
+    );
+  }
+}

lib/router/router.dart

@@ -2,6 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:go_router/go_router.dart';
 import 'package:ht_main/app/view/app_scaffold.dart';
 import 'package:ht_main/headlines-feed/view/headlines_feed_page.dart';
+import 'package:ht_main/headlines-search/view/headlines_search_page.dart';
 import 'package:ht_main/router/routes.dart';
 
 final appRouter = GoRouter(
@@ -33,11 +34,7 @@ final appRouter = GoRouter(
           path: Routes.search,
           name: Routes.searchName,
           builder: (BuildContext context, GoRouterState state) {
-            return const Placeholder(
-              child: Center(
-                child: Text('SEARCH PAGE'),
-              ),
-            );
+            return const HeadlinesSearchPage();
           },
         ),
         GoRoute(

pubspec.lock

@@ -607,7 +607,7 @@ packages:
     source: hosted
     version: "2.1.4"
   stream_transform:
-    dependency: transitive
+    dependency: "direct main"
     description:
       name: stream_transform
       sha256: ad47125e588cfd37a9a7f86c7d6356dde8dfe89d071d293f80ca9e9273a33871

pubspec.yaml

@@ -1,6 +1,6 @@
 name: ht_main
 description: main headlines toolkit mobile app.
-version: 0.14.0
+version: 0.15.0
 publish_to: none
 repository: https://github.com/headlines-toolkit/ht-main
 environment:
@@ -33,6 +33,7 @@ dependencies:
       ref: main
   intl: ^0.19.0
   meta: ^1.16.0
+  stream_transform: ^2.1.1
 
 dev_dependencies:
   bloc_test: ^10.0.0