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 ${commentCount == 1 ? 'Comment' : 'Comments'}',
99 style: const TextStyle(
100 fontSize: 15,
101 color: AppColors.textSecondary,
102 fontWeight: FontWeight.w600,
103 ),
104 ),
105 const SizedBox(width: 6),
106 const Icon(
107 Icons.arrow_drop_down,
108 color: AppColors.textSecondary,
109 size: 20,
110 ),
111 ],
112 ),
113 itemBuilder: (context) => [
114 for (var i = 0; i < _sortOptions.length; i++)
115 PopupMenuItem<String>(
116 value: _sortOptions[i],
117 child: Row(
118 children: [
119 Icon(
120 _getSortIcon(_sortOptions[i]),
121 color: AppColors.textPrimary,
122 size: 18,
123 ),
124 const SizedBox(width: 12),
125 Expanded(
126 child: Text(
127 _sortLabels[i],
128 style: const TextStyle(
129 color: AppColors.textPrimary,
130 fontWeight: FontWeight.normal,
131 ),
132 ),
133 ),
134 if (currentSort == _sortOptions[i])
135 const Icon(
136 Icons.check,
137 color: AppColors.primary,
138 size: 20,
139 ),
140 ],
141 ),
142 ),
143 ],
144 ),
145 ),
146 ],
147 ),
148 );
149 }
150}