import 'package:diameter/navigation.dart';
import 'package:flutter/material.dart';

class CategoryOverviewScreen extends StatefulWidget {
  static const String routeName = '/category';
  const CategoryOverviewScreen({Key? key}) : super(key: key);

  @override
  _CategoryOverviewScreenState createState() => _CategoryOverviewScreenState();
}

class _CategoryOverviewScreenState extends State<CategoryOverviewScreen> {
  final ScrollController _scrollController = ScrollController();

  @override
  void dispose() {
    _scrollController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Reports'),
      ),
      drawer:
          const Navigation(currentLocation: CategoryOverviewScreen.routeName),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Expanded(
            child: GridView.count(
              crossAxisCount: 2,
              padding: const EdgeInsets.all(10.0),
              children: [
                GestureDetector(
                  onTap: () => Navigator.pushNamed(context, Routes.mealSources),
                  child: Card(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Padding(
                          padding: const EdgeInsets.all(10.0),
                          child: Icon(Icons.local_grocery_store, size: 50, color: Theme.of(context).textTheme.subtitle2?.color),
                        ),
                        Text(
                          'MEAL SOURCES',
                          style: Theme.of(context).textTheme.subtitle2,
                          textAlign: TextAlign.center
                        ),
                      ],
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: () => Navigator.pushNamed(context, Routes.mealCategories),
                  child: Padding(
                    padding: const EdgeInsets.only(left: 10.0),
                    child: Card(
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Padding(
                            padding: const EdgeInsets.all(10.0),
                            child: Icon(Icons.category, size: 50, color: Theme.of(context).textTheme.subtitle2?.color),
                          ),
                          Text(
                            'MEAL CATEGORIES',
                            style: Theme.of(context).textTheme.subtitle2,
                            textAlign: TextAlign.center
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: () => Navigator.pushNamed(context, Routes.mealPortionTypes),
                  child: Card(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Padding(
                          padding: const EdgeInsets.all(10.0),
                          child: Icon(Icons.pie_chart, size: 50, color: Theme.of(context).textTheme.subtitle2?.color),
                        ),
                        Text(
                          'PORTION TYPES',
                          style: Theme.of(context).textTheme.subtitle2,
                          textAlign: TextAlign.center
                        ),
                      ],
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: () => Navigator.pushNamed(context, Routes.accuracies),
                  child: Padding(
                    padding: const EdgeInsets.only(left: 10.0),
                    child: Card(
                      child: Column(
                        mainAxisAlignment: MainAxisAlignment.center,
                        children: [
                          Padding(
                            padding: const EdgeInsets.all(10.0),
                            child: Icon(Icons.architecture, size: 50, color: Theme.of(context).textTheme.subtitle2?.color),
                          ),
                          Text(
                            'ACCURACIES',
                            style: Theme.of(context).textTheme.subtitle2,
                            textAlign: TextAlign.center
                          ),
                        ],
                      ),
                    ),
                  ),
                ),
                GestureDetector(
                  onTap: () => Navigator.pushNamed(context, Routes.eventTypes),
                  child: Card(
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Padding(
                          padding: const EdgeInsets.all(10.0),
                          child: Icon(Icons.event, size: 50, color: Theme.of(context).textTheme.subtitle2?.color),
                        ),
                        Text(
                          'EVENT TYPES',
                          style: Theme.of(context).textTheme.subtitle2,
                          textAlign: TextAlign.center
                        ),
                      ],
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
