import 'package:flutter/material.dart';
import 'package:dynamic_color/dynamic_color.dart';
import 'package:google_fonts/google_fonts.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return DynamicColorBuilder(
      builder: (lightDynamic, darkDynamic) {
        return MaterialApp(
          title: 'Test AppBar',
          debugShowCheckedModeBanner: false,
          theme: ThemeData(
            useMaterial3: true,
            brightness: Brightness.light,
            colorScheme: lightDynamic,
          ),
          darkTheme: ThemeData(
            useMaterial3: true,
            brightness: Brightness.dark,
            colorScheme: darkDynamic,
          ),
          home: IterableList(),
        );
      },
    );
  }
}

class IterableList extends StatelessWidget {
  const IterableList({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Small TopAppBar'),
        actions: [
          IconButton(onPressed: () {}, icon: Icon(Icons.favorite)),
          IconButton(onPressed: () {}, icon: Icon(Icons.favorite)),
        ],
        shape: Border.all(color: Colors.transparent),
        toolbarHeight: 64,
      ),
      drawer: MyNavigationDrawer(),
      body: ListView.builder(
        itemCount: 76,
        itemBuilder: (context, index) {
          return Padding(
            padding: EdgeInsets.only(left: 15, bottom: 6),
            child: Text(index.toString(), style: TextStyle(fontSize: 16)),
          );
        },
      ),
      floatingActionButton: FloatingActionButton.large(
        onPressed: () {},
        child: Icon(Icons.add),
      ),
    );
  }
}

class MyNavigationDrawer extends StatefulWidget {
  const MyNavigationDrawer({super.key});

  @override
  State<MyNavigationDrawer> createState() => _MyNavigationDrawerState();
}

class _MyNavigationDrawerState extends State<MyNavigationDrawer> {
  int selectedIndex = 0;

  void onDestinationSelected(int index) {
    setState(() {
      selectedIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return NavigationDrawer(
      selectedIndex: selectedIndex,
      onDestinationSelected: onDestinationSelected,
      children: [
        /*Padding(
          padding: EdgeInsets.fromLTRB(28, 16, 16, 10),
          child: Text('Mail', style: Theme.of(context).textTheme.titleSmall),
        ),*/
        Padding(
          padding: EdgeInsets.only(left: 28),
          child: Text(
            'Navigation Drawer',
             style: GoogleFonts.manrope(
               fontWeight: FontWeight.w500,
               textStyle: Theme.of(context).textTheme.titleLarge,
               height: 3,
            ),
          ),
        ),
        NavigationDrawerDestination(
          icon: Icon(Icons.token_outlined),
          selectedIcon: Icon(Icons.token),
          label: Text('Inbox'),
        ),
        NavigationDrawerDestination(
          icon: Icon(Icons.mail_outline),
          selectedIcon: Icon(Icons.mail),
          label: Text('OutBox'),
        ),
        NavigationDrawerDestination(
          icon: Icon(Icons.favorite_border_outlined),
          selectedIcon: Icon(Icons.favorite),
          label: Text('Favorites'),
        ),
        NavigationDrawerDestination(
          icon: Icon(Icons.delete_outline),
          selectedIcon: Icon(Icons.delete),
          label: Text('Trash'),
        ),
        Divider(indent: 28, endIndent: 28),
        Padding(
          padding: EdgeInsets.fromLTRB(28, 16, 16, 10),
          child: Text('Labels', style: Theme.of(context).textTheme.titleSmall),
        ),
        NavigationDrawerDestination(
          icon: Icon(Icons.circle_outlined),
          label: Text('Label circle'),
        ),
        NavigationDrawerDestination(
          icon: Icon(Icons.change_history),
          label: Text('Label triagle'),
        ),
        NavigationDrawerDestination(
          icon: Icon(Icons.square_outlined),
          label: Text('Label square'),
        ),
        Divider(indent: 28, endIndent: 28),
        Center(
          child: TextButton(
            onPressed: () {},
            child: Text('Navigation Drawer'),
          ),
        ),
        Center(
          child: OutlinedButton(
            onPressed: () {},
            child: Text('Navigation Drawer'),
          ),
        ),
        Center(
          child: ElevatedButton(
            onPressed: () {},
            child: Text('Navigation Drawer'),
          ),
        ),
        Center(
          child: FilledButton(
            onPressed: () {},
            child: Text('Navigation Drawer'),
          ),
        ),
        Center(
          child: FilledButton.tonal(
            onPressed: () {},
            child: Text('Navigation Drawer'),
          ),
        ),
        Center(
          child: FilledButton.tonalIcon(
            onPressed: () {},
            icon: Icon(Icons.replay_circle_filled_outlined),
            label: Text('Cards screen'),
          ),
        ),
      ],
    );
  }
}