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

import '../../../state/app/modules/gradeAverages/bloc/grade_averages_bloc.dart';
import '../../../state/app/modules/gradeAverages/bloc/grade_averages_event.dart';
import '../../../state/app/modules/gradeAverages/bloc/grade_averages_state.dart';
import '../../../widget/confirm_dialog.dart';
import 'grade_averages_list_view.dart';

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

  @override
  Widget build(BuildContext context) => BlocProvider<GradeAveragesBloc>(
      create: (context) => GradeAveragesBloc(),
      child: BlocBuilder<GradeAveragesBloc, GradeAveragesState>(
        builder: (context, state) {
          var bloc = context.watch<GradeAveragesBloc>();

          return Scaffold(
          appBar: AppBar(
            title: const Text('Notendurschnittsrechner'),
            actions: [
              Visibility(
                visible: bloc.state.grades.isNotEmpty,
                child: IconButton(
                    onPressed: () {
                      showDialog(
                        context: context,
                        builder: (context) => ConfirmDialog(
                          title: 'Zurücksetzen?',
                          content: 'Alle Einträge werden entfernt.',
                          confirmButton: 'Zurücksetzen',
                          onConfirm: () {
                            bloc.add(ResetAll());
                          },
                        ),
                      );
                    },
                    icon: const Icon(Icons.delete_forever)),
              ),
              PopupMenuButton<bool>(
                initialValue: bloc.isMiddleSchool(),
                icon: const Icon(Icons.more_horiz),
                itemBuilder: (context) => [true, false].map((isMiddleSchool) => PopupMenuItem<bool>(
                  value: isMiddleSchool,
                  child: Row(
                    children: [
                      Icon(
                          isMiddleSchool ? Icons.calculate_outlined : Icons.school_outlined,
                          color: Theme.of(context).colorScheme.onSurface
                      ),
                      const SizedBox(width: 15),
                      Text(isMiddleSchool ? 'Realschule' : 'Oberstufe'),
                    ],
                  ),
                )).toList(),
                onSelected: (isMiddleSchool) {
                  if (bloc.state.grades.isNotEmpty) {
                    showDialog(
                      context: context,
                      builder: (context) => ConfirmDialog(
                        title: 'Notensystem wechseln',
                        content:
                        'Beim Wechsel des Notensystems werden alle Einträge zurückgesetzt.',
                        confirmButton: 'Fortfahren',
                        onConfirm: () => bloc.add(GradingSystemChanged(isMiddleSchool)),
                      ),
                    );
                  } else {
                    bloc.add(GradingSystemChanged(isMiddleSchool));
                  }
                },
              ),
            ],
          ),

          body: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              const SizedBox(height: 30),
              Row(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text('Ø', style: TextStyle(fontSize: 30, fontWeight: FontWeight.bold)),
                  SizedBox(width: 5),
                  Text(bloc.average().toStringAsFixed(2), style: const TextStyle(fontSize: 30, fontWeight: FontWeight.bold))
                ],
              ),
              const SizedBox(height: 10),
              const Divider(),
              const SizedBox(height: 10),
              Text(bloc.isMiddleSchool() ? 'Wähle die Anzahl deiner jeweiligen Noten aus' : 'Wähle die Anzahl deiner jeweiligen Punkte aus'),
              const SizedBox(height: 10),
              const Expanded(
                child: GradeAveragesListView()
              ),
            ],
          ),
        );
        },
      ),
    );
}