feat: Remove "Is Food" and "Disable Amounts" Flags (#5684)

Co-authored-by: Kuchenpirat <24235032+Kuchenpirat@users.noreply.github.com>
2025-08-05 05:25:26 +02:00 · 2025-07-31 10:36:24 -05:00 · 2025-07-31 10:36:24 -05:00 · 245ca5fe3b
commit 245ca5fe3b
parent efc0d31724
49 changed files with 173 additions and 364 deletions
--- a/frontend/components/Domain/Household/HouseholdPreferencesEditor.vue
+++ b/frontend/components/Domain/Household/HouseholdPreferencesEditor.vue
@ -79,11 +79,6 @@ const recipePreferences: Preference[] = [
    label: i18n.t("group.disable-users-from-commenting-on-recipes"),
    description: i18n.t("group.disable-users-from-commenting-on-recipes-description"),
  },
-  {
-    key: "recipeDisableAmount",
-    label: i18n.t("group.disable-organizing-recipe-ingredients-by-units-and-food"),
-    description: i18n.t("group.disable-organizing-recipe-ingredients-by-units-and-food-description"),
-  },
 ];

 const allDays = [
--- a/frontend/components/Domain/Recipe/RecipeDialogAddToShoppingList.vue
+++ b/frontend/components/Domain/Recipe/RecipeDialogAddToShoppingList.vue
@ -130,20 +130,23 @@
                      .ingredients[i]
                      .checked"
                >
-                  <v-checkbox
-                    hide-details
-                    :model-value="ingredientData.checked"
-                    class="pt-0 my-auto py-auto"
-                    color="secondary"
-                    density="compact"
-                  />
-                  <div :key="`${ingredientData.ingredient.quantity || 'no-qty'}-${i}`">
-                    <RecipeIngredientListItem
-                      :ingredient="ingredientData.ingredient"
-                      :disable-amount="ingredientData.disableAmount"
-                      :scale="recipeSection.recipeScale"
-                    />
-                  </div>
+                  <v-container class="pa-0 ma-0">
+                    <v-row no-gutters>
+                      <v-checkbox
+                        hide-details
+                        :model-value="ingredientData.checked"
+                        class="pt-0 my-auto py-auto mr-2"
+                        color="secondary"
+                        density="compact"
+                      />
+                      <div :key="`${ingredientData.ingredient.quantity || 'no-qty'}-${i}`" class="pa-auto my-auto">
+                        <RecipeIngredientListItem
+                          :ingredient="ingredientData.ingredient"
+                          :scale="recipeSection.recipeScale"
+                        />
+                      </div>
+                    </v-row>
+                  </v-container>
                </v-list-item>
              </div>
            </div>
@ -188,7 +191,6 @@ export interface RecipeWithScale extends Recipe {
 export interface ShoppingListIngredient {
  checked: boolean;
  ingredient: RecipeIngredient;
-  disableAmount: boolean;
 }

 export interface ShoppingListIngredientSection {
@ -290,7 +292,6 @@ async function consolidateRecipesIntoSections(recipes: RecipeWithScale[]) {
      return {
        checked: !householdsWithFood.includes(userHousehold.value),
        ingredient: ing,
-        disableAmount: recipe.settings?.disableAmount || false,
      };
    });

--- a/frontend/components/Domain/Recipe/RecipeIngredientEditor.vue
+++ b/frontend/components/Domain/Recipe/RecipeIngredientEditor.vue
@ -17,7 +17,6 @@
      class="d-flex flex-wrap my-1"
    >
      <v-col
-        v-if="!disableAmount"
        sm="12"
        md="2"
        cols="12"
@ -42,7 +41,6 @@
        </v-text-field>
      </v-col>
      <v-col
-        v-if="!disableAmount"
        sm="12"
        md="3"
        cols="12"
@ -98,7 +96,6 @@

      <!-- Foods Input -->
      <v-col
-        v-if="!disableAmount"
        m="12"
        md="3"
        cols="12"
@ -166,16 +163,7 @@
            :placeholder="$t('recipe.notes')"
            class="mb-auto"
            @click="$emit('clickIngredientField', 'note')"
-          >
-            <template #prepend>
-              <v-icon
-                v-if="disableAmount && $attrs && $attrs.delete"
-                class="mr-n1 handle"
-              >
-                {{ $globals.icons.arrowUpDown }}
-              </v-icon>
-            </template>
-          </v-text-field>
+          />
          <BaseButtonGroup
            hover
            :large="false"
@ -216,10 +204,6 @@ import type { RecipeIngredient } from "~/lib/api/types/recipe";
 const model = defineModel<RecipeIngredient>({ required: true });

 defineProps({
-  disableAmount: {
-    type: Boolean,
-    default: false,
-  },
  unitError: {
    type: Boolean,
    default: false,
--- a/frontend/components/Domain/Recipe/RecipeIngredientListItem.vue
+++ b/frontend/components/Domain/Recipe/RecipeIngredientListItem.vue
@ -34,16 +34,14 @@ import { useParsedIngredientText } from "~/composables/recipes";

 interface Props {
  ingredient: RecipeIngredient;
-  disableAmount?: boolean;
  scale?: number;
 }
 const props = withDefaults(defineProps<Props>(), {
-  disableAmount: false,
  scale: 1,
 });

 const parsedIng = computed(() => {
-  return useParsedIngredientText(props.ingredient, props.disableAmount, props.scale);
+  return useParsedIngredientText(props.ingredient, props.scale);
 });
 </script>

--- a/frontend/components/Domain/Recipe/RecipeIngredients.vue
+++ b/frontend/components/Domain/Recipe/RecipeIngredients.vue
@ -43,7 +43,6 @@
          <v-list-item-title>
            <RecipeIngredientListItem
              :ingredient="ingredient"
-              :disable-amount="disableAmount"
              :scale="scale"
            />
          </v-list-item-title>
@ -60,13 +59,11 @@ import type { RecipeIngredient } from "~/lib/api/types/recipe";

 interface Props {
  value?: RecipeIngredient[];
-  disableAmount?: boolean;
  scale?: number;
  isCookMode?: boolean;
 }
 const props = withDefaults(defineProps<Props>(), {
  value: () => [],
-  disableAmount: false,
  scale: 1,
  isCookMode: false,
 });
@ -89,7 +86,7 @@ const ingredientCopyText = computed(() => {
      components.push(`[${ingredient.title}]`);
    }

-    components.push(parseIngredientText(ingredient, props.disableAmount, props.scale, false));
+    components.push(parseIngredientText(ingredient, props.scale, false));
  });

  return components.join("\n");
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePage.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePage.vue
@ -141,7 +141,6 @@
          <RecipeIngredients
            :value="notLinkedIngredients"
            :scale="scale"
-            :disable-amount="recipe.settings.disableAmount"
            :is-cook-mode="isCookMode"
          />
        </v-card>
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageIngredientEditor.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageIngredientEditor.vue
@ -1,9 +1,14 @@
 <!-- eslint-disable vue/no-mutating-props -->
 <template>
  <div>
-    <h2 class="mb-4 text-h5 font-weight-medium opacity-80">
-      {{ $t("recipe.ingredients") }}
-    </h2>
+    <div class="mb-4">
+      <h2 class="mb-4 text-h5 font-weight-medium opacity-80">
+        {{ $t("recipe.ingredients") }}
+      </h2>
+      <BannerWarning v-if="!hasFoodOrUnit">
+        {{ $t("recipe.ingredients-not-parsed-description", { parse: $t('recipe.parse') }) }}
+      </BannerWarning>
+    </div>
    <VueDraggable
      v-if="recipe.recipeIngredient.length > 0"
      v-model="recipe.recipeIngredient"
@ -27,7 +32,6 @@
          :key="ingredient.referenceId"
          v-model="recipe.recipeIngredient[index]"
          class="list-group-item"
-          :disable-amount="recipe.settings.disableAmount"
          @delete="recipe.recipeIngredient.splice(index, 1)"
          @insert-above="insertNewIngredient(index)"
          @insert-below="insertNewIngredient(index + 1)"
@ -49,7 +53,7 @@
          <span>
            <BaseButton
              class="mb-1"
-              :disabled="recipe.settings.disableAmount || hasFoodOrUnit"
+              :disabled="hasFoodOrUnit"
              color="accent"
              :to="`/g/${groupSlug}/r/${recipe.slug}/ingredient-parser`"
              v-bind="props"
@ -109,10 +113,7 @@ const hasFoodOrUnit = computed(() => {
 });

 const parserToolTip = computed(() => {
-  if (recipe.value.settings.disableAmount) {
-    return i18n.t("recipe.enable-ingredient-amounts-to-use-this-feature");
-  }
-  else if (hasFoodOrUnit.value) {
+  if (hasFoodOrUnit.value) {
    return i18n.t("recipe.recipes-with-units-or-foods-defined-cannot-be-parsed");
  }
  return i18n.t("recipe.parse-ingredients");
@ -127,7 +128,6 @@ function addIngredient(ingredients: Array<string> | null = null) {
        note: x,
        unit: undefined,
        food: undefined,
-        disableAmount: true,
        quantity: 1,
      };
    });
@ -146,7 +146,6 @@ function addIngredient(ingredients: Array<string> | null = null) {
      unit: undefined,
      // @ts-expect-error - prop can be null-type by NoUndefinedField type forces it to be set
      food: undefined,
-      disableAmount: true,
      quantity: 1,
    });
  }
@ -161,7 +160,6 @@ function insertNewIngredient(dest: number) {
    unit: undefined,
    // @ts-expect-error - prop can be null-type by NoUndefinedField type forces it to be set
    food: undefined,
-    disableAmount: true,
    quantity: 1,
  });
 }
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageIngredientToolsView.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageIngredientToolsView.vue
@ -3,7 +3,6 @@
    <RecipeIngredients
      :value="recipe.recipeIngredient"
      :scale="scale"
-      :disable-amount="recipe.settings.disableAmount"
      :is-cook-mode="isCookMode"
    />
    <div v-if="!isEditMode && recipe.tools && recipe.tools.length > 0">
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageInstructions.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageInstructions.vue
@ -36,7 +36,7 @@
            :value="ing.referenceId"
          >
            <template #label>
-              <RecipeIngredientHtml :markup="parseIngredientText(ing, recipe.settings.disableAmount)" />
+              <RecipeIngredientHtml :markup="parseIngredientText(ing)" />
            </template>
          </v-checkbox-btn>

@ -51,7 +51,7 @@
              :value="ing.referenceId"
            >
              <template #label>
-                <RecipeIngredientHtml :markup="parseIngredientText(ing, recipe.settings.disableAmount)" />
+                <RecipeIngredientHtml :markup="parseIngredientText(ing)" />
              </template>
            </v-checkbox-btn>
          </template>
@ -323,7 +323,6 @@
                              return step.ingredientReferences.map((ref) => ref.referenceId).includes(ing.referenceId || '')
                            })"
                            :scale="scale"
-                            :disable-amount="recipe.settings.disableAmount"
                            :is-cook-mode="isCookMode"
                          />
                        </div>
@ -552,7 +551,6 @@ function autoSetReferences() {
    props.recipe.recipeIngredient,
    activeRefs.value,
    activeText.value,
-    props.recipe.settings.disableAmount,
  ).forEach((ingredient: string) => activeRefs.value.push(ingredient));
 }

@ -574,7 +572,7 @@ function getIngredientByRefId(refId: string | undefined) {

  const ing = ingredientLookup.value[refId];
  if (!ing) return "";
-  return parseIngredientText(ing, props.recipe.settings.disableAmount, props.scale);
+  return parseIngredientText(ing, props.scale);
 }

 // ===============================================================
--- a/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageScale.vue
+++ b/frontend/components/Domain/Recipe/RecipePage/RecipePageParts/RecipePageScale.vue
@ -4,7 +4,7 @@
      v-if="!isEditMode"
      v-model.number="scale"
      :recipe-servings="recipeServings"
-      :edit-scale="!recipe.settings.disableAmount && !isEditMode"
+      :edit-scale="hasFoodOrUnit && !isEditMode"
    />
  </div>
 </template>
@ -24,4 +24,15 @@ const { isEditMode } = usePageState(props.recipe.slug);
 const recipeServings = computed<number>(() => {
  return props.recipe.recipeServings || props.recipe.recipeYieldQuantity || 1;
 });
+
+const hasFoodOrUnit = computed(() => {
+  if (props.recipe.recipeIngredient) {
+    for (const ingredient of props.recipe.recipeIngredient) {
+      if (ingredient.food || ingredient.unit) {
+        return true;
+      }
+    }
+  }
+  return false;
+});
 </script>
--- a/frontend/components/Domain/Recipe/RecipePrintView.vue
+++ b/frontend/components/Domain/Recipe/RecipePrintView.vue
@ -321,7 +321,7 @@ const hasNotes = computed(() => {
 });

 function parseText(ingredient: RecipeIngredient) {
-  return parseIngredientText(ingredient, props.recipe.settings?.disableAmount || false, props.scale);
+  return parseIngredientText(ingredient, props.scale);
 }
 </script>

--- a/frontend/components/Domain/Recipe/RecipeSettingsSwitches.vue
+++ b/frontend/components/Domain/Recipe/RecipeSettingsSwitches.vue
@ -31,7 +31,6 @@ const labels: Record<keyof RecipeSettings, string> = {
  showAssets: i18n.t("asset.show-assets"),
  landscapeView: i18n.t("recipe.landscape-view-coming-soon"),
  disableComments: i18n.t("recipe.disable-comments"),
-  disableAmount: i18n.t("recipe.disable-amount"),
  locked: i18n.t("recipe.locked"),
 };
 </script>
--- a/frontend/components/Domain/ShoppingList/ShoppingListItem.vue
+++ b/frontend/components/Domain/ShoppingList/ShoppingListItem.vue
@ -22,10 +22,7 @@
            :class="listItem.checked ? 'strike-through' : ''"
            style="min-width: 0;"
          >
-            <RecipeIngredientListItem
-              :ingredient="listItem"
-              :disable-amount="!(listItem.isFood || listItem.quantity !== 1)"
-            />
+            <RecipeIngredientListItem :ingredient="listItem" />
          </div>
        </div>
      </v-col>
@ -172,7 +169,6 @@
      @save="save"
      @cancel="toggleEdit(false)"
      @delete="$emit('delete')"
-      @toggle-foods="localListItem.isFood = !localListItem.isFood"
    />
  </div>
 </template>
--- a/frontend/components/Domain/ShoppingList/ShoppingListItemEditor.vue
+++ b/frontend/components/Domain/ShoppingList/ShoppingListItemEditor.vue
@ -2,7 +2,7 @@
  <div>
    <v-card variant="outlined">
      <v-card-text class="pb-3 pt-1">
-        <div v-if="listItem.isFood" class="d-md-flex align-center mb-2" style="gap: 20px">
+        <div class="d-md-flex align-center mb-2" style="gap: 20px">
          <div>
            <InputQuantity v-model="listItem.quantity" />
          </div>
@ -26,9 +26,6 @@
          />
        </div>
        <div class="d-md-flex align-center" style="gap: 20px">
-          <div v-if="!listItem.isFood">
-            <InputQuantity v-model="listItem.quantity" />
-          </div>
          <v-textarea
            v-model="listItem.note"
            hide-details
@ -99,11 +96,6 @@
              text: $t('general.cancel'),
              event: 'cancel',
            },
-            {
-              icon: $globals.icons.foods,
-              text: $t('shopping-list.toggle-food'),
-              event: 'toggle-foods',
-            },
            {
              icon: $globals.icons.save,
              text: $t('general.save'),
@ -113,7 +105,6 @@
          @save="$emit('save')"
          @cancel="$emit('cancel')"
          @delete="$emit('delete')"
-          @toggle-foods="listItem.isFood = !listItem.isFood"
        />
      </v-card-actions>
    </v-card>