import 'package:flutter/material.dart';

import 'about_page.dart';
import 'landing_page.dart';
import 'map_page.dart';

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

  static const routeName = '/';

  @override
  State<MainNavigationScaffold> createState() => _MainNavigationScaffoldState();
}

class _MainNavigationScaffoldState extends State<MainNavigationScaffold> {
  final List<Widget> _pages = [
    const LandingPage(),
    const MapPage(),
  ];

  int _selectedPageIndex = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Floodwatch'),
        actions: [
          IconButton(
            onPressed: () =>
                Navigator.of(context).pushNamed(AboutPage.routeName),
            icon: Icon(Icons.info_outline),
          )
        ],
      ),
      bottomNavigationBar: NavigationBar(
        selectedIndex: _selectedPageIndex,
        onDestinationSelected: (value) => setState(() {
          _selectedPageIndex = value;
        }),
        destinations: [
          NavigationDestination(icon: Icon(Icons.list), label: 'List'),
          NavigationDestination(icon: Icon(Icons.map_outlined), label: 'Map'),
        ],
      ),
      // Used IndexedStack to save the page state while navigating
      body: IndexedStack(
        index: _selectedPageIndex,
        children: _pages,
      ),
    );
  }
}