lib/features/learning/language_learning_tour_detail_page.dartDart
import 'package:flutter/material.dart';
import '../../core/localization/app_localizations.dart';
import '../../core/theme/app_colors.dart';
import '../../models/language_learning_tour.dart';
import '../../models/localized_content.dart';
import '../../models/tour.dart';
import '../../models/transport_mode.dart';
import '../../widgets/tour_map.dart';
import '../../services/analytics_service.dart';
import 'language_learning_tour_run_page.dart';
import 'learning_unit_page.dart';
class LanguageLearningTourDetailPage extends StatelessWidget {
const LanguageLearningTourDetailPage({super.key, required this.tour});
final LanguageLearningTour tour;
Tour _mapTour(BuildContext context) {
final l10n = AppLocalizations.of(context);
final lang = Localizations.localeOf(context).languageCode;
String local(String key) => l10n.t(key);
return Tour(
id: 'learning-${tour.definition.id}',
title: LocalizedContent({lang: local(tour.definition.titleKey)}),
subtitle: LocalizedContent({lang: local(tour.definition.subtitleKey)}),
category: 'learning',
durationMinutes: tour.definition.durationMinutes,
distanceKm: 0,
highlight: false,
recommendedTransport: TransportMode.walking,
supportedTransportModes: const [TransportMode.walking],
stops: [
for (final stop in tour.stops)
if (stop.location?.poiId != null)
TourStop(
poiId: stop.location!.poiId!,
title: LocalizedContent({lang: stop.title}),
guideText: LocalizedContent({
lang: stop.units
.map((u) => '${u.phraseDe} — ${u.help}')
.join('\n'),
}),
walkMinutesFromPrevious: 0,
),
],
);
}
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
final mapTour = _mapTour(context);
return Scaffold(
appBar: AppBar(title: Text(l10n.t('learningToursTitle'))),
body: ListView(
padding: const EdgeInsets.fromLTRB(20, 6, 20, 110),
children: [
Text(l10n.t(tour.definition.titleKey),
style: Theme.of(context)
.textTheme
.headlineSmall
?.copyWith(fontWeight: FontWeight.w900)),
const SizedBox(height: 8),
Text(l10n.t(tour.definition.subtitleKey),
style: const TextStyle(color: AppColors.mutedInk, height: 1.35)),
const SizedBox(height: 14),
Wrap(spacing: 8, runSpacing: 8, children: [
Chip(
avatar: const Icon(Icons.place_outlined, size: 18),
label: Text(l10n
.tf('learningTourStops', {'n': '${tour.stops.length}'}))),
Chip(
avatar: const Icon(Icons.translate_rounded, size: 18),
label: Text(l10n
.tf('learningTourLessons', {'n': '${tour.lessonCount}'}))),
Chip(
avatar: const Icon(Icons.schedule_rounded, size: 18),
label: Text(l10n.tf('learningTourMinutes',
{'n': '${tour.definition.durationMinutes}'}))),
]),
if (mapTour.stops.length >= 2) ...[
const SizedBox(height: 18),
TourMap(tour: mapTour, height: 280),
],
const SizedBox(height: 24),
Text(l10n.t('learningTourRoute'),
style: Theme.of(context)
.textTheme
.titleLarge
?.copyWith(fontWeight: FontWeight.w900)),
const SizedBox(height: 10),
for (var i = 0; i < tour.stops.length; i++) ...[
_StopCard(index: i + 1, stop: tour.stops[i]),
if (i < tour.stops.length - 1) const SizedBox(height: 12),
],
],
),
bottomNavigationBar: SafeArea(
minimum: const EdgeInsets.all(16),
child: FilledButton.icon(
onPressed: tour.stops.isEmpty
? null
: () {
AnalyticsService.instance.track('learning_tour_start',
properties: {
'learning_tour_id': tour.definition.id,
'stop_count': tour.stops.length
});
Navigator.of(context).push(MaterialPageRoute(
builder: (_) => LanguageLearningTourRunPage(tour: tour),
));
},
icon: const Icon(Icons.play_arrow_rounded),
label: Text(l10n.t('learningTourStart')),
),
),
);
}
}
class _StopCard extends StatelessWidget {
const _StopCard({required this.index, required this.stop});
final int index;
final LanguageLearningTourStop stop;
@override
Widget build(BuildContext context) {
final l10n = AppLocalizations.of(context);
return Container(
padding: const EdgeInsets.all(16),
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(color: AppColors.line),
borderRadius: BorderRadius.circular(22)),
child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
Row(crossAxisAlignment: CrossAxisAlignment.start, children: [
CircleAvatar(
radius: 20,
backgroundColor: AppColors.ink,
child: Text('$index',
style: const TextStyle(
color: Colors.white, fontWeight: FontWeight.w900))),
const SizedBox(width: 12),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(stop.title,
style: const TextStyle(
fontSize: 17, fontWeight: FontWeight.w900)),
const SizedBox(height: 3),
Text(
l10n.tf(
'learningTourLessons', {'n': '${stop.units.length}'}),
style: const TextStyle(color: AppColors.mutedInk)),
])),
]),
const SizedBox(height: 12),
for (final unit in stop.units)
ListTile(
contentPadding: EdgeInsets.zero,
dense: true,
leading:
const Icon(Icons.translate_rounded, color: AppColors.heartRed),
title: Text(unit.phraseDe,
style: const TextStyle(fontWeight: FontWeight.w800)),
subtitle:
Text(unit.help, maxLines: 2, overflow: TextOverflow.ellipsis),
trailing: const Icon(Icons.chevron_right_rounded),
onTap: () => Navigator.of(context).push(MaterialPageRoute(
builder: (_) => LearningUnitPage(unit: unit))),
),
]),
);
}
}