import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../../../core/models/units.dart';
import '../../../core/providers/sensor_history_provider.dart';
import '../../../core/providers/settings_provider.dart';
import '../../../ui/theme/app_colors.dart';
import '../dashboard/widgets/sensor_picker_sheet.dart';
import 'widgets/graph_time_selector.dart';
import 'widgets/sensor_graph_panel.dart';

final _graphWindowProvider = StateProvider<int>((ref) => 60);
final _graphSensorsProvider = StateProvider<List<String>>(
  (ref) => ['rpm', 'map', 'tps', 'ect'],
);

class GraphScreen extends ConsumerWidget {
  const GraphScreen({super.key});

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    final history = ref.watch(sensorHistoryProvider);
    final colors = AppColors.of(context);
    final units = ref.watch(unitPrefsProvider);
    final window = ref.watch(_graphWindowProvider);
    final sensors = ref.watch(_graphSensorsProvider);

    return Column(
      children: [
        // Time selector bar
        Container(
          color: colors.surface,
          padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
          child: Row(
            children: [
              Text('Window:',
                  style: TextStyle(color: colors.onSurfaceMuted, fontSize: 12)),
              const SizedBox(width: 8),
              GraphTimeSelector(
                windowSeconds: window,
                onChanged: (s) =>
                    ref.read(_graphWindowProvider.notifier).state = s,
              ),
              const Spacer(),
              IconButton(
                icon: Icon(Icons.add_chart, color: colors.accent, size: 20),
                tooltip: 'Add sensor',
                onPressed: () => _addSensor(context, ref, sensors),
                padding: EdgeInsets.zero,
                constraints: const BoxConstraints(),
              ),
            ],
          ),
        ),
        // Graph panels
        Expanded(
          child: sensors.isEmpty
              ? Center(
                  child: Column(
                    mainAxisSize: MainAxisSize.min,
                    children: [
                      Icon(Icons.show_chart,
                          size: 48, color: colors.accent.withAlpha(80)),
                      const SizedBox(height: 12),
                      Text('No sensors selected',
                          style: TextStyle(color: colors.onSurfaceMuted)),
                      const SizedBox(height: 8),
                      ElevatedButton.icon(
                        onPressed: () => _addSensor(context, ref, sensors),
                        icon: const Icon(Icons.add, size: 16),
                        label: const Text('Add sensor'),
                      ),
                    ],
                  ),
                )
              : ListView.builder(
                  itemCount: sensors.length,
                  itemBuilder: (context, i) => SensorGraphPanel(
                    view: sensorView(sensors[i], units),
                    history: history,
                    windowSeconds: window,
                    onRemove: () {
                      final next = List<String>.from(sensors)..removeAt(i);
                      ref.read(_graphSensorsProvider.notifier).state = next;
                    },
                  ),
                ),
        ),
      ],
    );
  }

  Future<void> _addSensor(
      BuildContext context, WidgetRef ref, List<String> current) async {
    final id = await pickSensor(
      context,
      title: 'ADD SENSOR TO GRAPH',
      currentId: '',
      units: ref.read(unitPrefsProvider),
    );
    if (id == null || current.contains(id)) return;
    ref.read(_graphSensorsProvider.notifier).state = [...current, id];
  }
}