feat: implement splash and onboarding flows, update app assets, and add project design documentation

This commit is contained in:
Hamza-Ayed
2026-07-24 04:15:07 +03:00
parent 9f7bc31408
commit 213b459912
208 changed files with 23801 additions and 1066 deletions
@@ -1,8 +1,9 @@
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
import '../../../core/l10n/app_localizations.dart';
import 'package:go_router/go_router.dart';
import 'package:intaleq_maps/intaleq_maps.dart';
import '../../../core/l10n/app_localizations.dart';
import '../../../core/design/tokens.dart';
import '../../../core/ui/tripz_button.dart';
import '../../trip/bloc/trip_bloc.dart';
@@ -10,9 +11,15 @@ import '../../trip/bloc/trip_state.dart';
import '../../trip/bloc/trip_event.dart';
import '../cubit/quote_cubit.dart';
import '../data/models/place_model.dart';
import '../data/models/route_model.dart';
import '../data/maps_repository.dart';
import '../../../core/di.dart';
import 'widgets/ride_class_card.dart';
/// شاشة معاينة المسار + اختيار فئة الرحلة + تأكيد الطلب.
List<LatLng> _decodePolyline(String encoded) {
return PolylineUtils.decode(encoded);
}
class RoutePreviewScreen extends StatefulWidget {
final PlaceModel pickup;
final PlaceModel destination;
@@ -29,10 +36,16 @@ class RoutePreviewScreen extends StatefulWidget {
class _RoutePreviewScreenState extends State<RoutePreviewScreen> {
IntaleqMapController? _mapController;
RouteModel? _route;
List<LatLng> _polylinePoints = [];
bool _routeLoading = true;
String? _routeError;
final _promoController = TextEditingController();
@override
void initState() {
super.initState();
_fetchRoute();
WidgetsBinding.instance.addPostFrameCallback((_) {
context.read<QuoteCubit>().fetchQuote(
pickupLat: widget.pickup.lat,
@@ -45,11 +58,59 @@ class _RoutePreviewScreenState extends State<RoutePreviewScreen> {
});
}
@override
void dispose() {
_promoController.dispose();
super.dispose();
}
Future<void> _fetchRoute() async {
setState(() {
_routeLoading = true;
_routeError = null;
});
try {
final repo = getIt<MapsRepository>();
final route = await repo.getRoute(
fromLat: widget.pickup.lat,
fromLng: widget.pickup.lng,
toLat: widget.destination.lat,
toLng: widget.destination.lng,
);
final points = await compute(_decodePolyline, route.polyline ?? '');
if (!mounted) return;
setState(() {
_route = route;
_polylinePoints = points;
_routeLoading = false;
});
_fitCamera();
} catch (e) {
if (!mounted) return;
setState(() {
_routeError = e.toString();
_routeLoading = false;
});
}
}
void _fitCamera() {
if (_mapController == null) return;
final bounds = _route?.getLatLngBounds();
if (bounds != null) {
_mapController!.moveCamera(CameraUpdate.newLatLngBounds(bounds));
} else {
_mapController!.moveCamera(CameraUpdate.newLatLngZoom(
LatLng(widget.pickup.lat, widget.pickup.lng),
15,
));
}
}
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context)!;
final cs = Theme.of(context).colorScheme;
final pickupLoc = LatLng(widget.pickup.lat, widget.pickup.lng);
final destLoc = LatLng(widget.destination.lat, widget.destination.lng);
@@ -58,185 +119,295 @@ class _RoutePreviewScreenState extends State<RoutePreviewScreen> {
prev.requestStatus != cur.requestStatus &&
cur.requestStatus == TripRequestStatus.searching,
listener: (context, state) {
// تم إنشاء الرحلة — انتقل للتتبع.
context.pushReplacement('/trip-tracking');
},
child: Scaffold(
body: Column(
body: Stack(
children: [
// الخريطة مع المسار
Expanded(
flex: 2,
child: Stack(
children: [
IntaleqMap(
apiKey: '',
initialCameraPosition: CameraPosition(
target: LatLng(
(pickupLoc.latitude + destLoc.latitude) / 2,
(pickupLoc.longitude + destLoc.longitude) / 2,
),
zoom: 14,
// الخريطة بكامل الشاشة
if (_routeLoading)
const Center(child: CircularProgressIndicator())
else if (_routeError != null)
Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(l10n.errorGeneric),
const SizedBox(height: T.s12),
TripzButton(
label: l10n.retry,
onPressed: _fetchRoute,
),
myLocationEnabled: false,
zoomControlsEnabled: false,
compassEnabled: false,
onMapCreated: (c) => _mapController = c,
markers: {
Marker(
markerId: const MarkerId('pickup'),
position: pickupLoc,
icon: InlqBitmap.defaultMarkerWithHue(210),
anchor: const Offset(0.5, 1.0),
),
Marker(
markerId: const MarkerId('destination'),
position: destLoc,
icon: InlqBitmap.defaultMarkerWithHue(0),
anchor: const Offset(0.5, 1.0),
),
},
polylines: {
Polyline(
polylineId: const PolylineId('route'),
points: [pickupLoc, destLoc],
color: cs.primary,
width: 4,
),
},
],
),
)
else
IntaleqMap(
apiKey: '',
initialCameraPosition: CameraPosition(
target: LatLng(
(pickupLoc.latitude + destLoc.latitude) / 2,
(pickupLoc.longitude + destLoc.longitude) / 2,
),
Positioned(
top: MediaQuery.of(context).padding.top + T.s8,
left: T.s12,
child: FloatingActionButton.small(
heroTag: 'back',
backgroundColor: cs.surface,
onPressed: () => context.pop(),
child: const Icon(Icons.arrow_back_rounded),
zoom: 14,
),
mapType: Theme.of(context).brightness == Brightness.dark
? IntaleqMapType.normal
: IntaleqMapType.light,
myLocationEnabled: false,
zoomControlsEnabled: false,
compassEnabled: false,
onMapCreated: (c) {
_mapController = c;
_fitCamera();
},
markers: {
Marker(
markerId: const MarkerId('pickup'),
position: pickupLoc,
icon: InlqBitmap.defaultMarkerWithHue(210),
anchor: const Offset(0.5, 1.0),
),
Marker(
markerId: const MarkerId('destination'),
position: destLoc,
icon: InlqBitmap.defaultMarkerWithHue(0),
anchor: const Offset(0.5, 1.0),
),
},
polylines: {
// حماية محرك C++ من الانهيار إذا كانت النقاط أقل من 2
if (_polylinePoints.length >= 2)
Polyline(
polylineId: const PolylineId('route'),
points: _polylinePoints,
color: cs.primary,
width: T.polylineWidth,
),
),
Positioned(
top: MediaQuery.of(context).padding.top + T.s8,
right: T.s12,
child: BlocBuilder<QuoteCubit, QuoteState>(
builder: (context, state) {
if (state.quote == null) return const SizedBox.shrink();
return Container(
padding: const EdgeInsets.symmetric(horizontal: T.s12, vertical: T.s8),
decoration: BoxDecoration(
color: cs.surface,
borderRadius: BorderRadius.circular(T.r12),
boxShadow: [T.shadowSm],
),
child: Text(
l10n.routeSummary(
state.quote!.distanceText ?? '',
state.quote!.durationText ?? '',
),
style: Theme.of(context).textTheme.labelLarge,
),
);
},
),
),
],
},
),
// زر الرجوع العائم (Top Left)
Positioned(
top: MediaQuery.of(context).padding.top + T.s8,
left: T.s12,
child: FloatingActionButton.small(
heroTag: 'back',
backgroundColor: cs.surface.withValues(alpha: 0.9),
elevation: 4,
onPressed: () => context.pop(),
child: Icon(Icons.arrow_back_rounded, color: cs.onSurface),
),
),
// قائمة فئات الرحلة
Expanded(
flex: 3,
// ملخص المسار العائم (Top Right)
Positioned(
top: MediaQuery.of(context).padding.top + T.s12,
right: T.s12,
child: BlocBuilder<QuoteCubit, QuoteState>(
builder: (context, state) {
if (state.quote == null) return const SizedBox.shrink();
return Container(
padding: const EdgeInsets.symmetric(
horizontal: T.s16, vertical: T.s12),
decoration: BoxDecoration(
color: cs.surface.withValues(alpha: 0.95),
borderRadius: BorderRadius.circular(T.r24),
boxShadow: const [T.shadowSm],
),
child: Text(
l10n.routeSummary(
state.quote!.distanceText ?? '',
state.quote!.durationText ?? '',
),
style: Theme.of(context).textTheme.labelLarge?.copyWith(
fontWeight: FontWeight.w700,
color: cs.onSurface,
),
),
);
},
),
),
// Bottom Sheet: فئات الرحلات
Align(
alignment: Alignment.bottomCenter,
child: Container(
color: cs.surface,
child: BlocBuilder<QuoteCubit, QuoteState>(
builder: (context, state) {
if (state.loading) {
return const Center(child: CircularProgressIndicator());
}
if (state.error != null) {
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(l10n.errorGeneric),
const SizedBox(height: T.s12),
TripzButton(
label: l10n.retry,
onPressed: () => context.read<QuoteCubit>().fetchQuote(
pickupLat: widget.pickup.lat,
pickupLng: widget.pickup.lng,
pickupAddress: widget.pickup.name,
dropoffLat: widget.destination.lat,
dropoffLng: widget.destination.lng,
dropoffAddress: widget.destination.name,
constraints: BoxConstraints(
maxHeight: MediaQuery.of(context).size.height * 0.55,
),
decoration: BoxDecoration(
color: cs.surface,
borderRadius: const BorderRadius.vertical(
top: Radius.circular(24),
),
boxShadow: [
BoxShadow(
color: Colors.black.withValues(alpha: 0.1),
blurRadius: 20,
offset: const Offset(0, -5),
)
],
),
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
// شريط السحب (Grab handle)
const SizedBox(height: T.s12),
Container(
width: 40,
height: 5,
decoration: BoxDecoration(
color: cs.outlineVariant.withValues(alpha: 0.5),
borderRadius: BorderRadius.circular(10),
),
),
const SizedBox(height: T.s12),
Expanded(
child: BlocBuilder<QuoteCubit, QuoteState>(
builder: (context, state) {
if (state.loading) {
return const Center(
child: CircularProgressIndicator());
}
if (state.error != null) {
return Center(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Text(l10n.errorGeneric,
style: Theme.of(context)
.textTheme
.bodyLarge
?.copyWith(color: cs.error)),
const SizedBox(height: T.s12),
TripzButton(
label: l10n.retry,
onPressed: () => context
.read<QuoteCubit>()
.fetchQuote(
pickupLat: widget.pickup.lat,
pickupLng: widget.pickup.lng,
pickupAddress: widget.pickup.name,
dropoffLat: widget.destination.lat,
dropoffLng: widget.destination.lng,
dropoffAddress:
widget.destination.name,
),
),
),
],
),
);
}
],
),
);
}
final classes = state.quote?.classes ?? [];
if (classes.isEmpty) {
return Center(child: Text(l10n.noResults));
}
final classes = state.quote?.classes ?? [];
if (classes.isEmpty) {
return Center(child: Text(l10n.noResults));
}
return Column(
children: [
Padding(
padding: const EdgeInsets.fromLTRB(T.pagePadding, T.s16, T.pagePadding, T.s8),
child: Align(
alignment: AlignmentDirectional.centerStart,
child: Text(l10n.rideClasses, style: Theme.of(context).textTheme.titleMedium),
),
),
Expanded(
child: ListView.separated(
padding: const EdgeInsets.symmetric(horizontal: T.pagePadding),
itemCount: classes.length,
separatorBuilder: (_, __) => const SizedBox(height: T.s8),
itemBuilder: (context, index) {
final cls = classes[index];
return RideClassCard(
quoteClass: cls,
selected: state.selectedClass == cls.vehicleClass,
onTap: () => context.read<QuoteCubit>().selectClass(cls.vehicleClass),
);
},
),
),
SafeArea(
child: Padding(
padding: const EdgeInsets.all(T.pagePadding),
child: Column(
children: [
_PaymentRow(
method: state.paymentMethod,
onChanged: (m) => context.read<QuoteCubit>().setPaymentMethod(m),
),
const SizedBox(height: T.s12),
// زر طلب الرحلة — يستخدم TripBloc
BlocBuilder<TripBloc, TripState>(
builder: (context, tripState) {
final isLoading = tripState.requestStatus == TripRequestStatus.loading;
return SizedBox(
width: double.infinity,
child: TripzButton(
label: isLoading ? l10n.loading : l10n.requestRide,
onPressed: (state.selectedClass != null && !isLoading)
? () => _requestTrip(context, state)
: null,
return Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Padding(
padding: const EdgeInsets.symmetric(
horizontal: T.pagePadding),
child: Text(
l10n.rideClasses,
style: Theme.of(context)
.textTheme
.titleLarge
?.copyWith(
fontWeight: FontWeight.w800,
letterSpacing: -0.5,
),
),
),
const SizedBox(height: T.s12),
Expanded(
child: ListView.separated(
padding: const EdgeInsets.symmetric(
horizontal: T.pagePadding),
itemCount: classes.length,
separatorBuilder: (_, __) =>
const SizedBox(height: T.s12),
itemBuilder: (context, index) {
final cls = classes[index];
return RideClassCard(
quoteClass: cls,
selected: state.selectedClass ==
cls.vehicleClass,
onTap: () => context
.read<QuoteCubit>()
.selectClass(cls.vehicleClass),
);
},
),
],
),
),
),
],
);
},
),
// شريط الدفع وكود الخصم
Container(
padding: const EdgeInsets.fromLTRB(
T.pagePadding, T.s12, T.pagePadding, T.s8),
decoration: BoxDecoration(
color: cs.surface,
border: Border(
top: BorderSide(
color: cs.outlineVariant
.withValues(alpha: 0.3),
),
),
),
child: Column(
children: [
_PaymentRow(
method: state.paymentMethod,
onChanged: (m) => context
.read<QuoteCubit>()
.setPaymentMethod(m),
),
const SizedBox(height: T.s12),
_PromoRow(
controller: _promoController,
onApply: (code) => context
.read<QuoteCubit>()
.setCouponCode(code),
),
],
),
),
// زر طلب الرحلة
SafeArea(
top: false,
child: Padding(
padding: const EdgeInsets.fromLTRB(
T.pagePadding, 0, T.pagePadding, T.s12),
child: BlocBuilder<TripBloc, TripState>(
builder: (context, tripState) {
final isLoading =
tripState.requestStatus ==
TripRequestStatus.loading;
return TripzButton(
label: isLoading
? l10n.loading
: l10n.requestRide,
onPressed:
(state.selectedClass != null &&
!isLoading)
? () =>
_requestTrip(context, state)
: null,
);
},
),
),
),
],
);
},
),
),
],
),
),
),
@@ -274,7 +445,8 @@ class _PaymentRow extends StatelessWidget {
final cs = Theme.of(context).colorScheme;
return Container(
padding: const EdgeInsets.symmetric(horizontal: T.pagePadding, vertical: T.s12),
padding: const EdgeInsets.symmetric(
horizontal: T.pagePadding, vertical: T.s12),
decoration: BoxDecoration(
color: cs.surfaceContainerHighest,
borderRadius: BorderRadius.circular(T.r12),
@@ -282,11 +454,14 @@ class _PaymentRow extends StatelessWidget {
child: Row(
children: [
Icon(
method == 'wallet' ? Icons.account_balance_wallet_outlined : Icons.money_rounded,
method == 'wallet'
? Icons.account_balance_wallet_outlined
: Icons.money_rounded,
color: cs.onSurfaceVariant,
),
const SizedBox(width: T.s12),
Text(l10n.paymentMethod, style: Theme.of(context).textTheme.bodyMedium),
Text(l10n.paymentMethod,
style: Theme.of(context).textTheme.bodyMedium),
const Spacer(),
DropdownButton<String>(
value: method,
@@ -294,7 +469,8 @@ class _PaymentRow extends StatelessWidget {
isDense: true,
items: [
DropdownMenuItem(value: 'cash', child: Text(l10n.cash)),
DropdownMenuItem(value: 'wallet', child: Text(l10n.walletPayment)),
DropdownMenuItem(
value: 'wallet', child: Text(l10n.walletPayment)),
],
onChanged: (v) {
if (v != null) onChanged(v);
@@ -305,3 +481,60 @@ class _PaymentRow extends StatelessWidget {
);
}
}
class _PromoRow extends StatefulWidget {
final TextEditingController controller;
final ValueChanged<String?> onApply;
const _PromoRow({required this.controller, required this.onApply});
@override
State<_PromoRow> createState() => _PromoRowState();
}
class _PromoRowState extends State<_PromoRow> {
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context)!;
final cs = Theme.of(context).colorScheme;
return Container(
padding:
const EdgeInsets.symmetric(horizontal: T.pagePadding, vertical: T.s8),
decoration: BoxDecoration(
color: cs.surfaceContainerHighest,
borderRadius: BorderRadius.circular(T.r12),
),
child: Row(
children: [
Icon(
Icons.local_offer_outlined,
color: cs.onSurfaceVariant,
),
const SizedBox(width: T.s12),
Expanded(
child: TextField(
controller: widget.controller,
decoration: InputDecoration(
hintText: l10n.couponCode,
border: InputBorder.none,
isDense: true,
contentPadding: EdgeInsets.zero,
),
style: Theme.of(context).textTheme.bodyMedium,
),
),
TripzButton(
label: l10n.confirm,
style: TripzButtonStyle.text,
fullWidth: false,
onPressed: () {
final code = widget.controller.text.trim();
widget.onApply(code.isEmpty ? null : code);
},
),
],
),
);
}
}