nearle_daily/catalogue_frontend
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Frontend health score updation

Browse Source
This commit is contained in:
sriram
2026-09-04 12:05:24 +05:30
parent 2108e402b0
commit 2ff8fd41ea
2 changed files with 20 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/ProductModal.jsx
View File

@@ -186,7 +186,7 @@ export function ProductModal({ product, onClose, onSelectRecommendation }) {
{description && <p className="mt-3 text-sm leading-relaxed text-ink-800">{description}</p>}
<NutritionPanel brand={brand} imageId={product.image_id} productName={product_name} />
<NutritionPanel brand={brand} imageId={product.image_id} productName={product_name} category={category} />
{size_variants.length > 0 && (
<Section icon={Tag} label="Available sizes">

22
src/components/nutrition/NutritionPanel.jsx
View File

@@ -45,7 +45,21 @@ function ScoreBadge({ label, score }) {
);
}
export function NutritionPanel({ brand, imageId, productName }) {
// Categories with no nutrition panel to show, mirroring
// backend/app/services/consumability.py. Kept here so the empty state can say
// WHY it is empty: "we could not find data" and "this is a bar of soap" are
// different facts, and the first reads as a failure the user might retry.
const NON_CONSUMABLE_CATEGORIES = new Set([
'hair care', 'skin care', 'skin & bath care', 'bath soap', 'beauty care',
'oral care', 'fragrance & deodorants', "men's grooming", 'feminine hygiene',
'personal care', 'detergents & fabric care', 'dishwash', 'household cleaning',
'household - agarbatti', 'household - lamp oil', 'household - air freshener',
'personal care - mosquito repellent', 'health care - cold & cough',
'health care - digestive', 'health care - antiseptic', 'health care - first aid',
'flowers',
]);
export function NutritionPanel({ brand, imageId, productName, category }) {
const [nutrition, setNutrition] = useState(null);
const [loading, setLoading] = useState(false);
const [perServing, setPerServing] = useState(false);
@@ -80,11 +94,13 @@ export function NutritionPanel({ brand, imageId, productName }) {
}
if (!nutrition || nutrition.data_status === 'unavailable') {
const notFood = NON_CONSUMABLE_CATEGORIES.has((category || '').trim().toLowerCase());
return (
<Section icon={Activity} label="Nutrition">
<p className="text-xs text-slate-400">
Nutrition data unavailable for {productName || 'this product'}. Verified nutrition facts
couldn't be confidently matched from trusted sources yet.
{notFood
? `Nutrition information doesn't apply to ${productName || 'this product'} — it isn't a food or drink.`
: `Nutrition data unavailable for ${productName || 'this product'}. Verified nutrition facts couldn't be confidently matched from trusted sources yet.`}
</p>
</Section>
);