import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';

import '../../../../state/app/modules/settings/bloc/settings_cubit.dart';
import '../../../../storage/haptic_settings.dart';
import '../../../../theming/app_theme.dart';
import '../../../../utils/haptics.dart';

class AppearanceSection extends StatelessWidget {
  const AppearanceSection({super.key});

  @override
  Widget build(BuildContext context) {
    final settings = context.watch<SettingsCubit>();
    return Column(
      children: [
        ListTile(
          leading: const Icon(Icons.dark_mode_outlined),
          title: const Text('Farbgebung'),
          trailing: DropdownButton<ThemeMode>(
            value: settings.val().appTheme,
            icon: const Icon(Icons.arrow_drop_down),
            items: ThemeMode.values
                .map(
                  (e) => DropdownMenuItem<ThemeMode>(
                    value: e,
                    enabled: e != settings.val().appTheme,
                    child: Row(
                      children: [
                        Icon(AppTheme.getDisplayOptions(e).icon),
                        const SizedBox(width: 10),
                        Text(AppTheme.getDisplayOptions(e).displayName),
                      ],
                    ),
                  ),
                )
                .toList(),
            onChanged: (e) => settings.val(write: true).appTheme = e!,
          ),
        ),
        ListTile(
          leading: const Icon(Icons.vibration_outlined),
          title: const Text('Haptisches Feedback'),
          trailing: DropdownButton<HapticLevel>(
            value: settings.val().hapticSettings.level,
            icon: const Icon(Icons.arrow_drop_down),
            items: HapticLevel.values
                .map(
                  (e) => DropdownMenuItem<HapticLevel>(
                    value: e,
                    enabled: e != settings.val().hapticSettings.level,
                    child: Row(
                      children: [
                        Icon(_hapticIcon(e)),
                        const SizedBox(width: 10),
                        Text(_hapticLabel(e)),
                      ],
                    ),
                  ),
                )
                .toList(),
            onChanged: (e) {
              settings.val(write: true).hapticSettings.level = e!;
              // Sofortiges Probe-Feedback in der neu gewählten Stufe.
              Haptics.longPress();
            },
          ),
        ),
      ],
    );
  }

  IconData _hapticIcon(HapticLevel level) {
    switch (level) {
      case HapticLevel.off:
        return Icons.notifications_off_outlined;
      case HapticLevel.reduced:
        return Icons.notifications_paused_outlined;
      case HapticLevel.full:
        return Icons.notifications_active_outlined;
    }
  }

  String _hapticLabel(HapticLevel level) {
    switch (level) {
      case HapticLevel.off:
        return 'Aus';
      case HapticLevel.reduced:
        return 'Reduziert';
      case HapticLevel.full:
        return 'Vollständig';
    }
  }
}