major refactor

lib/components/calculator/calculator.dart

@@ -25,9 +25,6 @@ class StationAutocomplete extends StatefulWidget {
 class _StationAutocompleteState extends State<StationAutocomplete> {
   late final TextEditingController _controller;
 
-  // Simulated list of over 10,000 stations
-  final List<String> stations = List.generate(10000, (i) => 'Station $i');
-
   @override
   void initState() {
     super.initState();
@@ -50,15 +47,7 @@ class _StationAutocompleteState extends State<StationAutocomplete> {
         if (textEditingValue.text.isEmpty) {
           return const Iterable<String>.empty();
         }
-        final query = textEditingValue.text.toLowerCase();
-        final matches = widget.allStations
-            .map((s) => s.name)
-            .where((name) => name.toLowerCase().contains(query))
-            .toList();
-
-        matches.sort((a, b) => a.length.compareTo(b.length));
-
-        return matches.take(10);
+        return _findTopMatches(textEditingValue.text);
       },
       onSelected: (String selection) {
         _controller.text = selection;
@@ -73,19 +62,12 @@ class _StationAutocompleteState extends State<StationAutocomplete> {
               focusNode: focusNode,
               textInputAction: TextInputAction.done,
               onSubmitted: (_) {
-                final query = textEditingController.text.toLowerCase();
-                final matches = widget.allStations
-                    .map((s) => s.name)
-                    .where((name) => name.toLowerCase().contains(query))
-                    .toList();
-
-                if (matches.isNotEmpty) {
-                  matches.sort((a, b) => a.length.compareTo(b.length));
-                  final firstMatch = matches.first;
-                  _controller.text = firstMatch;
-                  widget.onChanged(firstMatch);
-                  focusNode.unfocus(); // optionally close keyboard
-                }
+                final matches = _findTopMatches(textEditingController.text);
+                final firstMatch = matches.isEmpty ? null : matches.first;
+                if (firstMatch == null) return;
+                _controller.text = firstMatch;
+                widget.onChanged(firstMatch);
+                focusNode.unfocus(); // optionally close keyboard
               },
               decoration: const InputDecoration(
                 labelText: 'Select station',
@@ -95,6 +77,42 @@ class _StationAutocompleteState extends State<StationAutocomplete> {
           },
     );
   }
+
+  Iterable<String> _findTopMatches(String rawQuery) {
+    final query = rawQuery.trim().toLowerCase();
+    if (query.isEmpty) return const <String>[];
+
+    // Keep a bounded, sorted list (by shortest name, then alpha) without
+    // sorting the entire match set.
+    final best = <String>[];
+    for (final station in widget.allStations) {
+      final name = station.name;
+      if (name.isEmpty) continue;
+      if (!name.toLowerCase().contains(query)) continue;
+
+      _insertCandidate(best, name, max: 10);
+    }
+    return best;
+  }
+
+  void _insertCandidate(List<String> best, String candidate, {required int max}) {
+    final existingIndex = best.indexOf(candidate);
+    if (existingIndex >= 0) return;
+
+    int insertAt = 0;
+    while (insertAt < best.length &&
+        _candidateCompare(best[insertAt], candidate) <= 0) {
+      insertAt++;
+    }
+    best.insert(insertAt, candidate);
+    if (best.length > max) best.removeLast();
+  }
+
+  int _candidateCompare(String a, String b) {
+    final byLength = a.length.compareTo(b.length);
+    if (byLength != 0) return byLength;
+    return a.compareTo(b);
+  }
 }
 
 class RouteCalculator extends StatefulWidget {
@@ -146,20 +164,28 @@ class _RouteCalculatorState extends State<RouteCalculator> {
       _routeResult = null;
     });
     final api = context.read<ApiService>(); // context is valid here
-    final res = await api.post('/route/distance2', {
-      'route': stations.where((s) => s.trim().isNotEmpty).toList(),
-    });
+    try {
+      final res = await api.post('/route/distance2', {
+        'route': stations.where((s) => s.trim().isNotEmpty).toList(),
+      });
 
-    if (res['error'] == false) {
-      setState(() {
-        _routeResult = RouteResult.fromJson(res);
-      });
-      final distance = (_routeResult?.distance ?? 0);
-      widget.onDistanceComputed?.call(distance);
-    } else {
-      setState(() {
-        _errorMessage = RouteError.fromJson(res["error_obj"][0]).msg;
-      });
+      if (res is Map && res['error'] == false) {
+        setState(() {
+          _routeResult = RouteResult.fromJson(Map<String, dynamic>.from(res));
+        });
+        final distance = (_routeResult?.distance ?? 0);
+        widget.onDistanceComputed?.call(distance);
+      } else if (res is Map && res['error_obj'] is List && res['error_obj'].isNotEmpty) {
+        setState(() {
+          _errorMessage = RouteError.fromJson(
+            Map<String, dynamic>.from(res['error_obj'][0] as Map),
+          ).msg;
+        });
+      } else {
+        setState(() => _errorMessage = 'Failed to calculate route.');
+      }
+    } catch (e) {
+      setState(() => _errorMessage = 'Failed to calculate route: $e');
     }
   }
 

lib/components/login/login.dart

@@ -151,6 +151,13 @@ class _LoginPanelContentState extends State<LoginPanelContent> {
 
   bool _loggingIn = false;
 
+  @override
+  void dispose() {
+    _usernameController.dispose();
+    _passwordController.dispose();
+    super.dispose();
+  }
+
   Future<void> login() async {
     final username = _usernameController.text;
     final password = _passwordController.text;

lib/components/pages/new_entry/new_entry.dart

@@ -0,0 +1,26 @@
+import 'dart:async';
+import 'dart:convert';
+
+import 'package:collection/collection.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:intl/intl.dart';
+import 'package:mileograph_flutter/components/calculator/calculator.dart';
+import 'package:mileograph_flutter/components/pages/traction.dart';
+import 'package:mileograph_flutter/objects/objects.dart';
+import 'package:mileograph_flutter/services/api_service.dart';
+import 'package:mileograph_flutter/services/data_service.dart';
+import 'package:mileograph_flutter/services/navigation_guard.dart';
+import 'package:provider/provider.dart';
+import 'package:shared_preferences/shared_preferences.dart';
+
+part 'new_entry_page.dart';
+part 'new_entry_drafts.dart';
+part 'new_entry_picker_pages.dart';
+part 'new_entry_models.dart';
+part 'new_entry_draft_logic.dart';
+part 'new_entry_submit_logic.dart';
+part 'new_entry_traction_logic.dart';
+
+const String _kDraftPrefsKey = 'new_entry_draft';
+const String _kDraftListPrefsKey = 'new_entry_drafts_list';

lib/components/pages/new_entry/new_entry_draft_logic.dart

@@ -0,0 +1,340 @@
+part of 'new_entry.dart';
+
+extension _NewEntryDraftLogic on _NewEntryPageState {
+  Future<bool> _handleExitIntent() async {
+    if (!mounted) return false;
+    if (_isEditing) return true;
+    if (_formIsEmpty()) return true;
+    if (_activeDraftId != null && !_draftChangedFromBaseline()) {
+      return true;
+    }
+    final choice = await _promptSaveDraft();
+    if (choice == _ExitChoice.cancel) return false;
+    if (choice == _ExitChoice.save) {
+      await _saveDraftEntry(draftId: _activeDraftId);
+    } else if (choice == _ExitChoice.discard) {
+      await _resetFormState(clearDraft: true);
+      _activeDraftId = null;
+    }
+    return true;
+  }
+
+  bool _draftChangedFromBaseline() {
+    if (_loadedDraftSnapshot == null) return true;
+    final current = _buildDraftSnapshot(
+      id: _activeDraftId ?? 'temp',
+      includeTimestamp: false,
+    );
+    return !_snapshotEquality.equals(_loadedDraftSnapshot, current);
+  }
+
+  bool _formIsEmpty() {
+    return _startController.text.trim().isEmpty &&
+        _endController.text.trim().isEmpty &&
+        _headcodeController.text.trim().isEmpty &&
+        _notesController.text.trim().isEmpty &&
+        _networkController.text.trim().isEmpty &&
+        _mileageController.text.trim().isEmpty &&
+        _routeResult == null &&
+        _tractionItems.length <= 1;
+  }
+
+  Future<_ExitChoice> _promptSaveDraft() async {
+    if (!mounted) return _ExitChoice.cancel;
+    final result = await showDialog<_ExitChoice>(
+      context: context,
+      barrierDismissible: false,
+      useRootNavigator: false,
+      builder: (_) => AlertDialog(
+        title: const Text('Save draft?'),
+        content: const Text(
+          'Do you want to save this entry as a draft before leaving?',
+        ),
+        actions: [
+          TextButton(
+            onPressed: () => Navigator.of(context).pop(_ExitChoice.discard),
+            child: const Text('No'),
+          ),
+          TextButton(
+            onPressed: () => Navigator.of(context).pop(_ExitChoice.save),
+            child: const Text('Yes'),
+          ),
+          TextButton(
+            onPressed: () => Navigator.of(context).pop(_ExitChoice.cancel),
+            child: const Text('Cancel'),
+          ),
+        ],
+      ),
+    );
+    return result ?? _ExitChoice.cancel;
+  }
+
+  Future<void> _openDrafts() async {
+    final selected = await Navigator.of(context).push<_StoredDraft>(
+      MaterialPageRoute(
+        builder: (_) => _DraftListPage(
+          loadDrafts: _loadSavedDrafts,
+          onDeleteDraft: _deleteDraft,
+        ),
+      ),
+    );
+    if (selected != null) {
+      _activeDraftId = selected.id;
+      await _loadDraftEntry(selected.data);
+    }
+  }
+
+  Future<void> _saveDraft() async {
+    if (_restoringDraft || !_draftPersistenceEnabled) return;
+    final prefs = await SharedPreferences.getInstance();
+    final draft = {
+      "date": _selectedDate.toIso8601String(),
+      "time": {"hour": _selectedTime.hour, "minute": _selectedTime.minute},
+      "start": _startController.text,
+      "end": _endController.text,
+      "headcode": _headcodeController.text,
+      "notes": _notesController.text,
+      "mileage": _mileageController.text,
+      "network": _networkController.text,
+      "useManualMileage": _useManualMileage,
+      "selectedTripId": _selectedTripId,
+      "routeResult": _routeResult == null
+          ? null
+          : {
+              "input_route": _routeResult!.inputRoute,
+              "calculated_route": _routeResult!.calculatedRoute,
+              "costs": _routeResult!.costs,
+              "distance": _routeResult!.distance,
+            },
+      "tractionItems": _serializeTractionItems(),
+    };
+    await prefs.setString(_kDraftPrefsKey, jsonEncode(draft));
+  }
+
+  Future<void> _clearDraft() async {
+    if (!_draftPersistenceEnabled) return;
+    final prefs = await SharedPreferences.getInstance();
+    await prefs.remove(_kDraftPrefsKey);
+  }
+
+  Future<List<_StoredDraft>> _loadSavedDrafts() async {
+    final prefs = await SharedPreferences.getInstance();
+    final raw = prefs.getString(_kDraftListPrefsKey);
+    if (raw == null || raw.isEmpty) return [];
+    try {
+      final decoded = jsonDecode(raw);
+      if (decoded is! List) return [];
+      return decoded
+          .whereType<Map>()
+          .map((e) => _StoredDraft.fromJson(Map<String, dynamic>.from(e)))
+          .toList()
+        ..sort((a, b) => b.savedAt.compareTo(a.savedAt));
+    } catch (_) {
+      return [];
+    }
+  }
+
+  Future<void> _deleteDraft(String id) async {
+    final drafts = await _loadSavedDrafts();
+    drafts.removeWhere((d) => d.id == id);
+    final prefs = await SharedPreferences.getInstance();
+    await prefs.setString(
+      _kDraftListPrefsKey,
+      jsonEncode(drafts.map((e) => e.toJson()).toList()),
+    );
+    if (_activeDraftId == id) {
+      _activeDraftId = null;
+    }
+  }
+
+  Future<String> _saveDraftEntry({String? draftId}) async {
+    final id = draftId ?? DateTime.now().microsecondsSinceEpoch.toString();
+    final snapshot = _buildDraftSnapshot(id: id);
+    final drafts = await _loadSavedDrafts();
+    final now = DateTime.now();
+    final existingIndex = drafts.indexWhere((d) => d.id == id);
+    final newDraft = _StoredDraft(id: id, savedAt: now, data: snapshot);
+    if (existingIndex >= 0) {
+      drafts[existingIndex] = newDraft;
+    } else {
+      drafts.insert(0, newDraft);
+    }
+    final prefs = await SharedPreferences.getInstance();
+    await prefs.setString(
+      _kDraftListPrefsKey,
+      jsonEncode(drafts.map((e) => e.toJson()).toList()),
+    );
+    _activeDraftId = id;
+    _loadedDraftSnapshot = _buildDraftSnapshot(id: id, includeTimestamp: false);
+    return id;
+  }
+
+  Map<String, dynamic> _buildDraftSnapshot({
+    required String id,
+    bool includeTimestamp = true,
+  }) {
+    final routeStations = _routeResult?.calculatedRoute ?? [];
+    final startVal = _useManualMileage
+        ? _startController.text.trim()
+        : (routeStations.isNotEmpty ? routeStations.first : '');
+    final endVal = _useManualMileage
+        ? _endController.text.trim()
+        : (routeStations.isNotEmpty ? routeStations.last : '');
+    final mileageVal = _useManualMileage
+        ? double.tryParse(_mileageController.text.trim()) ?? 0
+        : (_routeResult?.distance ?? 0);
+    final tractionPayload = _buildTractionPayload();
+    final payload = _useManualMileage
+        ? {
+            "leg_trip": _selectedTripId,
+            "leg_start": startVal,
+            "leg_end": endVal,
+            "leg_begin_time": _legDateTime.toIso8601String(),
+            "leg_network": _networkController.text.trim(),
+            "leg_distance": mileageVal,
+            "isKilometers": false,
+            "leg_notes": _notesController.text.trim(),
+            "leg_headcode": _headcodeController.text.trim(),
+            "locos": tractionPayload,
+          }
+        : {
+            "leg_trip": _selectedTripId,
+            "leg_begin_time": _legDateTime.toIso8601String(),
+            "leg_route": routeStations,
+            "leg_notes": _notesController.text.trim(),
+            "leg_headcode": _headcodeController.text.trim(),
+            "leg_network": _networkController.text.trim(),
+            "locos": tractionPayload,
+            "leg_mileage": _routeResult?.distance ?? mileageVal,
+          };
+    return {
+      "id": id,
+      if (includeTimestamp) "saved_at": DateTime.now().toIso8601String(),
+      "mode": _useManualMileage ? 'manual' : 'auto',
+      "payload": payload,
+      "routeResult": _routeResult == null
+          ? null
+          : {
+              "input_route": _routeResult!.inputRoute,
+              "calculated_route": _routeResult!.calculatedRoute,
+              "costs": _routeResult!.costs,
+              "distance": _routeResult!.distance,
+            },
+      "tractionItems": _serializeTractionItems(),
+    };
+  }
+
+  Future<void> _loadDraftEntry(Map<String, dynamic> data) async {
+    if (!mounted) return;
+    final payloadRaw = data['payload'];
+    if (payloadRaw is! Map) return;
+    final payload = Map<String, dynamic>.from(payloadRaw);
+    final mode = data['mode'] as String?;
+    final useManual =
+        mode == 'manual' ||
+        (payload.containsKey('leg_distance') &&
+            !payload.containsKey('leg_route'));
+    final beginStr = payload['leg_begin_time'] as String?;
+    final beginTime = beginStr == null
+        ? DateTime.now()
+        : DateTime.tryParse(beginStr) ?? DateTime.now();
+    final tripRaw = payload['leg_trip'];
+    final tripId = tripRaw is num ? tripRaw.toInt() : null;
+
+    List<String> routeStations = [];
+    RouteResult? restoredRouteResult;
+    if (!useManual) {
+      if (payload['leg_route'] is List) {
+        routeStations = (payload['leg_route'] as List)
+            .map((e) => e.toString())
+            .toList();
+      }
+      final rr = data['routeResult'];
+      if (rr is Map<String, dynamic>) {
+        restoredRouteResult = RouteResult(
+          inputRoute:
+              (rr['input_route'] as List?)?.map((e) => e.toString()).toList() ??
+                  routeStations,
+          calculatedRoute:
+              (rr['calculated_route'] as List?)
+                      ?.map((e) => e.toString())
+                      .toList() ??
+                  routeStations,
+          costs:
+              (rr['costs'] as List?)
+                      ?.map((e) => (e as num).toDouble())
+                      .toList() ??
+                  [],
+          distance:
+              (rr['distance'] as num?)?.toDouble() ??
+                  (payload['leg_mileage'] as num?)?.toDouble() ??
+                  0,
+        );
+      } else if (routeStations.isNotEmpty) {
+        restoredRouteResult = RouteResult(
+          inputRoute: routeStations,
+          calculatedRoute: routeStations,
+          costs: const [],
+          distance: (payload['leg_mileage'] as num?)?.toDouble() ?? 0,
+        );
+      }
+    }
+
+    _restoringDraft = true;
+    _setState(() {
+      _useManualMileage = useManual;
+      _selectedDate = beginTime;
+      _selectedTime = TimeOfDay.fromDateTime(beginTime);
+      _selectedTripId = tripId == null || tripId == 0 ? null : tripId;
+      _routeResult = restoredRouteResult;
+      _headcodeController.text = (payload['leg_headcode'] as String? ?? '')
+          .toUpperCase();
+      _networkController.text = (payload['leg_network'] as String? ?? '')
+          .toUpperCase();
+      _notesController.text = payload['leg_notes'] ?? '';
+
+      if (useManual) {
+        _startController.text = payload['leg_start'] ?? '';
+        _endController.text = payload['leg_end'] ?? '';
+        final miles = (payload['leg_distance'] as num?)?.toDouble();
+        _mileageController.text = miles == null || miles == 0
+            ? ''
+            : miles.toStringAsFixed(2);
+      } else {
+        _startController.text =
+            routeStations.isNotEmpty ? routeStations.first : '';
+        _endController.text =
+            routeStations.isNotEmpty ? routeStations.last : '';
+        final dist = _routeResult?.distance ?? 0;
+        _mileageController.text = dist == 0 ? '' : dist.toStringAsFixed(2);
+      }
+
+      final tractionRaw = data['tractionItems'];
+      if (tractionRaw is List) {
+        _restoreTractionItems(
+          List<Map<String, dynamic>>.from(tractionRaw.cast<Map>()),
+        );
+      } else {
+        _tractionItems
+          ..clear()
+          ..add(_TractionItem.marker());
+      }
+      _lastSubmittedSnapshot = null;
+      final idRaw = data['id'];
+      if (idRaw != null) {
+        _activeDraftId = idRaw.toString();
+      }
+    });
+    final baselineId =
+        _activeDraftId ?? data['id']?.toString() ?? DateTime.now().toString();
+    _loadedDraftSnapshot = _buildDraftSnapshot(
+      id: baselineId,
+      includeTimestamp: false,
+    );
+    _restoringDraft = false;
+  }
+
+  Future<void> _loadDraft() async {
+    // legacy single draft no-op
+  }
+}

lib/components/pages/new_entry/new_entry_drafts.dart

@@ -0,0 +1,179 @@
+part of 'new_entry.dart';
+
+enum _ExitChoice { save, discard, cancel }
+
+class _StoredDraft {
+  final String id;
+  final DateTime savedAt;
+  final Map<String, dynamic> data;
+
+  _StoredDraft({required this.id, required this.savedAt, required this.data});
+
+  factory _StoredDraft.fromJson(Map<String, dynamic> json) {
+    final savedAt = DateTime.tryParse(json['saved_at'] ?? '') ?? DateTime.now();
+    final data = Map<String, dynamic>.from(json['data'] as Map? ?? {});
+    final embeddedId = data['id']?.toString();
+    return _StoredDraft(
+      id:
+          json['id']?.toString() ??
+          embeddedId ??
+          savedAt.microsecondsSinceEpoch.toString(),
+      savedAt: savedAt,
+      data: data,
+    );
+  }
+
+  Map<String, dynamic> toJson() {
+    return {"id": id, "saved_at": savedAt.toIso8601String(), "data": data};
+  }
+}
+
+class _DraftListPage extends StatelessWidget {
+  const _DraftListPage({required this.loadDrafts, required this.onDeleteDraft});
+  final Future<List<_StoredDraft>> Function() loadDrafts;
+  final Future<void> Function(String id) onDeleteDraft;
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(title: const Text('Drafts')),
+      body: FutureBuilder<List<_StoredDraft>>(
+        future: loadDrafts(),
+        builder: (context, snapshot) {
+          if (snapshot.connectionState == ConnectionState.waiting) {
+            return const Center(child: CircularProgressIndicator());
+          }
+          final drafts = snapshot.data ?? const [];
+          if (drafts.isEmpty) {
+            return const Center(child: Text('No drafts saved yet.'));
+          }
+          return _DraftListBody(drafts: drafts, onDelete: onDeleteDraft);
+        },
+      ),
+    );
+  }
+}
+
+class _DraftListBody extends StatefulWidget {
+  const _DraftListBody({required this.drafts, required this.onDelete});
+  final List<_StoredDraft> drafts;
+  final Future<void> Function(String id) onDelete;
+
+  @override
+  State<_DraftListBody> createState() => _DraftListBodyState();
+}
+
+class _DraftListBodyState extends State<_DraftListBody> {
+  late final List<_StoredDraft> _drafts = List.of(widget.drafts);
+
+  @override
+  Widget build(BuildContext context) {
+    return ListView.separated(
+      itemCount: _drafts.length,
+      separatorBuilder: (context, _) => const Divider(height: 0),
+      itemBuilder: (context, index) {
+        final draft = _drafts[index];
+        final routeLine = _draftSubtitle(draft);
+        final metaLine = _draftMetaLine(draft);
+        return ListTile(
+          title: Text(DateFormat.yMMMd().add_jm().format(draft.savedAt)),
+          subtitle: Column(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              if (routeLine != null) Text(routeLine),
+              if (metaLine.isNotEmpty) Text(metaLine),
+            ],
+          ),
+          trailing: Row(
+            mainAxisSize: MainAxisSize.min,
+            children: [
+              IconButton(
+                tooltip: 'Delete draft',
+                icon: const Icon(Icons.delete),
+                onPressed: () => _confirmDelete(context, draft),
+              ),
+              const Icon(Icons.chevron_right),
+            ],
+          ),
+          onTap: () => Navigator.of(context).pop(draft),
+        );
+      },
+    );
+  }
+
+  Future<void> _confirmDelete(BuildContext context, _StoredDraft draft) async {
+    final confirmed = await showDialog<bool>(
+      context: context,
+      builder: (dialogCtx) => AlertDialog(
+        title: const Text('Delete draft?'),
+        content: const Text('This draft will be removed permanently.'),
+        actions: [
+          TextButton(
+            onPressed: () => Navigator.of(dialogCtx).pop(false),
+            child: const Text('Cancel'),
+          ),
+          TextButton(
+            onPressed: () => Navigator.of(dialogCtx).pop(true),
+            child: const Text('Delete'),
+          ),
+        ],
+      ),
+    );
+    if (confirmed != true) return;
+    await widget.onDelete(draft.id);
+    if (!mounted) return;
+    setState(() {
+      _drafts.removeWhere((d) => d.id == draft.id);
+    });
+  }
+
+  String? _draftSubtitle(_StoredDraft draft) {
+    final payload = draft.data['payload'];
+    if (payload is! Map) return null;
+    final map = Map<String, dynamic>.from(payload);
+    String start = map['leg_start']?.toString() ?? '';
+    String end = map['leg_end']?.toString() ?? '';
+    if (start.isEmpty && end.isEmpty) {
+      if (map['leg_route'] is List && (map['leg_route'] as List).isNotEmpty) {
+        start = (map['leg_route'] as List).first.toString();
+        end = (map['leg_route'] as List).last.toString();
+      }
+    }
+    if (start.isEmpty && end.isEmpty) return null;
+    if (start.isNotEmpty && end.isNotEmpty) {
+      return '$start → $end';
+    }
+    return start.isNotEmpty ? start : end;
+  }
+
+  String _draftMetaLine(_StoredDraft draft) {
+    final payload = draft.data['payload'];
+    if (payload is! Map) return '';
+    final map = Map<String, dynamic>.from(payload);
+    final parts = <String>[];
+    if ((map['leg_trip'] as int? ?? 0) != 0) {
+      parts.add('Trip ${map['leg_trip']}');
+    }
+    final headcode = (map['leg_headcode'] as String? ?? '').trim();
+    if (headcode.isNotEmpty) parts.add('Headcode $headcode');
+    final network = (map['leg_network'] as String? ?? '').trim();
+    if (network.isNotEmpty) parts.add('Network $network');
+    final notes = (map['leg_notes'] as String? ?? '').trim();
+    if (notes.isNotEmpty) parts.add('Notes');
+    final mileage =
+        (map['leg_distance'] as num?)?.toDouble() ??
+        (map['leg_mileage'] as num?)?.toDouble();
+    if (mileage != null && mileage > 0) {
+      parts.add('${mileage.toStringAsFixed(1)} mi');
+    } else if (map['leg_route'] is List &&
+        (map['leg_route'] as List).isNotEmpty) {
+      parts.add('Route ${(map['leg_route'] as List).length} stops');
+    }
+    final locos = map['locos'];
+    if (locos is List && locos.isNotEmpty) {
+      parts.add('${locos.length} traction');
+    }
+    return parts.join(' • ');
+  }
+}
+

lib/components/pages/new_entry/new_entry_models.dart

@@ -0,0 +1,25 @@
+part of 'new_entry.dart';
+
+class _TractionItem {
+  final LocoSummary? loco;
+  final bool powering;
+  final bool isMarker;
+
+  _TractionItem({
+    required this.loco,
+    this.powering = true,
+    this.isMarker = false,
+  });
+
+  factory _TractionItem.marker() =>
+      _TractionItem(loco: null, powering: false, isMarker: true);
+
+  _TractionItem copyWith({LocoSummary? loco, bool? powering, bool? isMarker}) {
+    return _TractionItem(
+      loco: loco ?? this.loco,
+      powering: powering ?? this.powering,
+      isMarker: isMarker ?? this.isMarker,
+    );
+  }
+}
+

lib/components/pages/new_entry/new_entry_page.dart

@@ -0,0 +1,752 @@
+part of 'new_entry.dart';
+
+class NewEntryPage extends StatefulWidget {
+  const NewEntryPage({super.key, this.editLegId});
+
+  final int? editLegId;
+
+  @override
+  State<NewEntryPage> createState() => _NewEntryPageState();
+}
+
+class _NewEntryPageState extends State<NewEntryPage> {
+  final _formKey = GlobalKey<FormState>();
+  DateTime _selectedDate = DateTime.now();
+  TimeOfDay _selectedTime = TimeOfDay.now();
+  final _startController = TextEditingController();
+  final _endController = TextEditingController();
+  final _headcodeController = TextEditingController();
+  final _notesController = TextEditingController();
+  final _mileageController = TextEditingController();
+  final _networkController = TextEditingController();
+  bool _submitting = false;
+  bool _useManualMileage = false;
+  RouteResult? _routeResult;
+  final List<_TractionItem> _tractionItems = [_TractionItem.marker()];
+  int? _selectedTripId;
+  bool _restoringDraft = false;
+  bool _loadingEdit = false;
+  String? _loadError;
+  Map<String, dynamic>? _lastSubmittedSnapshot;
+  Map<String, dynamic>? _loadedDraftSnapshot;
+  final DeepCollectionEquality _snapshotEquality =
+      const DeepCollectionEquality();
+  String? _activeDraftId;
+
+  bool get _isEditing => widget.editLegId != null;
+  bool get _draftPersistenceEnabled =>
+      false; // legacy single draft disabled in favor of draft list
+
+  @override
+  void initState() {
+    super.initState();
+    NavigationGuard.register(_handleExitIntent);
+    // legacy single-draft auto-save listeners removed in favor of explicit multi-draft flow
+    Future.microtask(() {
+      if (!mounted) return;
+      final data = context.read<DataService>();
+      data.fetchClassList();
+      data.fetchTrips();
+      if (_draftPersistenceEnabled) {
+        _loadDraft();
+      }
+      if (_isEditing && widget.editLegId != null) {
+        _loadLegForEdit(widget.editLegId!);
+      }
+    });
+  }
+
+  @override
+  void dispose() {
+    NavigationGuard.unregister(_handleExitIntent);
+    _startController.dispose();
+    _endController.dispose();
+    _headcodeController.dispose();
+    _notesController.dispose();
+    _mileageController.dispose();
+    _networkController.dispose();
+    super.dispose();
+  }
+
+  void _setState(VoidCallback fn) {
+    if (!mounted) return;
+    // ignore: invalid_use_of_protected_member
+    setState(fn);
+  }
+
+  Widget _buildTripSelector(BuildContext context) {
+    final trips = context.watch<DataService>().tripList;
+    final sorted = [...trips]..sort((a, b) => b.tripId.compareTo(a.tripId));
+    final tripIds = sorted.map((t) => t.tripId).toSet();
+    final selectedValue =
+        (_selectedTripId != null && tripIds.contains(_selectedTripId))
+        ? _selectedTripId
+        : null;
+    return Row(
+      children: [
+        Expanded(
+          child: DropdownButtonFormField<int?>(
+            value: selectedValue,
+            decoration: const InputDecoration(
+              labelText: 'Trip',
+              border: OutlineInputBorder(),
+            ),
+            items: [
+              const DropdownMenuItem(value: null, child: Text('No trip')),
+              ...sorted.map(
+                (t) => DropdownMenuItem<int?>(
+                  value: t.tripId,
+                  child: Text(t.tripName),
+                ),
+              ),
+            ],
+            onChanged: (val) {
+              setState(() => _selectedTripId = val);
+              _saveDraft();
+            },
+          ),
+        ),
+        const SizedBox(width: 8),
+        ElevatedButton.icon(
+          onPressed: () => _showAddTripDialog(context),
+          icon: const Icon(Icons.add),
+          label: const Text('New Trip'),
+        ),
+      ],
+    );
+  }
+
+  Future<void> _showAddTripDialog(BuildContext context) async {
+    final controller = TextEditingController();
+    final result = await showDialog<String>(
+      context: context,
+      builder: (dialogContext) => AlertDialog(
+        title: const Text('New Trip'),
+        content: TextField(
+          controller: controller,
+          decoration: const InputDecoration(labelText: 'Trip name'),
+          autofocus: true,
+        ),
+        actions: [
+          TextButton(
+            onPressed: () => Navigator.of(dialogContext).pop(),
+            child: const Text('Cancel'),
+          ),
+          ElevatedButton(
+            onPressed: () => Navigator.of(dialogContext).pop(controller.text.trim()),
+            child: const Text('Add'),
+          ),
+        ],
+      ),
+    );
+    if (!context.mounted) {
+      controller.dispose();
+      return;
+    }
+    if (result != null && result.isNotEmpty) {
+      final api = context.read<ApiService>();
+      final data = context.read<DataService>();
+      final messenger = ScaffoldMessenger.maybeOf(context);
+      try {
+        await api.put('/trips/new', {"trip_name": result});
+        await data.fetchTrips();
+        if (!context.mounted) return;
+        final trips = data.tripList;
+        final match = trips.firstWhere(
+          (t) => t.tripName == result,
+          orElse: () => trips.isNotEmpty
+              ? trips.first
+              : TripSummary(tripId: 0, tripName: result, tripMileage: 0),
+        );
+        setState(() => _selectedTripId = match.tripId);
+        _saveDraft();
+      } catch (e) {
+        if (!context.mounted) return;
+        messenger?.showSnackBar(
+          SnackBar(content: Text('Failed to add trip: $e')),
+        );
+      } finally {
+        controller.dispose();
+      }
+    } else {
+      controller.dispose();
+    }
+  }
+
+  Future<void> _openCalculator() async {
+    final result = await Navigator.of(context).push<RouteResult>(
+      MaterialPageRoute(
+        builder: (_) => _CalculatorPickerPage(
+          onResult: (res) => Navigator.of(context).pop(res),
+        ),
+      ),
+    );
+    if (result != null) {
+      setState(() {
+        _routeResult = result;
+        _mileageController.text = result.distance.toStringAsFixed(2);
+        _useManualMileage = false;
+      });
+      _saveDraft();
+    }
+  }
+
+  Future<void> _pickDate() async {
+    final picked = await showDatePicker(
+      context: context,
+      initialDate: _selectedDate,
+      firstDate: DateTime(1970),
+      lastDate: DateTime.now().add(const Duration(days: 365)),
+    );
+    if (picked != null) setState(() => _selectedDate = picked);
+    _saveDraft();
+  }
+
+  Future<void> _pickTime() async {
+    final picked = await showTimePicker(
+      context: context,
+      initialTime: _selectedTime,
+    );
+    if (picked != null) {
+      setState(() => _selectedTime = picked);
+      _saveDraft();
+    }
+  }
+
+  Future<void> _loadLegForEdit(int legId) async {
+    setState(() {
+      _loadingEdit = true;
+      _loadError = null;
+    });
+    try {
+      final api = context.read<ApiService>();
+      final json = await api.get('/legs/by-id/$legId');
+      if (!mounted) return;
+      if (json is! Map<String, dynamic>) {
+        throw Exception('Unexpected response for leg $legId');
+      }
+      final beginTime =
+          DateTime.tryParse(json['leg_begin_time'] ?? '') ?? _selectedDate;
+      final routeStations = _parseRouteStations(json['leg_route']);
+      final mileageVal = (json['leg_mileage'] as num?)?.toDouble() ?? 0.0;
+      final useManual = routeStations.isEmpty;
+      final routeResult = useManual
+          ? null
+          : RouteResult(
+              inputRoute: routeStations,
+              calculatedRoute: routeStations,
+              costs: const <double>[],
+              distance: mileageVal,
+            );
+      final tractionItems = _buildTractionFromApi(
+        (json['locos'] as List? ?? [])
+            .whereType<Map>()
+            .map((e) => Map<String, dynamic>.from(e))
+            .toList(),
+      );
+
+      _restoringDraft = true;
+      setState(() {
+        final tripRaw = json['leg_trip'];
+        final tripId = tripRaw is num ? tripRaw.toInt() : null;
+        _selectedTripId = tripId == null || tripId == 0 ? null : tripId;
+        _selectedDate = beginTime;
+        _selectedTime = TimeOfDay.fromDateTime(beginTime);
+        _useManualMileage = useManual;
+        _routeResult = routeResult;
+        _startController.text = json['leg_start'] ?? '';
+        _endController.text = json['leg_end'] ?? '';
+        _headcodeController.text = (json['leg_headcode'] as String? ?? '')
+            .toUpperCase();
+        _notesController.text = json['leg_notes'] ?? '';
+        _networkController.text = (json['leg_network'] as String? ?? '')
+            .toUpperCase();
+        _mileageController.text = mileageVal == 0
+            ? ''
+            : mileageVal.toStringAsFixed(2);
+        _tractionItems
+          ..clear()
+          ..addAll(tractionItems);
+        if (_tractionItems.where((e) => e.isMarker).isEmpty) {
+          _tractionItems.insert(0, _TractionItem.marker());
+        }
+        _lastSubmittedSnapshot = null;
+      });
+    } catch (e) {
+      if (!mounted) return;
+      setState(() {
+        _loadError = 'Failed to load entry: $e';
+      });
+      ScaffoldMessenger.of(
+        context,
+      ).showSnackBar(SnackBar(content: Text('Failed to load entry: $e')));
+    } finally {
+      _restoringDraft = false;
+      if (mounted) {
+        setState(() => _loadingEdit = false);
+      }
+    }
+  }
+
+  List<String> _parseRouteStations(dynamic raw) {
+    if (raw is List) {
+      return raw.map((e) => e.toString()).toList();
+    }
+    if (raw is String) {
+      final trimmed = raw.trim();
+      if (trimmed.isEmpty) return [];
+      try {
+        final decoded = jsonDecode(trimmed);
+        if (decoded is List) {
+          return decoded.map((e) => e.toString()).toList();
+        }
+      } catch (_) {
+        // ignore and try alternative parsing
+      }
+      if (trimmed.startsWith('[') && trimmed.endsWith(']')) {
+        try {
+          final replaced = trimmed.replaceAll("'", '"');
+          final decoded = jsonDecode(replaced);
+          if (decoded is List) {
+            return decoded.map((e) => e.toString()).toList();
+          }
+        } catch (_) {}
+      }
+      if (trimmed.contains('->')) {
+        return trimmed
+            .split('->')
+            .map((e) => e.trim())
+            .where((e) => e.isNotEmpty)
+            .toList();
+      }
+      if (trimmed.contains(',')) {
+        return trimmed
+            .split(',')
+            .map((e) => e.trim())
+            .where((e) => e.isNotEmpty)
+            .toList();
+      }
+      return [trimmed];
+    }
+    return [];
+  }
+
+  DateTime get _legDateTime => DateTime(
+    _selectedDate.year,
+    _selectedDate.month,
+    _selectedDate.day,
+    _selectedTime.hour,
+    _selectedTime.minute,
+  );
+
+  @override
+  Widget build(BuildContext context) {
+    Widget body;
+    if (_isEditing && _loadingEdit) {
+      body = const Center(child: CircularProgressIndicator());
+    } else if (_isEditing && _loadError != null) {
+      body = Center(child: Text(_loadError!));
+    } else {
+      final isMobile = MediaQuery.of(context).size.width < 700;
+      body = Form(
+        key: _formKey,
+        child: LayoutBuilder(
+          builder: (context, constraints) {
+            final twoCol = !isMobile && constraints.maxWidth > 1000;
+            final tractionEmpty = _tractionItems.length == 1;
+            final mileageEmpty = !_useManualMileage && _routeResult == null;
+            final balancePanels = twoCol && tractionEmpty && mileageEmpty;
+            final balancedHeight = balancePanels ? 165.0 : null;
+
+            final detailPanel = _section('Details', [
+              Row(
+                children: [
+                  TextButton.icon(
+                    style: TextButton.styleFrom(
+                      padding: EdgeInsets.zero,
+                      minimumSize: const Size(0, 36),
+                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
+                    ),
+                    onPressed: _isEditing ? null : _openDrafts,
+                    icon: const Icon(Icons.list_alt, size: 16),
+                    label: const Text('Drafts'),
+                  ),
+                  const Spacer(),
+                  TextButton.icon(
+                    style: TextButton.styleFrom(
+                      padding: EdgeInsets.zero,
+                      minimumSize: const Size(0, 36),
+                      tapTargetSize: MaterialTapTargetSize.shrinkWrap,
+                    ),
+                    onPressed: _submitting
+                        ? null
+                        : () => _resetFormState(clearDraft: true),
+                    icon: const Icon(Icons.clear, size: 16),
+                    label: const Text('Clear form'),
+                  ),
+                ],
+              ),
+              _buildTripSelector(context),
+              Row(
+                children: [
+                  Expanded(
+                    child: OutlinedButton.icon(
+                      onPressed: _pickDate,
+                      icon: const Icon(Icons.calendar_today),
+                      label: Text(DateFormat.yMMMd().format(_selectedDate)),
+                    ),
+                  ),
+                  const SizedBox(width: 12),
+                  Expanded(
+                    child: OutlinedButton.icon(
+                      onPressed: _pickTime,
+                      icon: const Icon(Icons.schedule),
+                      label: Text(_selectedTime.format(context)),
+                    ),
+                  ),
+                ],
+              ),
+              if (_useManualMileage)
+                Row(
+                  children: [
+                    Expanded(
+                      child: TextFormField(
+                        controller: _startController,
+                        decoration: const InputDecoration(
+                          labelText: 'From',
+                          border: OutlineInputBorder(),
+                        ),
+                        validator: (v) => !_useManualMileage
+                            ? null
+                            : (v == null || v.isEmpty ? 'Required' : null),
+                      ),
+                    ),
+                    const SizedBox(width: 12),
+                    Expanded(
+                      child: TextFormField(
+                        controller: _endController,
+                        decoration: const InputDecoration(
+                          labelText: 'To',
+                          border: OutlineInputBorder(),
+                        ),
+                        validator: (v) => !_useManualMileage
+                            ? null
+                            : (v == null || v.isEmpty ? 'Required' : null),
+                      ),
+                    ),
+                  ],
+                ),
+              TextFormField(
+                controller: _headcodeController,
+                textCapitalization: TextCapitalization.characters,
+                inputFormatters: const [_UpperCaseTextFormatter()],
+                decoration: const InputDecoration(
+                  labelText: 'Headcode',
+                  border: OutlineInputBorder(),
+                ),
+              ),
+              TextFormField(
+                controller: _networkController,
+                textCapitalization: TextCapitalization.characters,
+                inputFormatters: const [_UpperCaseTextFormatter()],
+                decoration: const InputDecoration(
+                  labelText: 'Network',
+                  border: OutlineInputBorder(),
+                ),
+              ),
+              TextFormField(
+                controller: _notesController,
+                maxLines: 3,
+                decoration: const InputDecoration(
+                  labelText: 'Notes',
+                  border: OutlineInputBorder(),
+                ),
+              ),
+            ]);
+
+            final tractionPanel = _section('Traction', [
+              Align(
+                alignment: Alignment.centerLeft,
+                child: ElevatedButton.icon(
+                  onPressed: _openTractionPicker,
+                  icon: const Icon(Icons.search),
+                  label: const Text('Search traction'),
+                ),
+              ),
+              _buildTractionList(),
+            ], minHeight: balancedHeight);
+
+            final mileagePanel = _section(
+              'Mileage',
+              [
+                if (!_useManualMileage)
+                  Align(
+                    alignment: Alignment.centerLeft,
+                    child: TextButton.icon(
+                      style: TextButton.styleFrom(
+                        padding: const EdgeInsets.symmetric(
+                          horizontal: 10,
+                          vertical: 6,
+                        ),
+                        minimumSize: const Size(0, 32),
+                      ),
+                      onPressed: _openCalculator,
+                      icon: const Icon(Icons.calculate, size: 18),
+                      label: const Text('Open mileage calculator'),
+                    ),
+                  ),
+                if (_useManualMileage)
+                  TextFormField(
+                    controller: _mileageController,
+                    keyboardType: const TextInputType.numberWithOptions(
+                      decimal: true,
+                    ),
+                    decoration: const InputDecoration(
+                      labelText: 'Mileage (mi)',
+                      border: OutlineInputBorder(),
+                    ),
+                  )
+                else if (_routeResult != null)
+                  ListTile(
+                    contentPadding: EdgeInsets.zero,
+                    title: const Text('Calculated mileage'),
+                    subtitle: Text(
+                      '${_routeResult!.distance.toStringAsFixed(2)} mi',
+                    ),
+                  )
+                else
+                  const Padding(
+                    padding: EdgeInsets.symmetric(vertical: 8.0),
+                    child: Text(
+                      'No route selected. Use the calculator to add a route.',
+                    ),
+                  ),
+              ],
+              trailing: FilterChip(
+                label: Text(_useManualMileage ? 'Manual' : 'Automatic'),
+                selected: _useManualMileage,
+                onSelected: (val) {
+                  setState(() => _useManualMileage = val);
+                  _saveDraft();
+                },
+              ),
+              minHeight: balancedHeight,
+            );
+
+            return SingleChildScrollView(
+              padding: const EdgeInsets.all(16),
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.stretch,
+                children: [
+                  detailPanel,
+                  const SizedBox(height: 16),
+                  twoCol
+                      ? Row(
+                          crossAxisAlignment: CrossAxisAlignment.start,
+                          children: [
+                            Expanded(child: tractionPanel),
+                            const SizedBox(width: 16),
+                            Expanded(child: mileagePanel),
+                          ],
+                        )
+                      : Column(
+                          children: [
+                            tractionPanel,
+                            const SizedBox(height: 16),
+                            mileagePanel,
+                          ],
+                        ),
+                  const SizedBox(height: 12),
+                  ElevatedButton.icon(
+                    onPressed: _submitting ? null : _submit,
+                    icon: _submitting
+                        ? const SizedBox(
+                            height: 16,
+                            width: 16,
+                            child: CircularProgressIndicator(strokeWidth: 2),
+                          )
+                        : const Icon(Icons.send),
+                    label: Text(
+                      _submitting
+                          ? (_isEditing ? 'Saving...' : 'Submitting...')
+                          : (_isEditing ? 'Save changes' : 'Submit entry'),
+                    ),
+                  ),
+                ],
+              ),
+            );
+          },
+        ),
+      );
+    }
+
+    return PopScope(
+      canPop: false,
+      onPopInvokedWithResult: (didPop, _) async {
+        if (didPop) return;
+        final allow = await _handleExitIntent();
+        if (allow && context.mounted) {
+          Navigator.of(context).maybePop();
+        }
+      },
+      child: Scaffold(
+        appBar: _isEditing
+            ? AppBar(
+                leading: IconButton(
+                  icon: const Icon(Icons.arrow_back),
+                  onPressed: () async {
+                    if (!await _handleExitIntent()) return;
+                    if (!context.mounted) return;
+                    Navigator.of(context).maybePop();
+                  },
+                ),
+                title: const Text('Edit entry'),
+              )
+            : null,
+        body: body,
+      ),
+    );
+  }
+
+  Widget _buildTractionList() {
+    if (_tractionItems.length == 1) {
+      return const Padding(
+        padding: EdgeInsets.symmetric(vertical: 8.0),
+        child: Text('No traction selected yet.'),
+      );
+    }
+    return ReorderableListView.builder(
+      shrinkWrap: true,
+      physics: const NeverScrollableScrollPhysics(),
+      buildDefaultDragHandles: false,
+      onReorder: (oldIndex, newIndex) {
+        if (newIndex > oldIndex) newIndex -= 1;
+        setState(() {
+          final item = _tractionItems.removeAt(oldIndex);
+          _tractionItems.insert(newIndex, item);
+        });
+        _saveDraft();
+      },
+      itemCount: _tractionItems.length,
+      itemBuilder: (context, index) {
+        final item = _tractionItems[index];
+        if (item.isMarker) {
+          return Card(
+            key: const ValueKey('marker'),
+            color: Theme.of(context).colorScheme.surfaceContainerHighest,
+            child: const ListTile(
+              leading: Icon(Icons.train),
+              title: Text('Rolling stock marker'),
+              subtitle: Text(
+                'Place locomotives above/below. Positions set relative to this.',
+              ),
+            ),
+          );
+        }
+        final loco = item.loco!;
+        final markerIndex = _tractionItems.indexWhere(
+          (element) => element.isMarker,
+        );
+        final pos = index > markerIndex
+            ? -(index - markerIndex)
+            : (markerIndex - 1) - index;
+        return Card(
+          key: ValueKey('${loco.locoClass}-${loco.number}-$index'),
+          child: ListTile(
+            leading: ReorderableDragStartListener(
+              index: index,
+              child: const Icon(Icons.drag_indicator),
+            ),
+            title: Text('${loco.locoClass} ${loco.number}'),
+            subtitle: Text('${loco.name ?? ''} · Position $pos'),
+            trailing: Row(
+              mainAxisSize: MainAxisSize.min,
+              children: [
+                const Text('Powering'),
+                Switch(
+                  value: item.powering,
+                  onChanged: (v) {
+                    setState(() {
+                      _tractionItems[index] = item.copyWith(powering: v);
+                    });
+                    _saveDraft();
+                  },
+                ),
+                IconButton(
+                  icon: const Icon(Icons.delete),
+                  onPressed: () {
+                    setState(() {
+                      _tractionItems.removeAt(index);
+                    });
+                    _saveDraft();
+                  },
+                ),
+              ],
+            ),
+          ),
+        );
+      },
+    );
+  }
+
+  Widget _section(
+    String title,
+    List<Widget> children, {
+    Widget? trailing,
+    double? minHeight,
+  }) {
+    Widget card = Card(
+      child: Padding(
+        padding: const EdgeInsets.all(12.0),
+        child: Column(
+          crossAxisAlignment: CrossAxisAlignment.stretch,
+          children: [
+            Row(
+              mainAxisAlignment: MainAxisAlignment.spaceBetween,
+              children: [
+                Text(
+                  title,
+                  style: Theme.of(context).textTheme.titleMedium?.copyWith(
+                    fontWeight: FontWeight.bold,
+                  ),
+                ),
+                if (trailing != null) trailing,
+              ],
+            ),
+            const SizedBox(height: 8),
+            ...children.map(
+              (w) => Padding(
+                padding: const EdgeInsets.symmetric(vertical: 6),
+                child: w,
+              ),
+            ),
+          ],
+        ),
+      ),
+    );
+
+    if (minHeight != null) {
+      card = ConstrainedBox(
+        constraints: BoxConstraints(minHeight: minHeight),
+        child: card,
+      );
+    }
+
+    return card;
+  }
+}
+
+class _UpperCaseTextFormatter extends TextInputFormatter {
+  const _UpperCaseTextFormatter();
+
+  @override
+  TextEditingValue formatEditUpdate(
+    TextEditingValue oldValue,
+    TextEditingValue newValue,
+  ) {
+    return newValue.copyWith(
+      text: newValue.text.toUpperCase(),
+      selection: newValue.selection,
+    );
+  }
+}

lib/components/pages/new_entry/new_entry_picker_pages.dart

@@ -0,0 +1,21 @@
+part of 'new_entry.dart';
+
+class _CalculatorPickerPage extends StatelessWidget {
+  const _CalculatorPickerPage({required this.onResult});
+  final ValueChanged<RouteResult> onResult;
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        leading: IconButton(
+          icon: const Icon(Icons.arrow_back),
+          onPressed: () => Navigator.of(context).pop(),
+        ),
+        title: const Text('Mileage calculator'),
+      ),
+      body: RouteCalculator(onApplyRoute: onResult),
+    );
+  }
+}
+

lib/components/pages/new_entry/new_entry_submit_logic.dart

@@ -0,0 +1,216 @@
+part of 'new_entry.dart';
+
+extension _NewEntrySubmitLogic on _NewEntryPageState {
+  Future<bool> _validateRequiredFields() async {
+    final missing = <String>[];
+
+    if (_useManualMileage) {
+      if (_startController.text.trim().isEmpty) missing.add('From');
+      if (_endController.text.trim().isEmpty) missing.add('To');
+      final mileageText = _mileageController.text.trim();
+      if (double.tryParse(mileageText) == null) {
+        missing.add('Mileage');
+      }
+    } else {
+      if (_routeResult == null || _routeResult!.calculatedRoute.isEmpty) {
+        missing.add('Route');
+      }
+    }
+
+    if (_networkController.text.trim().isEmpty) {
+      missing.add('Network');
+    }
+
+    if (missing.isEmpty) return true;
+    if (!mounted) return false;
+
+    final fieldList = missing.join(', ');
+    await showDialog<void>(
+      context: context,
+      builder: (_) => AlertDialog(
+        title: const Text('Required field missing'),
+        content: Text(
+          missing.length == 1
+              ? 'Please fill the following field: $fieldList.'
+              : 'Please fill the following fields: $fieldList.',
+        ),
+        actions: [
+          TextButton(
+            onPressed: () => Navigator.of(context).pop(),
+            child: const Text('OK'),
+          ),
+        ],
+      ),
+    );
+    return false;
+  }
+
+  Future<void> _submit() async {
+    if (!_formKey.currentState!.validate()) return;
+    if (!await _validateRequiredFields()) return;
+    final routeStations = _routeResult?.calculatedRoute ?? [];
+    final startVal = _useManualMileage
+        ? _startController.text.trim()
+        : (routeStations.isNotEmpty ? routeStations.first : '');
+    final endVal = _useManualMileage
+        ? _endController.text.trim()
+        : (routeStations.isNotEmpty ? routeStations.last : '');
+    final mileageVal = _useManualMileage
+        ? double.tryParse(_mileageController.text.trim()) ?? 0
+        : (_routeResult?.distance ?? 0);
+    final tractionPayload = _buildTractionPayload();
+    final snapshot = _buildSubmissionSnapshot(
+      routeStations: routeStations,
+      startVal: startVal,
+      endVal: endVal,
+      mileageVal: mileageVal,
+      tractionPayload: tractionPayload,
+    );
+    if (_lastSubmittedSnapshot != null &&
+        _snapshotEquality.equals(_lastSubmittedSnapshot, snapshot)) {
+      final confirmed = await _confirmDuplicateSubmission();
+      if (!confirmed) return;
+    }
+    if (!mounted) return;
+    final api = context.read<ApiService>();
+    final dataService = context.read<DataService>();
+    final messenger = ScaffoldMessenger.maybeOf(context);
+    _setState(() => _submitting = true);
+    final isEditingExisting = _isEditing && widget.editLegId != null;
+
+    try {
+      if (_useManualMileage) {
+        final body = {
+          if (isEditingExisting) "leg_id": widget.editLegId,
+          "leg_trip": _selectedTripId,
+          "leg_start": startVal,
+          "leg_end": endVal,
+          "leg_begin_time": _legDateTime.toIso8601String(),
+          "leg_network": _networkController.text.trim(),
+          "leg_distance": mileageVal,
+          "isKilometers": false,
+          "leg_notes": _notesController.text.trim(),
+          "leg_headcode": _headcodeController.text.trim(),
+          "locos": tractionPayload,
+        };
+        if (isEditingExisting) {
+          await api.put('/update', body);
+        } else {
+          await api.post('/add/manual', body);
+        }
+      } else {
+        final body = {
+          if (isEditingExisting) "leg_id": widget.editLegId,
+          "leg_trip": _selectedTripId,
+          "leg_begin_time": _legDateTime.toIso8601String(),
+          "leg_route": routeStations,
+          "leg_notes": _notesController.text.trim(),
+          "leg_headcode": _headcodeController.text.trim(),
+          "leg_network": _networkController.text.trim(),
+          "locos": tractionPayload,
+        };
+        if (isEditingExisting) {
+          await api.put('/update', body);
+        } else {
+          await api.post('/add', body);
+        }
+      }
+      if (!mounted) return;
+      dataService.refreshLegs();
+      if (!mounted) return;
+      messenger?.showSnackBar(
+        SnackBar(
+          content: Text(isEditingExisting ? 'Entry updated' : 'Entry submitted'),
+        ),
+      );
+      _lastSubmittedSnapshot = snapshot;
+      _activeDraftId = null;
+    } catch (e) {
+      if (!mounted) return;
+      messenger?.showSnackBar(
+        SnackBar(content: Text('Failed to submit: $e')),
+      );
+    } finally {
+      if (mounted) _setState(() => _submitting = false);
+    }
+  }
+
+  Map<String, dynamic> _buildSubmissionSnapshot({
+    required List<String> routeStations,
+    required String startVal,
+    required String endVal,
+    required double mileageVal,
+    required List<Map<String, dynamic>> tractionPayload,
+  }) {
+    return {
+      "legId": widget.editLegId,
+      "useManualMileage": _useManualMileage,
+      "tripId": _selectedTripId,
+      "legDateTime": _legDateTime.toIso8601String(),
+      "start": startVal,
+      "end": endVal,
+      "routeStations": routeStations,
+      "mileage": mileageVal,
+      "network": _networkController.text.trim(),
+      "notes": _notesController.text.trim(),
+      "headcode": _headcodeController.text.trim(),
+      "locos": tractionPayload,
+      "routeResult": _routeResult == null
+          ? null
+          : {
+              "input_route": _routeResult!.inputRoute,
+              "calculated_route": _routeResult!.calculatedRoute,
+              "costs": _routeResult!.costs,
+              "distance": _routeResult!.distance,
+            },
+    };
+  }
+
+  Future<bool> _confirmDuplicateSubmission() async {
+    if (!mounted) return false;
+    final result = await showDialog<bool>(
+      context: context,
+      builder: (_) => AlertDialog(
+        title: const Text('Duplicate entry?'),
+        content: const Text('Entry already added, are you sure?'),
+        actions: [
+          TextButton(
+            onPressed: () => Navigator.of(context).pop(false),
+            child: const Text('Cancel'),
+          ),
+          ElevatedButton(
+            onPressed: () => Navigator.of(context).pop(true),
+            child: const Text('Submit anyway'),
+          ),
+        ],
+      ),
+    );
+    return result ?? false;
+  }
+
+  Future<void> _resetFormState({bool clearDraft = false}) async {
+    _formKey.currentState?.reset();
+    _startController.clear();
+    _endController.clear();
+    _headcodeController.clear();
+    _notesController.clear();
+    _mileageController.clear();
+    _networkController.clear();
+    final now = DateTime.now();
+    _setState(() {
+      _selectedDate = now;
+      _selectedTime = TimeOfDay.fromDateTime(now);
+      _useManualMileage = false;
+      _routeResult = null;
+      _tractionItems
+        ..clear()
+        ..add(_TractionItem.marker());
+      _selectedTripId = null;
+      _submitting = false;
+      _activeDraftId = null;
+    });
+    if (clearDraft) {
+      await _clearDraft();
+    }
+  }
+}

lib/components/pages/new_entry/new_entry_traction_logic.dart

@@ -0,0 +1,147 @@
+part of 'new_entry.dart';
+
+extension _NewEntryTractionLogic on _NewEntryPageState {
+  Future<void> _openTractionPicker() async {
+    final selectedKeys = _tractionItems
+        .where((e) => !e.isMarker && e.loco != null)
+        .map((e) => '${e.loco!.locoClass}-${e.loco!.number}')
+        .toSet();
+    await Navigator.of(context).push(
+      MaterialPageRoute(
+        builder: (_) => TractionPage(
+          selectionMode: true,
+          selectedKeys: selectedKeys,
+          onSelect: (loco) {
+            final markerIndex = _tractionItems.indexWhere(
+              (element) => element.isMarker,
+            );
+            final key = '${loco.locoClass}-${loco.number}';
+            _setState(() {
+              final existingIndex = _tractionItems.indexWhere(
+                (e) =>
+                    !e.isMarker &&
+                    e.loco != null &&
+                    '${e.loco!.locoClass}-${e.loco!.number}' == key,
+              );
+              if (existingIndex != -1) {
+                _tractionItems.removeAt(existingIndex);
+              } else {
+                _tractionItems.insert(
+                  markerIndex,
+                  _TractionItem(loco: loco, powering: true),
+                );
+              }
+            });
+            _saveDraft();
+          },
+        ),
+      ),
+    );
+  }
+
+  List<_TractionItem> _buildTractionFromApi(
+    List<Map<String, dynamic>> locoData,
+  ) {
+    if (locoData.isEmpty) return [_TractionItem.marker()];
+    final sorted = [...locoData]
+      ..sort((a, b) {
+        return _allocPos(b).compareTo(_allocPos(a));
+      });
+    final leading = sorted.where((e) => _allocPos(e) >= 0);
+    final trailing = sorted.where((e) => _allocPos(e) < 0);
+    return [
+      ...leading.map(_mapLocoToTractionItem),
+      _TractionItem.marker(),
+      ...trailing.map(_mapLocoToTractionItem),
+    ];
+  }
+
+  int _allocPos(Map<String, dynamic> loco) =>
+      (loco['alloc_pos'] as num?)?.toInt() ?? 0;
+
+  _TractionItem _mapLocoToTractionItem(Map<String, dynamic> loco) {
+    final poweringRaw = loco['alloc_powering'];
+    final powering = poweringRaw == true || poweringRaw == 1;
+    return _TractionItem(loco: LocoSummary.fromJson(loco), powering: powering);
+  }
+
+  List<Map<String, dynamic>> _buildTractionPayload() {
+    final markerIndex = _tractionItems.indexWhere(
+      (element) => element.isMarker,
+    );
+    final payload = <Map<String, dynamic>>[];
+    for (var i = 0; i < _tractionItems.length; i++) {
+      final item = _tractionItems[i];
+      if (item.isMarker || item.loco == null) continue;
+      int allocPos;
+      if (i > markerIndex) {
+        allocPos = -(i - markerIndex);
+      } else {
+        allocPos = (markerIndex - 1) - i;
+      }
+      payload.add({
+        "loco_type": item.loco!.type,
+        "loco_number": item.loco!.number,
+        "alloc_pos": allocPos,
+        "alloc_powering": item.powering ? 1 : 0,
+      });
+    }
+    return payload;
+  }
+
+  List<Map<String, dynamic>> _serializeTractionItems() {
+    return _tractionItems
+        .map(
+          (item) => {
+            "isMarker": item.isMarker,
+            "powering": item.powering,
+            "loco": item.loco == null
+                ? null
+                : {
+                    "id": item.loco!.id,
+                    "type": item.loco!.type,
+                    "number": item.loco!.number,
+                    "class": item.loco!.locoClass,
+                    "name": item.loco!.name,
+                    "operator": item.loco!.operator,
+                    "notes": item.loco!.notes,
+                    "evn": item.loco!.evn,
+                  },
+          },
+        )
+        .toList();
+  }
+
+  void _restoreTractionItems(List<Map<String, dynamic>> items) {
+    final restored = <_TractionItem>[];
+    for (final item in items) {
+      final locoData = item['loco'] as Map<String, dynamic>?;
+      LocoSummary? loco;
+      if (locoData != null) {
+        loco = LocoSummary(
+          locoId: locoData['id'] ?? 0,
+          locoType: locoData['type'] ?? '',
+          locoNumber: locoData['number'] ?? '',
+          locoName: locoData['name'] ?? '',
+          locoClass: locoData['class'] ?? '',
+          locoOperator: locoData['operator'] ?? '',
+          locoNotes: locoData['notes'],
+          locoEvn: locoData['evn'],
+        );
+      }
+      restored.add(
+        _TractionItem(
+          loco: loco,
+          powering: item['powering'] ?? true,
+          isMarker: item['isMarker'] ?? false,
+        ),
+      );
+    }
+    if (restored.where((e) => e.isMarker).isEmpty) {
+      restored.insert(0, _TractionItem.marker());
+    }
+    _tractionItems
+      ..clear()
+      ..addAll(restored);
+  }
+}

lib/components/pages/traction.dart

@@ -1,728 +1,2 @@
-import 'dart:convert';
+export 'traction/traction.dart';
 
-import 'package:flutter/material.dart';
-import 'package:go_router/go_router.dart';
-import 'package:mileograph_flutter/components/traction/traction_card.dart';
-import 'package:mileograph_flutter/objects/objects.dart';
-import 'package:mileograph_flutter/services/data_service.dart';
-import 'package:provider/provider.dart';
-import 'package:shared_preferences/shared_preferences.dart';
-
-class TractionPage extends StatefulWidget {
-  const TractionPage({
-    super.key,
-    this.selectionMode = false,
-    this.onSelect,
-    this.selectedKeys = const {},
-  });
-
-  final bool selectionMode;
-  final ValueChanged<LocoSummary>? onSelect;
-  final Set<String> selectedKeys;
-
-  @override
-  State<TractionPage> createState() => _TractionPageState();
-}
-
-class _TractionPageState extends State<TractionPage> {
-  static const String _prefsKey = 'traction_search_state_v1';
-  final _classController = TextEditingController();
-  final _classFocusNode = FocusNode();
-  final _numberController = TextEditingController();
-  final _nameController = TextEditingController();
-  bool _mileageFirst = true;
-  bool _initialised = false;
-  bool _showAdvancedFilters = false;
-  String? _selectedClass;
-  late Set<String> _selectedKeys;
-
-  final Map<String, TextEditingController> _dynamicControllers = {};
-  final Map<String, String?> _enumSelections = {};
-  bool _restoredFromPrefs = false;
-
-  @override
-  void initState() {
-    super.initState();
-    _classController.addListener(_onClassTextChanged);
-  }
-
-  @override
-  void didChangeDependencies() {
-    super.didChangeDependencies();
-    if (!_initialised) {
-      _initialised = true;
-      _selectedKeys = {...widget.selectedKeys};
-      WidgetsBinding.instance.addPostFrameCallback((_) {
-        _initialLoad();
-      });
-    }
-  }
-
-  Future<void> _initialLoad() async {
-    final data = context.read<DataService>();
-    await _restoreSearchState();
-    data.fetchClassList();
-    data.fetchEventFields();
-    await _refreshTraction();
-  }
-
-  Future<void> _restoreSearchState() async {
-    if (widget.selectionMode) return;
-    if (_restoredFromPrefs) return;
-    _restoredFromPrefs = true;
-    try {
-      final prefs = await SharedPreferences.getInstance();
-      final raw = prefs.getString(_prefsKey);
-      if (raw == null || raw.trim().isEmpty) return;
-      final decoded = jsonDecode(raw);
-      if (decoded is! Map) return;
-
-      final classText = decoded['classText']?.toString();
-      final numberText = decoded['number']?.toString();
-      final nameText = decoded['name']?.toString();
-      final selectedClass = decoded['selectedClass']?.toString();
-      final mileageFirst = decoded['mileageFirst'];
-      final showAdvanced = decoded['showAdvancedFilters'];
-
-      if (classText != null) _classController.text = classText;
-      if (numberText != null) _numberController.text = numberText;
-      if (nameText != null) _nameController.text = nameText;
-
-      final dynamicValues = <String, String>{};
-      final enumValues = <String, String?>{};
-      final dynamicRaw = decoded['dynamic'];
-      if (dynamicRaw is Map) {
-        for (final entry in dynamicRaw.entries) {
-          final key = entry.key.toString();
-          final val = entry.value?.toString() ?? '';
-          dynamicValues[key] = val;
-        }
-      }
-      final enumRaw = decoded['enum'];
-      if (enumRaw is Map) {
-        for (final entry in enumRaw.entries) {
-          enumValues[entry.key.toString()] = entry.value?.toString();
-        }
-      }
-
-      for (final entry in dynamicValues.entries) {
-        _dynamicControllers.putIfAbsent(
-          entry.key,
-          () => TextEditingController(text: entry.value),
-        );
-        _dynamicControllers[entry.key]?.text = entry.value;
-      }
-      for (final entry in enumValues.entries) {
-        _enumSelections[entry.key] = entry.value;
-      }
-
-      if (!mounted) return;
-      setState(() {
-        _selectedClass = (selectedClass != null && selectedClass.trim().isNotEmpty)
-            ? selectedClass
-            : null;
-        if (mileageFirst is bool) _mileageFirst = mileageFirst;
-        if (showAdvanced is bool) _showAdvancedFilters = showAdvanced;
-      });
-    } catch (_) {
-      // Ignore preference restore failures.
-    }
-  }
-
-  Future<void> _persistSearchState() async {
-    if (widget.selectionMode) return;
-    final payload = <String, dynamic>{
-      'classText': _classController.text,
-      'number': _numberController.text,
-      'name': _nameController.text,
-      'selectedClass': _selectedClass,
-      'mileageFirst': _mileageFirst,
-      'showAdvancedFilters': _showAdvancedFilters,
-      'dynamic': _dynamicControllers.map((k, v) => MapEntry(k, v.text)),
-      'enum': _enumSelections,
-    };
-
-    try {
-      final prefs = await SharedPreferences.getInstance();
-      await prefs.setString(_prefsKey, jsonEncode(payload));
-    } catch (_) {
-      // Ignore persistence failures.
-    }
-  }
-
-  @override
-  void dispose() {
-    _classController.removeListener(_onClassTextChanged);
-    _persistSearchState();
-    _classController.dispose();
-    _classFocusNode.dispose();
-    _numberController.dispose();
-    _nameController.dispose();
-    for (final controller in _dynamicControllers.values) {
-      controller.dispose();
-    }
-    super.dispose();
-  }
-
-  bool get _hasFilters {
-    final dynamicFieldsUsed =
-        _dynamicControllers.values.any(
-          (controller) => controller.text.trim().isNotEmpty,
-        ) ||
-        _enumSelections.values.any(
-          (value) => (value ?? '').toString().trim().isNotEmpty,
-        );
-
-    return [
-          _selectedClass,
-          _classController.text,
-          _numberController.text,
-          _nameController.text,
-        ].any((value) => (value ?? '').toString().trim().isNotEmpty) ||
-        dynamicFieldsUsed;
-  }
-
-  Future<void> _refreshTraction({bool append = false}) async {
-    final data = context.read<DataService>();
-    final filters = <String, dynamic>{};
-    final name = _nameController.text.trim();
-    if (name.isNotEmpty) filters['name'] = name;
-    _dynamicControllers.forEach((key, controller) {
-      final value = controller.text.trim();
-      if (value.isNotEmpty) filters[key] = value;
-    });
-    _enumSelections.forEach((key, value) {
-      if (value != null && value.toString().trim().isNotEmpty) {
-        filters[key] = value;
-      }
-    });
-    final hadOnly = !_hasFilters;
-    await data.fetchTraction(
-      hadOnly: hadOnly,
-      locoClass: _selectedClass ?? _classController.text.trim(),
-      locoNumber: _numberController.text.trim(),
-      offset: append ? data.traction.length : 0,
-      append: append,
-      filters: filters,
-      mileageFirst: _mileageFirst,
-    );
-    await _persistSearchState();
-  }
-
-  void _clearFilters() {
-    for (final controller in [
-      _classController,
-      _numberController,
-      _nameController,
-    ]) {
-      controller.clear();
-    }
-    for (final controller in _dynamicControllers.values) {
-      controller.clear();
-    }
-    _enumSelections.clear();
-    setState(() {
-      _selectedClass = null;
-      _mileageFirst = true;
-    });
-    _refreshTraction();
-  }
-
-  void _onClassTextChanged() {
-    if (_selectedClass != null &&
-        _classController.text.trim() != (_selectedClass ?? '')) {
-      setState(() {
-        _selectedClass = null;
-      });
-    }
-  }
-
-  List<EventField> _activeEventFields(List<EventField> fields) {
-    return fields
-        .where(
-          (field) => ![
-            'class',
-            'number',
-            'name',
-            'build date',
-            'build_date',
-          ].contains(field.name.toLowerCase()),
-        )
-        .toList();
-  }
-
-  void _ensureControllersForFields(List<EventField> fields) {
-    for (final field in fields) {
-      if (field.enumValues != null) {
-        _enumSelections.putIfAbsent(field.name, () => null);
-      } else {
-        _dynamicControllers.putIfAbsent(
-          field.name,
-          () => TextEditingController(),
-        );
-      }
-    }
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    final data = context.watch<DataService>();
-    final traction = data.traction;
-    final classOptions = data.locoClasses;
-    final isMobile = MediaQuery.of(context).size.width < 700;
-    _ensureControllersForFields(data.eventFields);
-    final extraFields = _activeEventFields(data.eventFields);
-
-    final listView = RefreshIndicator(
-      onRefresh: _refreshTraction,
-      child: ListView(
-        padding: const EdgeInsets.all(16),
-        physics: const AlwaysScrollableScrollPhysics(),
-        children: [
-          Row(
-            crossAxisAlignment: CrossAxisAlignment.start,
-            children: [
-              Expanded(
-                child: Column(
-                  crossAxisAlignment: CrossAxisAlignment.start,
-                  children: [
-                    Text(
-                      'Fleet',
-                      style: Theme.of(context).textTheme.labelMedium,
-                    ),
-                    const SizedBox(height: 2),
-                    Text(
-                      'Traction',
-                      style: Theme.of(context).textTheme.headlineSmall,
-                    ),
-                  ],
-                ),
-              ),
-              Row(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  IconButton(
-                    tooltip: 'Refresh',
-                    onPressed: _refreshTraction,
-                    icon: const Icon(Icons.refresh),
-                  ),
-                  const SizedBox(width: 8),
-                  FilledButton.icon(
-                    onPressed: () async {
-                      final createdClass = await context.push<String>(
-                        '/traction/new',
-                      );
-                      if (createdClass != null && createdClass.isNotEmpty) {
-                        _classController.text = createdClass;
-                        _selectedClass = createdClass;
-                        if (mounted) {
-                          _refreshTraction();
-                        }
-                      } else if (mounted && createdClass == '') {
-                        _refreshTraction();
-                      }
-                    },
-                    icon: const Icon(Icons.add),
-                    label: const Text('New Traction'),
-                  ),
-                ],
-              ),
-            ],
-          ),
-          const SizedBox(height: 12),
-          Card(
-            child: Padding(
-              padding: const EdgeInsets.all(12),
-              child: Column(
-                crossAxisAlignment: CrossAxisAlignment.stretch,
-                children: [
-                  Row(
-                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
-                    children: [
-                      Text(
-                        'Filters',
-                        style: Theme.of(context).textTheme.titleMedium,
-                      ),
-                      TextButton(
-                        onPressed: _clearFilters,
-                        child: const Text('Clear'),
-                      ),
-                    ],
-                  ),
-                  const SizedBox(height: 8),
-                  Wrap(
-                    spacing: 12,
-                    runSpacing: 12,
-                    children: [
-                      SizedBox(
-                        width: isMobile ? double.infinity : 240,
-                        child: RawAutocomplete<String>(
-                          textEditingController: _classController,
-                          focusNode: _classFocusNode,
-                          optionsBuilder: (TextEditingValue textEditingValue) {
-                            final query = textEditingValue.text.toLowerCase();
-                            if (query.isEmpty) {
-                              return classOptions;
-                            }
-                            return classOptions.where(
-                              (c) => c.toLowerCase().contains(query),
-                            );
-                          },
-                          fieldViewBuilder:
-                              (
-                                context,
-                                controller,
-                                focusNode,
-                                onFieldSubmitted,
-                              ) {
-                                return TextField(
-                                  controller: controller,
-                                  focusNode: focusNode,
-                                  decoration: const InputDecoration(
-                                    labelText: 'Class',
-                                    border: OutlineInputBorder(),
-                                  ),
-                                  onSubmitted: (_) => _refreshTraction(),
-                                );
-                              },
-                          optionsViewBuilder: (context, onSelected, options) {
-                            final optionList = options.toList();
-                            if (optionList.isEmpty) {
-                              return const SizedBox.shrink();
-                            }
-                            final maxWidth = isMobile
-                                ? MediaQuery.of(context).size.width - 64
-                                : 240.0;
-                            return Align(
-                              alignment: Alignment.topLeft,
-                              child: Material(
-                                elevation: 4,
-                                child: ConstrainedBox(
-                                  constraints: BoxConstraints(
-                                    maxWidth: maxWidth,
-                                    maxHeight: 240,
-                                  ),
-                                  child: ListView.builder(
-                                    padding: EdgeInsets.zero,
-                                    shrinkWrap: true,
-                                    itemCount: optionList.length,
-                                    itemBuilder: (context, index) {
-                                      final option = optionList[index];
-                                      return ListTile(
-                                        title: Text(option),
-                                        onTap: () => onSelected(option),
-                                      );
-                                    },
-                                  ),
-                                ),
-                              ),
-                            );
-                          },
-                          onSelected: (String selection) {
-                            setState(() {
-                              _selectedClass = selection;
-                              _classController.text = selection;
-                            });
-                            _refreshTraction();
-                          },
-                        ),
-                      ),
-                      SizedBox(
-                        width: isMobile ? double.infinity : 220,
-                        child: TextField(
-                          controller: _numberController,
-                          decoration: const InputDecoration(
-                            labelText: 'Number',
-                            border: OutlineInputBorder(),
-                          ),
-                          onSubmitted: (_) => _refreshTraction(),
-                        ),
-                      ),
-                      SizedBox(
-                        width: isMobile ? double.infinity : 220,
-                        child: TextField(
-                          controller: _nameController,
-                          decoration: const InputDecoration(
-                            labelText: 'Name',
-                            border: OutlineInputBorder(),
-                          ),
-                          onSubmitted: (_) => _refreshTraction(),
-                        ),
-                      ),
-                      FilterChip(
-                        label: Text(
-                          _mileageFirst ? 'Mileage first' : 'Number order',
-                        ),
-                        selected: _mileageFirst,
-                        onSelected: (v) {
-                          setState(() => _mileageFirst = v);
-                          _refreshTraction();
-                        },
-                      ),
-                      TextButton.icon(
-                        onPressed: () => setState(
-                          () => _showAdvancedFilters = !_showAdvancedFilters,
-                        ),
-                        icon: Icon(
-                          _showAdvancedFilters
-                              ? Icons.expand_less
-                              : Icons.expand_more,
-                        ),
-                        label: Text(
-                          _showAdvancedFilters
-                              ? 'Hide filters'
-                              : 'More filters',
-                        ),
-                      ),
-                      ElevatedButton.icon(
-                        onPressed: _refreshTraction,
-                        icon: const Icon(Icons.search),
-                        label: const Text('Search'),
-                      ),
-                    ],
-                  ),
-                  AnimatedCrossFade(
-                    crossFadeState: _showAdvancedFilters
-                        ? CrossFadeState.showFirst
-                        : CrossFadeState.showSecond,
-                    duration: const Duration(milliseconds: 200),
-                    firstChild: Padding(
-                      padding: const EdgeInsets.only(top: 12.0),
-                      child: data.isEventFieldsLoading
-                          ? const Center(
-                              child: Padding(
-                                padding: EdgeInsets.all(8.0),
-                                child: CircularProgressIndicator(
-                                  strokeWidth: 2,
-                                ),
-                              ),
-                            )
-                          : extraFields.isEmpty
-                          ? const Text('No extra filters available right now.')
-                          : Wrap(
-                              spacing: 12,
-                              runSpacing: 12,
-                              children: extraFields
-                                  .map(
-                                    (field) => _buildFilterInput(
-                                      context,
-                                      field,
-                                      isMobile,
-                                    ),
-                                  )
-                                  .toList(),
-                            ),
-                    ),
-                    secondChild: const SizedBox.shrink(),
-                  ),
-                ],
-              ),
-            ),
-          ),
-          const SizedBox(height: 12),
-          Stack(
-            children: [
-              if (data.isTractionLoading && traction.isEmpty)
-                const Padding(
-                  padding: EdgeInsets.symmetric(vertical: 32.0),
-                  child: Center(child: CircularProgressIndicator()),
-                )
-              else if (traction.isEmpty)
-                Card(
-                  child: Padding(
-                    padding: const EdgeInsets.all(16.0),
-                    child: Column(
-                      crossAxisAlignment: CrossAxisAlignment.start,
-                      children: [
-                        Text(
-                          'No traction found',
-                          style: Theme.of(context).textTheme.titleMedium?.copyWith(
-                            fontWeight: FontWeight.w700,
-                          ),
-                        ),
-                        const SizedBox(height: 8),
-                        const Text('Try relaxing the filters or sync again.'),
-                      ],
-                    ),
-                  ),
-                )
-              else
-                Column(
-                  children: [
-                    ...traction.map(
-                      (loco) => TractionCard(
-                        loco: loco,
-                        selectionMode: widget.selectionMode,
-                        isSelected: _isSelected(loco),
-                        onShowInfo: () => showTractionDetails(context, loco),
-                        onOpenTimeline: () => _openTimeline(loco),
-                        onOpenLegs: () => _openLegs(loco),
-                        onToggleSelect:
-                            widget.selectionMode ? () => _toggleSelection(loco) : null,
-                      ),
-                    ),
-                    if (data.tractionHasMore || data.isTractionLoading)
-                      Padding(
-                        padding: const EdgeInsets.only(top: 8.0),
-                        child: OutlinedButton.icon(
-                          onPressed: data.isTractionLoading
-                              ? null
-                              : () => _refreshTraction(append: true),
-                          icon: data.isTractionLoading
-                              ? const SizedBox(
-                                  height: 14,
-                                  width: 14,
-                                  child: CircularProgressIndicator(strokeWidth: 2),
-                                )
-                              : const Icon(Icons.expand_more),
-                          label: Text(
-                            data.isTractionLoading ? 'Loading...' : 'Load more',
-                          ),
-                        ),
-                      ),
-                  ],
-                ),
-              if (data.isTractionLoading)
-                Positioned.fill(
-                      child: IgnorePointer(
-                        child: Container(
-                      color: Theme.of(context).colorScheme.surface.withValues(alpha: 0.6),
-                      child: const Center(child: CircularProgressIndicator()),
-                    ),
-                  ),
-                ),
-            ],
-          ),
-        ],
-      ),
-    );
-
-    if (widget.selectionMode) {
-      return Scaffold(
-        appBar: AppBar(
-          leadingWidth: 140,
-          leading: Padding(
-            padding: const EdgeInsets.only(left: 8.0),
-            child: TextButton.icon(
-              onPressed: () => Navigator.of(context).pop(),
-              icon: const Icon(Icons.arrow_back),
-              label: const Text('Back'),
-              style: TextButton.styleFrom(
-                padding: const EdgeInsets.symmetric(
-                  horizontal: 12,
-                  vertical: 10,
-                ),
-                foregroundColor: Theme.of(context).colorScheme.onSurface,
-              ),
-            ),
-          ),
-          title: null,
-        ),
-        body: listView,
-      );
-    }
-
-    return listView;
-  }
-
-  void _toggleSelection(LocoSummary loco) {
-    final keyVal = '${loco.locoClass}-${loco.number}';
-    if (widget.onSelect != null) {
-      widget.onSelect!(loco);
-    }
-    setState(() {
-      if (_selectedKeys.contains(keyVal)) {
-        _selectedKeys.remove(keyVal);
-      } else {
-        _selectedKeys.add(keyVal);
-      }
-    });
-  }
-
-  bool _isSelected(LocoSummary loco) {
-    final keyVal = '${loco.locoClass}-${loco.number}';
-    return _selectedKeys.contains(keyVal);
-  }
-
-  Future<void> _openTimeline(LocoSummary loco) async {
-    final label = '${loco.locoClass} ${loco.number}'.trim();
-    await context.push(
-      '/traction/${loco.id}/timeline',
-      extra: {'label': label},
-    );
-    if (!mounted) return;
-    await _refreshTraction();
-  }
-
-  Future<void> _openLegs(LocoSummary loco) async {
-    final label = '${loco.locoClass} ${loco.number}'.trim();
-    await context.push(
-      '/traction/${loco.id}/legs',
-      extra: {'label': label},
-    );
-  }
-
-  Widget _buildFilterInput(
-    BuildContext context,
-    EventField field,
-    bool isMobile,
-  ) {
-    final width = isMobile ? double.infinity : 220.0;
-    if (field.enumValues != null && field.enumValues!.isNotEmpty) {
-      final options = field.enumValues!
-          .map((e) => e.toString())
-          .toSet()
-          .toList();
-      final currentValue = _enumSelections[field.name];
-      final safeValue = options.contains(currentValue) ? currentValue : null;
-      return SizedBox(
-        width: width,
-        child: DropdownButtonFormField<String?>(
-          value: safeValue,
-          decoration: InputDecoration(
-            labelText: field.display,
-            border: const OutlineInputBorder(),
-          ),
-          items: [
-            const DropdownMenuItem(value: null, child: Text('Any')),
-            ...options.map(
-              (value) => DropdownMenuItem(value: value, child: Text(value)),
-            ),
-          ],
-          onChanged: (val) {
-            setState(() {
-              _enumSelections[field.name] = val;
-            });
-            _refreshTraction();
-          },
-        ),
-      );
-    }
-
-    final controller =
-        _dynamicControllers[field.name] ?? TextEditingController();
-    _dynamicControllers[field.name] = controller;
-    TextInputType? inputType;
-    if (field.type != null) {
-      final type = field.type!.toLowerCase();
-      if (type.contains('int') ||
-          type.contains('num') ||
-          type.contains('double')) {
-        inputType = const TextInputType.numberWithOptions(decimal: true);
-      }
-    }
-
-    return SizedBox(
-      width: width,
-      child: TextField(
-        controller: controller,
-        keyboardType: inputType,
-        decoration: InputDecoration(
-          labelText: field.display,
-          border: const OutlineInputBorder(),
-        ),
-        onSubmitted: (_) => _refreshTraction(),
-      ),
-    );
-  }
-}

lib/components/pages/traction/traction.dart

@@ -0,0 +1,14 @@
+import 'dart:convert';
+
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+import 'package:mileograph_flutter/components/traction/traction_card.dart';
+import 'package:mileograph_flutter/objects/objects.dart';
+import 'package:mileograph_flutter/services/data_service.dart';
+import 'package:provider/provider.dart';
+import 'package:shared_preferences/shared_preferences.dart';
+
+part 'traction_page.dart';
+part 'traction_persistence.dart';
+
+const String _kTractionSearchPrefsKey = 'traction_search_state_v1';

lib/components/pages/traction/traction_page.dart

@@ -0,0 +1,641 @@
+part of 'traction.dart';
+
+class TractionPage extends StatefulWidget {
+  const TractionPage({
+    super.key,
+    this.selectionMode = false,
+    this.onSelect,
+    this.selectedKeys = const {},
+  });
+
+  final bool selectionMode;
+  final ValueChanged<LocoSummary>? onSelect;
+  final Set<String> selectedKeys;
+
+  @override
+  State<TractionPage> createState() => _TractionPageState();
+}
+
+class _TractionPageState extends State<TractionPage> {
+  final _classController = TextEditingController();
+  final _classFocusNode = FocusNode();
+  final _numberController = TextEditingController();
+  final _nameController = TextEditingController();
+  bool _mileageFirst = true;
+  bool _initialised = false;
+  bool _showAdvancedFilters = false;
+  String? _selectedClass;
+  late Set<String> _selectedKeys;
+
+  final Map<String, TextEditingController> _dynamicControllers = {};
+  final Map<String, String?> _enumSelections = {};
+  bool _restoredFromPrefs = false;
+
+  @override
+  void initState() {
+    super.initState();
+    _classController.addListener(_onClassTextChanged);
+  }
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    if (!_initialised) {
+      _initialised = true;
+      _selectedKeys = {...widget.selectedKeys};
+      WidgetsBinding.instance.addPostFrameCallback((_) {
+        _initialLoad();
+      });
+    }
+  }
+
+  Future<void> _initialLoad() async {
+    final data = context.read<DataService>();
+    await _restoreSearchState();
+    data.fetchClassList();
+    data.fetchEventFields();
+    await _refreshTraction();
+  }
+
+  @override
+  void dispose() {
+    _classController.removeListener(_onClassTextChanged);
+    _persistSearchState();
+    _classController.dispose();
+    _classFocusNode.dispose();
+    _numberController.dispose();
+    _nameController.dispose();
+    for (final controller in _dynamicControllers.values) {
+      controller.dispose();
+    }
+    super.dispose();
+  }
+
+  void _setState(VoidCallback fn) {
+    if (!mounted) return;
+    // ignore: invalid_use_of_protected_member
+    setState(fn);
+  }
+
+  bool get _hasFilters {
+    final dynamicFieldsUsed =
+        _dynamicControllers.values.any(
+          (controller) => controller.text.trim().isNotEmpty,
+        ) ||
+        _enumSelections.values.any(
+          (value) => (value ?? '').toString().trim().isNotEmpty,
+        );
+
+    return [
+          _selectedClass,
+          _classController.text,
+          _numberController.text,
+          _nameController.text,
+        ].any((value) => (value ?? '').toString().trim().isNotEmpty) ||
+        dynamicFieldsUsed;
+  }
+
+  Future<void> _refreshTraction({bool append = false}) async {
+    final data = context.read<DataService>();
+    final filters = <String, dynamic>{};
+    final name = _nameController.text.trim();
+    if (name.isNotEmpty) filters['name'] = name;
+    _dynamicControllers.forEach((key, controller) {
+      final value = controller.text.trim();
+      if (value.isNotEmpty) filters[key] = value;
+    });
+    _enumSelections.forEach((key, value) {
+      if (value != null && value.toString().trim().isNotEmpty) {
+        filters[key] = value;
+      }
+    });
+    final hadOnly = !_hasFilters;
+    await data.fetchTraction(
+      hadOnly: hadOnly,
+      locoClass: _selectedClass ?? _classController.text.trim(),
+      locoNumber: _numberController.text.trim(),
+      offset: append ? data.traction.length : 0,
+      append: append,
+      filters: filters,
+      mileageFirst: _mileageFirst,
+    );
+    await _persistSearchState();
+  }
+
+  void _clearFilters() {
+    for (final controller in [
+      _classController,
+      _numberController,
+      _nameController,
+    ]) {
+      controller.clear();
+    }
+    for (final controller in _dynamicControllers.values) {
+      controller.clear();
+    }
+    _enumSelections.clear();
+    setState(() {
+      _selectedClass = null;
+      _mileageFirst = true;
+    });
+    _refreshTraction();
+  }
+
+  void _onClassTextChanged() {
+    if (_selectedClass != null &&
+        _classController.text.trim() != (_selectedClass ?? '')) {
+      setState(() {
+        _selectedClass = null;
+      });
+    }
+  }
+
+  List<EventField> _activeEventFields(List<EventField> fields) {
+    return fields
+        .where(
+          (field) => ![
+            'class',
+            'number',
+            'name',
+            'build date',
+            'build_date',
+          ].contains(field.name.toLowerCase()),
+        )
+        .toList();
+  }
+
+  void _ensureControllersForFields(List<EventField> fields) {
+    for (final field in fields) {
+      if (field.enumValues != null) {
+        _enumSelections.putIfAbsent(field.name, () => null);
+      } else {
+        _dynamicControllers.putIfAbsent(
+          field.name,
+          () => TextEditingController(),
+        );
+      }
+    }
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final data = context.watch<DataService>();
+    final traction = data.traction;
+    final classOptions = data.locoClasses;
+    final isMobile = MediaQuery.of(context).size.width < 700;
+    _ensureControllersForFields(data.eventFields);
+    final extraFields = _activeEventFields(data.eventFields);
+
+    final listView = RefreshIndicator(
+      onRefresh: _refreshTraction,
+      child: ListView(
+        padding: const EdgeInsets.all(16),
+        physics: const AlwaysScrollableScrollPhysics(),
+        children: [
+          Row(
+            crossAxisAlignment: CrossAxisAlignment.start,
+            children: [
+              Expanded(
+                child: Column(
+                  crossAxisAlignment: CrossAxisAlignment.start,
+                  children: [
+                    Text(
+                      'Fleet',
+                      style: Theme.of(context).textTheme.labelMedium,
+                    ),
+                    const SizedBox(height: 2),
+                    Text(
+                      'Traction',
+                      style: Theme.of(context).textTheme.headlineSmall,
+                    ),
+                  ],
+                ),
+              ),
+              Row(
+                mainAxisSize: MainAxisSize.min,
+                children: [
+                  IconButton(
+                    tooltip: 'Refresh',
+                    onPressed: _refreshTraction,
+                    icon: const Icon(Icons.refresh),
+                  ),
+                  const SizedBox(width: 8),
+                  FilledButton.icon(
+                    onPressed: () async {
+                      final createdClass = await context.push<String>(
+                        '/traction/new',
+                      );
+                      if (createdClass != null && createdClass.isNotEmpty) {
+                        _classController.text = createdClass;
+                        _selectedClass = createdClass;
+                        if (mounted) {
+                          _refreshTraction();
+                        }
+                      } else if (mounted && createdClass == '') {
+                        _refreshTraction();
+                      }
+                    },
+                    icon: const Icon(Icons.add),
+                    label: const Text('New Traction'),
+                  ),
+                ],
+              ),
+            ],
+          ),
+          const SizedBox(height: 12),
+          Card(
+            child: Padding(
+              padding: const EdgeInsets.all(12),
+              child: Column(
+                crossAxisAlignment: CrossAxisAlignment.stretch,
+                children: [
+                  Row(
+                    mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                    children: [
+                      Text(
+                        'Filters',
+                        style: Theme.of(context).textTheme.titleMedium,
+                      ),
+                      TextButton(
+                        onPressed: _clearFilters,
+                        child: const Text('Clear'),
+                      ),
+                    ],
+                  ),
+                  const SizedBox(height: 8),
+                  Wrap(
+                    spacing: 12,
+                    runSpacing: 12,
+                    children: [
+                      SizedBox(
+                        width: isMobile ? double.infinity : 240,
+                        child: RawAutocomplete<String>(
+                          textEditingController: _classController,
+                          focusNode: _classFocusNode,
+                          optionsBuilder: (TextEditingValue textEditingValue) {
+                            final query = textEditingValue.text.toLowerCase();
+                            if (query.isEmpty) {
+                              return classOptions;
+                            }
+                            return classOptions.where(
+                              (c) => c.toLowerCase().contains(query),
+                            );
+                          },
+                          fieldViewBuilder:
+                              (
+                                context,
+                                controller,
+                                focusNode,
+                                onFieldSubmitted,
+                              ) {
+                                return TextField(
+                                  controller: controller,
+                                  focusNode: focusNode,
+                                  decoration: const InputDecoration(
+                                    labelText: 'Class',
+                                    border: OutlineInputBorder(),
+                                  ),
+                                  onSubmitted: (_) => _refreshTraction(),
+                                );
+                              },
+                          optionsViewBuilder: (context, onSelected, options) {
+                            final optionList = options.toList();
+                            if (optionList.isEmpty) {
+                              return const SizedBox.shrink();
+                            }
+                            final maxWidth = isMobile
+                                ? MediaQuery.of(context).size.width - 64
+                                : 240.0;
+                            return Align(
+                              alignment: Alignment.topLeft,
+                              child: Material(
+                                elevation: 4,
+                                child: ConstrainedBox(
+                                  constraints: BoxConstraints(
+                                    maxWidth: maxWidth,
+                                    maxHeight: 240,
+                                  ),
+                                  child: ListView.builder(
+                                    padding: EdgeInsets.zero,
+                                    shrinkWrap: true,
+                                    itemCount: optionList.length,
+                                    itemBuilder: (context, index) {
+                                      final option = optionList[index];
+                                      return ListTile(
+                                        title: Text(option),
+                                        onTap: () => onSelected(option),
+                                      );
+                                    },
+                                  ),
+                                ),
+                              ),
+                            );
+                          },
+                          onSelected: (String selection) {
+                            setState(() {
+                              _selectedClass = selection;
+                              _classController.text = selection;
+                            });
+                            _refreshTraction();
+                          },
+                        ),
+                      ),
+                      SizedBox(
+                        width: isMobile ? double.infinity : 220,
+                        child: TextField(
+                          controller: _numberController,
+                          decoration: const InputDecoration(
+                            labelText: 'Number',
+                            border: OutlineInputBorder(),
+                          ),
+                          onSubmitted: (_) => _refreshTraction(),
+                        ),
+                      ),
+                      SizedBox(
+                        width: isMobile ? double.infinity : 220,
+                        child: TextField(
+                          controller: _nameController,
+                          decoration: const InputDecoration(
+                            labelText: 'Name',
+                            border: OutlineInputBorder(),
+                          ),
+                          onSubmitted: (_) => _refreshTraction(),
+                        ),
+                      ),
+                      FilterChip(
+                        label: Text(
+                          _mileageFirst ? 'Mileage first' : 'Number order',
+                        ),
+                        selected: _mileageFirst,
+                        onSelected: (v) {
+                          setState(() => _mileageFirst = v);
+                          _refreshTraction();
+                        },
+                      ),
+                      TextButton.icon(
+                        onPressed: () => setState(
+                          () => _showAdvancedFilters = !_showAdvancedFilters,
+                        ),
+                        icon: Icon(
+                          _showAdvancedFilters
+                              ? Icons.expand_less
+                              : Icons.expand_more,
+                        ),
+                        label: Text(
+                          _showAdvancedFilters
+                              ? 'Hide filters'
+                              : 'More filters',
+                        ),
+                      ),
+                      ElevatedButton.icon(
+                        onPressed: _refreshTraction,
+                        icon: const Icon(Icons.search),
+                        label: const Text('Search'),
+                      ),
+                    ],
+                  ),
+                  AnimatedCrossFade(
+                    crossFadeState: _showAdvancedFilters
+                        ? CrossFadeState.showFirst
+                        : CrossFadeState.showSecond,
+                    duration: const Duration(milliseconds: 200),
+                    firstChild: Padding(
+                      padding: const EdgeInsets.only(top: 12.0),
+                      child: data.isEventFieldsLoading
+                          ? const Center(
+                              child: Padding(
+                                padding: EdgeInsets.all(8.0),
+                                child: CircularProgressIndicator(
+                                  strokeWidth: 2,
+                                ),
+                              ),
+                            )
+                          : extraFields.isEmpty
+                          ? const Text('No extra filters available right now.')
+                          : Wrap(
+                              spacing: 12,
+                              runSpacing: 12,
+                              children: extraFields
+                                  .map(
+                                    (field) => _buildFilterInput(
+                                      context,
+                                      field,
+                                      isMobile,
+                                    ),
+                                  )
+                                  .toList(),
+                            ),
+                    ),
+                    secondChild: const SizedBox.shrink(),
+                  ),
+                ],
+              ),
+            ),
+          ),
+          const SizedBox(height: 12),
+          Stack(
+            children: [
+              if (data.isTractionLoading && traction.isEmpty)
+                const Padding(
+                  padding: EdgeInsets.symmetric(vertical: 32.0),
+                  child: Center(child: CircularProgressIndicator()),
+                )
+              else if (traction.isEmpty)
+                Card(
+                  child: Padding(
+                    padding: const EdgeInsets.all(16.0),
+                    child: Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        Text(
+                          'No traction found',
+                          style: Theme.of(context).textTheme.titleMedium?.copyWith(
+                            fontWeight: FontWeight.w700,
+                          ),
+                        ),
+                        const SizedBox(height: 8),
+                        const Text('Try relaxing the filters or sync again.'),
+                      ],
+                    ),
+                  ),
+                )
+              else
+                Column(
+                  children: [
+                    ...traction.map(
+                      (loco) => TractionCard(
+                        loco: loco,
+                        selectionMode: widget.selectionMode,
+                        isSelected: _isSelected(loco),
+                        onShowInfo: () => showTractionDetails(context, loco),
+                        onOpenTimeline: () => _openTimeline(loco),
+                        onOpenLegs: () => _openLegs(loco),
+                        onToggleSelect:
+                            widget.selectionMode ? () => _toggleSelection(loco) : null,
+                      ),
+                    ),
+                    if (data.tractionHasMore || data.isTractionLoading)
+                      Padding(
+                        padding: const EdgeInsets.only(top: 8.0),
+                        child: OutlinedButton.icon(
+                          onPressed: data.isTractionLoading
+                              ? null
+                              : () => _refreshTraction(append: true),
+                          icon: data.isTractionLoading
+                              ? const SizedBox(
+                                  height: 14,
+                                  width: 14,
+                                  child: CircularProgressIndicator(strokeWidth: 2),
+                                )
+                              : const Icon(Icons.expand_more),
+                          label: Text(
+                            data.isTractionLoading ? 'Loading...' : 'Load more',
+                          ),
+                        ),
+                      ),
+                  ],
+                ),
+              if (data.isTractionLoading)
+                Positioned.fill(
+                      child: IgnorePointer(
+                        child: Container(
+                      color: Theme.of(context).colorScheme.surface.withValues(alpha: 0.6),
+                      child: const Center(child: CircularProgressIndicator()),
+                    ),
+                  ),
+                ),
+            ],
+          ),
+        ],
+      ),
+    );
+
+    if (widget.selectionMode) {
+      return Scaffold(
+        appBar: AppBar(
+          leadingWidth: 140,
+          leading: Padding(
+            padding: const EdgeInsets.only(left: 8.0),
+            child: TextButton.icon(
+              onPressed: () => Navigator.of(context).pop(),
+              icon: const Icon(Icons.arrow_back),
+              label: const Text('Back'),
+              style: TextButton.styleFrom(
+                padding: const EdgeInsets.symmetric(
+                  horizontal: 12,
+                  vertical: 10,
+                ),
+                foregroundColor: Theme.of(context).colorScheme.onSurface,
+              ),
+            ),
+          ),
+          title: null,
+        ),
+        body: listView,
+      );
+    }
+
+    return listView;
+  }
+
+  void _toggleSelection(LocoSummary loco) {
+    final keyVal = '${loco.locoClass}-${loco.number}';
+    if (widget.onSelect != null) {
+      widget.onSelect!(loco);
+    }
+    setState(() {
+      if (_selectedKeys.contains(keyVal)) {
+        _selectedKeys.remove(keyVal);
+      } else {
+        _selectedKeys.add(keyVal);
+      }
+    });
+  }
+
+  bool _isSelected(LocoSummary loco) {
+    final keyVal = '${loco.locoClass}-${loco.number}';
+    return _selectedKeys.contains(keyVal);
+  }
+
+  Future<void> _openTimeline(LocoSummary loco) async {
+    final label = '${loco.locoClass} ${loco.number}'.trim();
+    await context.push(
+      '/traction/${loco.id}/timeline',
+      extra: {'label': label},
+    );
+    if (!mounted) return;
+    await _refreshTraction();
+  }
+
+  Future<void> _openLegs(LocoSummary loco) async {
+    final label = '${loco.locoClass} ${loco.number}'.trim();
+    await context.push(
+      '/traction/${loco.id}/legs',
+      extra: {'label': label},
+    );
+  }
+
+  Widget _buildFilterInput(
+    BuildContext context,
+    EventField field,
+    bool isMobile,
+  ) {
+    final width = isMobile ? double.infinity : 220.0;
+    if (field.enumValues != null && field.enumValues!.isNotEmpty) {
+      final options = field.enumValues!
+          .map((e) => e.toString())
+          .toSet()
+          .toList();
+      final currentValue = _enumSelections[field.name];
+      final safeValue = options.contains(currentValue) ? currentValue : null;
+      return SizedBox(
+        width: width,
+        child: DropdownButtonFormField<String?>(
+          value: safeValue,
+          decoration: InputDecoration(
+            labelText: field.display,
+            border: const OutlineInputBorder(),
+          ),
+          items: [
+            const DropdownMenuItem(value: null, child: Text('Any')),
+            ...options.map(
+              (value) => DropdownMenuItem(value: value, child: Text(value)),
+            ),
+          ],
+          onChanged: (val) {
+            setState(() {
+              _enumSelections[field.name] = val;
+            });
+            _refreshTraction();
+          },
+        ),
+      );
+    }
+
+    final controller =
+        _dynamicControllers[field.name] ?? TextEditingController();
+    _dynamicControllers[field.name] = controller;
+    TextInputType? inputType;
+    if (field.type != null) {
+      final type = field.type!.toLowerCase();
+      if (type.contains('int') ||
+          type.contains('num') ||
+          type.contains('double')) {
+        inputType = const TextInputType.numberWithOptions(decimal: true);
+      }
+    }
+
+    return SizedBox(
+      width: width,
+      child: TextField(
+        controller: controller,
+        keyboardType: inputType,
+        decoration: InputDecoration(
+          labelText: field.display,
+          border: const OutlineInputBorder(),
+        ),
+        onSubmitted: (_) => _refreshTraction(),
+      ),
+    );
+  }
+}

lib/components/pages/traction/traction_persistence.dart

@@ -0,0 +1,88 @@
+part of 'traction.dart';
+
+extension _TractionPersistence on _TractionPageState {
+  Future<void> _restoreSearchState() async {
+    if (widget.selectionMode) return;
+    if (_restoredFromPrefs) return;
+    _restoredFromPrefs = true;
+    try {
+      final prefs = await SharedPreferences.getInstance();
+      final raw = prefs.getString(_kTractionSearchPrefsKey);
+      if (raw == null || raw.trim().isEmpty) return;
+      final decoded = jsonDecode(raw);
+      if (decoded is! Map) return;
+
+      final classText = decoded['classText']?.toString();
+      final numberText = decoded['number']?.toString();
+      final nameText = decoded['name']?.toString();
+      final selectedClass = decoded['selectedClass']?.toString();
+      final mileageFirst = decoded['mileageFirst'];
+      final showAdvanced = decoded['showAdvancedFilters'];
+
+      if (classText != null) _classController.text = classText;
+      if (numberText != null) _numberController.text = numberText;
+      if (nameText != null) _nameController.text = nameText;
+
+      final dynamicValues = <String, String>{};
+      final enumValues = <String, String?>{};
+      final dynamicRaw = decoded['dynamic'];
+      if (dynamicRaw is Map) {
+        for (final entry in dynamicRaw.entries) {
+          final key = entry.key.toString();
+          final val = entry.value?.toString() ?? '';
+          dynamicValues[key] = val;
+        }
+      }
+      final enumRaw = decoded['enum'];
+      if (enumRaw is Map) {
+        for (final entry in enumRaw.entries) {
+          enumValues[entry.key.toString()] = entry.value?.toString();
+        }
+      }
+
+      for (final entry in dynamicValues.entries) {
+        _dynamicControllers.putIfAbsent(
+          entry.key,
+          () => TextEditingController(text: entry.value),
+        );
+        _dynamicControllers[entry.key]?.text = entry.value;
+      }
+      for (final entry in enumValues.entries) {
+        _enumSelections[entry.key] = entry.value;
+      }
+
+      if (!mounted) return;
+      _setState(() {
+        _selectedClass =
+            (selectedClass != null && selectedClass.trim().isNotEmpty)
+                ? selectedClass
+                : null;
+        if (mileageFirst is bool) _mileageFirst = mileageFirst;
+        if (showAdvanced is bool) _showAdvancedFilters = showAdvanced;
+      });
+    } catch (_) {
+      // Ignore preference restore failures.
+    }
+  }
+
+  Future<void> _persistSearchState() async {
+    if (widget.selectionMode) return;
+    final payload = <String, dynamic>{
+      'classText': _classController.text,
+      'number': _numberController.text,
+      'name': _nameController.text,
+      'selectedClass': _selectedClass,
+      'mileageFirst': _mileageFirst,
+      'showAdvancedFilters': _showAdvancedFilters,
+      'dynamic': _dynamicControllers.map((k, v) => MapEntry(k, v.text)),
+      'enum': _enumSelections,
+    };
+
+    try {
+      final prefs = await SharedPreferences.getInstance();
+      await prefs.setString(_kTractionSearchPrefsKey, jsonEncode(payload));
+    } catch (_) {
+      // Ignore persistence failures.
+    }
+  }
+}

lib/components/pages/trips.dart

@@ -36,48 +36,60 @@ class _TripsPageState extends State<TripsPage> {
 
     return RefreshIndicator(
       onRefresh: _refreshTrips,
-      child: ListView(
+      child: ListView.builder(
         padding: const EdgeInsets.all(16),
         physics: const AlwaysScrollableScrollPhysics(),
-        children: [
-          Row(
-            mainAxisAlignment: MainAxisAlignment.spaceBetween,
-            children: [
-              Column(
-                crossAxisAlignment: CrossAxisAlignment.start,
-                children: [
-                  Text(
-                    'Journeys',
-                    style: Theme.of(context).textTheme.labelMedium,
-                  ),
-                  const SizedBox(height: 2),
-                  Text(
-                    'Trips',
-                    style: Theme.of(context).textTheme.headlineSmall,
-                  ),
-                ],
-              ),
-              Row(
-                children: [
-                  IconButton(
-                    onPressed: _refreshTrips,
-                    icon: const Icon(Icons.refresh),
-                    tooltip: 'Refresh trips',
-                  ),
-                ],
-              ),
-            ],
-          ),
-          const SizedBox(height: 12),
-          if (showLoading)
-            const Center(
+        itemCount: () {
+          if (showLoading) return 2;
+          if (tripDetails.isEmpty && tripSummaries.isEmpty) return 2;
+          if (tripDetails.isEmpty) return 1 + tripSummaries.length;
+          return 1 + tripDetails.length;
+        }(),
+        itemBuilder: (context, index) {
+          if (index == 0) {
+            return Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: [
+                Row(
+                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
+                  children: [
+                    Column(
+                      crossAxisAlignment: CrossAxisAlignment.start,
+                      children: [
+                        Text(
+                          'Journeys',
+                          style: Theme.of(context).textTheme.labelMedium,
+                        ),
+                        const SizedBox(height: 2),
+                        Text(
+                          'Trips',
+                          style: Theme.of(context).textTheme.headlineSmall,
+                        ),
+                      ],
+                    ),
+                    IconButton(
+                      onPressed: _refreshTrips,
+                      icon: const Icon(Icons.refresh),
+                      tooltip: 'Refresh trips',
+                    ),
+                  ],
+                ),
+                const SizedBox(height: 12),
+              ],
+            );
+          }
+
+          if (showLoading) {
+            return const Center(
               child: Padding(
                 padding: EdgeInsets.symmetric(vertical: 24.0),
                 child: CircularProgressIndicator(),
               ),
-            )
-          else if (tripDetails.isEmpty && tripSummaries.isEmpty)
-            Card(
+            );
+          }
+
+          if (tripDetails.isEmpty && tripSummaries.isEmpty) {
+            return Card(
               child: Padding(
                 padding: const EdgeInsets.all(16.0),
                 child: Column(
@@ -86,8 +98,8 @@ class _TripsPageState extends State<TripsPage> {
                     Text(
                       'No trips yet',
                       style: Theme.of(context).textTheme.titleMedium?.copyWith(
-                        fontWeight: FontWeight.w700,
-                      ),
+                            fontWeight: FontWeight.w700,
+                          ),
                     ),
                     const SizedBox(height: 8),
                     const Text(
@@ -96,29 +108,22 @@ class _TripsPageState extends State<TripsPage> {
                   ],
                 ),
               ),
-            )
-          else if (tripDetails.isEmpty)
-            Column(
-              children: tripSummaries
-                  .map(
-                    (trip) => Card(
-                      child: ListTile(
-                        title: Text(trip.tripName),
-                        subtitle: Text(
-                          '${trip.tripMileage.toStringAsFixed(1)} mi',
-                        ),
-                      ),
-                    ),
-                  )
-                  .toList(),
-            )
-          else
-            Column(
-              children: tripDetails
-                  .map((trip) => _buildTripCard(context, trip, isMobile))
-                  .toList(),
-            ),
-        ],
+            );
+          }
+
+          if (tripDetails.isEmpty) {
+            final trip = tripSummaries[index - 1];
+            return Card(
+              child: ListTile(
+                title: Text(trip.tripName),
+                subtitle: Text('${trip.tripMileage.toStringAsFixed(1)} mi'),
+              ),
+            );
+          }
+
+          final trip = tripDetails[index - 1];
+          return _buildTripCard(context, trip, isMobile);
+        },
       ),
     );
   }