import 'package:flutter/material.dart';

import '../../../../state/app/infrastructure/loadable_state/view/loadable_state_consumer.dart';
import '../../../../state/app/modules/timetable/bloc/timetable_bloc.dart';
import '../../../../state/app/modules/timetable/bloc/timetable_state.dart';
import '../../../../widget/placeholder_view.dart';
import 'search_subject_colors.dart';
import 'subject_color_filter.dart';
import 'subject_color_tile.dart';

/// Zentrale Verwaltungsseite: listet die Fächer aus dem eigenen Stundenplan und
/// lässt pro Fach eine Farbe zuweisen oder zurücksetzen. Bereits gefärbte
/// Fächer stehen oben; die Suche läuft über die AppBar.
class SubjectColorsView extends StatelessWidget {
  const SubjectColorsView({super.key});

  @override
  Widget build(BuildContext context) => Scaffold(
    appBar: AppBar(
      title: const Text('Fach-Farben'),
      actions: [
        IconButton(
          icon: const Icon(Icons.search),
          tooltip: 'Suchen',
          onPressed: () =>
              showSearch(context: context, delegate: SearchSubjectColors()),
        ),
      ],
    ),
    body: LoadableStateConsumer<TimetableBloc, TimetableState>(
      child: (state, _) {
        final subjects = filterAndSortSubjects(
          state.subjects?.result ?? const [],
          planSubjectShortNames(state),
        );
        if (subjects.isEmpty) {
          return const PlaceholderView(
            icon: Icons.palette_outlined,
            text: 'Keine Fächer in deinem Stundenplan',
          );
        }
        return ListView.builder(
          itemCount: subjects.length,
          itemBuilder: (_, index) => SubjectColorTile(subjects[index]),
        );
      },
    ),
  );
}
