Merge pull request #75 from stepanzh/74-bug-when-there-are-some-ingredients-and-user-updates-list-the-scaled-list-is-not-updated

Fix bug when there are some ingredients and user updates list the scaled list is not updated #74

Author: stepanzh

src/stores/proportioCalculator.js

@@ -12,6 +12,8 @@ export const useProportioCalculatorStore = defineStore('proportio-calculator', (
 
     const numberOfIngredients = computed(() => ingredients.value.length)
 
+    const scaleFactor = ref(NaN)
+
     function emptyIngredient() {
         const ingr = reactive({
             id: crypto.randomUUID(),
@@ -22,7 +24,15 @@ export const useProportioCalculatorStore = defineStore('proportio-calculator', (
         })
 
         ingr.stopWatchingScaledAmount = watch(() => ingr.scaledAmount, () => { onScaleAmountChanged(ingr.id) })
-        watch(() => ingr.originalAmount, () => { ingr.scaledAmount = NaN })
+        watch(() => ingr.originalAmount, () => {
+            // Note. When there are some components and scale factor, update ingr.scaledAmount.
+            // It is needed when user backed from scaled mode and add new ingredient.
+            if (scaleFactor.value && scaleFactor.value !== NaN) {
+                updateScaleAmount(ingr, scaleFactor.value)
+            } else {
+                ingr.scaledAmount = NaN
+            }
+        })
 
         ingr.displayedName = computed(() => ingr.name === '' ? '<Без названия>' : ingr.name )
 
@@ -46,16 +56,19 @@ export const useProportioCalculatorStore = defineStore('proportio-calculator', (
         }
 
         ingredients.value.push(ingr)
-        
-        // TODO: When there are some components and scale factor, update ingr.scaledAmount
     }
 
     function remove(id) {
-        ingredients.value = ingredients.value.filter((x) => x.id != id)
+        if (ingredients.value.length == 1) {
+            clear()
+        } else {
+            ingredients.value = ingredients.value.filter((x) => x.id != id)
+        }
     }
 
     function clear() {
         ingredients.value = []
+        scaleFactor.value = NaN
     }
 
     // Moves ingredient with `id` up, if possible
@@ -98,22 +111,26 @@ export const useProportioCalculatorStore = defineStore('proportio-calculator', (
         const changedIngr = ingredients.value.find((x) => x.id === forId)
 
         // TODO: NaNs
-        const scaleFactor = changedIngr.scaledAmount / changedIngr.originalAmount
-        updateScaleAmounts(forId, scaleFactor)
+        scaleFactor.value = changedIngr.scaledAmount / changedIngr.originalAmount
+        updateScaleAmounts(forId, scaleFactor.value)
     }
 
     function updateScaleAmounts(excludeId, scaleBy) {
         ingredients.value
             .filter((ingr) => ingr.id !== excludeId)
             .forEach((ingr) => {
-                console.log(`${Date.now()} updateScaleAmounts: updating ${ingr.id}`)
-                ingr.stopWatchingScaledAmount()
-                ingr.scaledAmount = ingr.originalAmount * scaleBy
-                // DRY
-                ingr.stopWatchingScaledAmount = watch(() => ingr.scaledAmount, () => { onScaleAmountChanged(ingr.id) })
+                updateScaleAmount(ingr, scaleBy)
             })
     }
 
+    function updateScaleAmount(ingr, scaleBy) {
+        console.log(`${Date.now()} updateScaleAmounts: updating ${ingr.id}`)
+        ingr.stopWatchingScaledAmount()
+        ingr.scaledAmount = ingr.originalAmount * scaleBy
+        // DRY
+        ingr.stopWatchingScaledAmount = watch(() => ingr.scaledAmount, () => { onScaleAmountChanged(ingr.id) })
+    }
+
     function getRecipeAsPlainTextTabular() {
         if (numberOfIngredients > 0) {
             console.error('Невозможно создать рецепт в виде строки: рецепт пуст')
@@ -148,9 +165,6 @@ export const useProportioCalculatorStore = defineStore('proportio-calculator', (
         clear,
         moveTowardsFirstOnce,
         moveTowardsLastOnce,
-        emptyIngredient,
-        onScaleAmountChanged,
-        updateScaleAmounts,
         getRecipeAsPlainTextTabular,
     }
 })