feat: "Quit without saving?" in a modal sheet (#6192)

* "Quit without saving?" in a modal sheet

* Revert changes on SmoothAlertDialog

* Fix bottom margin

packages/smooth_app/lib/generic_lib/bottom_sheets/smooth_bottom_sheet.dart

@@ -86,6 +86,11 @@ Future<T?> showSmoothListOfChoicesModalSheet<T>({
   List<Widget>? suffixIcons,
   Color? suffixIconTint,
   EdgeInsetsGeometry? padding,
+  EdgeInsetsGeometry? dividerPadding,
+  TextStyle? textStyle,
+  Color? headerBackgroundColor,
+  Color? prefixIndicatorColor,
+  bool safeArea = false,
 }) {
   assert(labels.length == values.length);
   assert(prefixIcons == null || values.length == prefixIcons.length);
@@ -105,11 +110,12 @@ Future<T?> showSmoothListOfChoicesModalSheet<T>({
         leading: prefixIcons != null
             ? IconTheme.merge(
                 data: IconThemeData(color: prefixIconTint),
-                child: prefixIcons[i])
+                child: prefixIcons[i],
+              )
             : null,
         title: Text(
           labels.elementAt(i),
-          style: const TextStyle(fontWeight: FontWeight.w500),
+          style: textStyle ?? const TextStyle(fontWeight: FontWeight.w500),
         ),
         contentPadding: EdgeInsetsDirectional.only(
           start: LARGE_SPACE,
@@ -129,21 +135,34 @@ Future<T?> showSmoothListOfChoicesModalSheet<T>({
     );
 
     if (i < labels.length - 1) {
-      items.add(const Divider(height: 1.0));
+      const Widget divider = Divider(height: 1.0);
+
+      if (dividerPadding != null) {
+        items.add(Padding(padding: dividerPadding, child: divider));
+      } else {
+        items.add(divider);
+      }
     }
   }
 
   if (footer != null) {
     items.add(footer);
   }
 
-  items.add(SizedBox(height: MediaQuery.of(context).padding.bottom));
+  final double paddingHeight = MediaQuery.paddingOf(context).bottom;
+  items.add(SizedBox(height: paddingHeight));
+
+  if (safeArea && paddingHeight == 0.0) {
+    items.add(SizedBox(height: MediaQuery.viewPaddingOf(context).bottom));
+  }
 
   return showSmoothModalSheet<T>(
     context: context,
     builder: (BuildContext context) => SmoothModalSheet(
       title: title,
       prefixIndicator: true,
+      prefixIndicatorColor: prefixIndicatorColor,
+      headerBackgroundColor: headerBackgroundColor,
       bodyPadding: EdgeInsets.zero,
       body: Column(children: items),
     ),
@@ -184,6 +203,7 @@ class SmoothModalSheet extends StatelessWidget {
     required this.body,
     bool prefixIndicator = false,
     bool closeButton = true,
+    Color? prefixIndicatorColor,
     Color? headerBackgroundColor,
     Color? headerForegroundColor,
     this.bodyPadding,
@@ -192,7 +212,9 @@ class SmoothModalSheet extends StatelessWidget {
   }) : header = SmoothModalSheetHeader(
           title: title,
           prefix: prefixIndicator
-              ? const SmoothModalSheetHeaderPrefixIndicator()
+              ? SmoothModalSheetHeaderPrefixIndicator(
+                  color: prefixIndicatorColor,
+                )
               : null,
           suffix: closeButton
               ? SmoothModalSheetHeaderCloseButton(

packages/smooth_app/lib/l10n/app_en.arb

@@ -1556,6 +1556,7 @@
     "@edit_product_form_item_categories_explainer_3": {
         "description": "Product edition - Categories - input explainer, part 3"
     },
+    "edit_product_form_item_exit_title": "Quit without saving?",
     "edit_product_form_item_exit_confirmation": "Do you want to save your changes before leaving this page?",
     "edit_product_form_item_exit_confirmation_positive_button": "Save changes",
     "edit_product_form_item_exit_confirmation_negative_button": "Discard changes",

packages/smooth_app/lib/l10n/app_fr.arb

@@ -1556,6 +1556,7 @@
     "@edit_product_form_item_categories_explainer_3": {
         "description": "Product edition - Categories - input explainer, part 3"
     },
+    "edit_product_form_item_exit_title": "Quitter sans sauvegarder ?",
     "edit_product_form_item_exit_confirmation": "Souhaitez-vous enregistrer vos modifications avant de quitter cette page ?",
     "edit_product_form_item_exit_confirmation_positive_button": "Enregistrer les modifications",
     "edit_product_form_item_exit_confirmation_negative_button": "Annuler les modifications",

packages/smooth_app/lib/pages/product/may_exit_page_helper.dart

@@ -1,6 +1,11 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
-import 'package:smooth_app/generic_lib/dialogs/smooth_alert_dialog.dart';
+import 'package:smooth_app/generic_lib/bottom_sheets/smooth_bottom_sheet.dart';
+import 'package:smooth_app/generic_lib/design_constants.dart';
+import 'package:smooth_app/helpers/color_extension.dart';
+import 'package:smooth_app/themes/smooth_theme.dart';
+import 'package:smooth_app/themes/smooth_theme_colors.dart';
+import 'package:smooth_app/themes/theme_provider.dart';
 
 /// Helper class about the "You're leaving the page with unsaved changes" case.
 class MayExitPageHelper {
@@ -13,30 +18,53 @@ class MayExitPageHelper {
   Future<bool?> openSaveBeforeLeavingDialog(
     final BuildContext context, {
     final String? title,
-  }) async =>
-      showDialog<bool>(
-        context: context,
-        builder: (final BuildContext context) {
-          final AppLocalizations appLocalizations =
-              AppLocalizations.of(context);
-          return SmoothAlertDialog(
-            close: true,
-            actionsAxis: Axis.vertical,
-            body:
-                Text(appLocalizations.edit_product_form_item_exit_confirmation),
-            title: title ?? appLocalizations.edit_product_label,
-            negativeAction: SmoothActionButton(
-              text: appLocalizations
-                  .edit_product_form_item_exit_confirmation_negative_button,
-              onPressed: () => Navigator.pop(context, false),
-            ),
-            positiveAction: SmoothActionButton(
-              text: appLocalizations
-                  .edit_product_form_item_exit_confirmation_positive_button,
-              onPressed: () => Navigator.pop(context, true),
-            ),
-            actionsOrder: SmoothButtonsBarOrder.numerical,
-          );
-        },
-      );
+  }) async {
+    final AppLocalizations appLocalizations = AppLocalizations.of(context);
+    final SmoothColorsThemeExtension extension =
+        context.extension<SmoothColorsThemeExtension>();
+
+    const Color color = Color(0xFFB81D1D);
+
+    return showSmoothListOfChoicesModalSheet<bool>(
+      context: context,
+      title: title ?? appLocalizations.edit_product_form_item_exit_title,
+      headerBackgroundColor: color,
+      header: ColoredBox(
+        color: context.lightTheme(listen: false)
+            ? color.lighten(0.55)
+            : color.darken(0.3),
+        child: Padding(
+          padding: const EdgeInsetsDirectional.symmetric(
+            horizontal: LARGE_SPACE,
+            vertical: MEDIUM_SPACE,
+          ),
+          child: Text(
+            appLocalizations.edit_product_form_item_exit_confirmation,
+            style: Theme.of(context).textTheme.bodyLarge?.copyWith(
+                  fontWeight: FontWeight.w600,
+                ),
+          ),
+        ),
+      ),
+      labels: <String>[
+        appLocalizations
+            .edit_product_form_item_exit_confirmation_positive_button,
+        appLocalizations
+            .edit_product_form_item_exit_confirmation_negative_button,
+      ],
+      values: <bool>[
+        true,
+        false,
+      ],
+      prefixIcons: <Widget>[
+        Icon(Icons.save_rounded, color: extension.success),
+        Icon(Icons.cancel_rounded, color: extension.error),
+      ],
+      dividerPadding: const EdgeInsetsDirectional.symmetric(
+        horizontal: MEDIUM_SPACE,
+      ),
+      textStyle: const TextStyle(fontWeight: FontWeight.w600),
+      safeArea: true,
+    );
+  }
 }