import 'package:flutter/material.dart';

import 'package:anyway/constants.dart';

import 'package:anyway/structs/trip.dart';
import 'package:anyway/modules/trips_saved_list.dart';
import 'package:anyway/utils/load_trips.dart';

import 'package:anyway/pages/new_trip.dart';
import 'package:anyway/pages/current_trip.dart';
import 'package:anyway/pages/onboarding.dart';
import 'package:anyway/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 {
  final String mainScreen;
  final Trip? trip;

  const BasePage({
    super.key,
    required this.mainScreen,
    this.trip,
  });

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

class _BasePageState extends State<BasePage> {

  @override
  Widget build(BuildContext context) {
    Widget currentView = const Text("loading...");
    Future<List<Trip>> trips = loadTrips();
    
    
    if (widget.mainScreen == "map") {
      if (widget.trip != null) {
        currentView = TripPage(trip: widget.trip!);
      } else {
        currentView = FutureBuilder(
          future: trips,
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              List<Trip> availableTrips = snapshot.data!;
              if (availableTrips.isNotEmpty) {
                return TripPage(trip: availableTrips[0]);
              } else {
                return Scaffold(
                  body: Center(
                    child: Text("Wow, so empty!"),
                  ),
                  floatingActionButton: FloatingActionButton.extended(
                    onPressed: () {
                      Navigator.of(context).push(
                        MaterialPageRoute(
                          builder: (context) => const NewTripPage()
                        )
                      );
                    },
                    label: Text("Plan a trip now"),
                  ),
                );
              }
            } else {
              return const Text("loading...");
            }
          },
        );
      }
    } else if (widget.mainScreen == "tutorial") {
      currentView = OnboardingPage();
    } else if (widget.mainScreen == "profile") {
      currentView = ProfilePage();
    }

    final ThemeData theme = Theme.of(context);
    
    return Scaffold(
      appBar: AppBar(title: Text(APP_NAME)),
      body: Center(child: currentView),
      drawer: Drawer(
        child: Column(
          children: [
            DrawerHeader(
              decoration: BoxDecoration(
                gradient: LinearGradient(colors: [Colors.red, Colors.yellow])
              ),
              child: Center(
                child: Text(
                  APP_NAME,
                  style: TextStyle(
                    color: Colors.grey[800],
                    fontSize: 24,
                    fontWeight: FontWeight.bold,
                  ),
                ),
              ),
            ),
            ListTile(
              title: const Text('Your Trips'),
              leading: const Icon(Icons.map),
              selected: widget.mainScreen == "map",
              onTap: () {},
              trailing: ElevatedButton(
                onPressed: () {
                  Navigator.of(context).push(
                    MaterialPageRoute(
                      builder: (context) => const NewTripPage()
                    )
                  );
                },
                child: const Text('New'),
              ),
            ),

            // Adds 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.
            Expanded(
              child: TripsOverview(trips: trips),
            ),
            ElevatedButton(
              onPressed: () async {
                removeAllTripsFromPrefs();
              },
              child: const Text('Clear trips'),
            ),
            const Divider(),
            ListTile(
              title: const Text('How to use'),
              leading: Icon(Icons.help),
              selected: widget.mainScreen == "tutorial",
              onTap: () {
                Navigator.of(context).push(
                  MaterialPageRoute(
                    builder: (context) => BasePage(mainScreen: "tutorial")
                  )
                );
              },
            ),

            // settings in the bottom of the drawer
            ListTile(
              title: const Text('Settings'),
              leading: const Icon(Icons.settings),
              selected: widget.mainScreen == "profile",
              onTap: () {
                Navigator.of(context).push(
                  MaterialPageRoute(
                    builder: (context) => BasePage(mainScreen: "profile")
                  )
                );
              },
            ),
          ],
        ),
      ),
    );
  }
}