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';
import '../widgets/settings_dropdown_tile.dart';

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

  @override
  Widget build(BuildContext context) {
    final settings = context.watch<SettingsCubit>();
    return Column(
      children: [
        SettingsDropdownTile<ThemeMode>(
          icon: Icons.dark_mode_outlined,
          title: 'Farbgebung',
          value: settings.val().appTheme,
          options: ThemeMode.values,
          optionIcon: (e) => AppTheme.getDisplayOptions(e).icon,
          optionLabel: (e) => AppTheme.getDisplayOptions(e).displayName,
          onChanged: (e) => settings.val(write: true).appTheme = e,
        ),
        SettingsDropdownTile<HapticLevel>(
          icon: Icons.vibration_outlined,
          title: 'Haptisches Feedback',
          value: settings.val().hapticSettings.level,
          options: HapticLevel.values,
          optionIcon: _hapticIcon,
          optionLabel: _hapticLabel,
          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';
    }
  }
}
