import 'package:flutter/material.dart';

import 'package:fast_network_navigation/pages/overview.dart';
import 'package:fast_network_navigation/pages/profile.dart';


// BasePage is the scaffold that holds all other pages
// A side drawer is used to switch between pages
class BasePage extends StatefulWidget {
  const BasePage({super.key, required this.title});
  final String title;

  @override
  State<BasePage> createState() => _BasePageState();
}

class _BasePageState extends State<BasePage> {
  int _selectedIndex = 0;
  
  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  Widget currentView = NavigationOverview();
  @override
  Widget build(BuildContext context) {
    final ThemeData theme = Theme.of(context);
    
    return Scaffold(
      appBar: AppBar(title: Text(widget.title)),
      body: Center(child: currentView),
      drawer: Drawer(
        // Add a ListView to the drawer. This ensures the user can scroll
        // through the options in the drawer if there isn't enough vertical
        // space to fit everything.
        child: ListView(
          // Important: Remove any padding from the ListView.
          padding: EdgeInsets.zero,
          children: [
            DrawerHeader(
              decoration: BoxDecoration(
                gradient: LinearGradient(colors: [Colors.cyan, theme.primaryColor])
              ),
              child: const Text('The fanciest navigation!'),
            ),
            ListTile(
              title: const Text('Start'),
              leading: const Icon(Icons.map),
              selected: _selectedIndex == 0,
              onTap: () {
                // Update the state of the app
                _onItemTapped(0);
                // Then close the drawer
                currentView = NavigationOverview();
                Navigator.pop(context);
              },
            ),
            ListTile(
              title: const Text('How to use'),
              leading: Icon(Icons.help),
              selected: _selectedIndex == 1,
              onTap: () {
                // Update the state of the app
                _onItemTapped(1);
                currentView = const Text("ghfhggfhgf");

                // Then close the drawer
                Navigator.pop(context);
              },
            ),
            const Divider(),
            ListTile(
              title: const Text('Settings'),
              leading: const Icon(Icons.settings),
              selected: _selectedIndex == 2,
              onTap: () {
                _onItemTapped(2);
                currentView = ProfilePage();
                Navigator.pop(context);
                },
            ),
            // settings in the bottom of the drawer
          ],
        ),
      ),
    );
  }
}