feat: Add HeadlineItem and state widgets

- Added HeadlineItemWidget
- Added FailureStateWidget
- Added LoadingStateWidget
- Added InitialStateWidget

Author: fulleni

lib/headlines-feed/view/headlines_feed_page.dart

@@ -1,10 +1,92 @@
 import 'package:flutter/material.dart';
+import 'package:flutter_bloc/flutter_bloc.dart';
+import 'package:ht_main/headlines-feed/bloc/headlines_feed_bloc.dart';
+import 'package:ht_main/headlines-feed/widgets/headline_item_widget.dart';
+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 HeadlinesFeedPage extends StatelessWidget {
+class HeadlinesFeedPage extends StatefulWidget {
   const HeadlinesFeedPage({super.key});
 
+  @override
+  State<HeadlinesFeedPage> createState() => _HeadlinesFeedPageState();
+}
+
+class _HeadlinesFeedPageState extends State<HeadlinesFeedPage> {
+  final _scrollController = ScrollController();
+
+  @override
+  void initState() {
+    super.initState();
+    _scrollController.addListener(_onScroll);
+  }
+
+  @override
+  void dispose() {
+    _scrollController
+      ..removeListener(_onScroll)
+      ..dispose();
+    super.dispose();
+  }
+
+  void _onScroll() {
+    if (_isBottom) {
+      context.read<HeadlinesFeedBloc>().add(HeadlinesFeedFetchRequested());
+    }
+  }
+
+  bool get _isBottom {
+    if (!_scrollController.hasClients) return false;
+    final maxScroll = _scrollController.position.maxScrollExtent;
+    final currentScroll = _scrollController.offset;
+    return currentScroll >= (maxScroll * 0.9);
+  }
+
   @override
   Widget build(BuildContext context) {
-    return const Placeholder(); // Placeholder for now
+    return Scaffold(
+      appBar: AppBar(title: const Text('Headlines Feed')),
+      body: BlocBuilder<HeadlinesFeedBloc, HeadlinesFeedState>(
+        builder: (context, state) {
+          switch (state) {
+            case HeadlinesFeedInitial():
+              return const InitialStateWidget();
+            case HeadlinesFeedLoading():
+              return const LoadingStateWidget();
+            case HeadlinesFeedLoaded():
+              return RefreshIndicator(
+                onRefresh: () async {
+                  context
+                      .read<HeadlinesFeedBloc>()
+                      .add(HeadlinesFeedRefreshRequested());
+                },
+                child: ListView.builder(
+                  controller: _scrollController,
+                  itemCount: state.hasMore
+                      ? state.headlines.length + 1
+                      : state.headlines.length,
+                  itemBuilder: (context, index) {
+                    if (index >= state.headlines.length) {
+                      return const LoadingStateWidget();
+                    }
+                    final headline = state.headlines[index];
+                    return HeadlineItemWidget(headline: headline);
+                  },
+                ),
+              );
+            case HeadlinesFeedError():
+              return FailureStateWidget(
+                message: state.message,
+                onRetry: () {
+                  context
+                      .read<HeadlinesFeedBloc>()
+                      .add(HeadlinesFeedRefreshRequested());
+                },
+              );
+          }
+        },
+      ),
+    );
   }
 }

lib/headlines-feed/widgets/headline_item_widget.dart

@@ -0,0 +1,36 @@
+import 'package:flutter/material.dart';
+import 'package:ht_headlines_repository/ht_headlines_repository.dart'
+    show Headline;
+
+/// A widget that displays a single headline.
+class HeadlineItemWidget extends StatelessWidget {
+  /// Creates a [HeadlineItemWidget].
+  const HeadlineItemWidget({required this.headline, super.key});
+
+  /// The headline to display.
+  final Headline headline;
+
+  @override
+  Widget build(BuildContext context) {
+    return Padding(
+      padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 16),
+      child: Column(
+        crossAxisAlignment: CrossAxisAlignment.start,
+        children: [
+          Text(
+            headline.title ?? 'No Title',
+            style: Theme.of(context).textTheme.titleMedium,
+          ),
+          if (headline.description != null)
+            Padding(
+              padding: const EdgeInsets.only(top: 4),
+              child: Text(
+                headline.description!,
+                style: Theme.of(context).textTheme.bodySmall,
+              ),
+            ),
+        ],
+      ),
+    );
+  }
+}

lib/shared/widgets/failure_state_widget.dart

@@ -0,0 +1,44 @@
+import 'package:flutter/material.dart';
+
+/// A widget to display an error message and an optional retry button.
+class FailureStateWidget extends StatelessWidget {
+  /// Creates a [FailureStateWidget].
+  ///
+  /// The [message] is the error message to display.
+  /// The [onRetry] is an optional callback to be called when the retry button is pressed.
+  const FailureStateWidget({
+    required this.message, super.key,
+    this.onRetry,
+  });
+
+  /// The error message to display.
+  final String message;
+
+  /// An optional callback to be called when the retry button is pressed.
+  final VoidCallback? onRetry;
+
+  @override
+  Widget build(BuildContext context) {
+    return Center(
+      child: Column(
+        mainAxisAlignment: MainAxisAlignment.center,
+        children: [
+          Text(
+            message,
+            style: Theme.of(context).textTheme.bodyMedium,
+            textAlign: TextAlign.center,
+          ),
+          // Show the retry button only if onRetry is provided
+          if (onRetry != null)
+            Padding(
+              padding: const EdgeInsets.only(top: 16),
+              child: ElevatedButton(
+                onPressed: onRetry,
+                child: const Text('Retry'),
+              ),
+            ),
+        ],
+      ),
+    );
+  }
+}

lib/shared/widgets/initial_state_widget.dart

@@ -0,0 +1,12 @@
+import 'package:flutter/material.dart';
+
+class InitialStateWidget extends StatelessWidget {
+  const InitialStateWidget({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return const Center(
+      child: Text('Initial State'),
+    );
+  }
+}

lib/shared/widgets/loading_state_widget.dart

@@ -0,0 +1,14 @@
+import 'package:flutter/material.dart';
+
+class LoadingStateWidget extends StatelessWidget {
+  const LoadingStateWidget({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Center(
+      child: CircularProgressIndicator(
+        color: Theme.of(context).colorScheme.secondary,
+      ),
+    );
+  }
+}

pubspec.yaml

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