From db09c2a0f9642ca4235d9af0c44e5e5975171200 Mon Sep 17 00:00:00 2001
From: Camille Brulotte <37625944+camillebrulotte@users.noreply.github.com>
Date: Fri, 22 Sep 2023 10:37:53 -0400
Subject: [PATCH] Add FAQ page (#850)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Merge master

* Add new page

* Finir FAQ login

* Add FAQ to more page

* Add faq viewmodel tests

* flutter test --update-goldens

* Add more page test

* Clean up

* [BOT] Applying version.

* [BOT] Applying format.

* Fix test

* Remove unused

* Remove unused variables

* Change colors in darkteam

* [BOT] Applying format.

* generate goldens

* [BOT] Applying format.

* [BOT] Update golden files

* Import

* -_-

* 😑

* [BOT] Applying version.

---------

Co-authored-by: camillebrulotte <camillebrulotte@users.noreply.github.com>
Co-authored-by: clubapplets-server <clubapplets-server@users.noreply.github.com>
---
 l10n/intl_en.arb                          |   5 +-
 l10n/intl_fr.arb                          |   7 +-
 lib/core/constants/discovery_ids.dart     |   1 +
 lib/core/constants/faq.dart               | 129 ++++++++++
 lib/core/constants/router_paths.dart      |   1 +
 lib/core/models/faq_actions.dart          |  27 ++
 lib/core/models/faq_questions.dart        |  12 +
 lib/core/viewmodels/faq_viewmodel.dart    |  48 ++++
 lib/core/viewmodels/login_viewmodel.dart  |   4 -
 lib/ui/router.dart                        |   6 +
 lib/ui/utils/discovery_components.dart    |  23 ++
 lib/ui/views/faq_view.dart                | 286 ++++++++++++++++++++++
 lib/ui/views/login_view.dart              |  27 +-
 lib/ui/views/more_view.dart               |  13 +
 pubspec.lock                              |   7 +
 pubspec.yaml                              |   3 +-
 test/ui/views/faq_view_test.dart          |  85 +++++++
 test/ui/views/goldenFiles/FaqView_1.png   | Bin 0 -> 10594 bytes
 test/ui/views/goldenFiles/moreView_1.png  | Bin 3429 -> 3450 bytes
 test/ui/views/login_view_test.dart        |  51 +---
 test/ui/views/more_view_test.dart         |  19 +-
 test/viewmodels/faq_viewmodel_test.dart   |  53 ++++
 test/viewmodels/login_viewmodel_test.dart |   8 -
 23 files changed, 732 insertions(+), 83 deletions(-)
 create mode 100644 lib/core/constants/faq.dart
 create mode 100644 lib/core/models/faq_actions.dart
 create mode 100644 lib/core/models/faq_questions.dart
 create mode 100644 lib/core/viewmodels/faq_viewmodel.dart
 create mode 100644 lib/ui/views/faq_view.dart
 create mode 100644 test/ui/views/faq_view_test.dart
 create mode 100644 test/ui/views/goldenFiles/FaqView_1.png
 create mode 100644 test/viewmodels/faq_viewmodel_test.dart

diff --git a/l10n/intl_en.arb b/l10n/intl_en.arb
index b1216dac3..fafd6d270 100644
--- a/l10n/intl_en.arb
+++ b/l10n/intl_en.arb
@@ -263,6 +263,7 @@
   "discovery_navbar_more_title": "More",
   "discovery_navbar_more_details": "The More page gives you access to additional options of the application.",
   "discovery_page_more_contributors": "Here you will find the list of all the students who contributed and developed this application.",
+  "discovery_page_faq": "Here you will find the answers to the most frequently asked questions.",
   "discovery_page_more_report_bug": "The app is not perfect and we are always open to suggestions! If you see a problem or want us to be part of an idea, you can use this feature.",
   "discovery_page_more_settings": "Here you can change the general settings of the application.",
   
@@ -309,7 +310,9 @@
 
   "in_app_review_title": "Rate us!",
   "forgot_password": "Forgot your password?",
-  "need_help_contact_us": "Need help? Contact us!",
+  "need_help": "Need help?",
+  "actions": "Actions",
+  "questions_and_answers": "Questions and answers",
   "universal_code_example": "Ex: AB12345",
   "my_tickets": "My tickets",
   "no_ticket": "No ticket",
diff --git a/l10n/intl_fr.arb b/l10n/intl_fr.arb
index c4b8c0a4d..387817b8c 100644
--- a/l10n/intl_fr.arb
+++ b/l10n/intl_fr.arb
@@ -264,6 +264,7 @@
   "discovery_navbar_more_details": "La page Plus vous permet d'avoir accès aux options supplémentaires de l'application.",
   "discovery_page_more_report_bug": "L'application n'est pas parfaite et nous sommes toujours ouverts à des suggestions! Si vous voyez un problème ou si vous souhaitez nous faire part d'une idée, vous pouvez utiliser cette fonctionnalité",
   "discovery_page_more_contributors": "Ici vous trouverez la liste de tous les étudiants qui ont travaillé sur le projet d'un point de vue du code.",
+  "discovery_page_faq": "Si vous avez des questions, vous pouvez consulter notre FAQ.",
   "discovery_page_more_settings": "Et finalement ici vous pouvez changer les paramètres généraux de l'application!",
   
   "discovery_page_thankyou_message": "Merci encore d'avoir installé ÉTSMobile! Nous espérons que cette application vous sera utile! Plein de nouvelles fonctionnalités vont arriver dans les mois à venir donc penser à mettre à jour l'application!!",
@@ -307,9 +308,11 @@
   },
   "progress_bar_suffix": "jours",
 
-  "in_app_review_title": "Évaluez-nous!",
+  "in_app_review_title": "Évaluez-nous!",  
+  "need_help": "Besoin d'aide?",
+  "questions_and_answers": "Questions et réponses",
+  "actions": "Actions",
   "forgot_password": "Mot de passe oublié?",
-  "need_help_contact_us": "Besoin d'aide? Contactez-nous!",
   "universal_code_example": "Ex: AB12345",
   "my_tickets": "Mes billets",
   "no_ticket": "Aucun billet",
diff --git a/lib/core/constants/discovery_ids.dart b/lib/core/constants/discovery_ids.dart
index c14e683dc..2212de49e 100644
--- a/lib/core/constants/discovery_ids.dart
+++ b/lib/core/constants/discovery_ids.dart
@@ -23,6 +23,7 @@ class DiscoveryIds {
 
   static const String detailsMoreBugReport = "page_more_bug_report";
   static const String detailsMoreContributors = "page_more_contributors";
+  static const String detailsMoreFaq = "page_more_faq";
   static const String detailsMoreSettings = "page_more_settings";
   static const String detailsMoreThankYou = "page_more_thank_you";
 }
diff --git a/lib/core/constants/faq.dart b/lib/core/constants/faq.dart
new file mode 100644
index 000000000..05592e81a
--- /dev/null
+++ b/lib/core/constants/faq.dart
@@ -0,0 +1,129 @@
+// FLUTTER / DART / THIRD-PARTIES
+import 'package:flutter/material.dart';
+
+// MODELS
+import 'package:notredame/core/models/faq_actions.dart';
+import 'package:notredame/core/models/faq_questions.dart';
+
+// CONSTANTS
+import 'package:notredame/core/constants/app_info.dart';
+
+class Faq {
+  List<QuestionItem> questions = [
+    QuestionItem(
+      title: {
+        "fr": "Quel mot de passe dois-je utiliser pour me connecter ?",
+        "en": "What password should I use to log in?"
+      },
+      description: {
+        "fr":
+            "Le mot de passe à utiliser correspond à celui utilisé pour la connexion à MonÉTS et les autres systèmes informatiques de l’ÉTS.",
+        "en":
+            "The password is the one you use for logging into MonÉTS and other ÉTS computer systems."
+      },
+    ),
+    QuestionItem(
+      title: {
+        "fr": "Je n’ai pas accès au cours et au programme.",
+        "en": "I don't have access to the courses and program."
+      },
+      description: {
+        "fr":
+            "Les nouveaux étudiants pourraient ne pas voir l’horaire et les cours inscrits avant le début de la première session de cours. Cependant, ces informations apparaissent dès le début de la première session de cours.",
+        "en":
+            "New students may not see the schedule and courses before the start of the first course session. However, this information becomes available at the beginning of the first course session."
+      },
+    ),
+    QuestionItem(
+      title: {
+        "fr":
+            "Je suis diplômé de l’ÉTS et je souhaite faire réactiver mon compte.",
+        "en": "I am an ÉTS graduate, and I want to reactivate my account."
+      },
+      description: {
+        "fr": "Vous pouvez demander de réactiver votre compte",
+        "en": "You can request to reactivate your account."
+      },
+    ),
+    QuestionItem(
+      title: {
+        "fr": "Je ne vois plus mes notes de contrôle",
+        "en": "I can't see my grades anymore."
+      },
+      description: {
+        "fr":
+            "Il est possible qu’il s’agit de la période d'évaluation des cours. Vous devez compléter les évaluations sur SignETS. Les notes seront disponibles après avoir répondu aux évaluations.",
+        "en":
+            "It is possible that this is the course evaluation period. You need to complete the evaluations on SignETS. Grades will be available after responding to the evaluations."
+      },
+    ),
+  ];
+
+  List<ActionItem> actions = [
+    ActionItem(
+      title: {
+        "fr": "Où trouver mon code universel ?",
+        "en": "Where can I find my universal code?"
+      },
+      description: {
+        "fr":
+            "Le code universel se trouve dans la décision d’admission sur le portail de monÉTS.",
+        "en":
+            "The universal code can be found in the admission decision on the MonÉTS portal."
+      },
+      type: ActionType.webview,
+      link: "https://portail.etsmtl.ca/home/Admission",
+      iconName: Icons.person,
+      iconColor: const Color(0xFFD5A8F8),
+      circleColor: const Color(0xFF6939B7),
+    ),
+    ActionItem(
+      title: {
+        "fr":
+            "Je suis diplômé de l’ÉTS et je souhaite faire réactiver mon compte.",
+        "en": "I am an ÉTS graduate, and I want to reactivate my account."
+      },
+      description: {
+        "fr": "Vous pouvez demander de réactiver votre compte.",
+        "en": "You can request to reactivate your account."
+      },
+      type: ActionType.webview,
+      link: "https://formulaires.etsmtl.ca/ReactivationCompte",
+      iconName: Icons.school,
+      iconColor: const Color(0xFF78E2BC),
+      circleColor: const Color(0xFF39B78A),
+    ),
+    ActionItem(
+      title: {
+        "fr":
+            "Questions concernant vos conditions d'admission, des inscriptions et des conditions relatives à la poursuite de vos études",
+        "en":
+            "Questions about your admission conditions, registrations, and conditions for continuing your studies"
+      },
+      description: {
+        "fr": "Veuillez contacter le Bureau de la registraire.",
+        "en": "Please contact the Office of the Registrar."
+      },
+      type: ActionType.email,
+      link: "accueilbdr@etsmtl.ca",
+      iconName: Icons.email,
+      iconColor: const Color(0xFFFCA4A4),
+      circleColor: const Color(0xFFDA4444),
+    ),
+    ActionItem(
+      title: {
+        "fr": "Questions concernant l’application ÉTSMobile",
+        "en": "Questions about the ÉTSMobile app"
+      },
+      description: {
+        "fr": "Veuillez contacter App|ETS.",
+        "en": "Please contact App|ETS."
+      },
+      type: ActionType.email,
+      link: AppInfo.email,
+      iconName: Icons.install_mobile,
+      iconColor: const Color(0xFF71D8F7),
+      circleColor: const Color(0xFF397DB7),
+    ),
+  ];
+}
diff --git a/lib/core/constants/router_paths.dart b/lib/core/constants/router_paths.dart
index 17f874fb5..f62fcf345 100644
--- a/lib/core/constants/router_paths.dart
+++ b/lib/core/constants/router_paths.dart
@@ -2,6 +2,7 @@
 class RouterPaths {
   static const String startup = "/startup";
   static const String login = "/login";
+  static const String faq = "/faq";
   static const String dashboard = "/dashboard";
   static const String schedule = "/schedule";
   static const String student = "/student";
diff --git a/lib/core/models/faq_actions.dart b/lib/core/models/faq_actions.dart
new file mode 100644
index 000000000..c229ede28
--- /dev/null
+++ b/lib/core/models/faq_actions.dart
@@ -0,0 +1,27 @@
+// FLUTTER / DART / THIRD-PARTIES
+import 'package:flutter/material.dart';
+
+class ActionItem {
+  final Map<String, String> title;
+  final Map<String, String> description;
+  final ActionType type;
+  final String link;
+  final IconData iconName;
+  final Color iconColor;
+  final Color circleColor;
+
+  ActionItem({
+    @required this.title,
+    @required this.description,
+    @required this.type,
+    @required this.link,
+    @required this.iconName,
+    @required this.iconColor,
+    @required this.circleColor,
+  });
+}
+
+enum ActionType {
+  webview,
+  email,
+}
diff --git a/lib/core/models/faq_questions.dart b/lib/core/models/faq_questions.dart
new file mode 100644
index 000000000..a96bc41a3
--- /dev/null
+++ b/lib/core/models/faq_questions.dart
@@ -0,0 +1,12 @@
+// FLUTTER / DART / THIRD-PARTIES
+import 'package:flutter/material.dart';
+
+class QuestionItem {
+  final Map<String, String> title;
+  final Map<String, String> description;
+
+  QuestionItem({
+    @required this.title,
+    @required this.description,
+  });
+}
diff --git a/lib/core/viewmodels/faq_viewmodel.dart b/lib/core/viewmodels/faq_viewmodel.dart
new file mode 100644
index 000000000..2fba133d9
--- /dev/null
+++ b/lib/core/viewmodels/faq_viewmodel.dart
@@ -0,0 +1,48 @@
+// FLUTTER / DART / THIRD-PARTIES
+import 'package:flutter/material.dart';
+import 'package:notredame/locator.dart';
+import 'package:stacked/stacked.dart';
+import 'package:flutter_gen/gen_l10n/app_localizations.dart';
+
+// MANAGERS
+import 'package:notredame/core/managers/settings_manager.dart';
+
+// SERVICES
+import 'package:notredame/core/services/launch_url_service.dart';
+import 'package:notredame/core/services/analytics_service.dart';
+
+// CONSTANTS
+import 'package:notredame/core/constants/app_info.dart';
+
+class FaqViewModel extends BaseViewModel {
+  final SettingsManager _settingsManager = locator<SettingsManager>();
+
+  final LaunchUrlService _launchUrlService = locator<LaunchUrlService>();
+
+  Locale get locale => _settingsManager.locale;
+
+  String mailtoStr(String email, String subject) {
+    return 'mailto:$email?subject=$subject';
+  }
+
+  Future<void> launchWebsite(String link, Brightness brightness) async {
+    await _launchUrlService.launchInBrowser(link, brightness);
+  }
+
+  Future<void> openMail(String addressEmail, BuildContext context) async {
+    var email = "";
+    if (addressEmail == AppInfo.email) {
+      email = mailtoStr(addressEmail, AppIntl.of(context).email_subject);
+    } else {
+      email = mailtoStr(addressEmail, "");
+    }
+
+    final urlLaunchable = await _launchUrlService.canLaunch(email);
+
+    if (urlLaunchable) {
+      await _launchUrlService.launch(email);
+    } else {
+      locator<AnalyticsService>().logError("login_view", "Cannot send email.");
+    }
+  }
+}
diff --git a/lib/core/viewmodels/login_viewmodel.dart b/lib/core/viewmodels/login_viewmodel.dart
index 09a8cb47b..0061bda40 100644
--- a/lib/core/viewmodels/login_viewmodel.dart
+++ b/lib/core/viewmodels/login_viewmodel.dart
@@ -90,8 +90,4 @@ class LoginViewModel extends BaseViewModel {
 
     return _appIntl.login_error_invalid_credentials;
   }
-
-  String mailtoStr(String email, String subject) {
-    return 'mailto:$email?subject=$subject';
-  }
 }
diff --git a/lib/ui/router.dart b/lib/ui/router.dart
index 53c973372..b7739e1c0 100644
--- a/lib/ui/router.dart
+++ b/lib/ui/router.dart
@@ -13,6 +13,7 @@ import 'package:notredame/ui/views/feedback_view.dart';
 
 // VIEWS
 import 'package:notredame/ui/views/login_view.dart';
+import 'package:notredame/ui/views/faq_view.dart';
 import 'package:notredame/ui/views/not_found_view.dart';
 import 'package:notredame/ui/views/more_view.dart';
 import 'package:notredame/ui/views/outage_view.dart';
@@ -48,6 +49,11 @@ Route<dynamic> generateRoute(RouteSettings routeSettings) {
       return MaterialPageRoute(
           settings: RouteSettings(name: routeSettings.name),
           builder: (_) => LoginView());
+    case RouterPaths.faq:
+      return MaterialPageRoute(
+          settings: RouteSettings(name: routeSettings.name),
+          builder: (_) =>
+              FaqView(backgroundColor: routeSettings.arguments as Color));
     case RouterPaths.dashboard:
       final code = (routeSettings.arguments as UpdateCode) ?? UpdateCode.none;
       return PageRouteBuilder(
diff --git a/lib/ui/utils/discovery_components.dart b/lib/ui/utils/discovery_components.dart
index d5655dd46..b7236cf6a 100644
--- a/lib/ui/utils/discovery_components.dart
+++ b/lib/ui/utils/discovery_components.dart
@@ -367,6 +367,29 @@ List<GroupDiscovery> discoveryComponents(BuildContext context) {
           ),
         ),
       ),
+      Discovery(
+        path: null,
+        featureId: DiscoveryIds.detailsMoreFaq,
+        title: AppIntl.of(context).need_help,
+        details: ConstrainedBox(
+          constraints: BoxConstraints(
+              maxHeight: MediaQuery.of(context).size.height * 0.2),
+          child: Column(
+            children: [
+              Expanded(
+                child: ListView(
+                  padding: EdgeInsets.zero,
+                  children: <Widget>[
+                    _buildSkipDiscoveryButton(context),
+                    Text(AppIntl.of(context).discovery_page_faq,
+                        textAlign: TextAlign.justify),
+                  ],
+                ),
+              ),
+            ],
+          ),
+        ),
+      ),
       Discovery(
         path: null,
         featureId: DiscoveryIds.detailsMoreSettings,
diff --git a/lib/ui/views/faq_view.dart b/lib/ui/views/faq_view.dart
new file mode 100644
index 000000000..e088180b9
--- /dev/null
+++ b/lib/ui/views/faq_view.dart
@@ -0,0 +1,286 @@
+// FLUTTER / DART / THIRD-PARTIES
+import 'package:carousel_slider/carousel_slider.dart';
+import 'package:flutter/material.dart';
+import 'package:stacked/stacked.dart';
+import 'package:flutter_gen/gen_l10n/app_localizations.dart';
+
+// VIEWMODEL
+import 'package:notredame/core/viewmodels/faq_viewmodel.dart';
+
+// MODELS
+import 'package:notredame/core/models/faq_actions.dart';
+
+// CONSTANTS
+import 'package:notredame/core/constants/faq.dart';
+
+class FaqView extends StatefulWidget {
+  final Color backgroundColor;
+
+  const FaqView({this.backgroundColor});
+
+  @override
+  State<FaqView> createState() => _FaqViewState();
+}
+
+class _FaqViewState extends State<FaqView> {
+  final Faq faq = Faq();
+
+  @override
+  Widget build(BuildContext context) => ViewModelBuilder<FaqViewModel>.reactive(
+        viewModelBuilder: () => FaqViewModel(),
+        builder: (context, model, child) {
+          return Scaffold(
+            backgroundColor: widget.backgroundColor,
+            body: Column(
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: <Widget>[
+                getTitle(),
+                getSubtitle(AppIntl.of(context).questions_and_answers),
+                Padding(
+                  padding: const EdgeInsets.only(left: 15.0, right: 15.0),
+                  child: CarouselSlider(
+                    options: CarouselOptions(
+                      height: 250.0,
+                    ),
+                    items: faq.questions.asMap().entries.map((entry) {
+                      final int index = entry.key;
+                      final question = faq.questions[index];
+
+                      return Builder(
+                        builder: (BuildContext context) {
+                          return Container(
+                            width: MediaQuery.of(context).size.width,
+                            margin: const EdgeInsets.symmetric(horizontal: 5.0),
+                            decoration: BoxDecoration(
+                              color: Theme.of(context).brightness ==
+                                      Brightness.light
+                                  ? const Color.fromARGB(255, 240, 238, 238)
+                                  : const Color.fromARGB(255, 40, 40, 40),
+                              borderRadius:
+                                  const BorderRadius.all(Radius.circular(8.0)),
+                            ),
+                            child: getQuestionCard(
+                              question.title[model.locale.languageCode],
+                              question.description[model.locale.languageCode],
+                            ),
+                          );
+                        },
+                      );
+                    }).toList(),
+                  ),
+                ),
+                getSubtitle(AppIntl.of(context).actions),
+                Expanded(
+                  child: ListView.builder(
+                    padding: const EdgeInsets.only(top: 1.0),
+                    itemCount: faq.actions.length,
+                    itemBuilder: (context, index) {
+                      final action = faq.actions[index];
+
+                      return getActionCard(
+                          action.title[model.locale.languageCode],
+                          action.description[model.locale.languageCode],
+                          action.type,
+                          action.link,
+                          action.iconName,
+                          action.iconColor,
+                          action.circleColor,
+                          context,
+                          model);
+                    },
+                  ),
+                )
+              ],
+            ),
+          );
+        },
+      );
+
+  Padding getTitle() {
+    return Padding(
+      padding: const EdgeInsets.only(top: 60.0),
+      child: Row(
+        children: [
+          Padding(
+            padding: const EdgeInsets.only(left: 5.0),
+            child: GestureDetector(
+              onTap: () {
+                Navigator.of(context).pop();
+              },
+              child: Padding(
+                padding: const EdgeInsets.only(left: 10.0),
+                child: Icon(
+                  Icons.arrow_back,
+                  color: widget.backgroundColor == Colors.white
+                      ? Colors.black
+                      : Colors.white,
+                ),
+              ),
+            ),
+          ),
+          const SizedBox(width: 8.0),
+          Expanded(
+            child: Text(
+              AppIntl.of(context).need_help,
+              textAlign: TextAlign.center,
+              style: Theme.of(context).textTheme.headline5.copyWith(
+                    color: widget.backgroundColor == Colors.white
+                        ? Colors.black
+                        : Colors.white,
+                  ),
+            ),
+          ),
+        ],
+      ),
+    );
+  }
+
+  Padding getSubtitle(String subtitle) {
+    return Padding(
+      padding: const EdgeInsets.only(left: 18.0, top: 18.0, bottom: 10.0),
+      child: Text(
+        subtitle,
+        style: Theme.of(context).textTheme.headline5.copyWith(
+              color: widget.backgroundColor == Colors.white
+                  ? Colors.black
+                  : Colors.white,
+            ),
+      ),
+    );
+  }
+
+  Padding getQuestionCard(String title, String description) {
+    return Padding(
+      padding: const EdgeInsets.only(top: 20.0, left: 20.0, right: 20.0),
+      child: Align(
+        alignment: Alignment.topLeft,
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          crossAxisAlignment: CrossAxisAlignment.start,
+          children: <Widget>[
+            Text(
+              title,
+              textScaleFactor: 1.0,
+              style: Theme.of(context).textTheme.bodyText2.copyWith(
+                    fontSize: 20,
+                    color: Theme.of(context).brightness == Brightness.light
+                        ? Colors.black
+                        : Colors.white,
+                  ),
+              textAlign: TextAlign.justify,
+            ),
+            const SizedBox(height: 20.0),
+            Text(
+              description,
+              textScaleFactor: 1.0,
+              style: Theme.of(context).textTheme.bodyText2.copyWith(
+                    fontSize: 16,
+                    color: Theme.of(context).brightness == Brightness.light
+                        ? Colors.black
+                        : Colors.white,
+                  ),
+              textAlign: TextAlign.justify,
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+
+  Padding getActionCard(
+      String title,
+      String description,
+      ActionType type,
+      String link,
+      IconData iconName,
+      Color iconColor,
+      Color circleColor,
+      BuildContext context,
+      FaqViewModel model) {
+    return Padding(
+      padding: const EdgeInsets.fromLTRB(15.0, 0.0, 15.0, 15.0),
+      child: ElevatedButton(
+        onPressed: () {
+          if (type.name == ActionType.webview.name) {
+            openWebview(model, link);
+          } else if (type.name == ActionType.email.name) {
+            openMail(model, context, link);
+          }
+        },
+        style: ButtonStyle(
+            elevation: MaterialStateProperty.all<double>(8.0),
+            shape: MaterialStateProperty.all<RoundedRectangleBorder>(
+              RoundedRectangleBorder(
+                borderRadius: BorderRadius.circular(8.0),
+              ),
+            )),
+        child: getActionCardInfo(
+          context,
+          title,
+          description,
+          iconName,
+          iconColor,
+          circleColor,
+        ),
+      ),
+    );
+  }
+
+  Row getActionCardInfo(BuildContext context, String title, String description,
+      IconData iconName, Color iconColor, Color circleColor) {
+    return Row(
+      children: <Widget>[
+        Column(
+          children: <Widget>[
+            CircleAvatar(
+              backgroundColor: circleColor,
+              radius: 25,
+              child: Icon(iconName, color: iconColor),
+            ),
+          ],
+        ),
+        Expanded(
+          child: Padding(
+            padding: const EdgeInsets.fromLTRB(15, 15, 0, 15),
+            child: Column(
+              mainAxisSize: MainAxisSize.min,
+              crossAxisAlignment: CrossAxisAlignment.start,
+              children: <Widget>[
+                Text(
+                  title,
+                  style: Theme.of(context).textTheme.bodyText2.copyWith(
+                        fontSize: 18,
+                        color: Theme.of(context).brightness == Brightness.light
+                            ? Colors.black
+                            : Colors.white,
+                      ),
+                  textAlign: TextAlign.left,
+                ),
+                const SizedBox(height: 10.0),
+                Text(
+                  description,
+                  style: Theme.of(context).textTheme.bodyText2.copyWith(
+                        fontSize: 16,
+                        color: Theme.of(context).brightness == Brightness.light
+                            ? Colors.black
+                            : Colors.white,
+                      ),
+                  textAlign: TextAlign.justify,
+                )
+              ],
+            ),
+          ),
+        )
+      ],
+    );
+  }
+
+  Future<void> openWebview(FaqViewModel model, String link) async {
+    model.launchWebsite(link, Theme.of(context).brightness);
+  }
+
+  Future<void> openMail(
+      FaqViewModel model, BuildContext context, String addressEmail) async {
+    model.openMail(addressEmail, context);
+  }
+}
diff --git a/lib/ui/views/login_view.dart b/lib/ui/views/login_view.dart
index db999169a..8135e44b6 100644
--- a/lib/ui/views/login_view.dart
+++ b/lib/ui/views/login_view.dart
@@ -6,7 +6,7 @@ import 'package:fluttertoast/fluttertoast.dart';
 import 'package:stacked/stacked.dart';
 
 // SERVICE
-import 'package:notredame/core/services/analytics_service.dart';
+import 'package:notredame/core/services/navigation_service.dart';
 import 'package:notredame/core/services/launch_url_service.dart';
 
 // UTILS
@@ -20,8 +20,8 @@ import 'package:notredame/core/viewmodels/login_viewmodel.dart';
 import 'package:notredame/ui/widgets/password_text_field.dart';
 
 // CONSTANTS
-import 'package:notredame/core/constants/app_info.dart';
 import 'package:notredame/core/constants/urls.dart';
+import 'package:notredame/core/constants/router_paths.dart';
 
 // OTHER
 import 'package:notredame/ui/utils/app_theme.dart';
@@ -37,6 +37,8 @@ class _LoginViewState extends State<LoginView> {
 
   final FocusScopeNode _focusNode = FocusScopeNode();
 
+  final NavigationService _navigationService = locator<NavigationService>();
+
   final LaunchUrlService _launchUrlService = locator<LaunchUrlService>();
 
   /// Unique key of the login form form
@@ -207,13 +209,18 @@ class _LoginViewState extends State<LoginView> {
                                   padding: const EdgeInsets.only(top: 24),
                                   child: InkWell(
                                     child: Text(
-                                      AppIntl.of(context).need_help_contact_us,
+                                      AppIntl.of(context).need_help,
                                       style: const TextStyle(
                                           decoration: TextDecoration.underline,
                                           color: Colors.white),
                                     ),
                                     onTap: () async {
-                                      sendEmail(model);
+                                      _navigationService.pushNamed(
+                                          RouterPaths.faq,
+                                          arguments: Utils.getColorByBrightness(
+                                              context,
+                                              AppTheme.etsLightRed,
+                                              AppTheme.primaryDark));
                                     },
                                   ),
                                 ),
@@ -260,16 +267,4 @@ class _LoginViewState extends State<LoginView> {
 
   Color get submitTextColor =>
       Utils.getColorByBrightness(context, AppTheme.etsLightRed, Colors.white);
-
-  Future<void> sendEmail(LoginViewModel model) async {
-    final clubEmail =
-        model.mailtoStr(AppInfo.email, AppIntl.of(context).email_subject);
-    final urlLaunchable = await _launchUrlService.canLaunch(clubEmail);
-
-    if (urlLaunchable) {
-      await _launchUrlService.launch(clubEmail);
-    } else {
-      locator<AnalyticsService>().logError("login_view", "Cannot send email.");
-    }
-  }
 }
diff --git a/lib/ui/views/more_view.dart b/lib/ui/views/more_view.dart
index 93c49a001..8ed7f33d3 100644
--- a/lib/ui/views/more_view.dart
+++ b/lib/ui/views/more_view.dart
@@ -160,6 +160,19 @@ class _MoreViewState extends State<MoreView> {
                         opaque: false,
                       ));
                     }),
+                ListTile(
+                    title: Text(AppIntl.of(context).need_help),
+                    leading: _buildDiscoveryFeatureDescriptionWidget(
+                        context,
+                        getProperIconAccordingToTheme(Icons.question_answer),
+                        DiscoveryIds.detailsMoreFaq,
+                        model),
+                    onTap: () {
+                      _analyticsService.logEvent(tag, "FAQ clicked");
+                      model.navigationService.pushNamed(RouterPaths.faq,
+                          arguments: Utils.getColorByBrightness(
+                              context, Colors.white, AppTheme.primaryDark));
+                    }),
                 ListTile(
                     title: Text(AppIntl.of(context).settings_title),
                     leading: _buildDiscoveryFeatureDescriptionWidget(
diff --git a/pubspec.lock b/pubspec.lock
index bcc47f26a..54a5724b1 100644
--- a/pubspec.lock
+++ b/pubspec.lock
@@ -85,6 +85,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.0.1"
+  carousel_slider:
+    dependency: "direct main"
+    description:
+      name: carousel_slider
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "4.2.1"
   characters:
     dependency: transitive
     description:
diff --git a/pubspec.yaml b/pubspec.yaml
index acc62915d..3f58d02db 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -5,7 +5,7 @@ description: The 4th generation of ÉTSMobile, the main gateway between the Éco
 # pub.dev using `pub publish`. This is preferred for private packages.
 publish_to: 'none' # Remove this line if you wish to publish to pub.dev
 
-version: 4.26.0+1
+version: 4.27.0+1
 
 environment:
   sdk: ">=2.10.0 <3.0.0"
@@ -71,6 +71,7 @@ dependencies:
   auto_size_text: ^3.0.0
   easter_egg_trigger: ^1.0.1
   calendar_view: ^1.0.1
+  carousel_slider: ^4.2.1
   reorderable_grid_view: ^2.2.6
 
 dev_dependencies:
diff --git a/test/ui/views/faq_view_test.dart b/test/ui/views/faq_view_test.dart
new file mode 100644
index 000000000..057f61b6d
--- /dev/null
+++ b/test/ui/views/faq_view_test.dart
@@ -0,0 +1,85 @@
+// FLUTTER / DART / THIRD-PARTIES
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:flutter_gen/gen_l10n/app_localizations.dart';
+
+// MANAGERS
+import 'package:notredame/core/managers/settings_manager.dart';
+import '../../mock/managers/settings_manager_mock.dart';
+
+// VIEW
+import 'package:notredame/ui/views/faq_view.dart';
+
+// HELPERS
+import '../../helpers.dart';
+
+// CONSTANTS
+import 'package:notredame/core/constants/faq.dart';
+
+void main() {
+  group('FaqView - ', () {
+    AppIntl appIntl;
+
+    SettingsManager settingsManager;
+
+    setUp(() async {
+      setupLaunchUrlServiceMock();
+      settingsManager = setupSettingsManagerMock();
+      appIntl = await setupAppIntl();
+    });
+
+    tearDown(() {});
+
+    group('UI - ', () {
+      testWidgets('has x ElevatedButton', (WidgetTester tester) async {
+        SettingsManagerMock.stubLocale(settingsManager as SettingsManagerMock);
+
+        await tester.pumpWidget(localizedWidget(child: const FaqView()));
+        await tester.pumpAndSettle();
+
+        final elevatedButton = find.byType(ElevatedButton, skipOffstage: false);
+
+        final Faq faq = Faq();
+        final numberOfButtons = faq.actions.length;
+        expect(elevatedButton, findsNWidgets(numberOfButtons));
+      });
+
+      testWidgets('has 2 subtitles', (WidgetTester tester) async {
+        SettingsManagerMock.stubLocale(settingsManager as SettingsManagerMock);
+
+        await tester.pumpWidget(localizedWidget(child: const FaqView()));
+        await tester.pumpAndSettle();
+
+        final subtitle1 = find.text(appIntl.actions);
+        expect(subtitle1, findsNWidgets(1));
+
+        final subtitle2 = find.text(appIntl.questions_and_answers);
+        expect(subtitle2, findsNWidgets(1));
+      });
+
+      testWidgets('has 1 title', (WidgetTester tester) async {
+        SettingsManagerMock.stubLocale(settingsManager as SettingsManagerMock);
+
+        await tester.pumpWidget(localizedWidget(child: const FaqView()));
+        await tester.pumpAndSettle();
+
+        final title = find.text(appIntl.need_help);
+
+        expect(title, findsOneWidget);
+      });
+    });
+
+    group("golden - ", () {
+      testWidgets("default view", (WidgetTester tester) async {
+        SettingsManagerMock.stubLocale(settingsManager as SettingsManagerMock);
+        tester.binding.window.physicalSizeTestValue = const Size(1800, 2410);
+
+        await tester.pumpWidget(localizedWidget(child: const FaqView()));
+        await tester.pumpAndSettle();
+
+        await expectLater(find.byType(FaqView),
+            matchesGoldenFile(goldenFilePath("FaqView_1")));
+      });
+    });
+  });
+}
diff --git a/test/ui/views/goldenFiles/FaqView_1.png b/test/ui/views/goldenFiles/FaqView_1.png
new file mode 100644
index 0000000000000000000000000000000000000000..e75a99a40637f71cc00b945d4c991443482ce8bb
GIT binary patch
literal 10594
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
F_-{S}oudE%

literal 0
HcmV?d00001

diff --git a/test/ui/views/goldenFiles/moreView_1.png b/test/ui/views/goldenFiles/moreView_1.png
index 09f80b04d672c9a87296e3ff71ab54b3336e599e..5f323d1f3f78ac682549280bbb2498cb1f95dc34 100644
GIT binary patch
delta 2425
zcmai#eK^x=1II0SIVgENO;MAVysSCmsN`)bDpVr!x~-C<A!KFV^3zeLI?~b)6-KJH
zlr}GEdE4qp>o~EJSzfXvrVTU9u+7fz)OoJ!xt@QX`?~J?&-?z~-~0Rh+#|+|#@BWL
zmOfrPf>KK-J|4Xk9dni~5lluJ?%x+k`&9#H`FN)mydqBB+q|aYH|DJ;t6$pn9Phpf
z$DRMV2%cAMek?53FQ&E7*EqL$=ZW*-fAmle2RKDfkt^?2v}QX|_HM=77vHRE7;NHg
zYrJ3EG}Dw(Rww8ra|B$g?K5ux>z{CC1S3HyA%iuyjnkp?+}lk>wl7r2=)=ZW<PX{8
zPwD(yd0#hEoI|g2U^AtC{;CHegAK>P%^IfHHP)`Uq_GOG&^y4nc3%0S6AaLDT0iS+
zTSvR71}`UTtTNEuU=H`ZhenW^%3z_HG2{7?)j-!gru)W6p)i(bF^=!=@5hilH>SWn
zy-?YgLe=tnaCNDlhUi89nL=HGGLb#$5$G{RV?1?Vc5p|c8-g)CRf0P^V_MjYifH7C
z3RR0e{HG4Pqp+XiU+I?m-CfE%&S6arClA{Z+bV1*1-<cy6Pib8(+XWQ&3)xTA8sh%
zHt)~3xj2|5+XyHs7<`O}sx2|7RQmxX9JL#*2-rTy)5px-6a#X?h@8JP;7wW>8{HK>
zn<I$L(+CQ*gC~aeKd28%YdyK=(PNG7fQ@i^i<CrkALX+$`Dv<5GrDfi@*m5QH8&4%
zCez<Y>5Y@k0P~tpwN=uB)77?J04Xz$7v;f}Oa}VeZfpM9ncP}3iJ}xthnS|RXr?lK
zmEuI*P<E^_`|}`6A;*vwp64?P1ATApqeeTDivoSqWMXC-k0gJKbNdkQe7m^EUdH??
zrEj7XB+J-Yr`~Zdq8ApRy;)Kd*5Djf3yF7!TcZh81%d5}ODJOiI_eXLMw#zYn&Rc}
z)e9q^3c{Mj<V0I>h9JV%mf{ACwoSiLDL1EA5a^=CWC6`SM7%gdR7!DHk0()CS+JhC
z!TG`I;%!Vu=Jb+1B&lI>bx4_RTY?cDmOE7IVJmtWV`^*dA>V6DDR@DTJcLl)7#dN`
zdaCCU;Xt|b;zfZ{X8$p`lryHqA<Gku`Y`KMb^Rq*wSu~w;SAPrk1?S%WLgybY5Ku*
zaoaid7L|-c0!9u|3UtLttWaQtS59yI#A>#B`#4sg)gUQqibWARL6XP8GcA7HS+0VH
z%M&j$3^1Za5z9;Ht{6o#1I2Ca)<~KL&>dh0r#A~nj52Eo2w;gSwhh5ar*#ZrTY_6U
zKhF^d!kHPumryu}{$v~RLJObfY;e#|np;b28Wm1|xvO7LsJ_s(No!?+wdvX0k;D#e
zJsXC^Pu!^zpPgBPj0a>F=!GPGQxCC&sT@Q*6Mt~7{t(XkWu}wZQa`Y%fy6gC9uq?q
z8Qj)MyfRQ*Utdq#lZ|XXYxZ|vy88N!mibYZp!H85P_o>{1ge-Mv;}ioc@?{#AMi-D
zP$FCui`RE#L4|{9BDPefH^`1VR@NS1iIJy6oq_@6#nz*RXSQzL`mm}_FC`_V5drhH
zO|Xnejf;!Jkklvz@F)jxg^tOpB;(pIjadjUo*U^7g5{zC=Id<O{3Ipul1b~4h7VzC
z1~qEt!T!74R_YgpK;7dsB97%xNCn%+i5N5|>T((N)GNF;m;|!|k7#S@g=c75qjEN;
zBfO(hz;l{5;5AK6y{~!f;V|AVHC^!)G6>UH12N+|OjEy$-tghOX51On?O(tz+K$G}
z*PrEbxm?<wvF^FKl)EIp2*<h)sG>h_0UcmwmV4u5zdm!&E6V-Ol|ZS}%i*abY0_82
zk}8o|_66d9v^>`_%%57DKeZxq5u;x{b~q%Y2?6`D7uvJFe*8OR9#YM~Kkl`=D4BH@
z|Kpf?_psCQOHZEiP4zSh>(Rz};l;}zRMdx7(dnEsiqX-Z{Xn%X&MRP$S4KY(<Lj$N
zXO`dg`!9ZB>yo0@pp0C<qi-966ob*Pd0ot0osA>cT6Tg*VaD3Iwb|#Pc?C3sIfI@s
zy>(sU^lWcNV`JagFoVHxRVwyRNEc*H_f;xvJJ_fdbT|ZEAOBBgYEJa_^@Z~+JXass
z^*1sNsAiGfSpdSjL$G7~%>Pv~C#SEJxw2f`1>avp`<adIUTD4sYjn)N8E1(7%8QJ5
zycHBi<<ni@2X}DG+lP`uqse)Bc}S6(6uQ0n;|ZBo&WlJkY4_bCD_HCaJGe+BBCKaM
zH1u{^dal6w477bC{OQ<?jHY*Nv6PPE0jm4uEGv2#cvQ;_<Y;Kxp>oJ%GHp-jngq+7
z+|Y;!QTq7{Ly-GHAH!1DAyD+eRJXD-?#rvEI=>sfGk;1?-IBHn%EM}4HV)<J9?`A~
zj*6;geH(<)9lXkD$I7W2NXo1{nE57nAN9RsNry4LuC_KXy#;&Wa&bw=&(SXAtyn7b
zaX>@IkXv(t4+I}x7*&<pnJReYPFR7IK3NDTl$((Ig4i`t?1xnZ#k>S5>P`}NS3*_g
zrjj!z8>s8tfYj>Wy*k{Lv+qY<UN+3*H7tyl{CSe`@$k_*F7OFC2d}-Vl8N?syJ_UN
z?J3Fc>nMsZ@e{Vfrlm!Zz-8%HOc@@3JzW#Buzxb9{Or@_`Omp_2f7CeL$G1Ambt$9
z`LCzLci#=jg*0mO0dCZ(vEUi9Z>EwZD*gS*#MnFgyM*<CxJCBV$;X{IaEcvC{g<_W
zSyi&m`}-vcjd<Fj%kQcFA=@wD`^_^|+rQ=20;tTg=p9zMZhBN6HtuR@--dnW5Rc6m
z(tMb9^5jW7MMuJoV+KssKP7?OPgwHYeWZ8)#JAS`O@m`FuSHWO!zXPXEdX+gOz0DZ
z*5zbX{X0M9Gk?}Z^awHG?bfmO&&|Q`Qg*XH-{bVy!L-kpt;1cj-VI)I9ZT*rs`=2@
zhlHeFAtlO9Xs?>m+@;-zMws%+ToO8SJ}GUyh8^y@^g7>SWNN5YB9Z@5o2lyMse|XV
z;r6eY&unsAM4w*djLb`hB@(KCd6{V0#$+h;_hdtK)@Fjm+Und&wh;CMiL34io`b>R
a<;$){1cndQgh|w(;p2V4i?;K~FMk2(nds&K

delta 2380
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

diff --git a/test/ui/views/login_view_test.dart b/test/ui/views/login_view_test.dart
index 1e80795c3..a55332483 100644
--- a/test/ui/views/login_view_test.dart
+++ b/test/ui/views/login_view_test.dart
@@ -2,7 +2,6 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_test/flutter_test.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
-import 'package:mockito/mockito.dart';
 
 // MANAGERS / SERVICES
 import 'package:notredame/core/managers/user_repository.dart';
@@ -25,8 +24,6 @@ import '../../helpers.dart';
 
 void main() {
   AppIntl intl;
-  LaunchUrlServiceMock launchUrlService;
-  AnalyticsServiceMock analyticsService;
 
   group('LoginView - ', () {
     setUp(() async {
@@ -35,8 +32,8 @@ void main() {
       setupNavigationServiceMock();
       setupSettingsManagerMock();
       setupPreferencesServiceMock();
-      launchUrlService = setupLaunchUrlServiceMock() as LaunchUrlServiceMock;
-      analyticsService = setupAnalyticsServiceMock() as AnalyticsServiceMock;
+      setupLaunchUrlServiceMock() as LaunchUrlServiceMock;
+      setupAnalyticsServiceMock() as AnalyticsServiceMock;
     });
 
     tearDown(() {
@@ -70,50 +67,6 @@ void main() {
             isA<ElevatedButton>()
                 .having((source) => source.onPressed, 'onPressed', isNull));
       });
-
-      testWidgets('should open emails', (WidgetTester tester) async {
-        const url = 'mailto:applets@ens.etsmtl.ca?subject=ÉTSMobile Problem';
-        LaunchUrlServiceMock.stubCanLaunchUrl(launchUrlService, url);
-        LaunchUrlServiceMock.stubLaunchUrl(launchUrlService, url);
-
-        await tester.pumpWidget(localizedWidget(child: LoginView()));
-        await tester.pumpAndSettle();
-
-        await tester
-            .tap(find.widgetWithText(InkWell, intl.need_help_contact_us));
-
-        // Rebuild the widget after the state has changed.
-        await tester.pump();
-
-        verify(launchUrlService.canLaunch(url)).called(1);
-        verify(launchUrlService.launch(url)).called(1);
-        verifyNoMoreInteractions(launchUrlService);
-      });
-
-      testWidgets('cannot launch email on this platform',
-          (WidgetTester tester) async {
-        const url = 'mailto:applets@ens.etsmtl.ca?subject=ÉTSMobile Problem';
-        LaunchUrlServiceMock.stubCanLaunchUrl(launchUrlService, url,
-            toReturn: false);
-        LaunchUrlServiceMock.stubLaunchUrl(launchUrlService, url,
-            toReturn: false);
-
-        await tester.pumpWidget(localizedWidget(child: LoginView()));
-        await tester.pumpAndSettle();
-
-        await tester
-            .tap(find.widgetWithText(InkWell, intl.need_help_contact_us));
-
-        // Rebuild the widget after the state has changed.
-        await tester.pumpAndSettle();
-
-        verify(launchUrlService.canLaunch(url)).called(1);
-        verifyNever(launchUrlService.launch(url));
-        verifyNoMoreInteractions(launchUrlService);
-
-        verify(analyticsService.logError(any, any)).called(1);
-        verifyNoMoreInteractions(analyticsService);
-      });
     });
   });
 }
diff --git a/test/ui/views/more_view_test.dart b/test/ui/views/more_view_test.dart
index a4221b97c..d7cc7387f 100644
--- a/test/ui/views/more_view_test.dart
+++ b/test/ui/views/more_view_test.dart
@@ -48,7 +48,7 @@ void main() {
     });
 
     group('UI - ', () {
-      testWidgets('has 1 listView and 6 listTiles',
+      testWidgets('has 1 listView and 8 listTiles',
           (WidgetTester tester) async {
         await tester.pumpWidget(
             localizedWidget(child: FeatureDiscovery(child: MoreView())));
@@ -58,7 +58,7 @@ void main() {
         expect(listview, findsOneWidget);
 
         final listTile = find.byType(ListTile);
-        expect(listTile, findsNWidgets(7));
+        expect(listTile, findsNWidgets(8));
       });
 
       group('navigation - ', () {
@@ -147,6 +147,21 @@ void main() {
           expect(find.byType(AboutDialog), findsOneWidget);
         });
 
+        testWidgets('need help', (WidgetTester tester) async {
+          await tester.pumpWidget(
+              localizedWidget(child: FeatureDiscovery(child: MoreView())));
+          await tester.pumpAndSettle(const Duration(seconds: 1));
+
+          // Tap the button.
+          await tester.tap(find.widgetWithText(ListTile, intl.need_help));
+
+          // Rebuild the widget after the state has changed.
+          await tester.pump();
+
+          verify(navigation.pushNamed(RouterPaths.faq, arguments: Colors.white))
+              .called(1);
+        });
+
         testWidgets('settings', (WidgetTester tester) async {
           await tester.pumpWidget(
               localizedWidget(child: FeatureDiscovery(child: MoreView())));
diff --git a/test/viewmodels/faq_viewmodel_test.dart b/test/viewmodels/faq_viewmodel_test.dart
new file mode 100644
index 000000000..52519f29a
--- /dev/null
+++ b/test/viewmodels/faq_viewmodel_test.dart
@@ -0,0 +1,53 @@
+// FLUTTER / DART / THIRD-PARTIES
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+import 'package:mockito/mockito.dart';
+
+// SERVICES / MANAGERS
+import 'package:notredame/core/services/launch_url_service.dart';
+import 'package:notredame/core/managers/settings_manager.dart';
+import '../mock/services/launch_url_service_mock.dart';
+
+// VIEW MODEL
+import 'package:notredame/core/viewmodels/faq_viewmodel.dart';
+
+// OTHER
+import '../helpers.dart';
+
+void main() {
+  LaunchUrlServiceMock launchUrlService;
+
+  FaqViewModel viewModel;
+
+  group('FaqViewModel - ', () {
+    setUp(() async {
+      launchUrlService = setupLaunchUrlServiceMock() as LaunchUrlServiceMock;
+      setupSettingsManagerMock();
+
+      viewModel = FaqViewModel();
+    });
+
+    tearDown(() {
+      unregister<SettingsManager>();
+      unregister<LaunchUrlService>();
+    });
+
+    group('Emails - ', () {
+      test('Has the right mailto', () {
+        final str = viewModel.mailtoStr("email", "subject");
+
+        expect(str, "mailto:email?subject=subject");
+      });
+    });
+
+    group('Webview - ', () {
+      test('Calls launchInBrowser', () {
+        viewModel.launchWebsite("https://clubapplets.ca/", Brightness.light);
+
+        verify(launchUrlService.launchInBrowser(
+                "https://clubapplets.ca/", Brightness.light))
+            .called(1);
+      });
+    });
+  });
+}
diff --git a/test/viewmodels/login_viewmodel_test.dart b/test/viewmodels/login_viewmodel_test.dart
index aabdf381f..04a9b619d 100644
--- a/test/viewmodels/login_viewmodel_test.dart
+++ b/test/viewmodels/login_viewmodel_test.dart
@@ -136,13 +136,5 @@ void main() {
         expect(viewModel.password, "");
       });
     });
-
-    group('Emails - ', () {
-      test('Has the right mailto', () {
-        final str = viewModel.mailtoStr("email", "subject");
-
-        expect(str, "mailto:email?subject=subject");
-      });
-    });
   });
 }