Merge pull request #43 from B3-3iL-DLW/ui/configuration_menu

UI/configuration menu
B3-3iL-DLW · Mar 15, 2024 · 63f11af · 63f11af
2 parents 1b2ea3a + 61b06bb
commit 63f11af
Show file tree

Hide file tree

Showing 9 changed files with 143 additions and 86 deletions.
diff --git a/frontend/app_student/.run/main_prod.run.xml b/frontend/app_student/.run/main_prod.run.xml
@@ -1,6 +1,6 @@
 <component name="ProjectRunConfigurationManager">
   <configuration default="false" name="main_prod" type="FlutterRunConfigurationType" factoryName="Flutter">
-    <option name="filePath" value="$PROJECT_DIR$/lib/main_prod.dart" />
+    <option name="filePath" value="$PROJECT_DIR$/frontend/app_student/lib/main_prod.dart" />
     <method v="2" />
   </configuration>
 </component>
diff --git a/frontend/app_student/lib/menu/menu_item.dart b/frontend/app_student/lib/menu/menu_item.dart
@@ -0,0 +1,20 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_svg/svg.dart';
+
+class MenuIcon extends BottomNavigationBarItem {
+  MenuIcon({
+    required String iconPath,
+    required int selectedIndex,
+    required int itemIndex,
+  }) : super(
+          icon: SvgPicture.asset(
+            iconPath,
+            height: 20,
+            width: 20,
+            colorFilter: selectedIndex == itemIndex
+                ? const ColorFilter.mode(Colors.blue, BlendMode.srcIn)
+                : null,
+          ),
+          label: '',
+        );
+}
diff --git a/frontend/app_student/lib/menu/menu_view.dart b/frontend/app_student/lib/menu/menu_view.dart
@@ -1,5 +1,8 @@
+import 'package:app_student/routes.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_svg/svg.dart';
+import 'package:go_router/go_router.dart';
+
+import 'menu_item.dart';
 
 class MenuBarView extends StatefulWidget {
   const MenuBarView({super.key});
@@ -9,56 +12,66 @@ class MenuBarView extends StatefulWidget {
 }
 
 class MenuBarViewState extends State<MenuBarView> {
-  int _selectedIndex = 0;
+  int _selectedIndex = 1;
+
+  @override
+  void initState() {
+    super.initState();
+    _setSelectedIndex();
+  }
+
+  void _setSelectedIndex() {
+    final route = GoRouter.of(context).routeInformationProvider.value.uri.path;
+
+    if (route == AppRoutes.loginPage) {
+      _selectedIndex = 0;
+    } else if (route == AppRoutes.schedulePage) {
+      _selectedIndex = 1;
+    } else if (route == AppRoutes.profilPage) {
+      _selectedIndex = 2;
+    }
+  }
 
   void _onItemTapped(int index) {
     setState(() {
       _selectedIndex = index;
     });
+
+    switch (index) {
+      case 0:
+        GoRouter.of(context).go(AppRoutes.loginPage);
+        break;
+      case 1:
+        GoRouter.of(context).go(AppRoutes.schedulePage);
+        break;
+      case 2:
+        GoRouter.of(context).go(AppRoutes.profilPage);
+        break;
+    }
   }
 
   @override
   Widget build(BuildContext context) {
-    return Scaffold(
-      bottomNavigationBar: BottomNavigationBar(
-        items: <BottomNavigationBarItem>[
-          BottomNavigationBarItem(
-            icon: SvgPicture.asset(
-              'assets/images/disconnect.svg',
-              height: 20,
-              width: 20,
-              colorFilter: _selectedIndex == 0
-                  ? const ColorFilter.mode(Colors.blue, BlendMode.srcIn)
-                  : null,
-            ),
-            label: '',
-          ),
-          BottomNavigationBarItem(
-            icon: SvgPicture.asset(
-              'assets/images/calendar.svg',
-              height: 20,
-              width: 20,
-              colorFilter: _selectedIndex == 1
-                  ? const ColorFilter.mode(Colors.blue, BlendMode.srcIn)
-                  : null,
-            ),
-            label: '',
-          ),
-          BottomNavigationBarItem(
-            icon: SvgPicture.asset(
-              'assets/images/profil.svg',
-              height: 20,
-              width: 20,
-              colorFilter: _selectedIndex == 2
-                  ? const ColorFilter.mode(Colors.blue, BlendMode.srcIn)
-                  : null,
-            ),
-            label: '',
-          ),
-        ],
-        currentIndex: _selectedIndex,
-        onTap: _onItemTapped,
-      ),
+    return BottomNavigationBar(
+      items: <BottomNavigationBarItem>[
+        MenuIcon(
+          iconPath: 'assets/images/disconnect.svg',
+          selectedIndex: _selectedIndex,
+          itemIndex: 0,
+        ),
+        MenuIcon(
+          iconPath: 'assets/images/calendar.svg',
+          selectedIndex: _selectedIndex,
+          itemIndex: 1,
+        ),
+        MenuIcon(
+          iconPath: 'assets/images/profil.svg',
+          selectedIndex: _selectedIndex,
+          itemIndex: 2,
+        ),
+      ],
+      currentIndex: _selectedIndex,
+      onTap: _onItemTapped,
     );
   }
 }
diff --git a/frontend/app_student/lib/profils/views/profil_page.dart b/frontend/app_student/lib/profils/views/profil_page.dart
@@ -1,4 +1,5 @@
 import 'package:app_student/class_groups/views/widgets/header/header_text.dart';
+import 'package:app_student/menu/menu_view.dart';
 import 'package:app_student/profils/views/widgets/class_group_button.dart';
 import 'package:flutter/material.dart';
 import 'package:app_student/login/widgets/header/header_logo.dart';
@@ -62,6 +63,7 @@ class ProfilPage extends StatelessWidget {
           const ClassGroupButton(),
         ],
       ),
+      bottomNavigationBar: const MenuBarView(),
     );
   }
 }
diff --git a/frontend/app_student/lib/routes.dart b/frontend/app_student/lib/routes.dart
@@ -5,6 +5,7 @@ import 'package:app_student/api/users/repositories/user_repository.dart';
 import 'package:app_student/api/week_schedule/repositories/week_schedule_repository.dart';
 import 'package:app_student/class_groups/cubit/class_group_cubit.dart';
 import 'package:app_student/config/config.dart';
+import 'package:app_student/profils/views/profil_page.dart';
 import 'package:app_student/users/cubit/user_cubit.dart';
 import 'package:app_student/week_schedule/cubit/week_schedule_cubit.dart';
 import 'package:app_student/week_schedule/views/week_schedule.dart';
@@ -20,6 +21,7 @@ class AppRoutes {
   static const classListPage = '/classList';
   static const loginPage = '/login';
   static const schedulePage = '/schedule';
+  static const profilPage = '/profil';
 
   static final routes = [
     GoRoute(
@@ -93,5 +95,11 @@ class AppRoutes {
                 child: const WeekSchedulePage(),
               ),
             ))),
+    GoRoute(
+        path: profilPage,
+        pageBuilder: (context, state) => MaterialPage<void>(
+              key: state.pageKey,
+              child: const ProfilPage(),
+            )),
   ];
 }
diff --git a/frontend/app_student/lib/week_schedule/cubit/week_schedule_cubit.dart b/frontend/app_student/lib/week_schedule/cubit/week_schedule_cubit.dart
@@ -22,7 +22,9 @@ class WeekScheduleCubit extends Cubit<WeekScheduleState> {
 
   Future fetchWeekSchedule() async {
     try {
-      if (isClosed) return;
+      if (isClosed) {
+        return;
+      }
       emit(WeekScheduleLoading());
       final user = await userCubit.getCurrentUser();
       final weekSchedule =
@@ -38,8 +40,14 @@ class WeekScheduleCubit extends Cubit<WeekScheduleState> {
           daySchedule.date.month == initialDate!.month &&
           daySchedule.date.year == initialDate!.year);
 
+      if (isClosed) {
+        return;
+      }
       emit(WeekScheduleLoaded(weekSchedule, todayIndex, allEvents, user));
     } catch (e) {
+      if (isClosed) {
+        return;
+      }
       emit(WeekScheduleError(e.toString()));
     }
   }

diff --git a/frontend/app_student/lib/week_schedule/views/week_schedule.dart b/frontend/app_student/lib/week_schedule/views/week_schedule.dart
@@ -1,4 +1,5 @@
 import 'package:app_student/api/week_schedule/repositories/week_schedule_repository.dart';
+import 'package:app_student/menu/menu_view.dart';
 import 'package:app_student/users/cubit/user_cubit.dart';
 import 'package:app_student/week_schedule/cubit/week_schedule_cubit.dart';
 import 'package:app_student/week_schedule/views/widgets/day_schedule_widget.dart';
@@ -24,46 +25,48 @@ class WeekSchedulePage extends StatelessWidget {
         initialDate: initialDate);
 
     return BlocProvider<WeekScheduleCubit>(
-        create: (context) => weekScheduleCubit..fetchUserAndSchedule(),
-        child: BlocProvider<UserCubit>(
-          create: (context) =>
-              UserCubit(userRepository: userRepository)..fetchUser(),
-          child: Scaffold(
-            appBar: const AppBarWeekSchedule(),
-            body: BlocBuilder<WeekScheduleCubit, WeekScheduleState>(
-              builder: (context, state) {
-                if (state is WeekScheduleLoading) {
-                  return const Center(child: CircularProgressIndicator());
-                } else if (state is WeekScheduleLoaded) {
-                  final allEvents = state.weekSchedule
-                      .expand((week) => week.daySchedules)
-                      .toList();
+      create: (context) => weekScheduleCubit..fetchUserAndSchedule(),
+      child: BlocProvider<UserCubit>(
+        create: (context) =>
+            UserCubit(userRepository: userRepository)..fetchUser(),
+        child: Scaffold(
+          appBar: const AppBarWeekSchedule(),
+          body: BlocBuilder<WeekScheduleCubit, WeekScheduleState>(
+            builder: (context, state) {
+              if (state is WeekScheduleLoading) {
+                return const Center(child: CircularProgressIndicator());
+              } else if (state is WeekScheduleLoaded) {
+                final allEvents = state.weekSchedule
+                    .expand((week) => week.daySchedules)
+                    .toList();
 
-                  return Padding(
-                    padding: const EdgeInsets.only(top: 30.0),
-                    child: SizedBox(
-                      height: MediaQuery.of(context).size.height,
-                      child: PageView.builder(
-                        controller: PageController(
-                          initialPage:
-                              state.todayIndex != -1 ? state.todayIndex : 0,
-                        ),
-                        itemCount: allEvents.length,
-                        itemBuilder: (context, index) {
-                          final daySchedule = allEvents[index];
-                          return DayScheduleWidget(daySchedule: daySchedule);
-                        },
+                return Padding(
+                  padding: const EdgeInsets.only(top: 30.0),
+                  child: SizedBox(
+                    height: MediaQuery.of(context).size.height,
+                    child: PageView.builder(
+                      controller: PageController(
+                        initialPage:
+                            state.todayIndex != -1 ? state.todayIndex : 0,
                       ),
+                      itemCount: allEvents.length,
+                      itemBuilder: (context, index) {
+                        final daySchedule = allEvents[index];
+                        return DayScheduleWidget(daySchedule: daySchedule);
+                      },
                     ),
-                  );
-                } else if (state is WeekScheduleError) {
-                  return Center(child: Text(state.message));
-                } else {
-                  return const SizedBox.shrink();
-                }
-              },
-            ),
+                  ),
+                );
+              } else if (state is WeekScheduleError) {
+                return Center(child: Text(state.message));
+              } else {
+                return const SizedBox.shrink();
+              }
+            },
           ),
-        ));
+          bottomNavigationBar: const MenuBarView(),
+        ),
+      ),
+    );
   }
 }
diff --git a/frontend/app_student/lib/week_schedule/views/widgets/components/app_bar_week_schedule.dart b/frontend/app_student/lib/week_schedule/views/widgets/components/app_bar_week_schedule.dart
@@ -1,12 +1,15 @@
 import 'package:app_student/users/cubit/user_cubit.dart';
-import 'package:app_student/week_schedule/views/widgets/components/datepicker_button.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 
+import 'datepicker_button.dart';
+
 class AppBarWeekSchedule extends StatelessWidget
     implements PreferredSizeWidget {
   const AppBarWeekSchedule({super.key});
 
+  static const double appBarHeight = 80.0;
+
   @override
   Widget build(BuildContext context) {
     final userState = context.watch<UserCubit>().state;
@@ -16,7 +19,7 @@ class AppBarWeekSchedule extends StatelessWidget
     }
     return AppBar(
       backgroundColor: const Color(0xFF005067),
-      title: const SizedBox.shrink(), // Make the title empty
+      title: const SizedBox.shrink(),
       flexibleSpace: Stack(
         alignment: Alignment.center,
         children: [
@@ -25,7 +28,7 @@ class AppBarWeekSchedule extends StatelessWidget
               child: Opacity(
                 opacity: 0.5,
                 child: Transform.scale(
-                  scale: 3.0, // Adjust the scale factor to zoom the image
+                  scale: 3.0,
                   child: Image.asset(
                     'assets/images/3il-icon-white.png',
                     fit: BoxFit.cover,
@@ -52,5 +55,5 @@ class AppBarWeekSchedule extends StatelessWidget
   }
 
   @override
-  Size get preferredSize => const Size.fromHeight(70.0);
+  Size get preferredSize => const Size.fromHeight(appBarHeight);
 }
diff --git a/frontend/app_student/lib/week_schedule/views/widgets/events/event_details.dart b/frontend/app_student/lib/week_schedule/views/widgets/events/event_details.dart
@@ -18,7 +18,7 @@ class EventDetails extends StatelessWidget {
             EventHours(event: event),
             SizedBox(
               width:
-                  constraints.maxWidth - 50, // Subtract the width of EventHours
+                  constraints.maxWidth - 80, // Subtract the width of EventHours
               child: EventInfo(event: event),
             ),
           ],