Re-Quest/mobile-app
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Implement agent search functionality and update the home screen to dynamically display professional data.

Browse Source
This commit is contained in:
pradeepkumar
2026-03-07 10:25:53 +05:30
parent 379fbfe0a8
commit aefe80253f
18 changed files with 1655 additions and 627 deletions
Download Patch File Download Diff File Expand all files Collapse all files

699
lib/features/agents/presentation/screens/agent_search_screen.dart Normal file
View File

@@ -0,0 +1,699 @@
import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:go_router/go_router.dart';
import 'package:real_estate_mobile/config/app_config.dart';
import 'package:real_estate_mobile/core/constants/app_colors.dart';
import 'package:real_estate_mobile/features/agents/data/models/agent_profile.dart';
import 'package:real_estate_mobile/features/agents/data/models/agent_type.dart';
import 'package:real_estate_mobile/features/agents/presentation/providers/search_agents_provider.dart';
import 'package:real_estate_mobile/features/home/presentation/widgets/home_header.dart';
class AgentSearchScreen extends ConsumerStatefulWidget {
final String? initialQuery;
const AgentSearchScreen({super.key, this.initialQuery});
@override
ConsumerState<AgentSearchScreen> createState() => _AgentSearchScreenState();
}
class _AgentSearchScreenState extends ConsumerState<AgentSearchScreen> {
late TextEditingController _searchController;
final ScrollController _scrollController = ScrollController();
@override
void initState() {
super.initState();
_searchController = TextEditingController(text: widget.initialQuery ?? '');
_scrollController.addListener(_onScroll);
// Trigger initial search if query provided
if (widget.initialQuery != null && widget.initialQuery!.isNotEmpty) {
WidgetsBinding.instance.addPostFrameCallback((_) {
ref
.read(searchAgentsProvider.notifier)
.search(widget.initialQuery!);
});
}
}
@override
void dispose() {
_searchController.dispose();
_scrollController.dispose();
super.dispose();
}
void _onScroll() {
if (_scrollController.position.pixels >=
_scrollController.position.maxScrollExtent - 200) {
ref.read(searchAgentsProvider.notifier).loadMore();
}
}
@override
Widget build(BuildContext context) {
final state = ref.watch(searchAgentsProvider);
return Scaffold(
backgroundColor: Colors.white,
body: Column(
children: [
// Shared header
SafeArea(
bottom: false,
child: const HomeHeader(),
),
_buildSearchBar(),
const SizedBox(height: 12),
_buildFilterChips(state.agentTypes, state.selectedAgentTypeId),
const SizedBox(height: 12),
Expanded(child: _buildAgentList(state)),
],
),
bottomNavigationBar: _buildBottomNavBar(),
);
}
Widget _buildSearchBar() {
return Padding(
padding: const EdgeInsets.fromLTRB(24, 16, 24, 0),
child: SizedBox(
height: 42,
child: Row(
children: [
Expanded(
child: Container(
decoration: BoxDecoration(
border: Border.all(
color: AppColors.primaryDark,
width: 0.1,
),
borderRadius: BorderRadius.circular(7),
),
child: TextField(
controller: _searchController,
style: const TextStyle(
fontFamily: 'Fractul',
fontSize: 14,
fontWeight: FontWeight.w500,
color: AppColors.primaryDark,
),
decoration: InputDecoration(
hintText: 'Search Agents',
hintStyle: TextStyle(
fontFamily: 'Fractul',
fontSize: 14,
fontWeight: FontWeight.w500,
color: Colors.black.withValues(alpha: 0.5),
),
border: InputBorder.none,
contentPadding: const EdgeInsets.symmetric(
horizontal: 14,
vertical: 10,
),
),
onSubmitted: (value) {
ref.read(searchAgentsProvider.notifier).search(value);
},
),
),
),
const SizedBox(width: 0),
GestureDetector(
onTap: () {
ref
.read(searchAgentsProvider.notifier)
.search(_searchController.text);
},
child: Container(
width: 62,
height: 42,
decoration: BoxDecoration(
color: AppColors.accentOrange,
border: Border.all(
color: AppColors.primaryDark,
width: 0.1,
),
borderRadius: BorderRadius.circular(7),
),
child: const Icon(Icons.search, color: Colors.white, size: 24),
),
),
],
),
),
);
}
Widget _buildFilterChips(
List<AgentType> agentTypes, String? selectedTypeId) {
return SizedBox(
height: 32,
child: Padding(
padding: const EdgeInsets.only(left: 24),
child: Row(
children: [
Expanded(
child: ListView.separated(
scrollDirection: Axis.horizontal,
itemCount: agentTypes.length,
separatorBuilder: (_, __) => const SizedBox(width: 4),
itemBuilder: (context, index) {
final type = agentTypes[index];
final isSelected = type.id == selectedTypeId;
return GestureDetector(
onTap: () {
ref
.read(searchAgentsProvider.notifier)
.filterByAgentType(
isSelected ? null : type.id);
},
child: Container(
padding: const EdgeInsets.symmetric(
horizontal: 12, vertical: 4),
decoration: BoxDecoration(
color: isSelected
? AppColors.accentOrange
: Colors.transparent,
borderRadius: BorderRadius.circular(15),
border: Border.all(
color: AppColors.primaryDark,
width: 0.1,
),
),
child: Center(
child: Text(
type.name,
style: TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 14,
fontWeight: FontWeight.w400,
color: isSelected
? Colors.white
: AppColors.primaryDark,
),
),
),
),
);
},
),
),
const SizedBox(width: 8),
Padding(
padding: const EdgeInsets.only(right: 24),
child: Container(
width: 39,
height: 27,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
border: Border.all(
color: AppColors.primaryDark,
width: 0.1,
),
),
child: const Icon(
Icons.tune,
color: AppColors.primaryDark,
size: 20,
),
),
),
],
),
),
);
}
Widget _buildAgentList(SearchAgentsState state) {
if (state.isLoading) {
return const Center(
child: CircularProgressIndicator(color: AppColors.accentOrange),
);
}
if (state.error != null) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(Icons.error_outline,
color: AppColors.accentOrange, size: 48),
const SizedBox(height: 12),
Text(
state.error!,
style: const TextStyle(
fontFamily: 'Fractul',
fontSize: 14,
color: AppColors.primaryDark,
),
textAlign: TextAlign.center,
),
const SizedBox(height: 16),
TextButton(
onPressed: () =>
ref.read(searchAgentsProvider.notifier).refresh(),
child: const Text(
'Retry',
style: TextStyle(
fontFamily: 'Fractul',
fontSize: 14,
fontWeight: FontWeight.w600,
color: AppColors.accentOrange,
),
),
),
],
),
);
}
if (state.agents.isEmpty) {
return const Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(Icons.people_outline, color: AppColors.hintText, size: 48),
SizedBox(height: 12),
Text(
'No agents found',
style: TextStyle(
fontFamily: 'Fractul',
fontSize: 14,
color: AppColors.hintText,
),
),
],
),
);
}
return ListView.builder(
controller: _scrollController,
padding: const EdgeInsets.symmetric(horizontal: 24),
itemCount: state.agents.length + (state.isLoadingMore ? 1 : 0),
itemBuilder: (context, index) {
if (index == state.agents.length) {
return const Padding(
padding: EdgeInsets.symmetric(vertical: 20),
child: Center(
child:
CircularProgressIndicator(color: AppColors.accentOrange),
),
);
}
return Padding(
padding: const EdgeInsets.only(bottom: 16),
child: _AgentCard(agent: state.agents[index]),
);
},
);
}
// ── Bottom Navigation Bar (shared style matching HomeScreen) ──
Widget _buildBottomNavBar() {
return Container(
decoration: const BoxDecoration(
color: Colors.white,
border: Border(
top: BorderSide(color: Color(0xFFE8E8E8), width: 1),
),
),
child: SafeArea(
top: false,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 12),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
_buildNavItem(
index: 0,
svgPath: 'assets/icons/nav_home_icon.svg',
fallbackIcon: Icons.home,
isSelected: false,
onTap: () => context.go('/home'),
),
_buildNavItem(
index: 1,
svgPath: 'assets/icons/nav_list_icon.svg',
fallbackIcon: Icons.list,
isSelected: true,
onTap: () {},
),
_buildNavItem(
index: 2,
svgPath: 'assets/icons/nav_messages_icon.svg',
fallbackIcon: Icons.chat_bubble,
isSelected: false,
onTap: () {},
),
_buildNavItem(
index: 3,
svgPath: 'assets/icons/nav_profile_icon.svg',
fallbackIcon: Icons.person_outline,
isSelected: false,
onTap: () {},
),
],
),
),
),
);
}
Widget _buildNavItem({
required int index,
required String svgPath,
required IconData fallbackIcon,
required bool isSelected,
required VoidCallback onTap,
}) {
return GestureDetector(
onTap: onTap,
behavior: HitTestBehavior.opaque,
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: SvgPicture.asset(
svgPath,
width: 24,
height: 24,
colorFilter: isSelected
? const ColorFilter.mode(AppColors.primaryDark, BlendMode.srcIn)
: const ColorFilter.mode(AppColors.accentOrange, BlendMode.srcIn),
placeholderBuilder: (_) => Icon(
fallbackIcon,
size: 24,
color: isSelected ? AppColors.primaryDark : AppColors.accentOrange,
),
),
),
);
}
}
// --- Agent Card Widget matching Figma design ---
class _AgentCard extends StatefulWidget {
final AgentProfile agent;
const _AgentCard({required this.agent});
@override
State<_AgentCard> createState() => _AgentCardState();
}
class _AgentCardState extends State<_AgentCard> {
bool _bioExpanded = false;
String? _resolveImageUrl(String? imageUrl) {
if (imageUrl == null || imageUrl.isEmpty) return null;
if (imageUrl.startsWith('http://') || imageUrl.startsWith('https://')) {
return imageUrl;
}
final baseUrl = AppConfig.apiBaseUrl;
if (baseUrl.isNotEmpty) return '$baseUrl$imageUrl';
return null;
}
@override
Widget build(BuildContext context) {
final agent = widget.agent;
final specializations = agent.specializations;
final bio = agent.bio ?? '';
final matchPercent = agent.averageRating != null
? '${(agent.averageRating! * 20).round()}%'
: null;
return Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(20),
border: Border.all(color: AppColors.primaryDark.withValues(alpha: 0.1)),
),
clipBehavior: Clip.antiAlias,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Cover image with match badge
Stack(
children: [
_buildCoverImage(agent),
if (matchPercent != null)
Positioned(
top: 0,
right: 0,
child: Container(
padding:
const EdgeInsets.symmetric(horizontal: 10, vertical: 12),
decoration: const BoxDecoration(
color: Color(0xFF638559),
borderRadius: BorderRadius.only(
bottomLeft: Radius.circular(20),
topRight: Radius.circular(20),
),
),
child: Text(
matchPercent,
style: const TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 14,
fontWeight: FontWeight.w400,
color: Color(0xFFF0F5FC),
),
),
),
),
],
),
// Card content
Padding(
padding: const EdgeInsets.fromLTRB(34, 16, 20, 20),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
// Name row with verified badge
Row(
children: [
Flexible(
child: Text.rich(
TextSpan(
children: [
TextSpan(
text: agent.firstName,
style: const TextStyle(
fontFamily: 'Fractul',
fontSize: 15,
fontWeight: FontWeight.w700,
color: AppColors.primaryDark,
),
),
TextSpan(
text: ' ${agent.lastName}',
style: const TextStyle(
fontFamily: 'Fractul',
fontSize: 15,
fontWeight: FontWeight.w400,
color: AppColors.primaryDark,
),
),
],
),
overflow: TextOverflow.ellipsis,
),
),
if (agent.isVerified) ...[
const SizedBox(width: 6),
SvgPicture.asset(
'assets/icons/verified_badge_icon.svg',
width: 16,
height: 16,
placeholderBuilder: (_) => const Icon(
Icons.verified,
color: Color(0xFF5D8B5A),
size: 16,
),
),
const SizedBox(width: 4),
const Text(
'(Verified Expert)',
style: TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 14,
fontWeight: FontWeight.w500,
color: Color(0xFF5D8B5A),
),
),
],
],
),
const SizedBox(height: 4),
// Headline / title
Text(
agent.headline ?? agent.agentType?.name ?? 'Licensed Real Estate Agent',
style: const TextStyle(
fontFamily: 'Fractul',
fontSize: 15,
fontWeight: FontWeight.w400,
color: AppColors.primaryDark,
),
),
const SizedBox(height: 10),
// Location + Member Since row
Row(
children: [
if (agent.location.isNotEmpty) ...[
SvgPicture.asset(
'assets/icons/location_pin_icon.svg',
width: 14,
height: 14,
placeholderBuilder: (_) => const Icon(
Icons.location_on,
color: AppColors.accentOrange,
size: 14,
),
),
const SizedBox(width: 4),
Text(
agent.location,
style: const TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 14,
fontWeight: FontWeight.w500,
color: AppColors.primaryDark,
),
),
const SizedBox(width: 16),
],
SvgPicture.asset(
'assets/icons/calendar_icon.svg',
width: 14,
height: 14,
placeholderBuilder: (_) => const Icon(
Icons.calendar_today,
color: AppColors.accentOrange,
size: 14,
),
),
const SizedBox(width: 4),
const Text(
'Member Since 2024',
style: TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 14,
fontWeight: FontWeight.w500,
color: AppColors.primaryDark,
),
),
],
),
const SizedBox(height: 12),
// Specialization tags
if (specializations.isNotEmpty) ...[
Wrap(
spacing: 8,
runSpacing: 8,
children: specializations
.take(8)
.map((tag) => _buildTag(tag))
.toList(),
),
const SizedBox(height: 14),
],
// Bio
if (bio.isNotEmpty) ...[
Text.rich(
TextSpan(
children: [
TextSpan(
text: _bioExpanded || bio.length <= 150
? bio
: '${bio.substring(0, 150)}... ',
style: const TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 10,
fontWeight: FontWeight.w400,
color: AppColors.primaryDark,
),
),
if (bio.length > 150)
WidgetSpan(
child: GestureDetector(
onTap: () =>
setState(() => _bioExpanded = !_bioExpanded),
child: Text(
_bioExpanded ? 'Show Less.' : 'Show More.',
style: const TextStyle(
fontFamily: 'Fractul',
fontSize: 10,
fontWeight: FontWeight.w600,
color: AppColors.primaryDark,
decoration: TextDecoration.underline,
),
),
),
),
],
),
),
],
],
),
),
],
),
);
}
Widget _buildCoverImage(AgentProfile agent) {
final resolvedUrl = _resolveImageUrl(agent.avatarUrl);
if (resolvedUrl != null) {
return CachedNetworkImage(
imageUrl: resolvedUrl,
width: double.infinity,
height: 265,
fit: BoxFit.cover,
placeholder: (_, __) => _buildPlaceholder(),
errorWidget: (_, __, ___) => _buildPlaceholder(),
);
}
return _buildPlaceholder();
}
Widget _buildPlaceholder() {
return Container(
width: double.infinity,
height: 265,
color: AppColors.gradientStart,
child:
const Icon(Icons.person, size: 80, color: AppColors.primaryDark),
);
}
Widget _buildTag(String label) {
return Container(
padding: const EdgeInsets.symmetric(horizontal: 10, vertical: 4),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(15),
border: Border.all(color: AppColors.primaryDark, width: 0.7),
),
child: Text(
label,
style: const TextStyle(
fontFamily: 'SourceSerif4',
fontSize: 14,
fontWeight: FontWeight.w400,
color: AppColors.primaryDark,
),
),
);
}
}