fix: product detail view for parapharmacy products

- Updated ProductView to use correct endpoint for parapharmacy
- Updated getProduct service to handle parapharmacy products
- Shows price, category, brand, source for parapharmacy products
- Updated labels from 'OFF' to 'Parafarmacia'
This commit is contained in:
Antoni Nuñez Romeu
2026-07-16 15:47:14 +02:00
parent 570d4ab43e
commit 3429b7e548
3 changed files with 39 additions and 25 deletions
@@ -62,7 +62,7 @@ export default function ProductDetailScreen() {
<View style={styles.nameRow}> <View style={styles.nameRow}>
<Text style={[styles.name, { color: colors.text }]}>{product.name}</Text> <Text style={[styles.name, { color: colors.text }]}>{product.name}</Text>
<View style={[styles.badge, { backgroundColor: isCima ? '#2b5bb5' : '#4caf50' }]}> <View style={[styles.badge, { backgroundColor: isCima ? '#2b5bb5' : '#4caf50' }]}>
<Text style={styles.badgeText}>{isCima ? 'CIMA' : 'OFF'}</Text> <Text style={styles.badgeText}>{isCima ? 'CIMA' : 'Parafarmacia'}</Text>
</View> </View>
</View> </View>
{product.brand ? ( {product.brand ? (
@@ -92,21 +92,21 @@ export default function ProductDetailScreen() {
</View> </View>
) : ( ) : (
<View style={[styles.infoSection, { backgroundColor: colors.card }]}> <View style={[styles.infoSection, { backgroundColor: colors.card }]}>
<Text style={[styles.sectionTitle, { color: colors.text }]}>Información nutricional</Text> <Text style={[styles.sectionTitle, { color: colors.text }]}>Información del producto</Text>
{product.nutriscore && ( {product.price != null && (
<InfoRow label="Nutri-Score" value={product.nutriscore.toUpperCase()} colors={colors} /> <InfoRow label="Precio" value={`${product.price} €`} colors={colors} />
)} )}
{product.nova_group != null && ( {product.original_price != null && product.original_price > (product.price || 0) && (
<InfoRow label="Grupo NOVA" value={String(product.nova_group)} colors={colors} /> <InfoRow label="Precio anterior" value={`${product.original_price} €`} colors={colors} />
)} )}
{product.eco_score && ( {product.category && (
<InfoRow label="Eco-Score" value={product.eco_score.toUpperCase()} colors={colors} /> <InfoRow label="Categoría" value={product.category} colors={colors} />
)} )}
{product.ingredients && ( {product.brand && (
<View style={[styles.infoRow, { borderBottomColor: colors.border }]}> <InfoRow label="Marca" value={product.brand} colors={colors} />
<Text style={[styles.infoLabel, { color: colors.textSecondary }]}>Ingredientes</Text> )}
<Text style={[styles.infoValueMultiline, { color: colors.text }]}>{product.ingredients}</Text> {product.source_url && (
</View> <InfoRow label="Fuente" value={product.source || 'Parafarmacia'} colors={colors} />
)} )}
</View> </View>
)} )}
+6 -1
View File
@@ -105,7 +105,12 @@ export async function getParapharmacyBrands(): Promise<string[]> {
export async function getProduct(source: string, id: string): Promise<Product | null> { export async function getProduct(source: string, id: string): Promise<Product | null> {
try { try {
const { data } = await api.get<Product>(`/products/${source}/${id}`); // Use different endpoint for parapharmacy products
const endpoint = source === 'parapharmacy'
? `/products/parapharmacy/${id}`
: `/products/${source}/${id}`;
const { data } = await api.get<Product>(endpoint);
return data; return data;
} catch (error) { } catch (error) {
console.error('[Products] Detail error:', error); console.error('[Products] Detail error:', error);
+20 -11
View File
@@ -17,13 +17,18 @@ export default function ProductView({ source, id, onBack }) {
setError(null); setError(null);
setPharmacies([]); setPharmacies([]);
try { try {
const response = await fetch(`/api/products/${source}/${id}`); // Use different endpoint for parapharmacy products
const apiUrl = source === 'parapharmacy'
? `/api/products/parapharmacy/${id}`
: `/api/products/${source}/${id}`;
const response = await fetch(apiUrl);
if (!response.ok) { if (!response.ok) {
throw new Error('Producto no encontrado'); throw new Error('Producto no encontrado');
} }
const data = await response.json(); const data = await response.json();
setProduct(data); setProduct(data);
loadPharmacies(source, data.id); loadPharmacies(source, data.id || data._id);
} catch (err) { } catch (err) {
setError(err.message); setError(err.message);
} finally { } finally {
@@ -71,8 +76,9 @@ export default function ProductView({ source, id, onBack }) {
if (!product) return null; if (!product) return null;
const isCima = product.source === 'cima'; const isCima = product.source === 'cima';
const isParapharmacy = product.source !== 'cima';
const sourceColor = isCima ? '#2563eb' : '#16a34a'; const sourceColor = isCima ? '#2563eb' : '#16a34a';
const sourceLabel = isCima ? 'CIMA' : 'Open Food Facts'; const sourceLabel = isCima ? 'CIMA' : 'Parafarmacia';
return ( return (
<div className="product-view"> <div className="product-view">
@@ -116,17 +122,20 @@ export default function ProductView({ source, id, onBack }) {
</> </>
) : ( ) : (
<> <>
{product.nutriscore && product.nutriscore !== 'not-applicable' && product.nutriscore !== 'unknown' && ( {product.price && (
<DetailRow label="Nutri-Score" value={product.nutriscore.toUpperCase()} /> <DetailRow label="Precio" value={`${product.price} €`} />
)} )}
{product.nova_group && ( {product.original_price && product.original_price > product.price && (
<DetailRow label="NOVA" value={`Grupo ${product.nova_group}`} /> <DetailRow label="Precio anterior" value={`${product.original_price} €`} />
)} )}
{product.eco_score && product.eco_score !== 'unknown' && ( {product.category && (
<DetailRow label="Eco-Score" value={product.eco_score.toUpperCase()} /> <DetailRow label="Categoría" value={product.category} />
)} )}
{product.ingredients && ( {product.brand && (
<DetailRow label="Ingredientes" value={product.ingredients} /> <DetailRow label="Marca" value={product.brand} />
)}
{product.source_url && (
<DetailRow label="Fuente" value={product.source} />
)} )}
</> </>
)} )}