feat: Ingredients Page (#707)

A page to edit the ingredients. Accessed via a button at the bottom of the ingredients knowledge panel card. Set userPreferencesFlagEditIngredients to true to see it.
openfoodfacts · Mar 27, 2022 · ce030c2 · ce030c2
1 parent 180d0b4
commit ce030c2
Show file tree

Hide file tree

Showing 6 changed files with 407 additions and 5 deletions.
diff --git a/packages/smooth_app/lib/cards/product_cards/knowledge_panels/knowledge_panels_builder.dart b/packages/smooth_app/lib/cards/product_cards/knowledge_panels/knowledge_panels_builder.dart
@@ -4,10 +4,14 @@ import 'package:openfoodfacts/model/KnowledgePanel.dart';
 import 'package:openfoodfacts/model/KnowledgePanelElement.dart';
 import 'package:openfoodfacts/model/KnowledgePanels.dart';
 import 'package:openfoodfacts/openfoodfacts.dart';
+import 'package:provider/provider.dart';
 import 'package:smooth_app/cards/product_cards/knowledge_panels/knowledge_panel_element_card.dart';
+import 'package:smooth_app/data_models/user_preferences.dart';
 import 'package:smooth_app/helpers/product_cards_helper.dart';
+import 'package:smooth_app/pages/product/edit_ingredients_page.dart';
 import 'package:smooth_app/pages/product/nutrition_page_loaded.dart';
 import 'package:smooth_app/pages/product/ordered_nutrients_cache.dart';
+import 'package:smooth_app/pages/user_preferences_dev_mode.dart';
 
 /// Builds "knowledge panels" panels.
 ///
@@ -128,12 +132,23 @@ class KnowledgePanelsBuilder {
             },
           ),
         );
-        if (product.statesTags?.contains('en:ingredients-to-be-completed') ??
+        if (context.read<UserPreferences>().getFlag(
+                UserPreferencesDevMode.userPreferencesFlagEditIngredients) ??
             false) {
+          // When the flag is removed, this should be the following:
+          // if (product.statesTags?.contains('en:ingredients-to-be-completed') ?? false) {
           knowledgePanelElementWidgets.add(
             addPanelButton(
               appLocalizations.score_add_missing_ingredients,
-              onPressed: () {},
+              onPressed: () async => Navigator.push<Widget>(
+                context,
+                MaterialPageRoute<Widget>(
+                  builder: (BuildContext context) => EditIngredientsPage(
+                    product: product,
+                    imageIngredientsUrl: product.imageIngredientsUrl,
+                  ),
+                ),
+              ),
             ),
           );
         }

diff --git a/packages/smooth_app/lib/l10n/app_en.arb b/packages/smooth_app/lib/l10n/app_en.arb
@@ -336,6 +336,10 @@
     },
     "ingredients": "Ingredients",
     "@ingredients": {},
+    "ingredients_editing_instructions": "Keep the original order. Indicate the percentage when specified. Separate with a comma or hyphen, use parentheses for ingredients of an ingredient, and indicate allergens between underscores.",
+    "ingredients_editing_error": "Failed to save the ingredients.",
+    "ingredients_editing_image_error": "Failed to get a new ingredients image.",
+    "ingredients_editing_title": "Edit Ingredients",
     "ingredients_photo": "Ingredients photo",
     "@ingredients_photo": {
         "description": "Button label: For adding a picture of the Ingredients of a product"
@@ -586,4 +590,4 @@
     "@main_app_color": {
         "description": "Heading for the section to pick the main app color"
     }
-}
+}
diff --git a/packages/smooth_app/lib/l10n/app_fr.arb b/packages/smooth_app/lib/l10n/app_fr.arb
@@ -336,6 +336,7 @@
     },
     "ingredients": "Ingrédients",
     "@ingredients": {},
+    "ingredients_editing_instructions": "Conserver l'ordre, indiquer le % lorsqu'il est précisé, séparer par une virgule ou -, utiliser les () pour les ingrédients d’un ingrédient, indiquer les allergènes entre _.",
     "ingredients_photo": "Photo des ingrédients",
     "@ingredients_photo": {
         "description": "Button label: For adding a picture of the Ingredients of a product"
@@ -582,4 +583,4 @@
     "@main_app_color": {
         "description": "Heading for the section to pick the main app color"
     }
-}
+}