class _MyAppState extends State<MyApp> {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Habito',
      theme: AppTheme.lightThemeMode,
      home: const HomePage(),
      // TODO: change this once auth and user session are created
    );
  }
}

//Homepage (routing)


class HomePage extends StatefulWidget {
  static route() => MaterialPageRoute(builder: (context) => HomePage());
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  int _selectedIndex = 0;

  final List<Widget> _pages = [
    UserDashboardPage(),
    HabitSelectionPage(),
    ViewHabitsPage(),
    ViewHabitsPage(),
  ];

  void _onItemTapped(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: IndexedStack(
        index: _selectedIndex,
        children: _pages,
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          showModalBottomSheet(
              context: context,
              isScrollControlled: true,
              backgroundColor: Colors.transparent,
              builder: (BuildContext context) {
                return AddHabitBottomSheet();
              });
        },
        backgroundColor: AppPallete.backgroundColor,
        child: Icon(Icons.add, size: 30),
      ),
      floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
      bottomNavigationBar: BottomAppBar(
        // color: Colors.white,
        shape: CircularNotchedRectangle(), // Makes room for FAB
        notchMargin: 10, // Space between FAB and bar
        child: Container(
          height: 70, // Adjust height to make space for the rounded shape
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.vertical(
              top: Radius.circular(10), //
              bottom: Radius.circular(10), //Rounded corners on top
            ),
            boxShadow: [
              BoxShadow(
                color: Colors.black12,
                blurRadius: 10,
              ),
            ],
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: <Widget>[
              IconButton(
                icon: Icon(Icons.home),
                color: _selectedIndex == 0 ? Colors.blue : Colors.grey,
                onPressed: () => _onItemTapped(0),
              ),
              IconButton(
                icon: Icon(Icons.list),
                color: _selectedIndex == 1 ? Colors.blue : Colors.grey,
                onPressed: () => _onItemTapped(1),
              ),
              SizedBox(width: 50), // Space for the FAB
              IconButton(
                icon: Icon(Icons.favorite),
                color: _selectedIndex == 2 ? Colors.blue : Colors.grey,
                onPressed: () => _onItemTapped(2),
              ),
              IconButton(
                icon: Icon(Icons.person),
                color: _selectedIndex == 3 ? Colors.blue : Colors.grey,
                onPressed: () => _onItemTapped(3),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

// Dialog (bottomsheet)

class AddHabitBottomSheet extends StatefulWidget {
  @override
  State<AddHabitBottomSheet> createState() => _AddHabitBottomSheetState();
}

class _AddHabitBottomSheetState extends State<AddHabitBottomSheet> {
  final TextEditingController habitController = TextEditingController();
  final TextEditingController entryController = TextEditingController();
  Habit? selectedHabit;
  String? selectedEffort;
  final _formKey = GlobalKey<FormState>();

  void _saveHabitEntry() {
    if (selectedEffort == null || selectedHabit == null) {
      showOverlaySnackBar(context, 'Missing habit or effort, please select one');
      return;
    }
    if (_formKey.currentState!.validate()) {
      print('hitting dat butttong');

      var entry = new HabitEntrySave(
        habitId: selectedHabit!.id!,
        habitName: selectedHabit!.name,
        effort: selectedEffort!,
      );
      print(entry.effort);
      context.read<HabitsBloc>().add(HabitEntrySave(
            effort: selectedEffort!,
            habitId: selectedHabit!.id!,
            habitName: selectedHabit!.name,
          ));
    }
  }

  @override
  void initState() {
    super.initState();
    context.read<HabitsBloc>().add(HabitsFetchAllHabits());
  }

  @override
  void dispose() {
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      // color: Colors.black.withOpacity(0.2),
      padding: const EdgeInsets.all(16.0),
      // Wrap in a Container and set width and margin
      child: BlocConsumer<HabitsBloc, HabitsState>(
        listener: (context, state) {
          // Successfull Save of HabitEntry
          if (state is HabitEntrySaveSuccess) {
            print('HabitEntry Success here.');

            Future.delayed(Duration(milliseconds: 500), () {
              context.read<HabitsBloc>().add(HabitEntrySaveCompleted());

              showOverlaySnackBar(context, "success!!!");
              Navigator.of(context).pop(true);


              Navigator.pushAndRemoveUntil(context, HomePage.route(), (route) => false);

          } else if (state is HabitEntrySaveFailure) {
            Navigator.of(context).pop(true);
            showOverlaySnackBar(context, state.error);
          }

        },
        builder: (context, state) {
          if (state is HabitsLoading) {
            return const Loader();
          }

          if (state is HabitsGetSuccess) {
            return Container(
              height: MediaQuery.of(context).size.height * 0.75,
              width: MediaQuery.of(context).size.width * 9, // Decrease width to 90% of the screen
              padding: const EdgeInsets.all(16.0),
              decoration: BoxDecoration(
                color: Colors.white.withOpacity(0.8), // Background color of the bottom sheet
                borderRadius: BorderRadius.all(Radius.circular(20)),
                boxShadow: [
                  BoxShadow(
                    color: Colors.black.withOpacity(0.1),
                    blurRadius: 10,
                    spreadRadius: 2,
                    offset: Offset(0, -2), // Shadow above the bottom sheet
                  ),
                ],
              ),
              child: Form(
                key: _formKey,
                child: Column(
                  children: [
                    Text(
                      'Habit Entry',
                      style: AppTextStyles.heading2,
                    ),
                    SizedBox(height: 10),
                    Column(
                      children: [
                        GridView.builder(
                          shrinkWrap: true,
                          physics: NeverScrollableScrollPhysics(),
                          gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                            crossAxisCount: 4,
                            crossAxisSpacing: 10,
                            mainAxisSpacing: 10,
                            childAspectRatio: 1,
                          ),
                          itemCount: state.habits.length,
                          itemBuilder: (context, index) {
                            Habit habit = state.habits[index];
                            HabitInfo habitInfo = HabitInfoHelper.getHabitInfo(habit.name);
                            // Check if this habit is selected.
                            bool isSelected = habit == selectedHabit;
                            return InkWell(
                              onTap: () {
                                setState(() {
                                  // Update selectedHabit
                                  selectedHabit = habit;
                                });
                                print('selected: ' + habit.name);
                              },
                              child: Container(
                                // width: 50,
                                // height: 50,
                                decoration: BoxDecoration(
                                  color: isSelected ? AppPallete.backgroundColor.withOpacity(1) : Colors.white,
                                  borderRadius: BorderRadius.circular(60),
                                  border: Border.all(color: isSelected ? Colors.grey.shade500 : Colors.grey.shade200),
                                  boxShadow: isSelected
                                      ? [
                                          BoxShadow(
                                            color: Colors.grey,
                                            blurRadius: 3,
                                            spreadRadius: 1,
                                          )
                                        ]
                                      : [],
                                ),
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  crossAxisAlignment: CrossAxisAlignment.center,
                                  children: [
                                    Icon(
                                      habitInfo.icon,
                                      color: habitInfo.color,
                                      size: 32,
                                    ),
                                    Text(
                                      habit.name,
                                      style: TextStyle(
                                        fontSize: 12,
                                        fontWeight: FontWeight.w500,
                                      ),
                                      textAlign: TextAlign.center,
                                    )
                                  ],
                                ),
                              ),
                            );
                          },
                        ),
                      ],
                    ),
                    // CircularSlider(),
                    if (selectedHabit != null)
                      TimeTrackerWidget(
                          habit: selectedHabit,
                          onEffortChanged: (effort) {
                            setState(() {
                              selectedEffort = effort;
                            });
                          }),

                    SizedBox(height: 20),
                    SubmitButton(
                      buttonText: 'Save Entry',
                      onSubmit: _saveHabitEntry,
                    ),
                  ],
                ),
              ),
            );
          }
          return const SizedBox();
        },
      ),
    );
  }
}


// PAge example to navigate to which is wrapped inside a blocconsumer

 if (state is HabitsGetSuccess) {
            return Padding(
              padding: const EdgeInsets.all(12.0),
              child: ListView(
                children: [
                  Padding(
                    padding: const EdgeInsets.symmetric(horizontal: 2),
                    // Heading