import 'package:flutter/material.dart';
import 'package:unit2/screens/unit2/homepage.dart/module-screen.dart';
import 'package:unit2/theme-data.dart/colors.dart';

class DashBoard extends StatelessWidget {
  final List<Module> roles;
  const DashBoard({super.key, required this.roles});
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.symmetric(horizontal: 24, vertical: 24),
      height: MediaQuery.of(context).size.height,
      //listview builder
      child: ListView.builder(
          scrollDirection: Axis.vertical,
          shrinkWrap: true,
          itemCount: roles.length,
          itemBuilder: (BuildContext context, int index) {
            //  gridview.count
            return SizedBox(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  Text(
                    roles[index].name,
                    style: Theme.of(context)
                        .textTheme
                        .labelLarge!
                        .copyWith(fontSize: 16, fontWeight: FontWeight.w700),
                  ),
                  const Divider(),
                  const SizedBox(
                    height: 8,
                  ),
                  GridView.count(
                      shrinkWrap: true,
                      crossAxisCount: 4,
                      crossAxisSpacing: 5,
                      mainAxisSpacing: 2,
                      physics: const BouncingScrollPhysics(),
                      padding: const EdgeInsets.symmetric(
                          vertical: 5, horizontal: 5),
                      children: roles[index].roles.map((role) {
                        return GestureDetector(
                          onTap: () {
                          },
                          child: Column(children: [
                            Icon(
                              role.icon,
                              size: 24,
                              color: second,
                            ),
                            const SizedBox(
                              height: 5,
                            ),
                            Expanded(
                              child: Text(
                                role.role.name!,
                                textAlign: TextAlign.center,
                                style: Theme.of(context)
                                    .textTheme
                                    .labelLarge!
                                    .copyWith(
                                        fontSize: 11,
                                        fontWeight: FontWeight.bold),
                              ),
                            ),
                          ]),
                        );
                      }).toList()),
                ],
              ),
            );
          }),
    );
  }
}