import 'package:flutter/material.dart'; import 'package:flutter_riverpod/flutter_riverpod.dart'; import 'package:intl/intl.dart'; import '../../../core/models/comment_model.dart'; import '../../auth/providers/auth_provider.dart'; import '../providers/comments_provider.dart'; class CommentsScreen extends ConsumerStatefulWidget { const CommentsScreen({ super.key, required this.novelId, this.chapterId, }); final String novelId; final String? chapterId; @override ConsumerState createState() => _CommentsScreenState(); } class _CommentsScreenState extends ConsumerState { final _textCtrl = TextEditingController(); bool _submitting = false; String get _key => widget.chapterId != null ? '${widget.novelId}:${widget.chapterId}' : widget.novelId; @override void dispose() { _textCtrl.dispose(); super.dispose(); } Future _submit() async { final text = _textCtrl.text.trim(); if (text.isEmpty) return; setState(() => _submitting = true); try { await ref.read(commentsProvider(_key).notifier).post(text); _textCtrl.clear(); } catch (e) { if (mounted) { ScaffoldMessenger.of(context) .showSnackBar(SnackBar(content: Text('Lỗi: $e'))); } } finally { if (mounted) setState(() => _submitting = false); } } @override Widget build(BuildContext context) { final isAuth = ref.watch(isAuthenticatedProvider); final commentsAsync = ref.watch(commentsProvider(_key)); return Scaffold( appBar: AppBar( title: Text(widget.chapterId != null ? 'Bình luận chương' : 'Bình luận'), ), body: Column( children: [ Expanded( child: commentsAsync.when( loading: () => const Center(child: CircularProgressIndicator()), error: (e, _) => Center(child: Text('Lỗi: $e')), data: (comments) { if (comments.isEmpty) { return const Center(child: Text('Chưa có bình luận nào')); } return ListView.separated( padding: const EdgeInsets.symmetric(vertical: 8), itemCount: comments.length, separatorBuilder: (_, separatorIndex) => const Divider(height: 1), itemBuilder: (context, index) => _CommentTile(comment: comments[index]), ); }, ), ), if (isAuth) _CommentInput( controller: _textCtrl, submitting: _submitting, onSubmit: _submit, ), ], ), ); } } class _CommentTile extends StatelessWidget { final CommentModel comment; const _CommentTile({required this.comment}); @override Widget build(BuildContext context) { return Padding( padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 10), child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Row( children: [ CircleAvatar( radius: 16, child: Text( comment.username[0].toUpperCase(), ), ), const SizedBox(width: 8), Expanded( child: Column( crossAxisAlignment: CrossAxisAlignment.start, children: [ Text( comment.username, style: const TextStyle(fontWeight: FontWeight.w600), ), Text( _formatDate(comment.createdAt), style: Theme.of(context).textTheme.bodySmall, ), ], ), ), ], ), const SizedBox(height: 8), Text(comment.content), ], ), ); } String _formatDate(DateTime? dt) { if (dt == null) return ''; return DateFormat('dd/MM/yyyy HH:mm').format(dt.toLocal()); } } class _CommentInput extends StatelessWidget { final TextEditingController controller; final bool submitting; final VoidCallback onSubmit; const _CommentInput({ required this.controller, required this.submitting, required this.onSubmit, }); @override Widget build(BuildContext context) { return Container( padding: EdgeInsets.only( left: 12, right: 12, top: 8, bottom: MediaQuery.of(context).padding.bottom + 8, ), color: Theme.of(context).colorScheme.surface, child: Row( children: [ Expanded( child: TextField( controller: controller, maxLines: 3, minLines: 1, decoration: InputDecoration( hintText: 'Viết bình luận...', border: OutlineInputBorder( borderRadius: BorderRadius.circular(12), ), isDense: true, ), textInputAction: TextInputAction.newline, ), ), const SizedBox(width: 8), IconButton.filled( onPressed: submitting ? null : onSubmit, icon: submitting ? const SizedBox( width: 18, height: 18, child: CircularProgressIndicator(strokeWidth: 2), ) : const Icon(Icons.send), ), ], ), ); } }