feat: Implement agent network management and refactor app navigation with a new AppShell component.
This commit is contained in:
pradeepkumar
@@ -0,0 +1,521 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
import 'package:real_estate_mobile/core/constants/app_colors.dart';
|
||||
import 'package:real_estate_mobile/core/widgets/s3_image.dart';
|
||||
import 'package:real_estate_mobile/features/agents/presentation/providers/agent_network_provider.dart';
|
||||
|
||||
class AgentNetworkScreen extends ConsumerWidget {
|
||||
const AgentNetworkScreen({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final state = ref.watch(agentNetworkProvider);
|
||||
|
||||
if (state.isLoading) {
|
||||
return const Center(
|
||||
child: CircularProgressIndicator(color: AppColors.accentOrange));
|
||||
}
|
||||
if (state.error != null) {
|
||||
return _buildError(context, ref, state.error!);
|
||||
}
|
||||
return _buildContent(context, ref, state);
|
||||
}
|
||||
|
||||
Widget _buildError(BuildContext context, WidgetRef ref, String error) {
|
||||
return Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Icon(Icons.error_outline,
|
||||
size: 48, color: AppColors.accentOrange),
|
||||
const SizedBox(height: 16),
|
||||
Text(error,
|
||||
style: const TextStyle(
|
||||
fontFamily: 'Fractul',
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColors.primaryDark,
|
||||
)),
|
||||
const SizedBox(height: 12),
|
||||
TextButton(
|
||||
onPressed: () =>
|
||||
ref.read(agentNetworkProvider.notifier).loadData(),
|
||||
child: const Text('Try Again',
|
||||
style: TextStyle(color: AppColors.accentOrange)),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildContent(
|
||||
BuildContext context, WidgetRef ref, AgentNetworkState state) {
|
||||
return RefreshIndicator(
|
||||
color: AppColors.accentOrange,
|
||||
onRefresh: () => ref.read(agentNetworkProvider.notifier).loadData(),
|
||||
child: SingleChildScrollView(
|
||||
physics: const AlwaysScrollableScrollPhysics(),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
const SizedBox(height: 12),
|
||||
|
||||
// ── Pending Requests Section ──
|
||||
if (state.pendingRequests.isNotEmpty) ...[
|
||||
_buildSectionHeader('Pending Requests',
|
||||
count: state.pendingRequests.length),
|
||||
const SizedBox(height: 12),
|
||||
...state.pendingRequests.map((request) => _RequestCard(
|
||||
data: request,
|
||||
isProcessing:
|
||||
state.processingIds.contains(request['id']),
|
||||
)),
|
||||
const SizedBox(height: 16),
|
||||
Divider(
|
||||
color: AppColors.primaryDark.withValues(alpha: 0.1),
|
||||
height: 1),
|
||||
const SizedBox(height: 16),
|
||||
],
|
||||
|
||||
// ── Manage My Network Section ──
|
||||
_buildManageNetworkHeader(context),
|
||||
const SizedBox(height: 12),
|
||||
|
||||
if (state.connections.isEmpty)
|
||||
_buildEmptyState(
|
||||
icon: Icons.people_outline,
|
||||
message: 'No connections yet',
|
||||
subtitle:
|
||||
'When you accept connection requests, they will appear here.',
|
||||
)
|
||||
else
|
||||
...state.connections
|
||||
.map((conn) => _ConnectionCard(data: conn)),
|
||||
|
||||
const SizedBox(height: 24),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildSectionHeader(String title, {int? count}) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24),
|
||||
child: Row(
|
||||
children: [
|
||||
Text(
|
||||
title,
|
||||
style: const TextStyle(
|
||||
fontFamily: 'Fractul',
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColors.primaryDark,
|
||||
),
|
||||
),
|
||||
if (count != null && count > 0) ...[
|
||||
const SizedBox(width: 8),
|
||||
Container(
|
||||
padding:
|
||||
const EdgeInsets.symmetric(horizontal: 8, vertical: 2),
|
||||
decoration: BoxDecoration(
|
||||
color: AppColors.accentOrange,
|
||||
borderRadius: BorderRadius.circular(10),
|
||||
),
|
||||
child: Text(
|
||||
'$count',
|
||||
style: const TextStyle(
|
||||
fontFamily: 'Fractul',
|
||||
fontSize: 12,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: Colors.white,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildManageNetworkHeader(BuildContext context) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.symmetric(horizontal: 0),
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 14),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(
|
||||
color: AppColors.primaryDark.withValues(alpha: 0.1),
|
||||
width: 0.5),
|
||||
borderRadius: BorderRadius.circular(7),
|
||||
),
|
||||
child: Row(
|
||||
children: [
|
||||
const Text(
|
||||
'Manage My Network',
|
||||
style: TextStyle(
|
||||
fontFamily: 'Fractul',
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColors.primaryDark,
|
||||
),
|
||||
),
|
||||
const Spacer(),
|
||||
Icon(Icons.arrow_forward,
|
||||
size: 20,
|
||||
color: AppColors.primaryDark.withValues(alpha: 0.7)),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildEmptyState({
|
||||
required IconData icon,
|
||||
required String message,
|
||||
String? subtitle,
|
||||
}) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 40),
|
||||
child: Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(icon, size: 48, color: AppColors.primaryDark.withValues(alpha: 0.3)),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
message,
|
||||
style: const TextStyle(
|
||||
fontFamily: 'Fractul',
|
||||
fontSize: 16,
|
||||
fontWeight: FontWeight.w600,
|
||||
color: AppColors.primaryDark,
|
||||
),
|
||||
),
|
||||
if (subtitle != null) ...[
|
||||
const SizedBox(height: 6),
|
||||
Text(
|
||||
subtitle,
|
||||
textAlign: TextAlign.center,
|
||||
style: TextStyle(
|
||||
fontFamily: 'SourceSerif4',
|
||||
fontSize: 14,
|
||||
color: AppColors.primaryDark.withValues(alpha: 0.6),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// ── Relative time formatting (same as web) ──
|
||||
String _formatRelativeTime(String? dateStr) {
|
||||
if (dateStr == null || dateStr.isEmpty) return '';
|
||||
try {
|
||||
final date = DateTime.parse(dateStr);
|
||||
final now = DateTime.now();
|
||||
final diff = now.difference(date);
|
||||
|
||||
if (diff.inSeconds < 60) return 'Just now';
|
||||
if (diff.inMinutes < 60) return '${diff.inMinutes}m ago';
|
||||
if (diff.inHours < 24) return '${diff.inHours}h ago';
|
||||
if (diff.inDays < 7) return '${diff.inDays}d ago';
|
||||
return DateFormat('MMM d').format(date);
|
||||
} catch (_) {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
// ── Date formatting for connections ──
|
||||
String _formatConnectedDate(String? dateStr) {
|
||||
if (dateStr == null || dateStr.isEmpty) return '';
|
||||
try {
|
||||
final date = DateTime.parse(dateStr);
|
||||
return 'Connected on ${DateFormat('MMM d, y').format(date)}';
|
||||
} catch (_) {
|
||||
return '';
|
||||
}
|
||||
}
|
||||
|
||||
// ── Request Card (pending connection requests with accept/reject) ──
|
||||
class _RequestCard extends ConsumerWidget {
|
||||
final Map<String, dynamic> data;
|
||||
final bool isProcessing;
|
||||
|
||||
const _RequestCard({required this.data, required this.isProcessing});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context, WidgetRef ref) {
|
||||
final user = data['user'] as Map<String, dynamic>? ?? {};
|
||||
final userName =
|
||||
user['email'] as String? ?? user['name'] as String? ?? 'User';
|
||||
final avatar = user['avatar'] as String?;
|
||||
final message = data['message'] as String?;
|
||||
final requestId = data['id'] as String;
|
||||
final createdAt = data['createdAt'] as String?;
|
||||
final relativeTime = _formatRelativeTime(createdAt);
|
||||
|
||||
return Opacity(
|
||||
opacity: isProcessing ? 0.5 : 1.0,
|
||||
child: AbsorbPointer(
|
||||
absorbing: isProcessing,
|
||||
child: Padding(
|
||||
padding:
|
||||
const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
||||
child: Row(
|
||||
children: [
|
||||
// Avatar
|
||||
ClipOval(
|
||||
child: SizedBox(
|
||||
width: 56,
|
||||
height: 56,
|
||||
child: avatar != null && avatar.isNotEmpty
|
||||
? S3Image(
|
||||
imageUrl: avatar,
|
||||
width: 56,
|
||||
height: 56,
|
||||
fit: BoxFit.cover,
|
||||
)
|
||||
: Container(
|
||||
color: const Color(0xFFE0E0E0),
|
||||
child: const Icon(Icons.person,
|
||||
size: 28, color: AppColors.primaryDark),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
// Name + message + time
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Flexible(
|
||||
child: Text(
|
||||
userName,
|
||||
style: const TextStyle(
|
||||
fontFamily: 'Fractul',
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: AppColors.primaryDark,
|
||||
),
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Icon(Icons.verified_user_outlined,
|
||||
size: 16,
|
||||
color: AppColors.primaryDark
|
||||
.withValues(alpha: 0.5)),
|
||||
],
|
||||
),
|
||||
if (message != null && message.isNotEmpty)
|
||||
Text(
|
||||
message,
|
||||
style: const TextStyle(
|
||||
fontFamily: 'SourceSerif4',
|
||||
fontSize: 14,
|
||||
color: AppColors.primaryDark,
|
||||
),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
Row(
|
||||
children: [
|
||||
Icon(Icons.link,
|
||||
size: 14,
|
||||
color: AppColors.primaryDark
|
||||
.withValues(alpha: 0.5)),
|
||||
const SizedBox(width: 4),
|
||||
const Text(
|
||||
'Mutual Connection',
|
||||
style: TextStyle(
|
||||
fontFamily: 'SourceSerif4',
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w200,
|
||||
color: AppColors.primaryDark,
|
||||
),
|
||||
),
|
||||
if (relativeTime.isNotEmpty) ...[
|
||||
const Spacer(),
|
||||
Text(
|
||||
relativeTime,
|
||||
style: TextStyle(
|
||||
fontFamily: 'SourceSerif4',
|
||||
fontSize: 12,
|
||||
color: AppColors.primaryDark
|
||||
.withValues(alpha: 0.5),
|
||||
),
|
||||
),
|
||||
],
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
// Reject button (X)
|
||||
GestureDetector(
|
||||
onTap: () => ref
|
||||
.read(agentNetworkProvider.notifier)
|
||||
.rejectRequest(requestId),
|
||||
child: Container(
|
||||
width: 33,
|
||||
height: 31,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(
|
||||
color:
|
||||
AppColors.primaryDark.withValues(alpha: 0.3),
|
||||
width: 1),
|
||||
),
|
||||
child: Icon(Icons.close,
|
||||
size: 18,
|
||||
color:
|
||||
AppColors.primaryDark.withValues(alpha: 0.6)),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 10),
|
||||
// Accept button (checkmark)
|
||||
GestureDetector(
|
||||
onTap: () => ref
|
||||
.read(agentNetworkProvider.notifier)
|
||||
.acceptRequest(requestId),
|
||||
child: Container(
|
||||
width: 33,
|
||||
height: 31,
|
||||
decoration: const BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: AppColors.accentOrange,
|
||||
),
|
||||
child: const Icon(Icons.check,
|
||||
size: 20, color: Colors.white),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// ── Connection Card (accepted connections in Manage My Network) ──
|
||||
class _ConnectionCard extends StatelessWidget {
|
||||
final Map<String, dynamic> data;
|
||||
|
||||
const _ConnectionCard({required this.data});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final user = data['user'] as Map<String, dynamic>? ?? {};
|
||||
final userName =
|
||||
user['email'] as String? ?? user['name'] as String? ?? 'User';
|
||||
final userEmail = user['email'] as String? ?? '';
|
||||
final avatar = user['avatar'] as String?;
|
||||
final respondedAt = data['respondedAt'] as String?;
|
||||
final connectedDate = _formatConnectedDate(respondedAt);
|
||||
|
||||
return Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
|
||||
child: Row(
|
||||
children: [
|
||||
// Avatar
|
||||
ClipOval(
|
||||
child: SizedBox(
|
||||
width: 56,
|
||||
height: 56,
|
||||
child: avatar != null && avatar.isNotEmpty
|
||||
? S3Image(
|
||||
imageUrl: avatar,
|
||||
width: 56,
|
||||
height: 56,
|
||||
fit: BoxFit.cover,
|
||||
)
|
||||
: Container(
|
||||
color: const Color(0xFFE0E0E0),
|
||||
child: const Icon(Icons.person,
|
||||
size: 28, color: AppColors.primaryDark),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
// Name + email + connected date
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Row(
|
||||
children: [
|
||||
Flexible(
|
||||
child: Text(
|
||||
userName,
|
||||
style: const TextStyle(
|
||||
fontFamily: 'Fractul',
|
||||
fontSize: 14,
|
||||
fontWeight: FontWeight.w500,
|
||||
color: AppColors.primaryDark,
|
||||
),
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 4),
|
||||
Icon(Icons.verified_user_outlined,
|
||||
size: 16,
|
||||
color: AppColors.primaryDark
|
||||
.withValues(alpha: 0.5)),
|
||||
],
|
||||
),
|
||||
if (userEmail.isNotEmpty)
|
||||
Text(
|
||||
userEmail,
|
||||
style: TextStyle(
|
||||
fontFamily: 'SourceSerif4',
|
||||
fontSize: 13,
|
||||
color:
|
||||
AppColors.primaryDark.withValues(alpha: 0.6),
|
||||
),
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
),
|
||||
if (connectedDate.isNotEmpty)
|
||||
Text(
|
||||
connectedDate,
|
||||
style: TextStyle(
|
||||
fontFamily: 'SourceSerif4',
|
||||
fontSize: 12,
|
||||
color:
|
||||
AppColors.primaryDark.withValues(alpha: 0.5),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 8),
|
||||
// Message button
|
||||
GestureDetector(
|
||||
onTap: () {
|
||||
// Navigate to messages — if we have userId, could create/open conversation
|
||||
context.push('/messages');
|
||||
},
|
||||
child: Container(
|
||||
width: 36,
|
||||
height: 36,
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
color: AppColors.accentOrange.withValues(alpha: 0.1),
|
||||
),
|
||||
child: const Icon(Icons.chat_bubble_outline,
|
||||
size: 18, color: AppColors.accentOrange),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user