260 lines
10 KiB
Dart
260 lines
10 KiB
Dart
import 'package:flutter/material.dart';
|
|
import 'package:flutter_riverpod/flutter_riverpod.dart';
|
|
import 'package:go_router/go_router.dart';
|
|
import '../../../core/theme/app_colors.dart';
|
|
import '../../../core/theme/app_typography.dart';
|
|
import '../../../services/alerts/road_alert_models.dart';
|
|
import '../../../services/alerts/road_alert_providers.dart';
|
|
import '../../../services/alerts/road_alert_service.dart';
|
|
import '../../../services/group_rides/group_ride_models.dart';
|
|
import '../../../services/group_rides/group_ride_providers.dart';
|
|
import '../../../services/location_service.dart';
|
|
import 'navigation_maneuver_card.dart';
|
|
|
|
/// Top alert and notification banner region for the dashboard.
|
|
///
|
|
/// Subscribes strictly to permission, road alert, and group ride providers.
|
|
/// Does NOT rebuild on high-frequency telemetry samples.
|
|
class DashboardAlertRegion extends ConsumerWidget {
|
|
const DashboardAlertRegion({super.key});
|
|
|
|
@override
|
|
Widget build(BuildContext context, WidgetRef ref) {
|
|
final hasLocPermissionAsync = ref.watch(locationPermissionGrantedProvider);
|
|
final hasLocPermission = hasLocPermissionAsync.value ?? true;
|
|
|
|
final alertsAsync = ref.watch(activeAlertsStreamProvider);
|
|
final activeAlerts = alertsAsync.value ?? [];
|
|
final closestAlert = activeAlerts.isNotEmpty ? activeAlerts.first : null;
|
|
|
|
final activeGroupRide = ref.watch(activeUserGroupRideProvider);
|
|
|
|
return Column(
|
|
mainAxisSize: MainAxisSize.min,
|
|
children: [
|
|
if (!hasLocPermission) _buildPermissionBanner(context, ref),
|
|
const NavigationManeuverCard(),
|
|
if (closestAlert != null) _buildRoadAlertBanner(context, closestAlert, ref),
|
|
if (activeGroupRide != null) _buildGroupRideBanner(context, activeGroupRide),
|
|
],
|
|
);
|
|
}
|
|
|
|
Widget _buildPermissionBanner(BuildContext context, WidgetRef ref) {
|
|
return Container(
|
|
width: double.infinity,
|
|
color: AppColors.darkAmber,
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
|
child: Row(
|
|
children: [
|
|
const Icon(Icons.location_off, color: Colors.white, size: 20),
|
|
const SizedBox(width: 10),
|
|
Expanded(
|
|
child: Text(
|
|
'Location permission needed for GPS speedometer.',
|
|
style: TextStyle(
|
|
fontFamily: AppTypography.fontBody,
|
|
fontSize: 12,
|
|
color: Colors.white,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(width: 8),
|
|
ElevatedButton(
|
|
style: ElevatedButton.styleFrom(
|
|
backgroundColor: Colors.white,
|
|
foregroundColor: Colors.black,
|
|
padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
|
|
minimumSize: Size.zero,
|
|
tapTargetSize: MaterialTapTargetSize.shrinkWrap,
|
|
),
|
|
onPressed: () async {
|
|
final locService = ref.read(locationServiceProvider);
|
|
await locService.requestPermissions();
|
|
ref.invalidate(locationPermissionGrantedProvider);
|
|
},
|
|
child: const Text('Enable', style: TextStyle(fontSize: 12, fontWeight: FontWeight.bold)),
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildRoadAlertBanner(BuildContext context, RoadAlert alert, WidgetRef ref) {
|
|
final isSwarm = alert.providerId == 'swarm_alerts';
|
|
|
|
return Container(
|
|
width: double.infinity,
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
|
decoration: BoxDecoration(
|
|
color: alert.category.color.withValues(alpha: 0.2),
|
|
border: Border(bottom: BorderSide(color: alert.category.color, width: 2)),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
Icon(alert.category.icon, color: alert.category.color, size: 26),
|
|
const SizedBox(width: 10),
|
|
Expanded(
|
|
child: Column(
|
|
crossAxisAlignment: CrossAxisAlignment.start,
|
|
children: [
|
|
Row(
|
|
children: [
|
|
Text(
|
|
alert.category.displayName.toUpperCase(),
|
|
overflow: TextOverflow.ellipsis,
|
|
style: TextStyle(
|
|
fontFamily: AppTypography.fontHeadline,
|
|
color: alert.category.color,
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 13,
|
|
letterSpacing: 0.8,
|
|
),
|
|
),
|
|
if (isSwarm) ...[
|
|
const SizedBox(width: 6),
|
|
Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 5, vertical: 1),
|
|
decoration: BoxDecoration(
|
|
color: Colors.blueAccent.withValues(alpha: 0.25),
|
|
borderRadius: BorderRadius.circular(4),
|
|
border: Border.all(color: Colors.blueAccent.withValues(alpha: 0.5), width: 0.8),
|
|
),
|
|
child: const Text(
|
|
'SWARM',
|
|
style: TextStyle(
|
|
fontSize: 9,
|
|
fontWeight: FontWeight.w900,
|
|
letterSpacing: 0.5,
|
|
color: Colors.lightBlueAccent,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
],
|
|
),
|
|
Text(
|
|
'${alert.distanceFromUser?.toStringAsFixed(0) ?? '0'}m Ahead • ${alert.roadName ?? alert.description}',
|
|
overflow: TextOverflow.ellipsis,
|
|
style: TextStyle(
|
|
fontFamily: AppTypography.fontBody,
|
|
color: Colors.white,
|
|
fontSize: 12,
|
|
fontWeight: FontWeight.w600,
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(width: 6),
|
|
if (isSwarm) ...[
|
|
IconButton(
|
|
icon: const Icon(Icons.thumb_up_alt_outlined, color: Colors.greenAccent, size: 20),
|
|
padding: EdgeInsets.zero,
|
|
constraints: const BoxConstraints(minWidth: 32, minHeight: 32),
|
|
tooltip: 'Confirm (Still there)',
|
|
onPressed: () {
|
|
ref.read(swarmRoadAlertServiceProvider).confirmAlert(alert.id);
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(
|
|
content: Text('Thanks! Swarm alert confirmed.'),
|
|
duration: Duration(seconds: 2),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
IconButton(
|
|
icon: const Icon(Icons.thumb_down_alt_outlined, color: Colors.orangeAccent, size: 20),
|
|
padding: EdgeInsets.zero,
|
|
constraints: const BoxConstraints(minWidth: 32, minHeight: 32),
|
|
tooltip: 'Clear (No longer there)',
|
|
onPressed: () {
|
|
ref.read(swarmRoadAlertServiceProvider).clearAlert(alert.id);
|
|
ref.read(roadAlertServiceProvider).dismissAlert(alert.id);
|
|
ScaffoldMessenger.of(context).showSnackBar(
|
|
const SnackBar(
|
|
content: Text('Reported clear to Rider Swarm.'),
|
|
duration: Duration(seconds: 2),
|
|
),
|
|
);
|
|
},
|
|
),
|
|
],
|
|
IconButton(
|
|
icon: const Icon(Icons.close, color: Colors.white70, size: 18),
|
|
padding: EdgeInsets.zero,
|
|
constraints: const BoxConstraints(minWidth: 32, minHeight: 32),
|
|
tooltip: 'Dismiss alert',
|
|
onPressed: () {
|
|
ref.read(roadAlertServiceProvider).dismissAlert(alert.id);
|
|
},
|
|
),
|
|
],
|
|
),
|
|
);
|
|
}
|
|
|
|
Widget _buildGroupRideBanner(BuildContext context, GroupRide ride) {
|
|
return InkWell(
|
|
onTap: () => context.push('/group-rides/${ride.id}/live'),
|
|
child: Container(
|
|
width: double.infinity,
|
|
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
|
|
decoration: BoxDecoration(
|
|
color: AppColors.cyberCyan.withValues(alpha: 0.15),
|
|
border: const Border(
|
|
bottom: BorderSide(color: AppColors.cyberCyan, width: 1.5),
|
|
),
|
|
),
|
|
child: Row(
|
|
children: [
|
|
const Icon(Icons.two_wheeler, color: AppColors.cyberCyan, size: 20),
|
|
const SizedBox(width: 10),
|
|
Expanded(
|
|
child: Row(
|
|
children: [
|
|
Flexible(
|
|
child: Text(
|
|
(ride.title.trim().isEmpty || ride.title.trim().toLowerCase() == 'text')
|
|
? 'GROUP RIDE ACTIVE'
|
|
: 'GROUP RIDE ACTIVE: ${ride.title.toUpperCase()}',
|
|
overflow: TextOverflow.ellipsis,
|
|
style: TextStyle(
|
|
fontFamily: AppTypography.fontHeadline,
|
|
color: AppColors.cyberCyan,
|
|
fontWeight: FontWeight.bold,
|
|
fontSize: 12,
|
|
letterSpacing: 0.6,
|
|
),
|
|
),
|
|
),
|
|
const SizedBox(width: 8),
|
|
Container(
|
|
padding: const EdgeInsets.symmetric(horizontal: 6, vertical: 2),
|
|
decoration: BoxDecoration(
|
|
color: AppColors.cyberCyan.withValues(alpha: 0.25),
|
|
borderRadius: BorderRadius.circular(4),
|
|
),
|
|
child: Text(
|
|
'${ride.participantCount} RIDERS',
|
|
style: TextStyle(
|
|
fontFamily: AppTypography.fontTelemetry,
|
|
color: Colors.white,
|
|
fontSize: 10,
|
|
fontWeight: FontWeight.bold,
|
|
),
|
|
),
|
|
),
|
|
],
|
|
),
|
|
),
|
|
const SizedBox(width: 8),
|
|
const Icon(Icons.chevron_right, color: AppColors.cyberCyan, size: 18),
|
|
],
|
|
),
|
|
),
|
|
);
|
|
}
|
|
}
|