mileograph_flutter/lib/components/calculator/calculator.dart

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:mileograph_flutter/objects/objects.dart';
import 'package:mileograph_flutter/services/apiService.dart';
import 'package:mileograph_flutter/services/dataService.dart';
import './routeSummaryWidget.dart';

class StationAutocomplete extends StatefulWidget {
  const StationAutocomplete({
    super.key,
    required this.allStations,
    this.initialValue,
    required this.onChanged,
  });

  final List<Station> allStations;
  final String? initialValue;
  final ValueChanged<String> onChanged;

  @override
  State<StationAutocomplete> createState() => _StationAutocompleteState();
}

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();
    _controller = TextEditingController(text: widget.initialValue ?? '');
    _controller.addListener(() {
      widget.onChanged(_controller.text);
    });
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Autocomplete<String>(
      optionsBuilder: (TextEditingValue textEditingValue) {
        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);
      },
      onSelected: (String selection) {
        _controller.text = selection;
        widget.onChanged(selection);
      },
      fieldViewBuilder:
          (context, textEditingController, focusNode, onFieldSubmitted) {
            textEditingController.value = _controller.value;

            return TextField(
              controller: textEditingController,
              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
                }
              },
              decoration: const InputDecoration(
                labelText: 'Select station',
                border: OutlineInputBorder(),
              ),
            );
          },
    );
  }
}

class RouteCalculator extends StatefulWidget {
  const RouteCalculator({super.key});

  @override
  State<RouteCalculator> createState() => _RouteCalculatorState();
}

class _RouteCalculatorState extends State<RouteCalculator> {
  List<Station> allStations = [];

  RouteResult? _routeResult;
  RouteResult? get result => _routeResult;
  String? _errorMessage;

  bool _showDetails = false;

  bool _fetched = false;

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
    if (!_fetched) {
      _fetched = true;
      WidgetsBinding.instance.addPostFrameCallback((_) async {
        final data = context.read<DataService>();
        final result = await data.fetchStations();
        if (mounted) {
          setState(() => allStations = result);
        }
      });
    }
  }

  Future<void> _calculateRoute(List<String> stations) async {
    setState(() {
      _errorMessage = null;
      _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(),
    });

    if (res['error'] == false) {
      setState(() {
        _routeResult = RouteResult.fromJson(res);
      });
    } else {
      setState(() {
        _errorMessage =
            RouteError.fromJson(res["error_obj"][0]).msg ??
            'Unknown error occurred';
      });
    }
  }

  void _addStation() {
    final data = context.read<DataService>();
    setState(() {
      data.stations.add('');
    });
  }

  void _removeStation(int index) {
    final data = context.read<DataService>();
    setState(() {
      data.stations.removeAt(index);
    });
  }

  void _updateStation(int index, String value) {
    final data = context.read<DataService>();
    setState(() {
      data.stations[index] = value;
    });
  }

  @override
  Widget build(BuildContext context) {
    final data = context.watch<DataService>();
    if (_showDetails && _routeResult != null) {
      return RouteDetailsView(
        route: _routeResult!.calculatedRoute,
        costs: _routeResult!.costs,
        onBack: () => setState(() => _showDetails = false),
      );
    }
    return Column(
      children: [
        Expanded(
          child: ReorderableListView(
            padding: const EdgeInsets.symmetric(vertical: 8),
            onReorder: (oldIndex, newIndex) {
              if (newIndex > oldIndex) newIndex -= 1;
              setState(() {
                final moved = data.stations.removeAt(oldIndex);
                data.stations.insert(newIndex, moved);
              });
            },
            children: List.generate(data.stations.length, (index) {
              return Container(
                key: ValueKey('$index-${data.stations[index]}'),
                margin: const EdgeInsets.symmetric(horizontal: 16, vertical: 4),
                child: Row(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    ReorderableDragStartListener(
                      index: index,
                      child: const Padding(
                        padding: EdgeInsets.only(top: 16),
                        child: Icon(Icons.drag_indicator),
                      ),
                    ),
                    const SizedBox(width: 8),
                    Expanded(
                      child: Card(
                        child: Padding(
                          padding: const EdgeInsets.all(12),
                          child: Row(
                            children: [
                              Expanded(
                                child: StationAutocomplete(
                                  allStations: allStations,
                                  initialValue: data.stations[index],
                                  onChanged: (val) =>
                                      _updateStation(index, val),
                                ),
                              ),
                              IconButton(
                                icon: const Icon(Icons.close),
                                onPressed: () => _removeStation(index),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              );
            }),
          ),
        ),
        if (_errorMessage != null)
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Text(
              _errorMessage!,
              style: TextStyle(color: Theme.of(context).colorScheme.error),
            ),
          )
        else if (_routeResult != null)
          RouteSummaryWidget(
            distance: _routeResult!.distance,
            onDetailsPressed: () => setState(() => _showDetails = true),
          )
        else
          SizedBox.shrink(),
        const SizedBox(height: 10),
        LayoutBuilder(
          builder: (context, constraints) {
            double screenWidth = constraints.maxWidth;

            return Padding(
              padding: EdgeInsets.only(right: screenWidth < 450 ? 70 : 0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  ElevatedButton.icon(
                    icon: const Icon(Icons.add),
                    label: const Text('Add Station'),
                    onPressed: _addStation,
                  ),
                  const SizedBox(width: 16),
                  ElevatedButton.icon(
                    icon: const Icon(Icons.route),
                    label: const Text('Calculate Route'),
                    onPressed: () async {
                      await _calculateRoute(data.stations);
                    },
                  ),
                ],
              ),
            );
          },
        ),

        const SizedBox(height: 16),
      ],
    );
  }
}

Widget debugPanel(List<String> stations) {
  return Padding(
    padding: const EdgeInsets.symmetric(horizontal: 16.0, vertical: 8.0),
    child: Wrap(
      crossAxisAlignment: WrapCrossAlignment.center,
      spacing: 8,
      children: [
        const Text(
          'Current Order:',
          style: TextStyle(fontWeight: FontWeight.bold),
        ),
        ...stations.map((s) => Chip(label: Text(s.isEmpty ? '<empty>' : s))),
      ],
    ),
  );
}