import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:quiosco_soler_2/src/pages/about_page.dart';

class LateralMenu extends StatefulWidget {
  final List<int> page;
  final String level;
  final void Function(String action, String? destination) onOptionSelected;

  const LateralMenu({
    Key? key,
    required this.page,
    required this.level,
    required this.onOptionSelected,
  }) : super(key: key);

  @override
  State<LateralMenu> createState() => _LateralMenuState();
}

class _LateralMenuState extends State<LateralMenu> {
  @override
  Widget build(BuildContext context) {
    return Drawer(
      child: ListView(
        padding: EdgeInsets.zero,
        children: [
          DrawerHeader(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Image.asset(
                  'assets/quiosco.png',
                  width: 64.0,
                ),
                const SizedBox(height: 8.0),
                const Text(
                  'QUIOSCO',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    fontFamily: 'Helvetica Neue Black Cond',
                    fontSize: 18.0,
                    color: Colors.white,
                  ),
                ),
                const Text(
                  'Colaborador',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    fontFamily: 'Helvetica Neue Light',
                    fontSize: 14.0,
                    color: Colors.white
                  ),
                ),
                const SizedBox(height: 16.0),
              ],
            ),
            decoration: const BoxDecoration(color: Color(0xFFFF0000)),
          ),
          ListTile(
            selected: widget.page[0] == 1 ? true : false,
            leading: const Icon(Icons.home),
            title: Text(
              'Inicio',
              style: GoogleFonts.roboto(
                fontSize: 16.0,
              ),
            ),
            onTap: widget.page[0] == 1 ? null : () => widget.onOptionSelected('pop', 'home'),
          ),
          Row(
            children: [
              const Expanded(child: Divider()),
              Text(
                'Información',
                style: GoogleFonts.roboto(
                  color: Colors.black45,
                  fontWeight: FontWeight.w300,
                ),
              ),
              const Expanded(child: Divider()),
            ],
          ),
          ListTile(
            selected: widget.page[4] == 1 ? true : false,
            leading: const Icon(Icons.info_outline),
            title: Text(
              'Información',
              style: GoogleFonts.roboto(
                fontSize: 16.0,
              ),
            ),
            onTap: () => Navigator.push(context, MaterialPageRoute(
              builder: (context) => const AboutPage(),
            )),
          ),
        ],
      ),
    );
  }
}
