Fixed ingredients units and quantities being presented as "null".

TDW-2023 · Dec 3, 2023 · c75cbfe · c75cbfe
1 parent 0784b45
commit c75cbfe
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/src/components/Recipes/Ingredients/RecipeIngredient.jsx b/src/components/Recipes/Ingredients/RecipeIngredient.jsx
@@ -14,7 +14,16 @@ export default function RecipeIngredient({ ingredient }) {
             {ingredient.food}
           </h3>
           <p className="text-blue-500 font-bold">
-            <span className="text-blue-500">{`${ingredient.quantity} ${ingredient.measure}`}</span>
+            <span className="text-blue-500">
+              {ingredient.quantity > 0
+                ? parseFloat(ingredient.quantity).toFixed(1) + " "
+                : null}
+            </span>
+            <span className="text-blue-500">
+              {ingredient.measure !== "null" && ingredient.measure !== "<unit>"
+                ? ingredient.measure
+                : null}
+            </span>
             <span className="text-gray-500 ms-1">{`(${Math.round(
               ingredient.weight,
             )} g)`}</span>

diff --git a/src/components/Recipes/Ingredients/RecipeIngredient.test.jsx b/src/components/Recipes/Ingredients/RecipeIngredient.test.jsx
@@ -40,8 +40,10 @@ describe("RecipeIngredient component", () => {
       text: "A fresh apple",
     };
     render(<RecipeIngredient ingredient={ingredient} />);
-    const quantityMeasureElement = screen.getByText(/1 piece/i);
+    const quantityMeasureElement = screen.getAllByText(/1.0/i)[0];
+    const unitMeasureElement = screen.getByText(/piece/i);
     expect(quantityMeasureElement).toBeInTheDocument();
+    expect(unitMeasureElement).toBeInTheDocument();
   });
 
   it("renders the ingredient weight correctly", () => {