Enhance RecipePreview and RecipesService with additional inventory item properties and conversion logic

frontend/app/recipes/RecipePreview.tsx

@@ -42,6 +42,14 @@ function formatDate(value: string | null) {
   return new Date(value).toLocaleDateString('sv-SE');
 }
 
+function isWeightUnit(unit: string): boolean {
+  return ['kg', 'g', 'mg', 'ml', 'l'].includes(unit.trim().toLowerCase());
+}
+
+function isPieceUnit(unit: string): boolean {
+  return ['st', 'stycke'].includes(unit.trim().toLowerCase());
+}
+
 export default function RecipePreview({ recipes }: Props) {
   const [selectedRecipeId, setSelectedRecipeId] = useState('');
   const [preview, setPreview] = useState<RecipeInventoryPreview | null>(null);
@@ -217,27 +225,38 @@ export default function RecipePreview({ recipes }: Props) {
                           #{item.id}: {item.quantity} {item.unit}
                           {item.brand ? `, ${item.brand}` : ''}
                           {item.location ? `, ${item.location}` : ''}
-                          {item.bestBeforeDate
-                            ? `, bäst före ${formatDate(item.bestBeforeDate)}`
-                            : ''}
+                          {item.bestBeforeDate ? `, bäst före ${formatDate(item.bestBeforeDate)}` : ''}
                         </div>
                       ))}
                     </div>
                   ) : null}
 
-                  {ingredient.otherInventoryItems.length > 0 ? (
+                  {ingredient.otherInventoryItems && ingredient.otherInventoryItems.length > 0 ? (
                     <div style={{ display: 'grid', gap: '0.35rem' }}>
-                      <strong>Andra inventory-poster med annan enhet</strong>
-                      {ingredient.otherInventoryItems.map((item) => (
-                        <div key={item.id}>
-                          #{item.id}: {item.quantity} {item.unit}
-                          {item.brand ? `, ${item.brand}` : ''}
-                          {item.location ? `, ${item.location}` : ''}
-                          {item.bestBeforeDate
-                            ? `, bäst före ${formatDate(item.bestBeforeDate)}`
-                            : ''}
-                        </div>
-                      ))}
+                      <strong>Andra enheter:</strong>
+                      {ingredient.otherInventoryItems.map((item) => {
+                        const weight = isWeightUnit(item.unit);
+                        const pieces = isPieceUnit(ingredient.requiredUnit);
+                        const pieces2 = isPieceUnit(item.unit);
+                        const weight2 = isWeightUnit(ingredient.requiredUnit);
+
+                        return (
+                          <div key={item.id}>
+                            #{item.id}: {item.quantity} {item.unit}
+                            {item.canConvert ? (
+                              <span> ≈ {(item.convertedQuantity || 0).toFixed(2)} {ingredient.requiredUnit}</span>
+                            ) : (
+                              <span>
+                                {weight && pieces
+                                  ? ' (kan inte konvertera vikt till stycken)'
+                                  : pieces2 && weight2
+                                  ? ' (kan inte konvertera stycken till vikt)'
+                                  : ' (kan inte konvertera)'}
+                              </span>
+                            )}
+                          </div>
+                        );
+                      })}
                     </div>
                   ) : null}
                 </article>