refactor: convert horizontal wrap chips to full-width vertical stack list in agent screens

This commit is contained in:
pradeepkumar
2026-05-07 11:59:21 +05:30
parent 91f8a1f1a0
commit 2760c14954
3 changed files with 256 additions and 220 deletions

View File

@@ -753,46 +753,55 @@ class _AgentCardState extends State<_AgentCard> {
),
const SizedBox(height: 12),
// Expertise tags
// Expertise tags — full-width pills, all start at same left edge
if (specializations.isNotEmpty) ...[
Wrap(
alignment: WrapAlignment.start,
spacing: 6,
runSpacing: 6,
children: [
...(_tagsExpanded
? specializations
: specializations.take(6))
.map((tag) => _buildTag(tag)),
if (specializations.length > 6)
GestureDetector(
onTap: () =>
setState(() => _tagsExpanded = !_tagsExpanded),
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: 10, vertical: 5),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: AppColors.accentOrange
.withValues(alpha: 0.1),
border: Border.all(
color: AppColors.accentOrange, width: 0.7),
),
child: Text(
_tagsExpanded
? 'Show Less'
: '+${specializations.length - 6} more',
style: const TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 13,
fontWeight: FontWeight.w600,
color: AppColors.accentOrange,
Builder(builder: (_) {
final visible = _tagsExpanded
? specializations
: specializations.take(6).toList();
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
for (int i = 0; i < visible.length; i++) ...[
if (i > 0) const SizedBox(height: 6),
_buildTag(visible[i]),
],
if (specializations.length > 6) ...[
const SizedBox(height: 8),
Align(
alignment: Alignment.center,
child: GestureDetector(
onTap: () => setState(
() => _tagsExpanded = !_tagsExpanded),
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: 12, vertical: 5),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(20),
color: AppColors.accentOrange
.withValues(alpha: 0.1),
border: Border.all(
color: AppColors.accentOrange,
width: 0.7),
),
child: Text(
_tagsExpanded
? 'Show Less'
: '+${specializations.length - 6} more',
style: const TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 13,
fontWeight: FontWeight.w600,
color: AppColors.accentOrange,
),
),
),
),
),
),
],
),
],
],
);
}),
const SizedBox(height: 14),
],