Main coves client
bretton.dev
1import 'package:flutter/material.dart';
2
3import '../constants/app_colors.dart';
4
5/// Comments section header with sort dropdown
6///
7/// Displays:
8/// - Comment count with pluralization
9/// - Sort dropdown (Hot/Top/New)
10/// - Empty state when no comments
11class CommentsHeader extends StatelessWidget {
12 const CommentsHeader({
13 required this.commentCount,
14 required this.currentSort,
15 required this.onSortChanged,
16 super.key,
17 });
18
19 final int commentCount;
20 final String currentSort;
21 final void Function(String) onSortChanged;
22
23 static const _sortOptions = ['hot', 'top', 'new'];
24 static const _sortLabels = ['Hot', 'Top', 'New'];
25
26 /// Get icon for a sort type
27 IconData _getSortIcon(String sortType) {
28 switch (sortType) {
29 case 'hot':
30 return Icons.local_fire_department;
31 case 'top':
32 return Icons.auto_awesome_rounded;
33 case 'new':
34 return Icons.fiber_new;
35 default:
36 return Icons.sort;
37 }
38 }
39
40 @override
41 Widget build(BuildContext context) {
42 // Show empty state if no comments
43 if (commentCount == 0) {
44 return Container(
45 padding: const EdgeInsets.symmetric(vertical: 32),
46 child: Column(
47 children: [
48 const Icon(
49 Icons.chat_bubble_outline,
50 size: 48,
51 color: AppColors.textSecondary,
52 ),
53 const SizedBox(height: 16),
54 Text(
55 'No comments yet',
56 style: TextStyle(
57 fontSize: 16,
58 color: AppColors.textPrimary.withValues(alpha: 0.7),
59 ),
60 ),
61 const SizedBox(height: 4),
62 Text(
63 'Be the first to comment',
64 style: TextStyle(
65 fontSize: 14,
66 color: AppColors.textSecondary.withValues(alpha: 0.7),
67 ),
68 ),
69 ],
70 ),
71 );
72 }
73
74 // Show comment count and sort dropdown
75 return Container(
76 padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
77 child: Row(
78 children: [
79 // Comment count with dropdown
80 Expanded(
81 child: PopupMenuButton<String>(
82 initialValue: currentSort,
83 onSelected: onSortChanged,
84 offset: const Offset(0, 40),
85 color: AppColors.backgroundSecondary,
86 shape: RoundedRectangleBorder(
87 borderRadius: BorderRadius.circular(12),
88 ),
89 child: Row(
90 children: [
91 Icon(
92 _getSortIcon(currentSort),
93 color: AppColors.textSecondary,
94 size: 16,
95 ),
96 const SizedBox(width: 6),
97 Text(
98 '$commentCount '
99 '${commentCount == 1 ? 'Comment' : 'Comments'}',
100 style: const TextStyle(
101 fontSize: 15,
102 color: AppColors.textSecondary,
103 fontWeight: FontWeight.w600,
104 ),
105 ),
106 const SizedBox(width: 6),
107 const Icon(
108 Icons.arrow_drop_down,
109 color: AppColors.textSecondary,
110 size: 20,
111 ),
112 ],
113 ),
114 itemBuilder:
115 (context) => [
116 for (var i = 0; i < _sortOptions.length; i++)
117 PopupMenuItem<String>(
118 value: _sortOptions[i],
119 child: Row(
120 children: [
121 Icon(
122 _getSortIcon(_sortOptions[i]),
123 color: AppColors.textPrimary,
124 size: 18,
125 ),
126 const SizedBox(width: 12),
127 Expanded(
128 child: Text(
129 _sortLabels[i],
130 style: const TextStyle(
131 color: AppColors.textPrimary,
132 fontWeight: FontWeight.normal,
133 ),
134 ),
135 ),
136 if (currentSort == _sortOptions[i])
137 const Icon(
138 Icons.check,
139 color: AppColors.primary,
140 size: 20,
141 ),
142 ],
143 ),
144 ),
145 ],
146 ),
147 ),
148 ],
149 ),
150 );
151 }
152}