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

import '../../../state/app/modules/grade_averages/bloc/grade_averages_bloc.dart';
import '../../../state/app/modules/grade_averages/bloc/grade_averages_event.dart';
import '../../../state/app/modules/grade_averages/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()),
            ],
          ),
        );
      },
    ),
  );
}